/* iPodil storefront dark theme polish. This file must be loaded after all storefront CSS. */

:root { color-scheme: light dark; }

:root[data-theme="dark"] {
    color-scheme: dark;
    --dark: #f6f8ff;
    --muted: #a9b4ca;
    --card: rgba(15, 23, 42, .94);
    --card-solid: #111827;
    --border: rgba(148, 163, 184, .20);
    --blue-soft: rgba(59, 130, 246, .18);
    --orange-soft: rgba(255, 122, 0, .15);
    --shadow: 0 24px 76px rgba(0, 0, 0, .48);
    --shadow-soft: 0 16px 42px rgba(0, 0, 0, .34);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --dark: #f6f8ff;
        --muted: #a9b4ca;
        --card: rgba(15, 23, 42, .94);
        --card-solid: #111827;
        --border: rgba(148, 163, 184, .20);
        --blue-soft: rgba(59, 130, 246, .18);
        --orange-soft: rgba(255, 122, 0, .15);
        --shadow: 0 24px 76px rgba(0, 0, 0, .48);
        --shadow-soft: 0 16px 42px rgba(0, 0, 0, .34);
    }
}

/* Manual dark mode */
:root[data-theme="dark"] body {
    color: #eaf0ff;
    background:
        radial-gradient(circle at 7% 5%, rgba(255, 122, 0, .13), transparent 26%),
        radial-gradient(circle at 94% 9%, rgba(35, 88, 246, .24), transparent 28%),
        linear-gradient(180deg, #050812 0%, #091120 45%, #0d1628 100%) !important;
}

:root[data-theme="dark"] .page-card,
:root[data-theme="dark"] .shell,
:root[data-theme="dark"] main {
    background: transparent !important;
    color: #eaf0ff;
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] h5,
:root[data-theme="dark"] h6,
:root[data-theme="dark"] b,
:root[data-theme="dark"] strong,
:root[data-theme="dark"] .section-head h2,
:root[data-theme="dark"] .catalog-hero h1,
:root[data-theme="dark"] .product-info h1,
:root[data-theme="dark"] .checkout-copy h1,
:root[data-theme="dark"] .catalog-sidebar h2,
:root[data-theme="dark"] .product b,
:root[data-theme="dark"] .category b,
:root[data-theme="dark"] .feature b {
    color: #f8fbff !important;
    text-shadow: none !important;
}

:root[data-theme="dark"] p,
:root[data-theme="dark"] li,
:root[data-theme="dark"] small,
:root[data-theme="dark"] span,
:root[data-theme="dark"] label,
:root[data-theme="dark"] .muted,
:root[data-theme="dark"] .section-head p,
:root[data-theme="dark"] .catalog-hero p,
:root[data-theme="dark"] .product-info p,
:root[data-theme="dark"] .footer,
:root[data-theme="dark"] .footer a {
    color: #b7c2d8 !important;
}

:root[data-theme="dark"] a { color: inherit; }

:root[data-theme="dark"] .header-clean,
:root[data-theme="dark"] .header-clean__topbar,
:root[data-theme="dark"] .header-category-nav {
    background: rgba(5, 10, 22, .94) !important;
    border-color: rgba(148, 163, 184, .18) !important;
    box-shadow: 0 18px 48px rgba(0, 0, 0, .42) !important;
}

:root[data-theme="dark"] .catalog-hero,
:root[data-theme="dark"] .product-hero,
:root[data-theme="dark"] .hero-card,
:root[data-theme="dark"] .info-hero,
:root[data-theme="dark"] .iphone-check-page-hero,
:root[data-theme="dark"] .home-trust-panel,
:root[data-theme="dark"] .mobile-category-reference {
    background:
        radial-gradient(circle at 84% 14%, rgba(35, 88, 246, .24), transparent 32%),
        radial-gradient(circle at 16% 90%, rgba(255, 122, 0, .14), transparent 28%),
        linear-gradient(135deg, #0a1020, #101a32) !important;
    border-color: rgba(148, 163, 184, .18) !important;
    box-shadow: 0 20px 58px rgba(0, 0, 0, .38) !important;
    color: #f8fbff !important;
}

:root[data-theme="dark"] .product,
:root[data-theme="dark"] .product-card,
:root[data-theme="dark"] .mobile-product-card,
:root[data-theme="dark"] .category,
:root[data-theme="dark"] .feature,
:root[data-theme="dark"] .info-card,
:root[data-theme="dark"] .iphone-check-list article,
:root[data-theme="dark"] .iphone-check-card-map,
:root[data-theme="dark"] .home-trust-panel__grid a,
:root[data-theme="dark"] .catalog-seo-content,
:root[data-theme="dark"] .catalog-seo-faq details,
:root[data-theme="dark"] .catalog-layout-v2,
:root[data-theme="dark"] .catalog-content,
:root[data-theme="dark"] .catalog-sidebar,
:root[data-theme="dark"] .catalog-topline,
:root[data-theme="dark"] .active-filter-chip,
:root[data-theme="dark"] .filter-link,
:root[data-theme="dark"] .filter-field,
:root[data-theme="dark"] .mobile-subcategory-card,
:root[data-theme="dark"] .product-detail,
:root[data-theme="dark"] .product-gallery,
:root[data-theme="dark"] .product-main-photo,
:root[data-theme="dark"] .product-info,
:root[data-theme="dark"] .product-meta,
:root[data-theme="dark"] .product-specs,
:root[data-theme="dark"] .product-benefits,
:root[data-theme="dark"] .warranty-card,
:root[data-theme="dark"] .checkout-layout,
:root[data-theme="dark"] .checkout-card,
:root[data-theme="dark"] .cart-panel,
:root[data-theme="dark"] .cart-item,
:root[data-theme="dark"] .order-summary,
:root[data-theme="dark"] .thank-you-card,
:root[data-theme="dark"] .footer,
:root[data-theme="dark"] .search-suggest,
:root[data-theme="dark"] .favorites-drawer__panel,
:root[data-theme="dark"] .mobile-menu__panel,
:root[data-theme="dark"] .mobile-menu__search,
:root[data-theme="dark"] .catalog-drawer__panel {
    background: linear-gradient(180deg, rgba(17, 24, 39, .96), rgba(9, 16, 30, .94)) !important;
    border-color: rgba(148, 163, 184, .18) !important;
    box-shadow: 0 16px 44px rgba(0, 0, 0, .34) !important;
    color: #eaf0ff !important;
}

:root[data-theme="dark"] .product-media,
:root[data-theme="dark"] .product-photo,
:root[data-theme="dark"] .product-image,
:root[data-theme="dark"] .product-card__image,
:root[data-theme="dark"] .product-main-photo,
:root[data-theme="dark"] .product-lightbox__image-button,
:root[data-theme="dark"] .thumb,
:root[data-theme="dark"] .product-gallery-thumb {
    background: linear-gradient(180deg, #f8fafc, #edf2fb) !important;
    border-color: rgba(148, 163, 184, .26) !important;
}

:root[data-theme="dark"] .badge,
:root[data-theme="dark"] .eyebrow,
:root[data-theme="dark"] .product-status,
:root[data-theme="dark"] .stock-badge,
:root[data-theme="dark"] .active-filter-chip,
:root[data-theme="dark"] .mobile-category-meta a,
:root[data-theme="dark"] .info-card span,
:root[data-theme="dark"] .home-trust-panel__grid span,
:root[data-theme="dark"] .iphone-check-list span {
    background: rgba(37, 99, 235, .18) !important;
    color: #8fb4ff !important;
    border-color: rgba(96, 165, 250, .24) !important;
}

:root[data-theme="dark"] .product .price,
:root[data-theme="dark"] .product-price,
:root[data-theme="dark"] .price,
:root[data-theme="dark"] .cart-total,
:root[data-theme="dark"] .order-total {
    color: #f8fbff !important;
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .header-search {
    background: rgba(15, 23, 42, .98) !important;
    border-color: rgba(148, 163, 184, .26) !important;
    color: #f8fbff !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: rgba(183, 194, 216, .72) !important; }

:root[data-theme="dark"] .icon-button,
:root[data-theme="dark"] .header-social-link,
:root[data-theme="dark"] .theme-toggle,
:root[data-theme="dark"] .product-gallery-arrow,
:root[data-theme="dark"] .product-lightbox__arrow,
:root[data-theme="dark"] .product-lightbox__close,
:root[data-theme="dark"] .product-lightbox__count {
    background: rgba(248, 251, 255, .94) !important;
    border-color: rgba(255, 255, 255, .46) !important;
    color: #0f172a !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .24) !important;
}

:root[data-theme="dark"] img[src*="/images/icons/"] {
    filter: brightness(0) invert(1) opacity(.88);
}

:root[data-theme="dark"] .button img,
:root[data-theme="dark"] .filter-submit img,
:root[data-theme="dark"] .product-gallery-arrow img,
:root[data-theme="dark"] .product-lightbox__arrow img,
:root[data-theme="dark"] .product-lightbox__close img,
:root[data-theme="dark"] .header-search button img,
:root[data-theme="dark"] .icon-button img,
:root[data-theme="dark"] .header-social-link img {
    filter: none !important;
}

:root[data-theme="dark"] .filter-link.active,
:root[data-theme="dark"] .active-filter-chips__reset,
:root[data-theme="dark"] .button,
:root[data-theme="dark"] .filter-submit,
:root[data-theme="dark"] .catalog-drawer__cta {
    color: #fff !important;
}

:root[data-theme="dark"] .catalog-drawer__subnav a,
:root[data-theme="dark"] .catalog-drawer__series summary,
:root[data-theme="dark"] .mobile-menu__nav a,
:root[data-theme="dark"] .mobile-menu__link-button {
    background: rgba(15, 23, 42, .68) !important;
    color: #f4f7ff !important;
    border-color: rgba(148, 163, 184, .14) !important;
}

:root[data-theme="dark"] .catalog-drawer__subnav a.catalog-drawer__all-link,
:root[data-theme="dark"] .filter-link.active {
    background: rgba(37, 99, 235, .20) !important;
    color: #6ea0ff !important;
}

:root[data-theme="dark"] .theme-toggle__icon::before { content: "☀"; }

/* System dark mode mirrors manual dark mode unless the user explicitly selected light. */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) body {
        color: #eaf0ff;
        background:
            radial-gradient(circle at 7% 5%, rgba(255, 122, 0, .13), transparent 26%),
            radial-gradient(circle at 94% 9%, rgba(35, 88, 246, .24), transparent 28%),
            linear-gradient(180deg, #050812 0%, #091120 45%, #0d1628 100%) !important;
    }

    :root:not([data-theme="light"]) .page-card,
    :root:not([data-theme="light"]) .shell,
    :root:not([data-theme="light"]) main { background: transparent !important; color: #eaf0ff; }

    :root:not([data-theme="light"]) h1,
    :root:not([data-theme="light"]) h2,
    :root:not([data-theme="light"]) h3,
    :root:not([data-theme="light"]) h4,
    :root:not([data-theme="light"]) h5,
    :root:not([data-theme="light"]) h6,
    :root:not([data-theme="light"]) b,
    :root:not([data-theme="light"]) strong,
    :root:not([data-theme="light"]) .section-head h2,
    :root:not([data-theme="light"]) .catalog-hero h1,
    :root:not([data-theme="light"]) .product-info h1,
    :root:not([data-theme="light"]) .checkout-copy h1,
    :root:not([data-theme="light"]) .catalog-sidebar h2,
    :root:not([data-theme="light"]) .product b,
    :root:not([data-theme="light"]) .category b,
    :root:not([data-theme="light"]) .feature b { color: #f8fbff !important; text-shadow: none !important; }

    :root:not([data-theme="light"]) p,
    :root:not([data-theme="light"]) li,
    :root:not([data-theme="light"]) small,
    :root:not([data-theme="light"]) span,
    :root:not([data-theme="light"]) label,
    :root:not([data-theme="light"]) .muted,
    :root:not([data-theme="light"]) .section-head p,
    :root:not([data-theme="light"]) .catalog-hero p,
    :root:not([data-theme="light"]) .product-info p,
    :root:not([data-theme="light"]) .footer,
    :root:not([data-theme="light"]) .footer a { color: #b7c2d8 !important; }

    :root:not([data-theme="light"]) .header-clean,
    :root:not([data-theme="light"]) .header-clean__topbar,
    :root:not([data-theme="light"]) .header-category-nav { background: rgba(5, 10, 22, .94) !important; border-color: rgba(148, 163, 184, .18) !important; box-shadow: 0 18px 48px rgba(0, 0, 0, .42) !important; }

    :root:not([data-theme="light"]) .catalog-hero,
    :root:not([data-theme="light"]) .product-hero,
    :root:not([data-theme="light"]) .hero-card,
    :root:not([data-theme="light"]) .info-hero,
    :root:not([data-theme="light"]) .iphone-check-page-hero,
    :root:not([data-theme="light"]) .home-trust-panel,
    :root:not([data-theme="light"]) .mobile-category-reference { background: radial-gradient(circle at 84% 14%, rgba(35, 88, 246, .24), transparent 32%), radial-gradient(circle at 16% 90%, rgba(255, 122, 0, .14), transparent 28%), linear-gradient(135deg, #0a1020, #101a32) !important; border-color: rgba(148, 163, 184, .18) !important; box-shadow: 0 20px 58px rgba(0, 0, 0, .38) !important; color: #f8fbff !important; }

    :root:not([data-theme="light"]) .product,
    :root:not([data-theme="light"]) .product-card,
    :root:not([data-theme="light"]) .mobile-product-card,
    :root:not([data-theme="light"]) .category,
    :root:not([data-theme="light"]) .feature,
    :root:not([data-theme="light"]) .info-card,
    :root:not([data-theme="light"]) .iphone-check-list article,
    :root:not([data-theme="light"]) .iphone-check-card-map,
    :root:not([data-theme="light"]) .home-trust-panel__grid a,
    :root:not([data-theme="light"]) .catalog-seo-content,
    :root:not([data-theme="light"]) .catalog-seo-faq details,
    :root:not([data-theme="light"]) .catalog-layout-v2,
    :root:not([data-theme="light"]) .catalog-content,
    :root:not([data-theme="light"]) .catalog-sidebar,
    :root:not([data-theme="light"]) .catalog-topline,
    :root:not([data-theme="light"]) .active-filter-chip,
    :root:not([data-theme="light"]) .filter-link,
    :root:not([data-theme="light"]) .filter-field,
    :root:not([data-theme="light"]) .mobile-subcategory-card,
    :root:not([data-theme="light"]) .product-detail,
    :root:not([data-theme="light"]) .product-gallery,
    :root:not([data-theme="light"]) .product-main-photo,
    :root:not([data-theme="light"]) .product-info,
    :root:not([data-theme="light"]) .product-meta,
    :root:not([data-theme="light"]) .product-specs,
    :root:not([data-theme="light"]) .product-benefits,
    :root:not([data-theme="light"]) .warranty-card,
    :root:not([data-theme="light"]) .checkout-layout,
    :root:not([data-theme="light"]) .checkout-card,
    :root:not([data-theme="light"]) .cart-panel,
    :root:not([data-theme="light"]) .cart-item,
    :root:not([data-theme="light"]) .order-summary,
    :root:not([data-theme="light"]) .thank-you-card,
    :root:not([data-theme="light"]) .footer,
    :root:not([data-theme="light"]) .search-suggest,
    :root:not([data-theme="light"]) .favorites-drawer__panel,
    :root:not([data-theme="light"]) .mobile-menu__panel,
    :root:not([data-theme="light"]) .mobile-menu__search,
    :root:not([data-theme="light"]) .catalog-drawer__panel { background: linear-gradient(180deg, rgba(17, 24, 39, .96), rgba(9, 16, 30, .94)) !important; border-color: rgba(148, 163, 184, .18) !important; box-shadow: 0 16px 44px rgba(0, 0, 0, .34) !important; color: #eaf0ff !important; }

    :root:not([data-theme="light"]) .product-media,
    :root:not([data-theme="light"]) .product-photo,
    :root:not([data-theme="light"]) .product-image,
    :root:not([data-theme="light"]) .product-card__image,
    :root:not([data-theme="light"]) .product-main-photo,
    :root:not([data-theme="light"]) .product-lightbox__image-button,
    :root:not([data-theme="light"]) .thumb,
    :root:not([data-theme="light"]) .product-gallery-thumb { background: linear-gradient(180deg, #f8fafc, #edf2fb) !important; border-color: rgba(148, 163, 184, .26) !important; }

    :root:not([data-theme="light"]) .badge,
    :root:not([data-theme="light"]) .eyebrow,
    :root:not([data-theme="light"]) .product-status,
    :root:not([data-theme="light"]) .stock-badge,
    :root:not([data-theme="light"]) .active-filter-chip,
    :root:not([data-theme="light"]) .mobile-category-meta a,
    :root:not([data-theme="light"]) .info-card span,
    :root:not([data-theme="light"]) .home-trust-panel__grid span,
    :root:not([data-theme="light"]) .iphone-check-list span { background: rgba(37, 99, 235, .18) !important; color: #8fb4ff !important; border-color: rgba(96, 165, 250, .24) !important; }

    :root:not([data-theme="light"]) input,
    :root:not([data-theme="light"]) select,
    :root:not([data-theme="light"]) textarea,
    :root:not([data-theme="light"]) .header-search { background: rgba(15, 23, 42, .98) !important; border-color: rgba(148, 163, 184, .26) !important; color: #f8fbff !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important; }

    :root:not([data-theme="light"]) input::placeholder,
    :root:not([data-theme="light"]) textarea::placeholder { color: rgba(183, 194, 216, .72) !important; }

    :root:not([data-theme="light"]) .icon-button,
    :root:not([data-theme="light"]) .header-social-link,
    :root:not([data-theme="light"]) .theme-toggle,
    :root:not([data-theme="light"]) .product-gallery-arrow,
    :root:not([data-theme="light"]) .product-lightbox__arrow,
    :root:not([data-theme="light"]) .product-lightbox__close,
    :root:not([data-theme="light"]) .product-lightbox__count { background: rgba(248, 251, 255, .94) !important; border-color: rgba(255, 255, 255, .46) !important; color: #0f172a !important; box-shadow: 0 14px 34px rgba(0, 0, 0, .24) !important; }

    :root:not([data-theme="light"]) img[src*="/images/icons/"] { filter: brightness(0) invert(1) opacity(.88); }
    :root:not([data-theme="light"]) .button img,
    :root:not([data-theme="light"]) .filter-submit img,
    :root:not([data-theme="light"]) .product-gallery-arrow img,
    :root:not([data-theme="light"]) .product-lightbox__arrow img,
    :root:not([data-theme="light"]) .product-lightbox__close img,
    :root:not([data-theme="light"]) .header-search button img,
    :root:not([data-theme="light"]) .icon-button img,
    :root:not([data-theme="light"]) .header-social-link img { filter: none !important; }

    :root:not([data-theme="light"]) .filter-link.active,
    :root:not([data-theme="light"]) .active-filter-chips__reset,
    :root:not([data-theme="light"]) .button,
    :root:not([data-theme="light"]) .filter-submit,
    :root:not([data-theme="light"]) .catalog-drawer__cta { color: #fff !important; }

    :root:not([data-theme="light"]) .catalog-drawer__subnav a,
    :root:not([data-theme="light"]) .catalog-drawer__series summary,
    :root:not([data-theme="light"]) .mobile-menu__nav a,
    :root:not([data-theme="light"]) .mobile-menu__link-button { background: rgba(15, 23, 42, .68) !important; color: #f4f7ff !important; border-color: rgba(148, 163, 184, .14) !important; }

    :root:not([data-theme="light"]) .catalog-drawer__subnav a.catalog-drawer__all-link,
    :root:not([data-theme="light"]) .filter-link.active { background: rgba(37, 99, 235, .20) !important; color: #6ea0ff !important; }

    :root:not([data-theme="light"]) .theme-toggle__icon::before { content: "☀"; }
}

.theme-toggle {
    min-width: 44px;
    height: 44px;
    border-radius: 14px;
    border: 1px solid rgba(17,26,54,.08);
    background: rgba(255,255,255,.82);
    color: var(--dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    box-shadow: var(--shadow-soft);
    cursor: pointer;
    font-weight: 900;
}

.theme-toggle__icon {
    width: 19px;
    height: 19px;
    display: inline-grid;
    place-items: center;
}

.theme-toggle__icon::before {
    content: "☾";
    font-size: 18px;
    line-height: 1;
}

.theme-toggle__text { display: none; }

@media (min-width: 1024px) {
    .theme-toggle--desktop .theme-toggle__text {
        display: inline;
        font-size: 12px;
    }
}

.mobile-menu .theme-toggle {
    width: 100% !important;
    min-height: 46px !important;
    justify-content: space-between !important;
    padding: 12px 14px !important;
    border-radius: 15px !important;
}

.mobile-menu .theme-toggle__text { display: inline !important; }
