./upp-dropdown.scss

:host {

    .fixed {
        position: fixed;
        z-index: 100;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
    
    .dropdown {
        position: absolute;
        width: 100%;
        padding: 0px 10px;

        background: var(--ion-color-light);
        z-index: 101;
        overflow: hidden;
        transform: scaleY(0);
        transform-origin: top;
        transition: transform 0.2s ease-in-out;

        &.visible {
           transform: scaleY(1);
        }
        
        ion-item {
            --padding-start: 10px;
            --background: transparent;
        }
    
        ion-list {
            background: var(--ion-background-color);

            margin: 0px 10px;
            padding: 0px 0px;
            border-radius: 10px;
            overflow: hidden;
        }
    }

    /* encapsulation: items inside upp-dropdown-title */
    ::ng-deep upp-dropdown-title {
        ion-item {
            --background: transparent;
        }
    }

    /* encapsulation: items inside upp-dropdown-content */
    ::ng-deep .dropdown ion-list ion-item {
        --padding-start: 0px;
        --inner-padding-start: 15px;
        --background: transparent;
        
        &:last-of-type {
            --border-style: none;
        }
    }
}