/*
 * PadXen / Arena Pulse - gaming visual layer
 * Loaded last by WEB-INF/temp/ui.xhtml, after page-specific CSS.
 * Presentation only: no changes to JSF forms, product images, checkout, or layout logic.
 */
:root {
    --gx-ink: #101a34;
    --gx-ink-deep: #080f24;
    --gx-electric: #246dff;
    --gx-cyan: #15c9ec;
    --gx-violet: #7655f7;
    --gx-magenta: #d554ed;
    --gx-paper: #f6f8ff;
    --gx-line: #dce5f8;
    --gx-muted: #596983;
    --gx-glow: 0 15px 36px rgba(37, 84, 194, .14);
}

/* Very light technical grid; all copy remains dark and readable. */
body {
    color: var(--gx-ink);
    background-color: var(--gx-paper);
    background-image:
        radial-gradient(ellipse 46% 35% at 100% 6%, rgba(21,201,236,.085), transparent 78%),
        radial-gradient(ellipse 50% 40% at 0% 38%, rgba(118,85,247,.07), transparent 80%),
        linear-gradient(rgba(51,95,178,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(51,95,178,.022) 1px, transparent 1px);
    background-size: auto, auto, 38px 38px, 38px 38px;
}
body > main { position: relative; }
::selection { background: #b7eafe; color: #10204a; }

/* Glass header and electric accent: keep original dark blue brand logo legible. */
.sticky-header {
    position: sticky;
    z-index: 1030;
    background: rgba(251,253,255,.94) !important;
    border-bottom: 1px solid rgba(36,109,255,.17);
    box-shadow: 0 8px 26px rgba(11,27,68,.085) !important;
    -webkit-backdrop-filter: blur(16px) saturate(145%);
    backdrop-filter: blur(16px) saturate(145%);
}
.sticky-header::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, var(--gx-electric), var(--gx-cyan) 42%, var(--gx-violet) 76%, var(--gx-magenta));
    pointer-events: none;
}
.sticky-header .navbar .nav-link {
    position: relative;
    color: #19294b !important;
    font-weight: 700;
    transition: color .2s ease;
}
.sticky-header .navbar .nav-link:hover,
.sticky-header .navbar .nav-link:focus-visible {
    color: #215bd3 !important;
}
@media (min-width: 992px) {
    .sticky-header .navbar-nav > .nav-item > .nav-link::before {
        content: "";
        display: block;
        position: absolute;
        left: 13%; right: 13%; bottom: 3px;
        height: 2px;
        background: linear-gradient(90deg, var(--gx-cyan), var(--gx-violet));
        border-radius: 8px;
        opacity: 0;
        transform: scaleX(.45);
        transform-origin: center;
        transition: opacity .22s ease, transform .22s ease;
        pointer-events: none;
    }
    .sticky-header .navbar-nav > .nav-item > .nav-link:hover::after,
    .sticky-header .navbar-nav > .nav-item > .nav-link:focus-visible::after {
        opacity: 1;
        transform: scaleX(1);
    }
}
.sticky-header .navbar-nav .text-danger { color: #b933a8 !important; }
.sticky-header .dropdown-menu,
.sticky-header .action-popup-card,
.sticky-header .header-search-box {
    background-color: rgba(255,255,255,.98);
    border: 1px solid rgba(36,109,255,.14) !important;
    box-shadow: 0 16px 40px rgba(18,37,88,.13) !important;
    border-radius: 17px;
}
.sticky-header .dropdown-item { color: #1b2e52; border-radius: 9px; }
.sticky-header .dropdown-item:hover,
.sticky-header .dropdown-item:focus { color: #184aa4; background: #edf4ff; }
.sticky-header .nav-action-btn {
    color: #173664;
    transition: color .2s ease, background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.sticky-header .nav-action-btn:hover,
.sticky-header .nav-action-btn:focus-visible {
    color: #215bdb;
    background: #eef6ff;
    box-shadow: 0 0 0 3px rgba(21,201,236,.12);
    transform: translateY(-1px);
}
.sticky-header .header-search-box .form-control:focus { box-shadow: none !important; }

/* Highlights, controls, and links shared by catalog and product pages. */
a:not(.btn):focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, .page-link:focus-visible {
    outline: 2px solid #236bff;
    outline-offset: 3px;
}
.btn-primary-pastel, .bundle-view-btn,
.product-page .btn-dark, .bundle-detail-page .btn-dark,
.product-page .btn-primary, .bundle-detail-page .btn-primary {
    background: linear-gradient(115deg, #1c65e9 0%, #5653e9 100%) !important;
    border-color: transparent !important;
    color: #fff !important;
    box-shadow: 0 9px 22px rgba(35,95,219,.19);
    transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.btn-primary-pastel:hover, .bundle-view-btn:hover,
.product-page .btn-dark:hover, .bundle-detail-page .btn-dark:hover,
.product-page .btn-primary:hover, .bundle-detail-page .btn-primary:hover {
    color: #fff !important;
    transform: translateY(-2px);
    filter: brightness(1.07);
    box-shadow: 0 13px 30px rgba(68,76,232,.24);
}
.product-page .btn-outline-dark:hover, .bundle-detail-page .btn-outline-dark:hover {
    border-color: #246dff;
    background: #ecf3ff;
    color: #204db1;
}
.section-title-compact, .product-page .product-title,
.bundle-detail-page .bundle-title, .sale-page h1 {
    color: #10244c;
    letter-spacing: -.032em;
}
.section-title-compact::after {
    content: "";
    display: block;
    width: 43px;
    max-width: 100%;
    height: 3px;
    margin: 10px auto 0;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--gx-cyan), var(--gx-violet));
}

/* Home promotional slider: retain safe contrast against the changing slide photos. */
.hero-slider-wrapper .hero-content {
    border: 1px solid rgba(78,138,244,.28) !important;
    background: rgba(249,252,255,.91) !important;
    box-shadow: 0 22px 52px rgba(11,29,82,.2), inset 0 1px 0 #fff !important;
    -webkit-backdrop-filter: blur(11px) saturate(135%);
    backdrop-filter: blur(11px) saturate(135%);
}
.hero-slider-wrapper .hero-content > .badge {
    background: #e9f6ff !important;
    color: #164ba5 !important;
    border-color: #bfe9ff;
}
.hero-slider-wrapper .hero-content .btn-primary-pastel {
    background: linear-gradient(115deg, #1c65e9, #6454ed) !important;
    color: #fff !important;
    border-color: transparent !important;
}
.hero-slider-wrapper .carousel-indicators .active {
    background-color: var(--gx-electric) !important;
}

/* Product & category cards - deliberately avoid changing title height, flex or image fit. */
.product-card-modern {
    border: 1px solid rgba(62,108,212,.17) !important;
    background: #fff !important;
    box-shadow: 0 10px 27px rgba(25,48,107,.075);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.product-card-modern:hover {
    border-color: rgba(49,158,255,.65) !important;
    box-shadow: 0 19px 42px rgba(33,80,179,.16), 0 0 0 1px rgba(77,86,255,.10);
}
.product-card-modern::before {
    background: linear-gradient(90deg, rgba(24,198,239,.19), rgba(109,91,255,.19));
}
.product-card-modern .product-card-media {
    border-color: rgba(38,111,225,.09);
    background: #fff;
}
.product-card-modern .product-card-title,
.product-card-modern h6 { color: #1a2b4f; }
.product-card-modern:hover .product-card-title,
.product-card-modern:hover h6 { color: #225ec7; }
.product-card-modern .product-sale-price,
.product-card-modern:hover .product-sale-price { color: #137b74 !important; }
.product-card-modern .product-new-badge {
    color: #235abb;
    background: #ecf5ff;
    border-color: #c5e5ff;
}
.product-card-modern .product-new-badge i { color: #247ad7; }
.product-card-modern .product-wishlist-icon {
    color: #bb3aa0;
    border-color: rgba(188,65,172,.15);
}
.product-card-modern:hover .product-wishlist-icon {
    color: #fff;
    background: #ad43cc;
}
.category-grid-card {
    border-color: rgba(57,101,210,.18) !important;
    background: #fff;
    box-shadow: 0 9px 28px rgba(26,50,114,.085);
}
.category-grid-card:hover {
    border-color: rgba(67,132,244,.59) !important;
    box-shadow: 0 16px 39px rgba(40,84,181,.16);
}
.category-grid-card .category-grid-media {
    background: linear-gradient(135deg, #f6faff, #edf3ff);
}
.category-grid-card:hover .category-grid-arrow {
    background: linear-gradient(130deg, #1b70f4, #7655f7);
    color: #fff;
}
.category-grid-title { color: #183363; }
.category-grid-card:hover .category-grid-title { color: #245fc6; }

/* Filters, breadcrumbs, bundles, PDP information panels. */
.filter-card, .product-page .product-card,
.product-page .gallery-panel, .product-page .info-box,
.product-page .section-card, .bundle-detail-page .purchase-card,
.bundle-detail-page .section-card, .bundle-detail-page .summary-box,
.bundle-detail-page .benefit-box {
    border-color: rgba(45,98,210,.16) !important;
    box-shadow: 0 12px 34px rgba(31,60,124,.07);
}
.product-page, .bundle-detail-page {
    --px-border: #dbe5f8;
    --px-soft: #f4f8ff;
    --bd-border: #dbe5f8;
    --bd-soft: #f5f8ff;
}
.product-page .product-image,
.bundle-detail-page .bundle-visual {
    border: 1px solid #d4e1fa;
    box-shadow: 0 14px 34px rgba(23,67,158,.11) !important;
    /* Do not change object-fit or picture sizing from the user's image-fill fix. */
}
.product-page .gallery-thumb:hover,
.product-page .gallery-thumb.active { border-color: #3675ec; }
.product-page .benefit-link:hover .benefit-icon,
.product-page .benefit-link:hover .benefit-title { color: #1e62e6; }
.product-page .benefit-link:hover .benefit-icon {
    background: #2068ec;
    color: #fff;
}
.product-page .variant-card.selected,
.product-page .variant-card.active,
.product-page .variant-card[aria-pressed="true"] {
    border-color: #407bf0;
    box-shadow: 0 0 0 2px rgba(35,109,255,.12);
}
.product-page .badge.text-bg-primary,
.bundle-detail-page .badge.text-bg-primary {
    background-color: #285fe8 !important;
}
.breadcrumb .breadcrumb-item a { color: #3466b7; text-decoration: none; }
.breadcrumb .breadcrumb-item a:hover { color: #7149d0; }
.pagination .page-link { color: #275ac2; background: #fff; border-color: #dbe6fa; }
.pagination .page-item.active .page-link {
    color: #fff;
    background: #2b62e4;
    border-color: #2b62e4;
}
.pagination .page-link:hover { color: #244db6; background: #ebf2ff; }
.form-control:focus, .form-select:focus {
    border-color: #5590f7;
    box-shadow: 0 0 0 .2rem rgba(45,117,239,.12);
}

/* Sale/banner treatments; don't override the offer descriptions or prices. */
.sale-page .sale-hero {
    border: 1px solid rgba(61,105,229,.22);
    border-radius: 22px;
    box-shadow: 0 15px 42px rgba(36,74,153,.09);
}

/* High-contrast graphite footer, adapted to the original navy-on-transparent logo. */
.site-footer {
    position: relative;
    background: linear-gradient(145deg, #0d1935 0%, #0c142d 53%, #1b1743 100%) !important;
    border-top: 1px solid rgba(68,171,255,.32) !important;
    color: #dfebff;
    box-shadow: 0 -9px 29px rgba(24,53,112,.08);
}
.site-footer::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 3px;
    background: linear-gradient(90deg, #1769f5, #23d3ec 50%, #9b6bff);
    pointer-events: none;
}
.site-footer .footer-section-label,
.site-footer .text-dark { color: #f4f8ff !important; }
.site-footer p, .site-footer .text-muted,
.site-footer .footer-links a, .site-footer .social-icons a,
.site-footer .bottom-bar { color: #bdcbea !important; }
.site-footer .footer-links a:hover,
.site-footer .social-icons a:hover,
.site-footer .bottom-bar a:hover { color: #70e7fa !important; }
.site-footer .padxen-footer-brand {
    display: inline-flex;
    padding: 6px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 18px;
    background: #eff6ff;
    box-shadow: 0 7px 22px rgba(0,0,0,.16);
}
.site-footer .paypal-acceptance-mark {
    padding: 6px;
    border-radius: 12px;
    background: rgba(255,255,255,.96);
}
.site-footer .newsletter-form .form-control {
    background: #f9fbff;
    border: 1px solid #c7d8f7;
    color: #13264b;
}
.site-footer .newsletter-form .btn {
    border-color: transparent;
    background: linear-gradient(115deg, #2474ef, #6651d9);
    color: #fff;
}
.site-footer .newsletter-form .btn:hover { filter: brightness(1.1); }
.site-footer .bottom-bar { border-color: rgba(207,221,255,.2) !important; }

/* Keep the theme mobile-friendly and honor reduced-motion accessibility. */
@media (max-width: 991.98px) {
    .sticky-header { background: rgba(251,253,255,.98) !important; }
    .sticky-header .navbar-collapse {
        border-top: 1px solid #e1eafe;
        margin-top: 8px;
        padding-bottom: 12px;
    }
    .sticky-header .navbar-nav .nav-link { padding: 10px 12px; }
}
@media (max-width: 575.98px) {
    body {
        background-image: radial-gradient(ellipse at top right, rgba(21,201,236,.08), transparent 70%);
    }
    .hero-slider-wrapper .hero-content {
        border-radius: 18px;
        box-shadow: 0 12px 28px rgba(11,29,82,.15) !important;
    }
    .site-footer .padxen-footer-brand { padding: 4px; }
}
@media (prefers-reduced-motion: reduce) {
    .sticky-header .nav-action-btn,
    .sticky-header .navbar .nav-link,
    .sticky-header .navbar-nav > .nav-item > .nav-link::before,
    .product-card-modern, .category-grid-card,
    .btn-primary-pastel, .bundle-view-btn,
    .site-footer .paypal-acceptance-mark { transition: none !important; }
    .product-card-modern:hover, .category-grid-card:hover,
    .btn-primary-pastel:hover, .bundle-view-btn:hover,
    .site-footer .paypal-acceptance-mark:hover { transform: none !important; }
}