/*
|--------------------------------------------------------------------------
| Itatech Theme - Mobile Header
|--------------------------------------------------------------------------
| Mobile-only header layer. Desktop rules stay in header.css.
*/

@media (min-width: 1024px) {
    .ita-mobile-compact-header {
        display: none !important;
    }
}

@media (max-width: 1023px) {
    :root {
        --ita-mobile-header-bg: #1e1e22;
        --ita-mobile-panel-bg: #1e1e24;
        --ita-mobile-surface: #2a2a30;
        --ita-mobile-field: #3e3e40;
        --ita-mobile-text: #f6f7fb;
        --ita-mobile-muted: #c9cacc;
        --ita-mobile-accent: #241dda;
        --ita-mobile-accent-soft: #4d8fff;
        --ita-mobile-compact-header-height: 118px;
    }

    .ita-header,
    .custom-header {
        background: var(--ita-mobile-header-bg) !important;
    }

    .ita-mobile-header {
        position: relative !important;
        z-index: 30 !important;
        gap: 14px !important;
        padding: 16px 18px 17px !important;
        border-bottom: 1px solid rgba(255, 255, 255, .05) !important;
        background: var(--ita-mobile-header-bg) !important;
        box-shadow: 0 10px 24px rgba(0, 0, 0, .2) !important;
        transition: none !important;
    }

    .ita-mobile-header > .flex:first-child {
        min-height: 52px !important;
    }

    .ita-mobile-header .custom-burgem-color2 {
        gap: 10px !important;
        min-width: 0 !important;
    }

    .ita-mobile-header .icon-hamburger,
    .ita-mobile-compact-menu .icon-hamburger {
        color: #d5dde8 !important;
        font-size: 24px !important;
        line-height: 1 !important;
    }

    .ita-mobile-header .custom-logo {
        max-height: 38px !important;
        margin: 0 !important;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        display: block !important;
        width: 132px !important;
        max-width: 36vw !important;
        height: auto !important;
        object-fit: contain !important;
    }

    .ita-mobile-header .custom-color-icones {
        gap: 8px !important;
        align-items: center !important;
        color: var(--ita-mobile-text) !important;
    }

    .ita-mobile-header v-itatech-mini-cart {
        order: 1 !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn {
        order: 2 !important;
    }

    .ita-mobile-header .ita-mobile-notification-toggle {
        order: 3 !important;
    }

    .ita-mobile-header .ita-mobile-user-dropdown-shell {
        order: 4 !important;
    }

    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-compact-notification {
        position: relative !important;
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #ffffff !important;
        filter: none !important;
    }

    .ita-mobile-header .ita-notification-toggle:hover,
    .ita-mobile-compact-notification:hover {
        background: rgba(255, 255, 255, .06) !important;
        color: #ffffff !important;
    }

    .ita-mobile-header .ita-notification-toggle .fa-bell,
    .ita-mobile-compact-notification .fa-bell {
        font-size: 19px !important;
    }

    .ita-mobile-header .ita-notification-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        top: -4px !important;
        right: -5px !important;
        min-width: 17px !important;
        height: 17px !important;
        padding: 0 4px !important;
        border-color: var(--ita-mobile-header-bg) !important;
        font-size: 10px !important;
        box-shadow: none !important;
    }

    .ita-mobile-header .ita-cart-v4 {
        position: relative !important;
        display: inline-grid !important;
        width: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;
        height: 50px !important;
        min-height: 50px !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        background: var(--ita-mobile-accent) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-v4:hover,
    .ita-mobile-header .ita-cart-v4:active {
        transform: none !important;
        filter: brightness(1.07) !important;
        box-shadow: none !important;
    }

    .ita-mobile-header .ita-cart-icon-side {
        width: 100% !important;
        min-width: 100% !important;
        height: 100% !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        color: #ffffff !important;
        font-size: 22px !important;
    }

    .ita-mobile-header .ita-cart-info-side {
        display: none !important;
    }

    .ita-mobile-header .custom-user {
        display: none !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-header .ita-mobile-favorites-btn {
        position: relative !important;
        display: inline-grid !important;
        place-items: center !important;
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible {
        background: rgba(255, 255, 255, .06) !important;
        color: #ffffff !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn .ita-favorites-icon,
    .ita-mobile-compact-header .ita-mobile-favorites-btn .ita-favorites-icon {
        color: #ffffff !important;
        font-size: 19px !important;
        filter: none !important;
    }

    .ita-mobile-user-dropdown-shell,
    .ita-mobile-compact-user-dropdown-shell,
    .ita-mobile-user-dropdown,
    .ita-mobile-user-toggle {
        display: inline-grid !important;
        place-items: center !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        color: #f1e8dc !important;
        text-decoration: none !important;
    }

    .ita-mobile-header .ita-mobile-user-icon,
    .ita-mobile-user-toggle .ita-mobile-user-icon {
        color: #f1e8dc !important;
        font-size: 38px !important;
        line-height: 1 !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20 {
        right: 0 !important;
        left: auto !important;
        width: min(330px, calc(100vw - 24px)) !important;
        min-width: min(330px, calc(100vw - 24px)) !important;
        border: 1px solid rgba(77, 163, 255, .16) !important;
        border-radius: 10px !important;
        background: #1f2027 !important;
        color: #f6f7fb !important;
        box-shadow: 0 16px 34px rgba(0, 0, 0, .34) !important;
    }

    .ita-mobile-user-dropdown-content,
    .ita-mobile-user-dropdown-content p,
    .ita-mobile-user-dropdown-content a {
        color: #f6f7fb !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20 p,
    .ita-mobile-user-dropdown .absolute.z-20 a {
        color: #f6f7fb !important;
    }

    .ita-mobile-user-dropdown-content .border,
    .ita-mobile-user-dropdown-content [class*="border-zinc"],
    .ita-mobile-user-dropdown .absolute.z-20 .border,
    .ita-mobile-user-dropdown .absolute.z-20 [class*="border-zinc"] {
        border-color: rgba(255, 255, 255, .08) !important;
    }

    .ita-mobile-user-primary-action,
    .ita-mobile-user-dropdown .absolute.z-20 .bg-navyBlue {
        border-radius: 8px !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
    }

    .ita-mobile-user-secondary-action,
    .ita-mobile-user-dropdown .absolute.z-20 .bg-white {
        border-color: rgba(77, 163, 255, .28) !important;
        border-radius: 8px !important;
        background: #272831 !important;
        color: #ffffff !important;
    }

    .ita-mobile-header form {
        width: 100% !important;
    }

    .ita-mobile-header .custom-bar-position {
        top: 0 !important;
    }

    .ita-mobile-header .custom-lupa,
    .ita-mobile-compact-search-shell .icon-search {
        color: #c5cbd4 !important;
        font-size: 20px !important;
    }

    .ita-mobile-header .custom-color-bar {
        min-height: 50px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: var(--ita-mobile-field) !important;
        color: var(--ita-mobile-muted) !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        outline: none !important;
        box-shadow: none !important;
    }

    .ita-mobile-header .custom-color-bar::placeholder {
        color: #c6c7ca !important;
        opacity: 1 !important;
    }

    .ita-mobile-header .custom-color-bar:focus {
        border-color: transparent !important;
        outline: none !important;
        box-shadow: inset 0 0 0 1px rgba(77, 163, 255, .22) !important;
    }

    .ita-mobile-compact-header {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: 0 !important;
        z-index: 1100 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        min-height: var(--ita-mobile-compact-header-height) !important;
        padding: 10px 14px 12px !important;
        border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
        background: var(--ita-mobile-header-bg) !important;
        box-shadow: 0 12px 24px rgba(0, 0, 0, .24) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateY(-100%) !important;
        pointer-events: none !important;
        transition: none !important;
    }

    .ita-mobile-compact-header.is-visible {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    /*
     * Correção v194 - evita vão preto/pulo ao voltar para o topo no mobile.
     * O cabeçalho compacto fica fixo por cima da página, sem colapsar o
     * cabeçalho principal e sem empurrar o <main> com margin-top temporário.
     */
    html.ita-mobile-compact-visible .ita-mobile-header {
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        pointer-events: auto !important;
    }

    html.ita-mobile-compact-visible main#main {
        margin-top: 0 !important;
    }

    .ita-mobile-compact-top {
        display: grid !important;
        grid-template-columns: auto minmax(96px, 1fr) auto !important;
        align-items: center !important;
        gap: 10px !important;
        min-height: 46px !important;
    }

    .ita-mobile-compact-menu {
        display: inline-grid !important;
        place-items: center !important;
        width: 36px !important;
        height: 40px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #d5dde8 !important;
        padding: 0 !important;
    }

    .ita-mobile-compact-menu > div,
    .ita-mobile-compact-menu > div > div:first-child {
        display: inline-grid !important;
        place-items: center !important;
        width: 36px !important;
        height: 40px !important;
    }

    .ita-mobile-compact-logo {
        display: inline-flex !important;
        align-items: center !important;
        min-width: 0 !important;
    }

    .ita-mobile-compact-actions {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 6px !important;
    }

    .ita-mobile-compact-cart {
        order: 1 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
    }

    .ita-mobile-compact-header .ita-cart-v4 {
        position: relative !important;
        display: inline-grid !important;
        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        border: 0 !important;
        border-radius: 7px !important;
        overflow: hidden !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        color: #ffffff !important;
        font-size: 22px !important;
        box-shadow: none !important;
    }

    .ita-mobile-compact-header .ita-cart-v4:hover,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible {
        filter: brightness(1.07) !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-compact-header .ita-cart-icon-side {
        width: 100% !important;
        min-width: 100% !important;
        height: 100% !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        color: #ffffff !important;
        font-size: 22px !important;
    }

    .ita-mobile-compact-header .ita-cart-info-side {
        display: none !important;
    }

    .ita-mobile-compact-favorites-btn {
        order: 2 !important;
    }

    .ita-mobile-compact-notification {
        order: 3 !important;
    }

    .ita-mobile-compact-user-dropdown-shell {
        order: 4 !important;
    }

    .ita-mobile-compact-search {
        width: 100% !important;
    }

    .ita-mobile-compact-search-shell {
        position: relative !important;
        width: 100% !important;
    }

    .ita-mobile-compact-search-shell .icon-search {
        position: absolute !important;
        top: 50% !important;
        left: 14px !important;
        transform: translateY(-50%) !important;
        pointer-events: none !important;
    }

    .ita-mobile-compact-search-shell input {
        width: 100% !important;
        min-height: 44px !important;
        padding: 0 14px 0 44px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: var(--ita-mobile-field) !important;
        color: var(--ita-mobile-muted) !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        outline: none !important;
        box-shadow: none !important;
    }

    .ita-mobile-compact-search-shell input::placeholder {
        color: #c6c7ca !important;
        opacity: 1 !important;
    }

    .ita-mobile-compact-search-shell input:focus {
        box-shadow: inset 0 0 0 1px rgba(77, 163, 255, .22) !important;
    }

    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.inset-0.z-20,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.inset-0[class*="bg-gray-500"] {
        top: var(--ita-mobile-compact-header-height) !important;
        height: auto !important;
    }

    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.z-\[1000\] {
        top: var(--ita-mobile-compact-header-height) !important;
        bottom: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - var(--ita-mobile-compact-header-height)) !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-compact-header .fixed.inset-0.z-20,
    html.ita-mobile-compact-visible .ita-mobile-compact-header .fixed.inset-0[class*="bg-gray-500"] {
        top: var(--ita-mobile-compact-header-height) !important;
        height: auto !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-compact-header .fixed.z-\[1000\] {
        top: var(--ita-mobile-compact-header-height) !important;
        bottom: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - var(--ita-mobile-compact-header-height)) !important;
    }

    .ita-mobile-header .fixed.inset-0.z-20,
    .ita-mobile-header .fixed.inset-0.bg-gray-500,
    .ita-mobile-header .fixed.inset-0[class*="bg-gray-500"],
    .ita-mobile-compact-header .fixed.inset-0.z-20,
    .ita-mobile-compact-header .fixed.inset-0.bg-gray-500,
    .ita-mobile-compact-header .fixed.inset-0[class*="bg-gray-500"] {
        background: rgba(10, 10, 15, .74) !important;
        backdrop-filter: blur(2px) !important;
    }

    .ita-mobile-header .fixed.z-\[1000\],
    .ita-mobile-header .pointer-events-auto,
    .ita-mobile-header .pointer-events-auto.bg-white,
    .ita-mobile-header .pointer-events-auto[class*="bg-white"],
    .ita-mobile-compact-header .fixed.z-\[1000\],
    .ita-mobile-compact-header .pointer-events-auto,
    .ita-mobile-compact-header .pointer-events-auto.bg-white,
    .ita-mobile-compact-header .pointer-events-auto[class*="bg-white"] {
        background: var(--ita-mobile-panel-bg) !important;
        color: var(--ita-mobile-text) !important;
    }

    .ita-mobile-header .burger-color {
        border-color: rgba(255, 255, 255, .07) !important;
        background: var(--ita-mobile-panel-bg) !important;
    }

    .ita-mobile-header .custom-profile-bar {
        border-color: rgba(77, 163, 255, .16) !important;
        border-radius: 8px !important;
        background: #26272f !important;
        color: #ffffff !important;
    }

    .ita-mobile-category-panel {
        min-height: 100% !important;
        padding: 10px 6px 24px !important;
        background: var(--ita-mobile-panel-bg) !important;
        color: var(--ita-mobile-text) !important;
    }

    .ita-mobile-category-panel a::before,
    .ita-mobile-category-panel a::after,
    .ita-mobile-category-left::before,
    .ita-mobile-category-left::after,
    .ita-mobile-sub-link::before,
    .ita-mobile-sub-link::after,
    .ita-mobile-nested-link::before,
    .ita-mobile-nested-link::after,
    .ita-mobile-deep-link::before,
    .ita-mobile-deep-link::after {
        content: none !important;
        display: none !important;
    }

    .ita-mobile-category-list {
        display: grid !important;
        gap: 5px !important;
    }

    .ita-mobile-category-row,
    .ita-mobile-sub-row,
    .ita-mobile-nested-row,
    .ita-mobile-deep-link {
        display: flex !important;
        align-items: center !important;
        min-height: 48px !important;
        border-radius: 8px !important;
        color: var(--ita-mobile-text) !important;
    }

    .ita-mobile-category-row {
        background: transparent !important;
    }

    .ita-mobile-category-item.is-open > .ita-mobile-category-row,
    .ita-mobile-category-row:hover,
    .ita-mobile-sub-item.is-open > .ita-mobile-sub-row,
    .ita-mobile-nested-item.is-open > .ita-mobile-nested-row {
        background: rgba(77, 163, 255, .08) !important;
    }

    .ita-mobile-category-left,
    .ita-mobile-sub-link,
    .ita-mobile-nested-link,
    .ita-mobile-deep-link {
        display: flex !important;
        align-items: center !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
        gap: 10px !important;
        padding: 9px 10px !important;
        color: var(--ita-mobile-text) !important;
        text-decoration: none !important;
    }

    .ita-mobile-category-label,
    .ita-mobile-sub-label {
        min-width: 0 !important;
        overflow: hidden !important;
        color: #d9dde5 !important;
        font-size: 14px !important;
        font-weight: 900 !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis !important;
        text-transform: uppercase !important;
        white-space: nowrap !important;
    }

    .ita-mobile-category-icon,
    .ita-mobile-folder-icon {
        display: inline-grid !important;
        place-items: center !important;
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        border-radius: 8px !important;
        background: #2a2d36 !important;
        color: #8fb4ff !important;
    }

    .ita-mobile-category-icon::before {
        content: "" !important;
        display: block !important;
        width: 18px !important;
        height: 18px !important;
        background: #b7c3d5 !important;
        -webkit-mask: var(--ita-mobile-category-icon-image) center / contain no-repeat !important;
        mask: var(--ita-mobile-category-icon-image) center / contain no-repeat !important;
    }

    .ita-mobile-category-item.is-promotion .ita-mobile-category-icon::before {
        background: #b7c3d5 !important;
    }

    .ita-mobile-category-item.is-promotion .ita-mobile-category-row {
        background: transparent !important;
    }

    .ita-mobile-folder-icon i {
        font-size: 14px !important;
    }

    .ita-mobile-folder-icon--small {
        width: 26px !important;
        min-width: 26px !important;
        height: 26px !important;
        border-radius: 7px !important;
    }

    .ita-mobile-folder-icon--small i {
        font-size: 12px !important;
    }

    .ita-mobile-category-toggle,
    .ita-mobile-sub-toggle {
        display: inline-grid !important;
        place-items: center !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        margin-right: 8px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: rgba(77, 163, 255, .1) !important;
        color: #8fb4ff !important;
        transition: background .16s ease, color .16s ease !important;
    }

    .ita-mobile-sub-toggle--small {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
    }

    .ita-mobile-category-toggle i,
    .ita-mobile-sub-toggle i {
        font-size: 14px !important;
        transition: transform .16s ease !important;
    }

    .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-toggle i,
    .ita-mobile-sub-item.is-open > .ita-mobile-sub-row .ita-mobile-sub-toggle i,
    .ita-mobile-nested-item.is-open > .ita-mobile-nested-row .ita-mobile-sub-toggle i {
        transform: rotate(90deg) !important;
    }

    .ita-mobile-sub-list,
    .ita-mobile-nested-list,
    .ita-mobile-deep-list {
        display: grid !important;
        gap: 3px !important;
        margin: 2px 0 8px 24px !important;
        padding-left: 10px !important;
        border-left: 1px solid rgba(255, 255, 255, .08) !important;
    }

    .ita-mobile-deep-link {
        min-height: 40px !important;
        padding: 7px 8px !important;
    }
}

@media (max-width: 430px) {
    .ita-mobile-header {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: 112px !important;
        max-width: 30vw !important;
    }

    .ita-mobile-header .custom-color-icones,
    .ita-mobile-compact-actions {
        gap: 5px !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-cart {
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-user-dropdown-shell,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification,
    .ita-mobile-compact-user-dropdown-shell,
    .ita-mobile-user-dropdown,
    .ita-mobile-user-toggle {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
    }

    .ita-mobile-header .ita-mobile-user-icon,
    .ita-mobile-user-toggle .ita-mobile-user-icon {
        font-size: 34px !important;
    }
}

/* ==========================================================
   Correção v178 - Mobile: menu ao lado da busca + carrinho expandido
   - Move o botão de expandir/tudo para a esquerda da barra de pesquisa.
   - Mantém o carrinho expandido na linha superior do cabeçalho mobile.
   - Escopado somente no header mobile/compacto para não alterar desktop.
   ========================================================== */
@media (max-width: 1023px) {
    :root {
        --ita-mobile-compact-header-height: 122px;
    }

    .ita-mobile-header > .flex:first-child {
        gap: 8px !important;
    }

    .ita-mobile-logo-shell {
        min-width: 0 !important;
        flex: 0 1 auto !important;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: clamp(96px, 24vw, 132px) !important;
        max-width: none !important;
    }

    .ita-mobile-search-row,
    .ita-mobile-compact-search-row {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu {
        display: inline-grid !important;
        place-items: center !important;
        flex: 0 0 48px !important;
        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
        height: 50px !important;
        min-height: 50px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: rgba(255, 255, 255, .055) !important;
        color: #d5dde8 !important;
        box-shadow: none !important;
    }

    .ita-mobile-search-drawer > div,
    .ita-mobile-search-drawer > div > div:first-child,
    .ita-mobile-compact-menu > div,
    .ita-mobile-compact-menu > div > div:first-child {
        display: inline-grid !important;
        place-items: center !important;
        width: 48px !important;
        height: 50px !important;
    }

    .ita-mobile-search-drawer .icon-hamburger,
    .ita-mobile-compact-menu .icon-hamburger {
        color: #d5dde8 !important;
        font-size: 24px !important;
        line-height: 1 !important;
    }

    .ita-mobile-header form.ita-mobile-search-form,
    .ita-mobile-search-form,
    .ita-mobile-compact-search {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    .ita-mobile-compact-search-shell {
        width: 100% !important;
        min-width: 0 !important;
    }

    .ita-mobile-compact-top {
        display: grid !important;
        grid-template-columns: minmax(86px, 1fr) auto !important;
        align-items: center !important;
        gap: 8px !important;
        min-height: 46px !important;
    }

    .ita-mobile-compact-actions {
        min-width: 0 !important;
        gap: 5px !important;
    }

    .ita-mobile-header .custom-color-icones {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        gap: 6px !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4 {
        position: relative !important;
        display: inline-flex !important;
        align-items: stretch !important;
        width: 152px !important;
        min-width: 152px !important;
        max-width: 152px !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .ita-mobile-compact-cart {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: auto !important;
        min-width: 0 !important;
        height: 48px !important;
    }

    .ita-mobile-header .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-icon-side {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 46px !important;
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        border-radius: 6px 0 0 6px !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        color: #ffffff !important;
        font-size: 20px !important;
    }

    .ita-mobile-header .ita-cart-icon-side .fas,
    .ita-mobile-header .ita-cart-icon-side .fa-shopping-cart,
    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart {
        color: #ffffff !important;
        font-size: 20px !important;
        line-height: 1 !important;
    }

    .ita-mobile-header .ita-cart-info-side,
    .ita-mobile-compact-header .ita-cart-info-side {
        display: inline-flex !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;
        padding: 6px 8px 6px 9px !important;
        border: 1px solid rgba(76, 148, 255, .22) !important;
        border-left: 0 !important;
        border-radius: 0 6px 6px 0 !important;
        overflow: hidden !important;
        background: linear-gradient(180deg, #2a2a2f 0%, #242429 100%) !important;
        color: #ffffff !important;
        text-align: left !important;
    }

    .ita-mobile-header .ita-cart-title,
    .ita-mobile-header .ita-cart-price,
    .ita-mobile-compact-header .ita-cart-title,
    .ita-mobile-compact-header .ita-cart-price {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        color: #ffffff !important;
        line-height: 1.08 !important;
    }

    .ita-mobile-header .ita-cart-title,
    .ita-mobile-compact-header .ita-cart-title {
        font-size: 10px !important;
        font-weight: 900 !important;
        letter-spacing: .01em !important;
    }

    .ita-mobile-header .ita-cart-price,
    .ita-mobile-compact-header .ita-cart-price {
        margin-top: 2px !important;
        font-family: Roboto, Arial, sans-serif !important;
        font-size: 11px !important;
        font-weight: 800 !important;
    }

    .ita-mobile-header .ita-cart-v4:hover,
    .ita-mobile-header .ita-cart-v4:active,
    .ita-mobile-compact-header .ita-cart-v4:hover,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible {
        transform: none !important;
        filter: brightness(1.04) !important;
        box-shadow: none !important;
    }
}

@media (max-width: 560px) {
    .ita-mobile-header {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: clamp(76px, 22vw, 112px) !important;
        max-width: none !important;
    }

    .ita-mobile-header .custom-color-icones,
    .ita-mobile-compact-actions {
        gap: 4px !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4 {
        width: 132px !important;
        min-width: 132px !important;
        max-width: 132px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
    }

    .ita-mobile-header .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-icon-side {
        flex-basis: 40px !important;
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        font-size: 18px !important;
    }

    .ita-mobile-header .ita-cart-icon-side .fas,
    .ita-mobile-header .ita-cart-icon-side .fa-shopping-cart,
    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart {
        font-size: 18px !important;
    }

    .ita-mobile-header .ita-cart-info-side,
    .ita-mobile-compact-header .ita-cart-info-side {
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        padding: 5px 6px 5px 7px !important;
    }

    .ita-mobile-header .ita-cart-title,
    .ita-mobile-compact-header .ita-cart-title {
        font-size: 9px !important;
    }

    .ita-mobile-header .ita-cart-price,
    .ita-mobile-compact-header .ita-cart-price {
        font-size: 10px !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-user-dropdown-shell,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification,
    .ita-mobile-compact-user-dropdown-shell,
    .ita-mobile-user-dropdown,
    .ita-mobile-user-toggle {
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
    }

    .ita-mobile-header .ita-mobile-user-icon,
    .ita-mobile-user-toggle .ita-mobile-user-icon {
        font-size: 32px !important;
    }

    .ita-mobile-search-row,
    .ita-mobile-compact-search-row {
        gap: 8px !important;
    }

    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu,
    .ita-mobile-search-drawer > div,
    .ita-mobile-search-drawer > div > div:first-child,
    .ita-mobile-compact-menu > div,
    .ita-mobile-compact-menu > div > div:first-child {
        flex-basis: 44px !important;
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    .ita-mobile-header .custom-color-bar,
    .ita-mobile-compact-search-shell input {
        min-height: 44px !important;
    }
}

@media (max-width: 360px) {
    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: 72px !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4 {
        width: 124px !important;
        min-width: 124px !important;
        max-width: 124px !important;
    }

    .ita-mobile-header .ita-cart-title,
    .ita-mobile-compact-header .ita-cart-title {
        font-size: 8.5px !important;
    }

    .ita-mobile-header .ita-cart-price,
    .ita-mobile-compact-header .ita-cart-price {
        font-size: 9.5px !important;
    }
}

/* ==========================================================
   Correção v179 - Mobile: carrinho compacto + grid dos botões
   - Mantém o botão de expandir/tudo ao lado esquerdo da busca.
   - Volta o carrinho para o modo compacto no topo e no compacto fixo.
   - Expande melhor a logo sem quebrar a grade dos botões.
   - Padroniza a caixa/background dos botões como células iguais.
   ========================================================== */
@media (max-width: 1023px) {
    :root {
        --ita-mobile-compact-header-height: 122px;
        --ita-mobile-action-size: 42px;
        --ita-mobile-action-gap: 6px;
        --ita-mobile-action-bg: #2a2a2f;
        --ita-mobile-action-bg-hover: #303039;
    }

    .ita-mobile-header > .flex:first-child,
    .ita-mobile-compact-top {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .ita-mobile-logo-shell,
    .ita-mobile-compact-logo {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .ita-mobile-header .custom-logo,
    .ita-mobile-compact-logo {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: max-content !important;
        max-width: 100% !important;
        max-height: 44px !important;
        overflow: hidden !important;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: clamp(132px, 38vw, 176px) !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
    }

    .ita-mobile-header .custom-color-icones,
    .ita-mobile-compact-actions {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: var(--ita-mobile-action-size) !important;
        align-items: center !important;
        justify-content: end !important;
        gap: var(--ita-mobile-action-gap) !important;
        min-width: 0 !important;
        width: max-content !important;
        flex: 0 0 auto !important;
    }

    .ita-mobile-header v-itatech-mini-cart,
    .ita-mobile-compact-cart {
        display: inline-grid !important;
        place-items: center !important;
        width: var(--ita-mobile-action-size) !important;
        min-width: var(--ita-mobile-action-size) !important;
        max-width: var(--ita-mobile-action-size) !important;
        height: var(--ita-mobile-action-size) !important;
        min-height: var(--ita-mobile-action-size) !important;
        max-height: var(--ita-mobile-action-size) !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4 {
        display: inline-grid !important;
        place-items: center !important;
        width: var(--ita-mobile-action-size) !important;
        min-width: var(--ita-mobile-action-size) !important;
        max-width: var(--ita-mobile-action-size) !important;
        height: var(--ita-mobile-action-size) !important;
        min-height: var(--ita-mobile-action-size) !important;
        max-height: var(--ita-mobile-action-size) !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 6px !important;
        overflow: hidden !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-icon-side {
        display: inline-grid !important;
        place-items: center !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: 100% !important;
        flex: none !important;
        border-radius: 6px !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        color: #ffffff !important;
        font-size: 20px !important;
    }

    .ita-mobile-header .ita-cart-icon-side .fas,
    .ita-mobile-header .ita-cart-icon-side .fa-shopping-cart,
    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart {
        font-size: 20px !important;
        line-height: 1 !important;
        color: #ffffff !important;
    }

    .ita-mobile-header .ita-cart-info-side,
    .ita-mobile-compact-header .ita-cart-info-side {
        display: none !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-user-dropdown-shell,
    .ita-mobile-user-dropdown,
    .ita-mobile-user-toggle,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification,
    .ita-mobile-compact-user-dropdown-shell {
        width: var(--ita-mobile-action-size) !important;
        min-width: var(--ita-mobile-action-size) !important;
        max-width: var(--ita-mobile-action-size) !important;
        height: var(--ita-mobile-action-size) !important;
        min-height: var(--ita-mobile-action-size) !important;
        max-height: var(--ita-mobile-action-size) !important;
        border: 0 !important;
        border-radius: 6px !important;
        background: var(--ita-mobile-action-bg) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-header .ita-notification-toggle:hover,
    .ita-mobile-user-dropdown-shell:hover,
    .ita-mobile-user-toggle:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-notification:hover,
    .ita-mobile-compact-user-dropdown-shell:hover,
    .ita-mobile-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-header .ita-notification-toggle:focus-visible,
    .ita-mobile-user-toggle:focus-visible,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-notification:focus-visible {
        background: var(--ita-mobile-action-bg-hover) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .18) !important;
        outline: none !important;
        filter: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-mobile-user-icon,
    .ita-mobile-user-toggle .ita-mobile-user-icon {
        font-size: 32px !important;
        line-height: 1 !important;
    }

    .ita-mobile-header .ita-notification-toggle .fa-bell,
    .ita-mobile-compact-notification .fa-bell,
    .ita-mobile-header .ita-mobile-favorites-btn .ita-favorites-icon,
    .ita-mobile-compact-header .ita-mobile-favorites-btn .ita-favorites-icon {
        font-size: 19px !important;
        line-height: 1 !important;
    }

    .ita-mobile-search-row,
    .ita-mobile-compact-search-row {
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu,
    .ita-mobile-search-drawer > div,
    .ita-mobile-search-drawer > div > div:first-child,
    .ita-mobile-compact-menu > div,
    .ita-mobile-compact-menu > div > div:first-child {
        width: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
    }

    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu {
        border-radius: 8px !important;
        background: var(--ita-mobile-action-bg) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
    }

    .ita-mobile-search-form,
    .ita-mobile-compact-search {
        width: 100% !important;
        min-width: 0 !important;
    }
}

@media (max-width: 430px) {
    :root {
        --ita-mobile-action-size: 38px;
        --ita-mobile-action-gap: 4px;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: clamp(118px, 36vw, 148px) !important;
    }

    .ita-mobile-search-row,
    .ita-mobile-compact-search-row {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu,
    .ita-mobile-search-drawer > div,
    .ita-mobile-search-drawer > div > div:first-child,
    .ita-mobile-compact-menu > div,
    .ita-mobile-compact-menu > div > div:first-child {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
    }
}

@media (max-width: 360px) {
    :root {
        --ita-mobile-action-size: 36px;
        --ita-mobile-action-gap: 3px;
    }

    .ita-mobile-header .custom-logo img,
    .ita-mobile-compact-logo img {
        width: clamp(104px, 34vw, 130px) !important;
    }
}


/* ==========================================================
   Correção v180 - Mobile: espaçamento dos ícones + login desktop
   - Aumenta levemente o espaçamento do grid entre os ícones.
   - Remove a caixa/background dos ícones comuns.
   - Mantém somente o carrinho com caixa.
   - Usa o mesmo padrão visual do dropdown desktop no login mobile.
   ========================================================== */
@media (max-width: 1023px) {
    :root {
        --ita-mobile-action-gap: 10px;
    }

    .ita-mobile-header .custom-color-icones,
    .ita-mobile-compact-actions {
        gap: var(--ita-mobile-action-gap) !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-user-dropdown-shell,
    .ita-mobile-user-dropdown,
    .ita-mobile-user-toggle,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification,
    .ita-mobile-compact-user-dropdown-shell {
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    .ita-mobile-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-header .ita-notification-toggle:hover,
    .ita-mobile-user-dropdown-shell:hover,
    .ita-mobile-user-toggle:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-notification:hover,
    .ita-mobile-compact-user-dropdown-shell:hover,
    .ita-mobile-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-header .ita-notification-toggle:focus-visible,
    .ita-mobile-user-toggle:focus-visible,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-notification:focus-visible {
        background: transparent !important;
        box-shadow: none !important;
        outline: none !important;
        filter: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-header .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-icon-side {
        border-radius: 6px !important;
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4 {
        box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
    }

    .ita-mobile-header .ita-mobile-user-icon,
    .ita-mobile-user-toggle .ita-mobile-user-icon {
        color: #ffffff !important;
        font-size: 34px !important;
        line-height: 1 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        filter: none !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20,
    .ita-mobile-user-dropdown > .absolute,
    .ita-mobile-user-dropdown > div.absolute {
        top: calc(100% + 10px) !important;
        right: 0 !important;
        left: auto !important;
        width: min(350px, calc(100vw - 24px)) !important;
        min-width: min(350px, calc(100vw - 24px)) !important;
        max-width: calc(100vw - 24px) !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid rgba(255, 255, 255, .06) !important;
        border-radius: 18px !important;
        background: #1f1f22 !important;
        color: #ffffff !important;
        box-shadow: 0 18px 45px rgba(0, 0, 0, .45) !important;
        transform: none !important;
    }

    .ita-mobile-user-dropdown-content {
        padding: 0 !important;
        background: #1f1f22 !important;
        color: #ffffff !important;
        font-family: Roboto, Arial, Helvetica, sans-serif !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-card {
        width: 100% !important;
        overflow: hidden !important;
        border-radius: 18px !important;
        background: #1f1f22 !important;
        color: #ffffff !important;
        font-family: Roboto, Arial, Helvetica, sans-serif !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-head {
        padding: 22px 22px 16px !important;
        background: #1f1f22 !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-title,
    .ita-mobile-user-dropdown .ita-profile-menu-subtitle {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        margin: 0 !important;
        color: #ffffff !important;
        font-family: Roboto, Arial, Helvetica, sans-serif !important;
        text-align: left !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-title {
        margin-bottom: 10px !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        line-height: 1.25 !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-subtitle {
        color: #f1f1f3 !important;
        font-size: 13.5px !important;
        font-weight: 600 !important;
        line-height: 1.35 !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-title i,
    .ita-mobile-user-dropdown .ita-profile-menu-subtitle i {
        width: 20px !important;
        min-width: 20px !important;
        color: #cfd0d6 !important;
        font-size: 15px !important;
        line-height: 1 !important;
        text-align: center !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-divider {
        width: calc(100% - 44px) !important;
        height: 1px !important;
        margin: 0 22px !important;
        border: 0 !important;
        background: rgba(255, 255, 255, .72) !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-links {
        display: grid !important;
        gap: 4px !important;
        padding: 16px 10px 18px !important;
        background: #1f1f22 !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-link {
        display: flex !important;
        align-items: center !important;
        gap: 14px !important;
        min-height: 46px !important;
        padding: 0 16px !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #f1f1f3 !important;
        font-family: Roboto, Arial, Helvetica, sans-serif !important;
        font-size: 18px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        text-decoration: none !important;
        box-shadow: none !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-link i {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 22px !important;
        min-width: 22px !important;
        height: 22px !important;
        color: #cfd0d6 !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-link span {
        color: inherit !important;
        white-space: nowrap !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-link:hover,
    .ita-mobile-user-dropdown .ita-profile-menu-link:focus-visible {
        color: #ffffff !important;
        background: rgb(34, 23, 160) !important;
        outline: none !important;
        box-shadow: 0 10px 24px rgba(34, 23, 160, .24) !important;
        transform: translate3d(0, -1px, 0) !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-link:hover i,
    .ita-mobile-user-dropdown .ita-profile-menu-link:focus-visible i {
        color: #ffffff !important;
    }

    .ita-mobile-user-dropdown .ita-profile-menu-link--logout:hover,
    .ita-mobile-user-dropdown .ita-profile-menu-link--logout:focus-visible {
        background: rgba(249, 52, 87, .65) !important;
        box-shadow: 0 10px 24px rgba(249, 52, 87, .18) !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 14px !important;
        padding: 22px !important;
        background: #1f1f22 !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 9px !important;
        min-height: 58px !important;
        padding: 0 14px !important;
        border-radius: 15px !important;
        font-family: Roboto, Arial, Helvetica, sans-serif !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        text-decoration: none !important;
        box-shadow: none !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button--login {
        color: #ffffff !important;
        background: #07105a !important;
        border: 1px solid #07105a !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button--register {
        color: #07105a !important;
        background: #ffffff !important;
        border: 1px solid rgba(255, 255, 255, .96) !important;
        box-shadow: inset 0 0 0 1px rgba(7, 16, 90, .08) !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button i,
    .ita-mobile-user-dropdown .ita-profile-guest-button span {
        color: inherit !important;
        white-space: nowrap !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button:hover,
    .ita-mobile-user-dropdown .ita-profile-guest-button:focus-visible {
        outline: none !important;
        transform: translate3d(0, -1px, 0) !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button--login:hover,
    .ita-mobile-user-dropdown .ita-profile-guest-button--login:focus-visible {
        color: #ffffff !important;
        background: rgb(34, 23, 160) !important;
        border-color: rgb(34, 23, 160) !important;
    }

    .ita-mobile-user-dropdown .ita-profile-guest-button--register:hover,
    .ita-mobile-user-dropdown .ita-profile-guest-button--register:focus-visible {
        color: #07105a !important;
        background: #ffffff !important;
        border-color: rgba(255, 255, 255, .96) !important;
        box-shadow: inset 0 0 0 1px rgba(7, 16, 90, .08) !important;
    }
}

@media (max-width: 430px) {
    :root {
        --ita-mobile-action-gap: 7px;
    }
}

@media (max-width: 390px) {
    .ita-mobile-user-dropdown .ita-profile-guest-actions {
        grid-template-columns: 1fr !important;
    }
}

/* Ajuste final v180: remove também a caixa do botão de expandir/tudo e reforça as cores do dropdown convidado. */
@media (max-width: 1023px) {
    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu {
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20 a.ita-profile-guest-button--login,
    .ita-mobile-user-dropdown > .absolute a.ita-profile-guest-button--login,
    .ita-mobile-user-dropdown > div.absolute a.ita-profile-guest-button--login {
        color: #ffffff !important;
        background: #07105a !important;
        border-color: #07105a !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20 a.ita-profile-guest-button--register,
    .ita-mobile-user-dropdown > .absolute a.ita-profile-guest-button--register,
    .ita-mobile-user-dropdown > div.absolute a.ita-profile-guest-button--register {
        color: #07105a !important;
        background: #ffffff !important;
        border-color: rgba(255, 255, 255, .96) !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20 a.ita-profile-guest-button--register i,
    .ita-mobile-user-dropdown .absolute.z-20 a.ita-profile-guest-button--register span,
    .ita-mobile-user-dropdown > .absolute a.ita-profile-guest-button--register i,
    .ita-mobile-user-dropdown > .absolute a.ita-profile-guest-button--register span,
    .ita-mobile-user-dropdown > div.absolute a.ita-profile-guest-button--register i,
    .ita-mobile-user-dropdown > div.absolute a.ita-profile-guest-button--register span {
        color: #07105a !important;
    }

    .ita-mobile-user-dropdown .absolute.z-20 a.ita-profile-guest-button--login i,
    .ita-mobile-user-dropdown .absolute.z-20 a.ita-profile-guest-button--login span,
    .ita-mobile-user-dropdown > .absolute a.ita-profile-guest-button--login i,
    .ita-mobile-user-dropdown > .absolute a.ita-profile-guest-button--login span,
    .ita-mobile-user-dropdown > div.absolute a.ita-profile-guest-button--login i,
    .ita-mobile-user-dropdown > div.absolute a.ita-profile-guest-button--login span {
        color: #ffffff !important;
    }
}

/* ==========================================================
   Correção v181 - Mobile: manter caixa do botão Expandir
   - Restaura somente a caixa/background do botão Expandir/Tudo.
   - Mantém os demais ícones sem caixa e preserva o carrinho como estava.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-search-drawer,
    .ita-mobile-compact-menu {
        border: 0 !important;
        border-radius: 8px !important;
        background: var(--ita-mobile-action-bg, #2a2a2f) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
    }

    .ita-mobile-search-drawer:hover,
    .ita-mobile-search-drawer:focus-visible,
    .ita-mobile-compact-menu:hover,
    .ita-mobile-compact-menu:focus-visible {
        background: var(--ita-mobile-action-bg-hover, #303039) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .18) !important;
        outline: none !important;
        filter: none !important;
        transform: none !important;
    }
}


/* ==========================================================
   Correcao v183 - Mobile: barra compacta igual ao desktop
   - Remove a copia do cabecalho mobile com logo.
   - Usa a mesma ordem funcional do desktop: Mostrar Tudo, busca e acoes.
   - Evita sobreposicao entre o cabecalho normal e a barra compacta.
   ========================================================== */
@media (max-width: 1023px) {
    :root {
        --ita-mobile-compact-header-height: 64px;
        --ita-mobile-compact-action-size: 42px;
        --ita-mobile-compact-gap: 8px;
    }

    .ita-mobile-compact-header {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: 0 !important;
        z-index: 1300 !important;
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 8px 10px !important;
        border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        box-shadow: 0 10px 22px rgba(0, 0, 0, .24) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translate3d(0, -100%, 0) !important;
        pointer-events: none !important;
        transition: opacity .16s ease, transform .16s ease, visibility .16s ease !important;
    }

    .ita-mobile-compact-header.is-visible {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translate3d(0, 0, 0) !important;
        pointer-events: auto !important;
    }

    .ita-mobile-compact-inner {
        display: grid !important;
        grid-template-columns: auto minmax(120px, 1fr) auto !important;
        align-items: center !important;
        gap: var(--ita-mobile-compact-gap) !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
    }

    .ita-mobile-compact-all-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        width: auto !important;
        min-width: 48px !important;
        max-width: 150px !important;
        height: 48px !important;
        padding: 0 12px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: var(--ita-mobile-action-bg, #2a2a2f) !important;
        color: #ffffff !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .16) !important;
        cursor: pointer !important;
        white-space: nowrap !important;
    }

    .ita-mobile-compact-all-button:hover,
    .ita-mobile-compact-all-button:focus-visible {
        background: var(--ita-mobile-action-bg-hover, #303039) !important;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .18) !important;
        outline: none !important;
    }

    .ita-mobile-compact-all-button .icon-hamburger {
        color: #d5dde8 !important;
        font-size: 22px !important;
        line-height: 1 !important;
    }

    .ita-mobile-compact-all-text {
        display: inline-block !important;
        color: #ffffff !important;
        font-size: 11px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        text-transform: uppercase !important;
    }

    .ita-mobile-compact-search {
        width: 100% !important;
        min-width: 0 !important;
    }

    .ita-mobile-compact-search-shell {
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .ita-mobile-compact-search-shell .icon-search {
        position: absolute !important;
        top: 50% !important;
        left: 13px !important;
        z-index: 1 !important;
        color: #c5cbd4 !important;
        font-size: 19px !important;
        line-height: 1 !important;
        transform: translateY(-50%) !important;
        pointer-events: none !important;
    }

    .ita-mobile-compact-search-shell input {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 48px !important;
        min-height: 48px !important;
        padding: 0 12px 0 42px !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: var(--ita-mobile-field, #3e3e40) !important;
        color: var(--ita-mobile-muted, #c9cacc) !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 48px !important;
        outline: none !important;
        box-shadow: none !important;
    }

    .ita-mobile-compact-search-shell input::placeholder {
        color: #c6c7ca !important;
        opacity: 1 !important;
    }

    .ita-mobile-compact-search-shell input:focus {
        box-shadow: inset 0 0 0 1px rgba(77, 163, 255, .22) !important;
    }

    .ita-mobile-compact-actions {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: var(--ita-mobile-compact-action-size) !important;
        align-items: center !important;
        justify-content: end !important;
        gap: 6px !important;
        min-width: 0 !important;
    }

    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        display: inline-grid !important;
        place-items: center !important;
        width: var(--ita-mobile-compact-action-size) !important;
        min-width: var(--ita-mobile-compact-action-size) !important;
        max-width: var(--ita-mobile-compact-action-size) !important;
        height: var(--ita-mobile-compact-action-size) !important;
        min-height: var(--ita-mobile-compact-action-size) !important;
        max-height: var(--ita-mobile-compact-action-size) !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 6px !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-icon-side {
        background: linear-gradient(135deg, #3216b9 0%, #1147c5 100%) !important;
        color: #ffffff !important;
    }

    .ita-mobile-compact-header .ita-cart-icon-side {
        display: inline-grid !important;
        place-items: center !important;
        width: 100% !important;
        min-width: 100% !important;
        height: 100% !important;
        border-radius: 6px !important;
    }

    .ita-mobile-compact-header .ita-cart-info-side {
        display: none !important;
    }

    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart {
        color: #ffffff !important;
        font-size: 20px !important;
        line-height: 1 !important;
    }

    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        background: transparent !important;
        color: #ffffff !important;
    }

    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-notification:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-notification:focus-visible {
        background: transparent !important;
        box-shadow: none !important;
        outline: none !important;
        filter: none !important;
    }

    .ita-mobile-compact-header .ita-favorites-icon,
    .ita-mobile-compact-notification .fa-bell {
        color: #ffffff !important;
        font-size: 19px !important;
        line-height: 1 !important;
    }

    .ita-mobile-compact-header .ita-favorites-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        top: -4px !important;
        right: -4px !important;
        min-width: 17px !important;
        height: 17px !important;
        padding: 0 4px !important;
        border-color: var(--ita-mobile-header-bg, #1e1e22) !important;
        font-size: 10px !important;
    }

    /*
     * Correção v194 - evita vão preto/pulo ao voltar para o topo no mobile.
     * O cabeçalho compacto fica fixo por cima da página, sem colapsar o
     * cabeçalho principal e sem empurrar o <main> com margin-top temporário.
     */
    html.ita-mobile-compact-visible .ita-mobile-header {
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        pointer-events: auto !important;
    }

    html.ita-mobile-compact-visible main#main {
        margin-top: 0 !important;
    }
}

@media (max-width: 620px) {
    .ita-mobile-compact-inner {
        grid-template-columns: 48px minmax(96px, 1fr) auto !important;
        gap: 7px !important;
    }

    .ita-mobile-compact-all-button {
        width: 48px !important;
        max-width: 48px !important;
        padding: 0 !important;
    }

    .ita-mobile-compact-all-text {
        display: none !important;
    }
}

@media (max-width: 390px) {
    :root {
        --ita-mobile-compact-action-size: 38px;
        --ita-mobile-compact-gap: 6px;
    }

    .ita-mobile-compact-header {
        padding-right: 8px !important;
        padding-left: 8px !important;
    }

    .ita-mobile-compact-inner {
        grid-template-columns: 44px minmax(84px, 1fr) auto !important;
        gap: 6px !important;
    }

    .ita-mobile-compact-all-button {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
    }

    .ita-mobile-compact-search-shell input {
        height: 44px !important;
        min-height: 44px !important;
        line-height: 44px !important;
        font-size: 12px !important;
    }
}


/* ==========================================================
   Correcao v184 - Mobile: remove flicker da entrada compacta
   - A troca entre cabecalho normal e compacta passa a ser imediata.
   - Mantem fundo escuro no header, html, body e app durante o scroll.
   ========================================================== */
@media (max-width: 1023px) {
    html,
    body,
    #app,
    .ita-header,
    .custom-header {
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
    }

    .ita-mobile-compact-header,
    .ita-mobile-compact-header.is-visible {
        transition: none !important;
        animation: none !important;
    }

    .ita-mobile-compact-header {
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        will-change: auto !important;
    }

    .ita-mobile-compact-header.is-visible {
        transform: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header {
        transition: none !important;
        animation: none !important;
    }
}


/* ==========================================================
   Correcao v185 - Mobile: drawers visiveis a partir da compacta
   - O container do cabecalho normal fica vivo para os componentes Vue.
   - Somente os controles visuais do cabecalho normal somem.
   - Drawers/painel do carrinho deixam de ficar "abertos invisiveis".
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible .ita-mobile-header {
        display: block !important;
        max-height: none !important;
        min-height: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: visible !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child,
    html.ita-mobile-compact-visible .ita-mobile-search-row {
        min-height: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-logo-shell,
    html.ita-mobile-compact-visible .ita-mobile-header .custom-user,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-notification-toggle:not(.ita-mobile-compact-notification),
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-favorites-btn:not(.ita-mobile-compact-favorites-btn),
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown-shell,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mini-cart-drawer > div:first-child,
    html.ita-mobile-compact-visible .ita-mobile-search-form,
    html.ita-mobile-compact-visible .ita-mobile-search-drawer > div > div:first-child {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .fixed,
    html.ita-mobile-compact-visible .ita-mobile-header .pointer-events-auto,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mini-cart-drawer {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}


/* ==========================================================
   Correcao v186 - Mobile: drawers abaixo da barra compacta
   - Replica o enquadramento da compacta desktop no mobile.
   - O painel abre abaixo da barra, e nao por tras dela.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible .ita-mobile-header .fixed.inset-0.z-20,
    html.ita-mobile-compact-visible .ita-mobile-header .fixed.inset-0.bg-gray-500,
    html.ita-mobile-compact-visible .ita-mobile-header .fixed.inset-0[class*="bg-gray-500"],
    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.inset-0.z-20,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.inset-0.bg-gray-500,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.inset-0[class*="bg-gray-500"] {
        top: var(--ita-mobile-compact-header-height) !important;
        height: auto !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .fixed.z-\[1000\],
    html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.z-\[1000\] {
        top: var(--ita-mobile-compact-header-height) !important;
        bottom: 0 !important;
        height: auto !important;
        max-height: calc(100dvh - var(--ita-mobile-compact-header-height)) !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .pointer-events-auto,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer .pointer-events-auto {
        height: 100% !important;
        max-height: calc(100dvh - var(--ita-mobile-compact-header-height)) !important;
    }

    @supports not (height: 100dvh) {
        html.ita-mobile-compact-visible .ita-mobile-header .fixed.z-\[1000\],
        html.ita-mobile-compact-visible .ita-mini-cart-drawer .fixed.z-\[1000\],
        html.ita-mobile-compact-visible .ita-mobile-header .pointer-events-auto,
        html.ita-mobile-compact-visible .ita-mini-cart-drawer .pointer-events-auto {
            max-height: calc(100vh - var(--ita-mobile-compact-header-height)) !important;
        }
    }
}


/* ==========================================================
   Correcao v187 - Mobile: barra compacta sem empurrao
   - Mantem o cabecalho mobile com a mesma altura no fluxo do documento.
   - A compacta entra como overlay fixo por transform/opacity.
   - Preserva os drawers abaixo da compacta sem aplicar margin no main.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible {
        scroll-padding-top: var(--ita-mobile-compact-header-height) !important;
    }

    html.ita-mobile-compact-visible main#main {
        margin-top: 0 !important;
    }

    .ita-mobile-compact-header {
        transform: translate3d(0, -100%, 0) !important;
        transition:
            opacity .18s ease,
            transform .18s ease,
            visibility 0s linear .18s !important;
        will-change: opacity, transform !important;
    }

    .ita-mobile-compact-header.is-visible {
        transform: translate3d(0, 0, 0) !important;
        transition-delay: 0s !important;
    }

    html.ita-mobile-compact-visible .ita-header,
    html.ita-mobile-compact-visible .custom-header {
        background: transparent !important;
        box-shadow: none !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 14px !important;
        max-height: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 16px 18px 17px !important;
        border-bottom: 1px solid transparent !important;
        overflow: visible !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: none !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child {
        display: flex !important;
        min-height: 52px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-search-row {
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .fixed,
    html.ita-mobile-compact-visible .ita-mobile-header .pointer-events-auto,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mini-cart-drawer,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}


/* ==========================================================
   Correcao v188 - Mobile: compacta com acoes, busca expansivel e badges
   - Remove o bloco escuro remanescente atras da compacta.
   - Carrinho usa badge numerico como favoritos/notificacoes.
   - Compacta vira barra de botoes com rotulo inferior e busca expansivel.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible body,
    html.ita-mobile-compact-visible #app,
    html.ita-mobile-compact-visible main#main {
        background: #ffffff !important;
    }

    html.ita-mobile-compact-visible .ita-header,
    html.ita-mobile-compact-visible .custom-header,
    html.ita-mobile-compact-visible .ita-mobile-header {
        background: transparent !important;
        box-shadow: none !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-cart-v4 {
        position: relative !important;
        display: inline-grid !important;
        place-items: center !important;
        overflow: visible !important;
        border: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-header v-itatech-mini-cart {
        width: var(--ita-mobile-action-size, 42px) !important;
        min-width: var(--ita-mobile-action-size, 42px) !important;
        max-width: var(--ita-mobile-action-size, 42px) !important;
        height: var(--ita-mobile-action-size, 42px) !important;
        min-height: var(--ita-mobile-action-size, 42px) !important;
        max-height: var(--ita-mobile-action-size, 42px) !important;
    }

    .ita-mobile-header .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-icon-side {
        display: inline-grid !important;
        place-items: center !important;
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        font-size: 20px !important;
    }

    .ita-mobile-header .ita-cart-icon-side .fas,
    .ita-mobile-header .ita-cart-icon-side .fa-shopping-cart,
    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart {
        color: #ffffff !important;
        font-size: 20px !important;
        line-height: 1 !important;
    }

    .ita-mobile-header .ita-cart-info-side,
    .ita-mobile-compact-header .ita-cart-info-side {
        display: none !important;
    }

    .ita-cart-badge,
    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-cart-badge {
        position: absolute !important;
        top: -4px !important;
        right: -5px !important;
        z-index: 2 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 17px !important;
        height: 17px !important;
        padding: 0 4px !important;
        border: 2px solid var(--ita-mobile-header-bg, #1e1e22) !important;
        border-radius: 999px !important;
        background: #ef4444 !important;
        color: #ffffff !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        box-shadow: none !important;
    }

    .ita-mobile-compact-header {
        padding: 8px 10px !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translate3d(0, -100%, 0) !important;
        transition:
            opacity .18s ease,
            transform .18s ease,
            visibility 0s linear .18s !important;
        will-change: opacity, transform !important;
    }

    .ita-mobile-compact-header.is-visible {
        opacity: 1 !important;
        visibility: visible !important;
        transform: translate3d(0, 0, 0) !important;
        transition-delay: 0s !important;
    }

    .ita-mobile-compact-inner {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: start !important;
        gap: 0 !important;
        width: 100% !important;
        min-height: 56px !important;
    }

    .ita-mobile-compact-actions {
        display: contents !important;
    }

    .ita-mobile-compact-action,
    .ita-mobile-compact-all-button,
    .ita-mobile-compact-search-toggle,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        position: relative !important;
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
        padding: 3px 2px 2px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
        cursor: pointer !important;
        transform: none !important;
        text-decoration: none !important;
    }

    .ita-mobile-compact-action:hover,
    .ita-mobile-compact-action:focus-visible,
    .ita-mobile-compact-all-button:hover,
    .ita-mobile-compact-all-button:focus-visible,
    .ita-mobile-compact-search-toggle:hover,
    .ita-mobile-compact-search-toggle:focus-visible,
    .ita-mobile-compact-header .ita-cart-v4:hover,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-notification:hover,
    .ita-mobile-compact-notification:focus-visible {
        background: rgba(255, 255, 255, .06) !important;
        box-shadow: none !important;
        outline: none !important;
        filter: none !important;
        transform: none !important;
    }

    .ita-mobile-compact-action-icon,
    .ita-mobile-compact-all-button .icon-hamburger,
    .ita-mobile-compact-search-toggle .icon-search,
    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart,
    .ita-mobile-compact-header .ita-favorites-icon,
    .ita-mobile-compact-notification .fa-bell {
        color: #ffffff !important;
        font-size: 20px !important;
        line-height: 1 !important;
    }

    .ita-mobile-compact-action-label,
    .ita-mobile-compact-all-text {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        color: #ffffff !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        line-height: 1.1 !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        text-transform: none !important;
        white-space: nowrap !important;
    }

    .ita-mobile-compact-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-favorites-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        top: 1px !important;
        right: calc(50% - 24px) !important;
        border-color: var(--ita-mobile-header-bg, #1e1e22) !important;
    }

    .ita-mobile-compact-search {
        order: 2 !important;
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-height: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition:
            max-height .18s ease,
            margin-top .18s ease,
            opacity .14s ease !important;
    }

    .ita-mobile-compact-header.is-search-open .ita-mobile-compact-search {
        max-height: 54px !important;
        margin-top: 8px !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .ita-mobile-compact-search-shell input {
        height: 46px !important;
        min-height: 46px !important;
        line-height: 46px !important;
    }
}

@media (max-width: 390px) {
    .ita-mobile-compact-action-label,
    .ita-mobile-compact-all-text {
        font-size: 9px !important;
    }

    .ita-mobile-compact-action,
    .ita-mobile-compact-all-button,
    .ita-mobile-compact-search-toggle,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
    }
}


/* ==========================================================
   Correcao v189 - Mobile: compacta em linha unica
   - Mantem os icones em uma unica barra horizontal.
   - Busca abre sobreposta abaixo da barra, sem quebrar a linha.
   - Neutraliza hover herdado do carrinho e isola a badge do desktop.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-compact-header {
        min-height: 64px !important;
        padding: 7px 10px !important;
    }

    .ita-mobile-compact-inner {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 4px !important;
        min-height: 50px !important;
        width: 100% !important;
    }

    .ita-mobile-compact-actions {
        display: contents !important;
    }

    .ita-mobile-compact-action,
    .ita-mobile-compact-all-button,
    .ita-mobile-compact-search-toggle,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;
        padding: 3px 1px 2px !important;
    }

    .ita-mobile-compact-action-label,
    .ita-mobile-compact-all-text {
        font-size: 10px !important;
        line-height: 1 !important;
    }

    .ita-mobile-compact-action-icon,
    .ita-mobile-compact-all-button .icon-hamburger,
    .ita-mobile-compact-search-toggle .icon-search,
    .ita-mobile-compact-header .ita-cart-icon-side .fas,
    .ita-mobile-compact-header .ita-cart-icon-side .fa-shopping-cart,
    .ita-mobile-compact-header .ita-favorites-icon,
    .ita-mobile-compact-notification .fa-bell {
        font-size: 19px !important;
    }

    .ita-mobile-compact-search {
        position: absolute !important;
        top: calc(100% + 7px) !important;
        right: 0 !important;
        left: 0 !important;
        z-index: 1 !important;
        display: block !important;
        width: 100% !important;
        max-height: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transform: translate3d(0, -6px, 0) !important;
        transition:
            opacity .16s ease,
            transform .16s ease,
            max-height .16s ease !important;
    }

    .ita-mobile-compact-header.is-search-open .ita-mobile-compact-search {
        max-height: 52px !important;
        margin: 0 !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: translate3d(0, 0, 0) !important;
    }

    .ita-mobile-compact-search-shell {
        border-radius: 10px !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        box-shadow: 0 12px 22px rgba(0, 0, 0, .24) !important;
    }

    .ita-mobile-header .ita-cart-v4:hover,
    .ita-mobile-header .ita-cart-v4:focus-visible,
    .ita-mobile-header .ita-cart-v4:active,
    .ita-mobile-compact-header .ita-cart-v4:hover,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible,
    .ita-mobile-compact-header .ita-cart-v4:active {
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-v4:hover .ita-cart-icon-side,
    .ita-mobile-header .ita-cart-v4:focus-visible .ita-cart-icon-side,
    .ita-mobile-header .ita-cart-v4:active .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-v4:hover .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-v4:active .ita-cart-icon-side,
    .ita-mobile-header .ita-cart-v4:hover .ita-cart-info-side,
    .ita-mobile-compact-header .ita-cart-v4:hover .ita-cart-info-side {
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-cart-badge {
        display: inline-flex !important;
    }
}

@media (max-width: 390px) {
    .ita-mobile-compact-action-label,
    .ita-mobile-compact-all-text {
        font-size: 8.5px !important;
    }

    .ita-mobile-compact-action,
    .ita-mobile-compact-all-button,
    .ita-mobile-compact-search-toggle,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
    }
}


/* ==========================================================
   Correcao v190 - Mobile: remove bloco flutuante e tela branca
   - O botao antigo do drawer fica invisivel enquanto a compacta aparece.
   - O cabecalho original volta assim que a compacta inicia a saida.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible .ita-mobile-search-drawer {
        border-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-search-drawer > div > div:first-child,
    html.ita-mobile-compact-visible .ita-mobile-search-drawer .icon-hamburger {
        background: transparent !important;
        box-shadow: none !important;
        color: transparent !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-search-drawer .fixed,
    html.ita-mobile-compact-visible .ita-mobile-search-drawer .pointer-events-auto {
        color: inherit !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}


/* ==========================================================
   Correcao v192 - Mobile: remove faixa por layout, sem trocar fundo
   - Colapsa o cabecalho original enquanto a compacta esta ativa.
   - O JS compensa o scroll para evitar empurrao.
   - Reverte a cor forcada da correcao anterior.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible,
    html.ita-mobile-compact-visible body,
    html.ita-mobile-compact-visible #app,
    html.ita-mobile-compact-visible main#main {
        background: revert !important;
    }

    html.ita-mobile-compact-visible .ita-header,
    html.ita-mobile-compact-visible .custom-header {
        height: 0 !important;
        min-height: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        box-shadow: none !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header {
        display: block !important;
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child,
    html.ita-mobile-compact-visible .ita-mobile-search-row {
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .fixed,
    html.ita-mobile-compact-visible .ita-mobile-header .pointer-events-auto,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mini-cart-drawer,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    html.ita-mobile-compact-visible main#main {
        margin-top: 0 !important;
    }
}

/* ==========================================================
   Correcao v193 - Mobile: troca compacta/principal sem pulo
   - O cabecalho principal nao e mais colapsado enquanto a compacta esta ativa.
   - Mantem a altura original no fluxo da pagina para o scroll nao recalcular a tela.
   - Esconde somente os controles visuais do cabecalho principal, preservando drawers/Vue.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible .ita-header,
    html.ita-mobile-compact-visible .custom-header {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        box-shadow: none !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 14px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 16px 18px 17px !important;
        border-bottom: 1px solid transparent !important;
        overflow: visible !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child {
        display: flex !important;
        min-height: 52px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-search-row {
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible main#main {
        margin-top: 0 !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .fixed,
    html.ita-mobile-compact-visible .ita-mobile-header .pointer-events-auto,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mini-cart-drawer,
    html.ita-mobile-compact-visible .ita-mini-cart-drawer {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}


/* ==========================================================
   Correção v194 - Mobile: remove o vão preto na subida
   - Mantém o cabeçalho principal no fluxo normal da página.
   - Não deixa linhas internas invisíveis enquanto a compacta está ativa.
   - A compacta apenas sobrepõe a página e some antes do cabeçalho principal entrar.
   ========================================================== */
@media (max-width: 1023px) {
    html.ita-mobile-compact-visible main#main {
        margin-top: 0 !important;
    }

    html.ita-mobile-compact-visible .ita-header,
    html.ita-mobile-compact-visible .custom-header {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        box-shadow: none !important;
        pointer-events: auto !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 14px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 16px clamp(12px, 4vw, 18px) 17px !important;
        border-bottom: 1px solid rgba(255, 255, 255, .05) !important;
        overflow: visible !important;
        background: var(--ita-mobile-header-bg, #1e1e22) !important;
        box-shadow: 0 10px 24px rgba(0, 0, 0, .2) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child,
    html.ita-mobile-compact-visible .ita-mobile-search-row {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child {
        display: flex !important;
        min-height: 52px !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-search-row {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 48px !important;
        gap: 10px !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-logo-shell,
    html.ita-mobile-compact-visible .ita-mobile-header .custom-user,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-notification-toggle:not(.ita-mobile-compact-notification),
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-favorites-btn:not(.ita-mobile-compact-favorites-btn),
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown-shell,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mini-cart-drawer > div:first-child,
    html.ita-mobile-compact-visible .ita-mobile-search-form,
    html.ita-mobile-compact-visible .ita-mobile-search-drawer > div > div:first-child {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

/* ==========================================================
   Correção v195 - Mobile: nomes abaixo dos ícones do cabeçalho principal
   - Aplica o mesmo padrão de rótulo da barra compacta nos ícones superiores.
   - Não altera a lógica do mini-cart, favoritos, notificações ou login.
   ========================================================== */
@media (max-width: 1023px) {
    :root {
        --ita-mobile-main-action-width: 52px;
        --ita-mobile-main-action-height: 58px;
        --ita-mobile-main-icon-size: 20px;
        --ita-mobile-main-label-size: 9.5px;
    }

    .ita-mobile-header > .flex:first-child,
    html.ita-mobile-compact-visible .ita-mobile-header > .flex:first-child {
        align-items: center !important;
        min-height: var(--ita-mobile-main-action-height) !important;
    }

    .ita-mobile-header .custom-color-icones {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: var(--ita-mobile-main-action-width) !important;
        align-items: center !important;
        justify-content: end !important;
        gap: 7px !important;
        width: max-content !important;
        min-width: 0 !important;
    }

    .ita-mobile-header v-itatech-mini-cart,
    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-header .ita-mobile-user-dropdown-shell {
        position: relative !important;
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        width: var(--ita-mobile-main-action-width) !important;
        min-width: var(--ita-mobile-main-action-width) !important;
        max-width: var(--ita-mobile-main-action-width) !important;
        height: var(--ita-mobile-main-action-height) !important;
        min-height: var(--ita-mobile-main-action-height) !important;
        max-height: var(--ita-mobile-main-action-height) !important;
        padding: 2px 1px 1px !important;
        border: 0 !important;
        border-radius: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
        filter: none !important;
        transform: none !important;
        text-decoration: none !important;
    }

    .ita-mobile-header .ita-cart-v4:hover,
    .ita-mobile-header .ita-cart-v4:focus-visible,
    .ita-mobile-header .ita-cart-v4:active,
    .ita-mobile-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-header .ita-notification-toggle:hover,
    .ita-mobile-header .ita-notification-toggle:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:hover,
    .ita-mobile-header .ita-mobile-user-toggle:hover,
    .ita-mobile-header .ita-mobile-user-toggle:focus-visible {
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-icon-side,
    .ita-mobile-header .ita-mobile-favorites-btn .ita-favorites-icon,
    .ita-mobile-header .ita-notification-toggle .fa-bell {
        display: inline-grid !important;
        place-items: center !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 24px !important;
        min-height: 24px !important;
        max-height: 24px !important;
        margin: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        font-size: var(--ita-mobile-main-icon-size) !important;
        line-height: 1 !important;
    }

    .ita-mobile-header .ita-cart-icon-side .fas,
    .ita-mobile-header .ita-cart-icon-side .fa-shopping-cart {
        color: #ffffff !important;
        font-size: var(--ita-mobile-main-icon-size) !important;
        line-height: 1 !important;
    }

    .ita-mobile-header .ita-cart-info-side {
        display: none !important;
    }

    .ita-mobile-header .ita-mobile-user-dropdown,
    .ita-mobile-header .ita-mobile-user-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 28px !important;
        min-height: 28px !important;
        max-height: 28px !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .ita-mobile-header .ita-mobile-user-icon,
    .ita-mobile-user-toggle .ita-mobile-user-icon {
        color: #ffffff !important;
        font-size: 31px !important;
        line-height: 1 !important;
        transform: none !important;
        filter: none !important;
    }

    .ita-mobile-header .ita-mobile-main-action-label {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        overflow: hidden !important;
        color: #ffffff !important;
        font-family: Roboto, Arial, sans-serif !important;
        font-size: var(--ita-mobile-main-label-size) !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        text-align: center !important;
        text-overflow: clip !important;
        text-transform: none !important;
        white-space: nowrap !important;
        pointer-events: none !important;
    }



    .ita-mobile-header .ita-mobile-main-user-label,
    .ita-mobile-header .ita-mobile-user-dropdown-shell > .ita-mobile-main-action-label {
        align-self: center !important;
        justify-self: center !important;
        text-align: center !important;
        transform: translateX(0) !important;
    }
    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-header .ita-favorites-badge,
    .ita-mobile-header .ita-notification-badge {
        top: 2px !important;
        right: 4px !important;
        z-index: 4 !important;
        border-color: var(--ita-mobile-header-bg, #1e1e22) !important;
    }
}

@media (max-width: 430px) {
    :root {
        --ita-mobile-main-action-width: 49px;
        --ita-mobile-main-action-height: 56px;
        --ita-mobile-main-label-size: 9px;
    }

    .ita-mobile-header .custom-color-icones {
        gap: 3px !important;
    }
}

@media (max-width: 360px) {
    :root {
        --ita-mobile-main-action-width: 45px;
        --ita-mobile-main-label-size: 8.7px;
    }

    .ita-mobile-header .custom-color-icones {
        gap: 2px !important;
    }
}


/* ==========================================================
   Correção v196 - Mobile: rótulos isolados do desktop e sem abreviação
   - O rótulo do carrinho fica oculto fora do cabeçalho mobile.
   - Aumenta a área útil dos ícones sem reduzir a logo.
   - Remove uppercase/ellipsis dos nomes e centraliza Conta.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .custom-color-icones {
        grid-auto-columns: var(--ita-mobile-main-action-width, 52px) !important;
        gap: 3px !important;
    }

    .ita-mobile-header .ita-mobile-main-action-label {
        display: block !important;
        overflow: visible !important;
        text-align: center !important;
        text-overflow: clip !important;
        text-transform: none !important;
        white-space: nowrap !important;
    }

    .ita-mobile-header .ita-mobile-main-user-label,
    .ita-mobile-header .ita-mobile-user-dropdown-shell > .ita-mobile-main-action-label {
        align-self: center !important;
        justify-self: center !important;
        width: 100% !important;
        text-align: center !important;
        transform: none !important;
    }
}

@media (max-width: 430px) {
    .ita-mobile-header .custom-color-icones {
        gap: 3px !important;
    }
}

@media (max-width: 360px) {
    .ita-mobile-header .custom-color-icones {
        gap: 2px !important;
    }
}

/* ==========================================================
   Correção v197 - Mobile: badges/tags padronizadas nos ícones
   - Reposiciona as tags para ficarem mais próximas/entradas no ícone.
   - Mantém o mesmo posicionamento no cabeçalho principal e na barra compacta.
   - Padroniza largura, altura e fonte das tags de carrinho, favoritos e avisos.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-header .ita-favorites-badge,
    .ita-mobile-header .ita-notification-badge,
    .ita-mobile-compact-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-favorites-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        position: absolute !important;
        top: 2px !important;
        right: calc(50% - 18px) !important;
        z-index: 5 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 17px !important;
        width: auto !important;
        height: 17px !important;
        min-height: 17px !important;
        max-height: 17px !important;
        padding: 0 4px !important;
        border: 2px solid var(--ita-mobile-header-bg, #1e1e22) !important;
        border-radius: 999px !important;
        background: #ef4444 !important;
        color: #ffffff !important;
        font-family: Roboto, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        text-align: center !important;
        box-shadow: none !important;
        transform: none !important;
    }
}

/* ==========================================================
   Correção v198 - Mobile: ajuste fino das tags/badges
   - Mantém as cores herdadas da versão anterior.
   - Alinha todas as tags na mesma altura.
   - Deixa as tags apenas levemente entradas no ícone.
   - Corrige o carrinho da barra compacta para não ficar muito para dentro.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-header .ita-favorites-badge,
    .ita-mobile-header .ita-notification-badge,
    .ita-mobile-compact-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-favorites-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        position: absolute !important;
        z-index: 5 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 17px !important;
        width: auto !important;
        height: 17px !important;
        min-height: 17px !important;
        max-height: 17px !important;
        padding: 0 4px !important;
        border-width: 2px !important;
        border-style: solid !important;
        border-color: var(--ita-mobile-header-bg, #1e1e22) !important;
        border-radius: 999px !important;
        font-family: Roboto, Arial, sans-serif !important;
        font-size: 10px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        text-align: center !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-header .ita-favorites-badge,
    .ita-mobile-header .ita-notification-badge {
        top: 2px !important;
        right: 4px !important;
    }

    .ita-mobile-compact-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-favorites-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        top: 2px !important;
        right: calc(50% - 22px) !important;
    }
}

/* ==========================================================
   Correção v199 - Mobile: alinhamento fino das tags do sino
   - Mantém as cores já existentes, sem trocar a coloração das tags.
   - Deixa a tag do sino levemente mais para dentro do ícone.
   - Igual o padrão visual entre cabeçalho principal e barra compacta.
   - Corrige a barra compacta para a tag não ficar mais baixa que as outras.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-header .ita-favorites-badge,
    .ita-mobile-header .ita-notification-badge,
    .ita-mobile-compact-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-favorites-badge,
    .ita-mobile-compact-header .ita-notification-badge {
        min-width: 17px !important;
        height: 17px !important;
        min-height: 17px !important;
        max-height: 17px !important;
        padding: 0 4px !important;
        line-height: 1 !important;
        align-items: center !important;
        justify-content: center !important;
        transform: none !important;
        box-shadow: none !important;
    }

    .ita-mobile-header .ita-cart-badge,
    .ita-mobile-header .ita-favorites-badge {
        top: 1px !important;
        right: 5px !important;
    }

    .ita-mobile-header .ita-notification-badge {
        top: 1px !important;
        right: 7px !important;
    }

    .ita-mobile-compact-header .ita-cart-badge,
    .ita-mobile-compact-header .ita-favorites-badge {
        top: 0 !important;
        right: calc(50% - 20px) !important;
    }

    .ita-mobile-compact-header .ita-notification-badge {
        top: 0 !important;
        right: calc(50% - 18px) !important;
    }
}

/* ==========================================================
   Correção v203 - Mobile: badge azul somente quando houver valor
   - Mantém a cor vermelha original quando o contador está zerado.
   - Quando o contador fica acima de 0, aplica azul no badge.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-cart-badge.ita-mobile-badge-has-value,
    .ita-mobile-header .ita-favorites-badge.ita-mobile-badge-has-value,
    .ita-mobile-header .ita-notification-badge.ita-mobile-badge-has-value,
    .ita-mobile-compact-header .ita-cart-badge.ita-mobile-badge-has-value,
    .ita-mobile-compact-header .ita-favorites-badge.ita-mobile-badge-has-value,
    .ita-mobile-compact-header .ita-notification-badge.ita-mobile-badge-has-value {
        background: #2f6bff !important;
    }
}

/* ==========================================================
   Correção v204 - Mobile: nome do cliente e ajuste visual da logo
   - Mantém os ícones na posição atual.
   - Move somente a logo principal levemente para a direita no mobile.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-mobile-logo-shell {
        transform: translateX(6px) !important;
    }
}

/* ==========================================================
   Correção v205 - Mobile: hover discreto nos ícones
   - Adiciona efeito hover nos ícones do cabeçalho principal e compacto.
   - Não altera posição, tamanho, badges/tags, cores dos contadores ou lógica.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-header .ita-mobile-user-dropdown-shell,
    .ita-mobile-header .ita-mobile-user-toggle,
    .ita-mobile-compact-action,
    .ita-mobile-compact-all-button,
    .ita-mobile-compact-search-toggle,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        transition: background-color .16s ease, background .16s ease, opacity .16s ease !important;
    }

    .ita-mobile-header .ita-cart-v4:hover,
    .ita-mobile-header .ita-cart-v4:focus-visible,
    .ita-mobile-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-header .ita-notification-toggle:hover,
    .ita-mobile-header .ita-notification-toggle:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:hover,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus-within,
    .ita-mobile-header .ita-mobile-user-toggle:hover,
    .ita-mobile-header .ita-mobile-user-toggle:focus-visible,
    .ita-mobile-compact-action:hover,
    .ita-mobile-compact-action:focus-visible,
    .ita-mobile-compact-all-button:hover,
    .ita-mobile-compact-all-button:focus-visible,
    .ita-mobile-compact-search-toggle:hover,
    .ita-mobile-compact-search-toggle:focus-visible,
    .ita-mobile-compact-header .ita-cart-v4:hover,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-notification:hover,
    .ita-mobile-compact-notification:focus-visible {
        background: rgba(255, 255, 255, .08) !important;
        border-radius: 8px !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-v4:hover .ita-cart-icon-side,
    .ita-mobile-header .ita-cart-v4:focus-visible .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-v4:hover .ita-cart-icon-side,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible .ita-cart-icon-side {
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        transform: none !important;
    }
}


/* ==========================================================
   Correção v206 - Mobile touch: remove hover preso após toque
   - Mantém o hover da v205 para dispositivos com mouse.
   - Em telas touch, não deixa :hover/:focus preso quando o usuário toca fora.
   - Mantém apenas um feedback rápido no :active durante o toque.
   ========================================================== */
@media (max-width: 1023px) and (hover: none), (max-width: 1023px) and (pointer: coarse) {
    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-header .ita-mobile-favorites-btn,
    .ita-mobile-header .ita-notification-toggle,
    .ita-mobile-header .ita-mobile-user-dropdown-shell,
    .ita-mobile-header .ita-mobile-user-toggle,
    .ita-mobile-compact-action,
    .ita-mobile-compact-all-button,
    .ita-mobile-compact-search-toggle,
    .ita-mobile-compact-header .ita-cart-v4,
    .ita-mobile-compact-header .ita-mobile-favorites-btn,
    .ita-mobile-compact-notification {
        -webkit-tap-highlight-color: transparent !important;
    }

    .ita-mobile-header .ita-cart-v4:hover,
    .ita-mobile-header .ita-cart-v4:focus,
    .ita-mobile-header .ita-cart-v4:focus-visible,
    .ita-mobile-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-header .ita-mobile-favorites-btn:focus,
    .ita-mobile-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-header .ita-notification-toggle:hover,
    .ita-mobile-header .ita-notification-toggle:focus,
    .ita-mobile-header .ita-notification-toggle:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:hover,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus-within,
    .ita-mobile-header .ita-mobile-user-toggle:hover,
    .ita-mobile-header .ita-mobile-user-toggle:focus,
    .ita-mobile-header .ita-mobile-user-toggle:focus-visible,
    .ita-mobile-compact-action:hover,
    .ita-mobile-compact-action:focus,
    .ita-mobile-compact-action:focus-visible,
    .ita-mobile-compact-all-button:hover,
    .ita-mobile-compact-all-button:focus,
    .ita-mobile-compact-all-button:focus-visible,
    .ita-mobile-compact-search-toggle:hover,
    .ita-mobile-compact-search-toggle:focus,
    .ita-mobile-compact-search-toggle:focus-visible,
    .ita-mobile-compact-header .ita-cart-v4:hover,
    .ita-mobile-compact-header .ita-cart-v4:focus,
    .ita-mobile-compact-header .ita-cart-v4:focus-visible,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:hover,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:focus-visible,
    .ita-mobile-compact-notification:hover,
    .ita-mobile-compact-notification:focus,
    .ita-mobile-compact-notification:focus-visible {
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-cart-v4:active,
    .ita-mobile-header .ita-mobile-favorites-btn:active,
    .ita-mobile-header .ita-notification-toggle:active,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:active,
    .ita-mobile-header .ita-mobile-user-toggle:active,
    .ita-mobile-compact-action:active,
    .ita-mobile-compact-all-button:active,
    .ita-mobile-compact-search-toggle:active,
    .ita-mobile-compact-header .ita-cart-v4:active,
    .ita-mobile-compact-header .ita-mobile-favorites-btn:active,
    .ita-mobile-compact-notification:active {
        background: rgba(255, 255, 255, .08) !important;
        border-radius: 8px !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }
}

/* ==========================================================
   Correção v207 - Mobile: botão Tudo / painel expandido
   - Alinha os ícones das categorias no painel aberto pelo botão Tudo.
   - Usa o mesmo padrão visual do header.css desktop: célula fixa do ícone,
     texto alinhado ao centro e seta em coluna própria.
   - Escopado somente ao mobile, sem alterar desktop ou os ícones do cabeçalho.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-category-panel .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-sub-row,
    .ita-mobile-category-panel .ita-mobile-nested-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 38px !important;
        align-items: center !important;
        column-gap: 6px !important;
        min-height: 46px !important;
        padding: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-left,
    .ita-mobile-category-panel .ita-mobile-sub-link,
    .ita-mobile-category-panel .ita-mobile-nested-link,
    .ita-mobile-category-panel .ita-mobile-deep-link {
        display: grid !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 0 10px 0 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-deep-link {
        grid-template-columns: 32px minmax(0, 1fr) !important;
        margin-left: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-folder-icon {
        display: inline-grid !important;
        place-items: center !important;
        justify-self: start !important;
        align-self: stretch !important;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        margin: 0 !important;
        border-radius: 8px !important;
        line-height: 1 !important;
    }

    .ita-mobile-category-panel .ita-mobile-folder-icon--small {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        border-radius: 7px !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-icon::before {
        width: 19px !important;
        height: 19px !important;
        margin: 0 !important;
        transform: none !important;
    }

    .ita-mobile-category-panel .ita-mobile-folder-icon i {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 19px !important;
        height: 19px !important;
        margin: 0 !important;
        font-size: 15px !important;
        line-height: 1 !important;
        transform: none !important;
    }

    .ita-mobile-category-panel .ita-mobile-folder-icon--small i {
        width: 17px !important;
        height: 17px !important;
        font-size: 13px !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-label,
    .ita-mobile-category-panel .ita-mobile-sub-label {
        display: block !important;
        align-self: center !important;
        min-width: 0 !important;
        line-height: 1.15 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-toggle {
        justify-self: end !important;
        align-self: center !important;
        width: 34px !important;
        min-width: 34px !important;
        max-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        margin: 0 4px 0 0 !important;
        padding: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-sub-toggle--small {
        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
        max-height: 30px !important;
    }

    .ita-mobile-category-panel .ita-mobile-sub-list,
    .ita-mobile-category-panel .ita-mobile-nested-list,
    .ita-mobile-category-panel .ita-mobile-deep-list {
        margin-left: 18px !important;
        padding-left: 8px !important;
    }
}

/* ==========================================================
   Correção v208 - Mobile: alinhamento da categoria Promoções
   - Ajuste pontual somente no item Promoções do painel aberto pelo botão Tudo.
   - Mantém a mesma grade/padrão da v207 e apenas compensa o eixo visual do rocket.png.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion > .ita-mobile-category-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 38px !important;
        align-items: center !important;
        column-gap: 6px !important;
        min-height: 46px !important;
        padding: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-left {
        display: grid !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 0 10px 0 0 !important;
        margin: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-icon {
        display: inline-grid !important;
        place-items: center !important;
        justify-self: start !important;
        align-self: stretch !important;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        margin: 0 0 0 4px !important;
        border-radius: 8px !important;
        line-height: 1 !important;
        transform: none !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-icon::before {
        width: 19px !important;
        height: 19px !important;
        margin: 0 !important;
        transform: none !important;
        -webkit-mask: var(--ita-mobile-category-icon-image) center / 19px 19px no-repeat !important;
        mask: var(--ita-mobile-category-icon-image) center / 19px 19px no-repeat !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-label {
        align-self: center !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.15 !important;
        text-align: left !important;
    }
}

/* ==========================================================
   Correção v209 - Mobile: grade do botão Tudo padronizada
   - Ajusta somente o painel expandido pelo botão Tudo.
   - Remove compensações diferentes da categoria Promoções.
   - Padroniza a grade, coluna dos ícones e espaçamento entre categorias
     com o padrão compacto do header.css desktop.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-category-panel .ita-mobile-category-list {
        gap: 2px !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item,
    .ita-mobile-category-panel .ita-mobile-sub-item,
    .ita-mobile-category-panel .ita-mobile-nested-item {
        margin: 0 !important;
        padding: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion > .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-sub-row,
    .ita-mobile-category-panel .ita-mobile-nested-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 38px !important;
        align-items: center !important;
        column-gap: 6px !important;
        min-height: 46px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-left,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-left,
    .ita-mobile-category-panel .ita-mobile-sub-link,
    .ita-mobile-category-panel .ita-mobile-nested-link,
    .ita-mobile-category-panel .ita-mobile-deep-link {
        display: grid !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;
        min-width: 0 !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 10px 0 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-folder-icon {
        display: inline-grid !important;
        place-items: center !important;
        justify-self: start !important;
        align-self: center !important;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1 !important;
        transform: none !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-icon::before,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-icon::before {
        width: 19px !important;
        height: 19px !important;
        margin: 0 !important;
        transform: none !important;
        -webkit-mask: var(--ita-mobile-category-icon-image) center / 19px 19px no-repeat !important;
        mask: var(--ita-mobile-category-icon-image) center / 19px 19px no-repeat !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-label,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-label,
    .ita-mobile-category-panel .ita-mobile-sub-label {
        align-self: center !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.15 !important;
        text-align: left !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-toggle {
        justify-self: end !important;
        align-self: center !important;
        margin: 0 4px 0 0 !important;
    }

    .ita-mobile-category-panel .ita-mobile-sub-list,
    .ita-mobile-category-panel .ita-mobile-nested-list,
    .ita-mobile-category-panel .ita-mobile-deep-list {
        gap: 2px !important;
    }
}

/* ==========================================================
   Correção v210 - Mobile: botão Tudo com espaçamento/hover no padrão desktop
   - Mantém a grade da v209.
   - Ajusta somente o painel expandido pelo botão Tudo no mobile.
   - Aproxima o hover, item aberto e espaçamento do padrão do header.css desktop.
   ========================================================== */
@media (max-width: 1023px) {
    .ita-mobile-category-panel .ita-mobile-category-list {
        gap: 9px !important;
        padding: 4px 0 20px !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion > .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-sub-row,
    .ita-mobile-category-panel .ita-mobile-nested-row {
        min-height: 54px !important;
        border-left: 3px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        transition: background-color .18s ease, border-color .18s ease !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover,
    .ita-mobile-category-panel .ita-mobile-category-row:focus-within,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-sub-row:hover,
    .ita-mobile-category-panel .ita-mobile-sub-row:focus-within,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row,
    .ita-mobile-category-panel .ita-mobile-nested-row:hover,
    .ita-mobile-category-panel .ita-mobile-nested-row:focus-within,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row {
        background: rgba(17, 71, 197, .13) !important;
        border-left-color: #1147c5 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row {
        background: rgba(17, 71, 197, .16) !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-left,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-left,
    .ita-mobile-category-panel .ita-mobile-sub-link,
    .ita-mobile-category-panel .ita-mobile-nested-link,
    .ita-mobile-category-panel .ita-mobile-deep-link {
        grid-template-columns: 32px minmax(0, 1fr) !important;
        column-gap: 14px !important;
        min-height: 54px !important;
        padding: 0 10px 0 14px !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-category-item.is-promotion .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-folder-icon {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        max-height: 32px !important;
        align-self: center !important;
        border-radius: 8px !important;
        transition: background-color .18s ease, transform .18s ease !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-sub-row:hover .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-row:hover .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row .ita-mobile-folder-icon {
        background: rgba(17, 71, 197, .22) !important;
        transform: translateX(1px) !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover .ita-mobile-category-icon::before,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-icon::before {
        background: #4da3ff !important;
        opacity: 1 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-toggle {
        justify-self: end !important;
        align-self: center !important;
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        margin: 0 8px 0 0 !important;
        background: transparent !important;
        color: #8fb4ff !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-row:hover .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-row:hover .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row .ita-mobile-sub-toggle {
        background: transparent !important;
        color: #ffffff !important;
    }

    .ita-mobile-category-panel .ita-mobile-sub-list,
    .ita-mobile-category-panel .ita-mobile-nested-list,
    .ita-mobile-category-panel .ita-mobile-deep-list {
        gap: 5px !important;
        margin-top: 4px !important;
        margin-bottom: 10px !important;
    }
}

/* ==========================================================
   Correção v211 - Mobile: hover do painel Tudo não fica preso
   - Em telas touch, remove o destaque preso por :hover/:focus-within
     quando todas as categorias são recolhidas.
   - Mantém o destaque real somente no item aberto (.is-open).
   - Não altera grade, espaçamento ou lógica dos ícones do cabeçalho.
   ========================================================== */
@media (max-width: 1023px) and (hover: none), (max-width: 1023px) and (pointer: coarse) {
    .ita-mobile-category-panel .ita-mobile-category-row:hover,
    .ita-mobile-category-panel .ita-mobile-category-row:focus-within,
    .ita-mobile-category-panel .ita-mobile-sub-row:hover,
    .ita-mobile-category-panel .ita-mobile-sub-row:focus-within,
    .ita-mobile-category-panel .ita-mobile-nested-row:hover,
    .ita-mobile-category-panel .ita-mobile-nested-row:focus-within {
        background: transparent !important;
        border-left-color: transparent !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-sub-row:hover .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-row:hover .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-category-row:focus-within .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-sub-row:focus-within .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-row:focus-within .ita-mobile-folder-icon {
        transform: none !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover .ita-mobile-category-icon::before,
    .ita-mobile-category-panel .ita-mobile-category-row:focus-within .ita-mobile-category-icon::before {
        background: #cbd5e1 !important;
        opacity: .95 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:hover .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-category-row:focus-within .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-row:hover .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-row:focus-within .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-row:hover .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-row:focus-within .ita-mobile-sub-toggle {
        background: transparent !important;
        color: #8fb4ff !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:active,
    .ita-mobile-category-panel .ita-mobile-sub-row:active,
    .ita-mobile-category-panel .ita-mobile-nested-row:active,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row {
        background: rgba(17, 71, 197, .16) !important;
        border-left-color: #1147c5 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:active .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-sub-row:active .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-row:active .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row .ita-mobile-folder-icon {
        background: rgba(17, 71, 197, .22) !important;
        transform: translateX(1px) !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:active .ita-mobile-category-icon::before,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-icon::before {
        background: #4da3ff !important;
        opacity: 1 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-row:active .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-row:active .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-row:active .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-category-item.is-open > .ita-mobile-category-row .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-item.is-open > .ita-mobile-sub-row .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-item.is-open > .ita-mobile-nested-row .ita-mobile-sub-toggle {
        background: transparent !important;
        color: #ffffff !important;
    }
}


/* ==========================================================
   Correção v212 - Mobile: ícone do Tudo não mantém hover preso
   - Ajusta somente o ícone das categorias no painel Tudo em telas touch.
   - Quando o item não está aberto, o ícone volta para o estado normal mesmo se o navegador mantiver :hover/:focus/:active.
   - Mantém o destaque apenas no item realmente aberto (.is-open).
   ========================================================== */
@media (max-width: 1023px) and (hover: none), (max-width: 1023px) and (pointer: coarse) {
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:hover .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:focus-within .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:active .ita-mobile-category-icon,
    .ita-mobile-category-panel .ita-mobile-sub-item:not(.is-open) > .ita-mobile-sub-row:hover .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-sub-item:not(.is-open) > .ita-mobile-sub-row:focus-within .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-sub-item:not(.is-open) > .ita-mobile-sub-row:active .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-item:not(.is-open) > .ita-mobile-nested-row:hover .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-item:not(.is-open) > .ita-mobile-nested-row:focus-within .ita-mobile-folder-icon,
    .ita-mobile-category-panel .ita-mobile-nested-item:not(.is-open) > .ita-mobile-nested-row:active .ita-mobile-folder-icon {
        background: #2a2d36 !important;
        color: #8fb4ff !important;
        transform: none !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:hover .ita-mobile-category-icon::before,
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:focus-within .ita-mobile-category-icon::before,
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:active .ita-mobile-category-icon::before {
        background: #b7c3d5 !important;
        opacity: .95 !important;
    }

    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:hover .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:focus-within .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-category-item:not(.is-open) > .ita-mobile-category-row:active .ita-mobile-category-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-item:not(.is-open) > .ita-mobile-sub-row:hover .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-item:not(.is-open) > .ita-mobile-sub-row:focus-within .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-sub-item:not(.is-open) > .ita-mobile-sub-row:active .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-item:not(.is-open) > .ita-mobile-nested-row:hover .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-item:not(.is-open) > .ita-mobile-nested-row:focus-within .ita-mobile-sub-toggle,
    .ita-mobile-category-panel .ita-mobile-nested-item:not(.is-open) > .ita-mobile-nested-row:active .ita-mobile-sub-toggle {
        background: transparent !important;
        color: #8fb4ff !important;
    }
}

/* ========================================================================
   Correção v312 - Mobile compacto: texto "Carrinho" sem corte inferior
   ------------------------------------------------------------------------
   Ajusta somente o rótulo do carrinho para evitar que a última letra fique
   cortada. Não altera lógica, badge, ícone, posição ou outros botões.
   ======================================================================== */
@media (max-width: 1023px) {
    .ita-mobile-compact-header .ita-mobile-compact-cart-button > .ita-mobile-compact-action-label,
    .ita-mobile-header .ita-cart-v4 > .ita-mobile-main-cart-label {
        line-height: 1.24 !important;
        min-height: 13px !important;
        padding-bottom: 1px !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

/* ========================================================================
   Correção v313 - Carrinho mobile: texto sem corte lateral
   ------------------------------------------------------------------------
   Ajusta somente o label "Carrinho" para a última letra não ser cortada.
   Não altera lógica, badge, ícone, ordem, posição geral ou outros botões.
   ======================================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-cart-v4,
    .ita-mobile-header v-itatech-mini-cart,
    .ita-mobile-compact-header .ita-mobile-compact-cart-button {
        overflow: visible !important;
    }

    .ita-mobile-header .ita-cart-v4 > .ita-mobile-main-cart-label,
    .ita-mobile-header v-itatech-mini-cart > .ita-cart-v4 > .ita-mobile-main-cart-label,
    .ita-mobile-compact-header .ita-mobile-compact-cart-button > .ita-mobile-compact-action-label {
        display: block !important;
        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;
        margin-right: -2px !important;
        margin-left: -2px !important;
        padding-right: 2px !important;
        padding-left: 2px !important;
        overflow: visible !important;
        text-overflow: clip !important;
        white-space: nowrap !important;
        line-height: 1.22 !important;
        letter-spacing: -0.04px !important;
    }
}

/* ========================================================================
   Correção v327.11 - Dropdown do usuário não sobrepõe a barra compacta mobile
   ------------------------------------------------------------------------
   Quando a barra compacta mobile estiver visível, qualquer menu/dropdown de
   usuário aberto no cabeçalho principal é ocultado para não ficar por cima
   da barra compacta. Não altera carrinho, favoritos, avisos ou tema escuro.
   ======================================================================== */

@media (max-width: 1024px) {
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown .absolute.z-20,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown > .absolute,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown > div.absolute,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown-content {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown,
    html.ita-mobile-compact-visible .ita-mobile-header .ita-mobile-user-dropdown-shell {
        z-index: 1 !important;
    }
}

/* ========================================================================
   Correção v327.13 - Mobile compacta some sem animação ao voltar ao topo
   ------------------------------------------------------------------------
   Preserva a estrutura atual, mas força o estado de saída da barra compacta
   a desaparecer imediatamente quando o cabeçalho principal volta a aparecer.
   ======================================================================== */
@media (max-width: 1023px) {
    .ita-mobile-compact-header.is-hiding-instant,
    .ita-mobile-compact-header.is-hiding-instant:not(.is-visible) {
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translate3d(0, -100%, 0) !important;
        pointer-events: none !important;
        transition: none !important;
        animation: none !important;
        will-change: auto !important;
    }
}


/* ========================================================================
   Correção v328 - Mobile: usuário sem hover e drawers sem arrastar a página
   ------------------------------------------------------------------------
   - Remove o estado hover/focus/active do botão de usuário somente no mobile.
   - Mantém a rolagem presa ao painel do carrinho/menu, sem repassar o gesto
     para a página por trás do drawer.
   ======================================================================== */
@media (max-width: 1023px) {
    .ita-mobile-header .ita-mobile-user-dropdown-shell,
    .ita-mobile-header .ita-mobile-user-dropdown,
    .ita-mobile-header .ita-mobile-user-dropdown > div:first-child,
    .ita-mobile-header .ita-mobile-user-dropdown .select-none,
    .ita-mobile-header .ita-mobile-user-toggle {
        -webkit-tap-highlight-color: transparent !important;
        transition: none !important;
    }

    .ita-mobile-header .ita-mobile-user-dropdown-shell:hover,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus-within,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:active,
    .ita-mobile-header .ita-mobile-user-dropdown:hover,
    .ita-mobile-header .ita-mobile-user-dropdown:focus,
    .ita-mobile-header .ita-mobile-user-dropdown:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown:focus-within,
    .ita-mobile-header .ita-mobile-user-dropdown:active,
    .ita-mobile-header .ita-mobile-user-dropdown > div:first-child:hover,
    .ita-mobile-header .ita-mobile-user-dropdown > div:first-child:focus,
    .ita-mobile-header .ita-mobile-user-dropdown > div:first-child:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown > div:first-child:focus-within,
    .ita-mobile-header .ita-mobile-user-dropdown > div:first-child:active,
    .ita-mobile-header .ita-mobile-user-dropdown .select-none:hover,
    .ita-mobile-header .ita-mobile-user-dropdown .select-none:focus,
    .ita-mobile-header .ita-mobile-user-dropdown .select-none:focus-visible,
    .ita-mobile-header .ita-mobile-user-dropdown .select-none:focus-within,
    .ita-mobile-header .ita-mobile-user-dropdown .select-none:active,
    .ita-mobile-header .ita-mobile-user-toggle:hover,
    .ita-mobile-header .ita-mobile-user-toggle:focus,
    .ita-mobile-header .ita-mobile-user-toggle:focus-visible,
    .ita-mobile-header .ita-mobile-user-toggle:active {
        background: transparent !important;
        border-color: transparent !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        filter: none !important;
        outline: none !important;
        transform: none !important;
    }

    .ita-mobile-header .ita-mobile-user-dropdown-shell:hover .ita-mobile-user-icon,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:focus-within .ita-mobile-user-icon,
    .ita-mobile-header .ita-mobile-user-dropdown-shell:active .ita-mobile-user-icon,
    .ita-mobile-header .ita-mobile-user-toggle:hover .ita-mobile-user-icon,
    .ita-mobile-header .ita-mobile-user-toggle:focus .ita-mobile-user-icon,
    .ita-mobile-header .ita-mobile-user-toggle:focus-visible .ita-mobile-user-icon,
    .ita-mobile-header .ita-mobile-user-toggle:active .ita-mobile-user-icon {
        color: #ffffff !important;
        filter: none !important;
        text-shadow: none !important;
        transform: none !important;
    }

    html.ita-mini-cart-open,
    html.ita-mobile-drawer-open {
        overflow: hidden !important;
        overscroll-behavior: none !important;
    }

    body.ita-mini-cart-scroll-locked,
    body.ita-mobile-drawer-scroll-locked {
        width: 100% !important;
        overflow: hidden !important;
        overscroll-behavior: none !important;
    }

    .ita-mini-cart-drawer .fixed.inset-0.z-20,
    .ita-mini-cart-drawer .fixed.inset-0.bg-gray-500,
    .ita-mini-cart-drawer .fixed.inset-0[class*="bg-gray-500"],
    .ita-mobile-search-drawer .fixed.inset-0.z-20,
    .ita-mobile-search-drawer .fixed.inset-0.bg-gray-500,
    .ita-mobile-search-drawer .fixed.inset-0[class*="bg-gray-500"] {
        overscroll-behavior: none !important;
        touch-action: none !important;
    }

    .ita-mini-cart-drawer .fixed.z-\[1000\],
    .ita-mini-cart-drawer .pointer-events-auto,
    .ita-mini-cart-drawer [class*="overflow-auto"],
    .ita-mini-cart-content-slot,
    .ita-mini-cart-list,
    .ita-mobile-search-drawer .fixed.z-\[1000\],
    .ita-mobile-search-drawer .pointer-events-auto,
    .ita-mobile-search-drawer [class*="overflow-auto"],
    .ita-mobile-category-panel {
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
        touch-action: pan-y !important;
    }
}


/* ========================================================================
   Correção v336 - Mobile: busca compacta sem ficar sob a barra do navegador
   ------------------------------------------------------------------------
   Mantém a lógica atual do botão Buscar e compensa mudanças do visualViewport
   quando o navegador mobile exibe/oculta a barra de URL durante o foco.
   ======================================================================== */
@media (max-width: 1023px) {
    :root {
        --ita-mobile-visual-viewport-top: 0px;
    }

    .ita-mobile-compact-header {
        top: max(env(safe-area-inset-top, 0px), var(--ita-mobile-visual-viewport-top, 0px)) !important;
    }
}