/* Login: gli override storici puntavano a h2/p, ma il markup mobile usa i nuovi blocchi login-*.
   Qui riallineiamo la bottom sheet senza toccare il desktop. */
#login-overlay {
    align-items: flex-end !important;
    justify-content: flex-end !important;
    padding: 0 !important;
}

#login-overlay .login-card {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: min(92dvh, 820px) !important;
    margin: 0 !important;
    padding: 20px 18px calc(28px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 26px 26px 0 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
}

#login-overlay .login-logo-container {
    margin-bottom: 12px !important;
}

#login-overlay .login-logo-img {
    width: 108px !important;
}

#login-overlay .login-heading-block {
    margin-bottom: 12px !important;
}

#login-overlay .login-main-title {
    font-size: 1.72rem !important;
    line-height: 1.02 !important;
}

#login-overlay .login-mode-tabs {
    margin-bottom: 18px !important;
    border-radius: 14px !important;
}

#login-overlay .login-tab {
    min-height: 48px !important;
    font-size: 0.78rem !important;
}

#login-overlay .login-form {
    gap: 10px !important;
}

#login-overlay .login-field-label {
    font-size: 0.68rem !important;
    margin-bottom: 7px !important;
}

#login-overlay .input-field-modern {
    min-height: 48px !important;
    padding: 13px 14px !important;
    font-size: 16px !important;
    border-radius: 14px !important;
}

#login-overlay .login-password-row {
    position: relative !important;
}

#login-overlay .login-password-row .input-field-modern {
    padding-right: 50px !important;
}

#login-overlay .btn-toggle-pwd {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: 8px !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 10px !important;
    background: transparent !important;
    border: none !important;
    color: #a3a3a3 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#login-overlay .btn-login {
    min-height: 48px !important;
    border-radius: 14px !important;
}

/* Le pagine operative condividono la stessa shell mobile: fissiamo il respiro sotto la bottom bar
   e limitiamo i ritocchi ai soli moduli che hanno mostrato regressioni. */
body.page-produzione #contenitore-dati,
body.page-richieste #contenitore-dati,
body.page-acquisti #contenitore-dati {
    padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
}

/* Variabile touch-target condivisa – usata dai file modulo e da workspace-responsive.css */
body {
    --mobile-touch-target: 48px;
}

/* Le tab bar dei workspace sono tutte presenti nel DOM, ma ne deve comparire
   solo una alla volta. Alcuni overlay storici usano selettori larghi e possono
   battere lo style.display impostato dal JS. */
#acq-tab-bar,
#req-tab-bar,
#prod-tab-bar,
#pip-tab-bar,
#crm-tab-bar,
#kit-tab-bar {
    display: none !important;
}

body.page-acquisti #acq-tab-bar,
body.page-ordini-estero #acq-tab-bar,
body.page-richieste #req-tab-bar,
body.page-produzione #prod-tab-bar,
body.page-kit #prod-tab-bar,
body.page-manuali #prod-tab-bar,
body.page-pip #pip-tab-bar,
body.page-crm #crm-tab-bar {
    --mobile-scroll-gutter: 14px;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 8px var(--mobile-scroll-gutter) 10px !important;
    margin-left: calc(-1 * var(--mobile-scroll-gutter)) !important;
    margin-right: calc(-1 * var(--mobile-scroll-gutter)) !important;
    scroll-padding-inline: var(--mobile-scroll-gutter);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

body.page-acquisti #acq-tab-bar::-webkit-scrollbar,
body.page-ordini-estero #acq-tab-bar::-webkit-scrollbar,
body.page-richieste #req-tab-bar::-webkit-scrollbar,
body.page-produzione #prod-tab-bar::-webkit-scrollbar,
body.page-kit #prod-tab-bar::-webkit-scrollbar,
body.page-manuali #prod-tab-bar::-webkit-scrollbar,
body.page-pip #pip-tab-bar::-webkit-scrollbar,
body.page-crm #crm-tab-bar::-webkit-scrollbar {
    display: none;
}

body #app-sidebar-submenu .app-subtab-row,
html[data-theme] body #app-sidebar-submenu .app-subtab-row,
[data-theme] #app-sidebar-submenu .app-subtab-row {
    max-width: calc(100vw - 24px) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 4px 10px !important;
    scroll-padding-inline: 10px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

body #app-sidebar-submenu .app-subtab-row::-webkit-scrollbar,
html[data-theme] body #app-sidebar-submenu .app-subtab-row::-webkit-scrollbar,
[data-theme] #app-sidebar-submenu .app-subtab-row::-webkit-scrollbar {
    display: none;
}

body #app-sidebar-submenu .app-subtab-btn,
html[data-theme] body #app-sidebar-submenu .app-subtab-btn,
[data-theme] #app-sidebar-submenu .app-subtab-btn {
    flex: 0 0 auto !important;
}

/* Responsive sidebar fixes */
body.sidebar-is-open {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    touch-action: none !important;
}

body.sidebar-is-open .sidebar {
    max-width: calc(100vw - 18px) !important;
    overflow: hidden auto !important;
    overscroll-behavior-x: none !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    contain: layout paint !important;
}

body.sidebar-is-open .mobile-sidebar-backdrop {
    touch-action: none !important;
}

.sidebar .menu-item,
.sidebar .menu-content,
.sidebar-footer {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body.sidebar-is-open .sidebar *,
body.sidebar-is-open .sidebar-footer,
body.sidebar-is-open .sidebar-user-section {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

body.sidebar-is-open .app-sidebar-submenu {
    display: none !important;
}

.sidebar .menu-label {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.sidebar :where(button, [role="button"], .menu-item, .account-menu-item),
.mobile-sidebar-backdrop {
    min-width: var(--mobile-touch-target) !important;
    min-height: var(--mobile-touch-target) !important;
    box-sizing: border-box !important;
    touch-action: manipulation;
}

.sidebar .avatar-editor-btn {
    width: var(--mobile-touch-target) !important;
    height: var(--mobile-touch-target) !important;
}

/* The article-filter button was absolutely positioned by an older search style. */
.mobile-search-shell .btn-filtro-articoli-mobile {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    transform: none !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(17,17,17,0.08) !important;
    background: rgba(17,17,17,0.04) !important;
    color: #575757 !important;
    z-index: 1 !important;
}

.mobile-search-shell .mobile-search-close {
    position: static !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
}

.mobile-search-shell .btn-filtro-articoli-mobile:hover,
.mobile-search-shell .btn-filtro-articoli-mobile.active {
    background: #111111 !important;
    color: #ffffff !important;
    border-color: #111111 !important;
}

.mobile-search-shell input {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    padding-right: 0 !important;
}

/* Shared page-kit overrides from main recovery block */
body.page-kit #kit-tab-bar {
    margin-bottom: 12px !important;
}

body.page-kit .kit-tab-btn {
    min-height: 48px !important;
}