@use "bulma/sass/utilities/css-variables" as cv;
@use "bulma/sass/utilities/initial-variables" as iv;
@use "bulma/sass/utilities/derived-variables" as dv;
@use "bulma/sass/utilities/controls" as controls;

.#{iv.$class-prefix}timepicker {
    .dropdown-menu {
        min-width: 0;
    }
    .dropdown,
    .dropdown-trigger {
        width: 100%;
    }
    // unset opacity when dropdow is disabled
    .dropdown {
        &.is-disabled {
            opacity: 1;
        }
    }
    .dropdown-item {
        font-size: inherit;
        padding: 0;
    }
    .timepicker-footer {
        padding: 0 0.5rem 0 0.5rem;
    }
    .dropdown-content {
        .control {
            font-size: 1.25em;
            margin-right: 0 !important;
            .select {
                margin: 0 0.125em;

                select {
                    font-weight: cv.getVar("weight-semibold");
                    padding-right: cv.getVar("control-padding-horizontal");
                    border: 0;
                    option {
                        &:disabled {
                            color: cv.getRgbaVar("grey", 0.7);
                        }
                    }
                }
                &:after {
                    display: none;
                }
            }
            &.is-colon {
                font-size: 1.7em;
                line-height: 1.7em;

                &:last-child {
                    padding-right: cv.getVar("control-padding-horizontal");
                }
            }
        }
    }
    // Sizes
    &.is-small {
        @include controls.control-small;
    }
    &.is-medium {
        @include controls.control-medium;
    }
    &.is-large {
        @include controls.control-large;
    }
}