/* Сжать доп.панели https://forum.mozilla-russia.org/viewtopic.php?pid=775867#p775867 */
#ucf-additional-top-bar,
#ucf-additional-bottom-bar {
    --toolbarbutton-outer-padding: 0px !important;
    --toolbarbutton-inner-padding: 2px !important;
    min-height: 18px !important;
}
:is(#ucf-additional-top-bar,#ucf-additional-bottom-bar) .toolbarbutton-badge {
    margin-inline-end: calc(-1 * (var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding))) !important;
}
#ucf-additional-bottom-closebutton {
    padding: 0 !important;
}
#ucf-additional-vertical-bar {
    --toolbarbutton-outer-padding: 0px !important; /* это и есть ширина боковой панели; комбинируется с пар. ниже */
    --toolbarbutton-inner-padding: 3px !important; /* расстояние по вертикали между кнопками; комбинируется с предыдущим, лучше 3 или 5 */
    min-width: 18px !important;
}
#ucf-additional-vertical-bar .toolbarbutton-badge {
    margin-inline-end: calc(-1 * (var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding))) !important;
}

:root {
    --urlbar-min-height: max(28px, 1.4em) !important;
    --urlbar-icon-padding: 4px !important;
    --urlbar-container-padding: 0px !important;
    --urlbar-icon-border-radius: 0px !important;
    --urlbar-margin-inline: 1px !important;
    --focus-outline-width: 1px !important;
    --v-urlbar-searchbar-border-radius: calc(var(--urlbar-min-height) / 2);
}
:root[uidensity=touch] {
    --urlbar-min-height: max(34px, 1.4em) !important;
    --urlbar-margin-inline: 5px !important;
}

#urlbar-container {
    padding: 1px 0 !important;
    margin: 0 var(--urlbar-margin-inline) !important;
    &[breakout] {
        position: relative !important;
    }
    #urlbar {
        #identity-icon-box,
        #identity-box {
            max-width: calc(30px + 15em) !important;
        }
        &[breakout] {
            display: block !important;
            position: absolute !important;
            width: 100% !important;
            height: var(--urlbar-height) !important;
            top: calc((var(--urlbar-container-height) - var(--urlbar-height)) / 2) !important;
            inset-inline: 0 !important;
        }
        &[breakout] > :is(#urlbar-input-container,.urlbar-input-container) {
            width: 100% !important;
            height: var(--urlbar-height) !important;
            padding: 0 !important;
        }
        &[breakout][breakout-extend],
        &[breakout][breakout-extend-disabled][open] {
            height: auto !important;
        }
        &[breakout] > #urlbar-background {
            display: block !important;
            position: absolute !important;
            animation: none !important;
            inset-inline: 0 !important;
            box-shadow: none !important;
            height: var(--urlbar-height) !important;
            top: 0 !important;
            bottom: auto !important;
        }
        &[breakout][open] > #urlbar-background {
            border-color: var(--toolbar-field-border-color, transparent) !important;
        }
        &[breakout][focused] > #urlbar-background {
            border-color: var(--toolbar-field-focus-border-color, Highlight) !important;
        }
        &[breakout] > .urlbarView {
            margin: 0 !important;
            width: 100% !important;
            border-radius: var(--v-urlbar-searchbar-border-radius) !important;
            background: var(--toolbar-field-focus-background-color, Field) !important;
            color: var(--toolbar-field-focus-color, FieldText) !important;
            border: 1px solid var(--arrowpanel-border-color, ThreeDShadow) !important;
            border-top: none !important;
            box-shadow: 0 2px 14px rgba(0, 0, 0, 0.13);
            .searchbar-engine-one-off-item {
                margin: 0 !important;
                min-width: 28px !important;
                height: 28px !important;
                &:not(.search-setting-button)::after {
                    content: "";
                    border-inline-end: 1px solid;
                    border-image: linear-gradient(transparent 15%, var(--urlbarView-separator-color) 15%, var(--urlbarView-separator-color) 85%, transparent 85%) 1 1;
                }
            }
            .search-panel-one-offs-container {
                min-width: calc(5 * 28px) !important;
            }
            .urlbarView-quickaction-button {
                border-radius: var(--toolbarbutton-border-radius) !important;
                box-shadow: none !important;
            }
        }
        &[breakout] > .urlbarView .urlbarView-body-inner {
            border: none !important;
        }
        &[breakout] > .urlbarView .search-one-offs,
        &[breakout] > .urlbarView .urlbarView-results {
            padding-block: 0 !important;
        }
        &:not([focused]) input {
            mask-image: linear-gradient(to left, transparent, black 3ch);
            mask-repeat: no-repeat;
        }
        &:not([focused]):-moz-locale-dir(rtl) input {
            mask-image: linear-gradient(to right, transparent, black 3ch);
        }
    }
}
#search-container {
    padding: 1px 0 !important;
    margin: 0 var(--urlbar-margin-inline) !important;
    #searchbar {
        .searchbar-search-icon {
            margin-inline-start: 6px !important;
        }
        &:not(:focus-within) input {
            mask-image: linear-gradient(to left, transparent, black 3ch);
            mask-repeat: no-repeat;
        }
        &:not(:focus-within):-moz-locale-dir(rtl) input {
            mask-image: linear-gradient(to right, transparent, black 3ch);
        }
    }
}
#urlbar :is(#urlbar-input-container,.urlbar-input-container,#urlbar-background), #searchbar {
    box-shadow: none !important;
    background-clip: border-box !important;
    border-radius: var(--v-urlbar-searchbar-border-radius) !important;
    overflow: clip;
}
#urlbar, #searchbar {
    min-height: var(--urlbar-min-height) !important;
    font-size: 1em !important;
    box-shadow: none !important;
    align-items: stretch !important;
}
#PopupSearchAutoComplete {
    --panel-subview-body-padding: 0 !important;
    --panel-padding: 0 !important;
    --panel-border-radius: var(--v-urlbar-searchbar-border-radius) !important;
    --panel-shadow: 0 2px var(--panel-shadow-margin) rgba(0, 0, 0, 0.13) !important;
    --panel-shadow-margin: 14px !important;
    & > .search-panel-current-engine {
        margin-top: 0px !important;
        padding-inline: 6px !important;
    }
    & > menuseparator.searchbar-separator {
        display: none !important;
    }
    & > .search-one-offs:not([hidden]) {
        border-top: 1px solid var(--urlbarView-separator-color);
        display: flex !important;
        align-items: start !important;
        flex-wrap: wrap !important;
    }
    .search-panel-one-offs-container {
        min-width: calc(5 * 28px) !important;
    }
    .searchbar-engine-one-off-item {
        margin: 0 !important;
        min-width: 28px !important;
        height: 28px !important;
        &:not(.search-setting-button)::after {
            content: "";
            border-inline-end: 1px solid;
            border-image: linear-gradient(transparent 15%, var(--urlbarView-separator-color) 15%, var(--urlbarView-separator-color) 85%, transparent 85%) 1 1;
        }
    }
}
#urlbar-search-splitter {
    min-width: 6px !important;
    width: 6px !important;
    margin: 0 -3px !important;
}

:root {
    --toolbar-field-background-color: rgb(240, 240, 244) !important;
    --toolbar-field-color: rgb(21, 20, 26) !important;
    --toolbar-field-border-color: color-mix(in srgb, currentColor 20%, transparent) !important;
    --toolbar-field-focus-background-color: rgb(255,255,255) !important;
    --toolbar-field-focus-color: rgb(21, 20, 26) !important;
    --toolbar-field-focus-border-color: rgb(0, 97, 224) !important;
}
#urlbar > .urlbarView, #PopupSearchAutoComplete {
    --urlbarView-hover-background: color-mix(in srgb, currentColor 17%, transparent) !important;
    --urlbarView-separator-color: color-mix(in srgb, currentColor 14%, transparent) !important;
    --toolbar-field-focus-background-color: light-dark(rgb(255,255,255), rgba(10,10,15,0.6)) !important;
    --link-color: light-dark(rgb(0, 97, 224), rgb(41, 148, 255)) !important;
    --toolbar-field-focus-color: light-dark(rgb(21, 20, 26), rgb(251, 251, 254)) !important;
}
panel[type="autocomplete-richlistbox"] {
    --panel-background: light-dark(rgb(255,255,255), rgba(10,10,15,0.6)) !important;
    --panel-shadow-margin: 14px !important;
    --panel-shadow: 0 2px var(--panel-shadow-margin) rgba(0, 0, 0, 0.13) !important;
}