/* ==========================================================================
   Product Pages General Structure
   ========================================================================== */

.product {                   /* Switch general structure to grid */
    display: grid;
    grid-template-columns: 35% 1fr;
    
    grid-template-areas:
        "title title"
        "gallery description"
        "gallery details"
        ". ."               /* Hack: overflow vs. vertical alignment issue */
        "related related";
    gap: 1rem;
    grid-auto-rows: auto;
    align-items: start;
    margin-bottom: 2em;
}

@media (max-width:768px) {      /* On small screen switch to basic flex layout*/
    .product {
        display: flex;
        flex-direction: column;
    }
}

.product_titles {               /* Heading and sub-heading */
    grid-area: title;
    order: 1;
    text-align: center;
    margin-block: 1em;
    align-self: center;
}
.product_title,
.product_subtitle {
    text-wrap: balance;         /* Fallback for Safari and Firefox */
    text-wrap: pretty;          /* Preferred, limited support */
}
.product_title {
    margin: 0;
    font-size: 2em;
}
.product_subtitle {
    font-size: 1.5em;
    font-weight: 300;
    letter-spacing: .3em;
    margin: 0;
    word-break: keep-all;       /* Prevent CJK scripts from being broken up */
}
.product_subtitle rt {
    ruby-align: center;
    user-select: none;
    font-size: 0.5rem;
}

.woocommerce-product-gallery {
    grid-area: gallery;
    grid-row: 2 / span 3; /* spans description + details rows */
    order: 3;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100% !important;        
}

.storefront-wc-brands-single-product {
    display: none;
}

.summary {
    grid-area: description;
    order: 2;
    padding: 0 !important;        /* Override multiple wc defaults */
    margin: 0 !important;
    clear: none !important;
    float: none !important;
    width: 100% !important;       /* Short descriptions would de-center item bundles */
}
.summary div {
    margin: 0 !important;
    padding: 0 !important;
}
.summary p {
    margin-bottom: 0;
    font-weight: 300;
}
.summary,
.item-details {
    font-size: 0.9em;
}
.summary em,
.item-details em {
    font-style: normal;
}



/* ==========================================================================
   LINK STYLING & ANIMATIONS
   ========================================================================== */

/* 1. Short & Full Descriptions (Layered Marker Underlay) */
.entry-summary p a,
.item-details-description a {
    color: var(--text-color) !important;
    text-decoration: none !important;
    padding: 0 0.1em;
    
    /* Layer 1: Accent Color (Starts hidden at 0% width)
       Layer 2: Secondary Color (Always visible at 100% width) */
    background-image: 
        linear-gradient(var(--accent-color), var(--accent-color)),
        linear-gradient(var(--wc-secondary), var(--wc-secondary));
    
    /* Position both lines at the bottom-left */
    background-position: 0% 100%, 0% 100%;
    background-repeat: no-repeat, no-repeat;
    
    /* Accent line starts at 0% width and 1px height. 
       Base line stays at 100% width and 20% height. */
    background-size: 0% 1px, 100% 20%;
    
    transition: background-size 0.3s ease, color 0.3s ease;
}

.entry-summary p a:hover,
.item-details-description a:hover {
    /* Grow the thin accent line to 100% width. Base line stays untouched. */
    background-size: 100% 1px, 100% 20%;
    color: var(--accent-color) !important;
}

/* RTL Override for Layered Marker */
html[dir="rtl"] .woocommerce-product-details__short-description a,
html[dir="rtl"] .item-details-description a {
    background-position: 100% 100%, 100% 100%;
}


/* 2. Additional Information Tab (Fluid Expanding Line) */
.item-details-additional_information a {
    color: var(--text-color) !important;
    text-decoration: none !important;
    padding-bottom: 1px;
    background-image: linear-gradient(var(--accent-color), var(--accent-color));
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size 0.3s ease, color 0.3s ease;
}

.item-details-additional_information a:hover {
    background-size: 100% 1px;
    color: var(--accent-color) !important;
}

/* RTL Override for Expanding Line */
html[dir="rtl"] .item-details-additional_information a {
    background-position: 100% 100%;
}


/* ==========================================================================
   ITEM DESCRIPTION DETAILS & TABS
   ========================================================================== */

.item-details {
    grid-area: details; /* Apply to custom wc tabs output */
    order: 4;
}
.item-details p,
.item-details li {
    font-weight: 300;
}
.item-details p:has(+ ul) {
    margin-bottom: 0;
}
.item-details li {
    line-height: 1.5em;
    list-style: disc inside;
}

.item-details > div:not(:first-child) {
    margin-top: 1rem; /* Add gap within sections */
}

.item-details h2, .woocommerce-grouped-product h2, .related h2 {
    font-size: 1.25rem !important;
    text-align: center;
    margin-bottom: 0.5em !important;
    margin-top: 1em;
}

@media (min-width:768px) { /* On large screens collapse the descriptions together */
    .item-details-description h2 {
        display: none;
    }
}

.item-details table th {
    padding: .5em 1em;
}
.item-details table td {
    padding: .3em 1em;
    text-wrap: balance;         /* Fallback for Safari and Firefox */
    text-wrap: pretty;          /* Preferred, limited support */
}


/* ==========================================================================
   IMAGE GALLERY
   ========================================================================== */

    /* --- MAIN IMAGE CROSSFADE GRID --- */
    .chromagi-gallery-container .woocommerce-product-gallery__wrapper {
        display: grid;
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .chromagi-gallery-container .woocommerce-product-gallery__image {
        grid-area: 1 / 1;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
        z-index: 1;
        margin: 0;
    }
    .chromagi-gallery-container .woocommerce-product-gallery__image.flex-active-slide {
        opacity: 1;
        visibility: visible;
        z-index: 2;
    }
    .chromagi-gallery-container q {
        cursor: zoom;
    }
    
    /* --- THUMBNAIL NAV --- */
    .chromagi-gallery-container .flex-control-thumbs {
        display: flex;
        justify-content: space-evenly;
        flex-wrap: wrap;
        gap: 8px;
        padding: 0;
        margin: 15px 0 0 0;
        list-style: none;
        
        align-items: center;
        gap: 10px;
        list-style: none;
        text-align: center;
    }
    .chromagi-gallery-container .flex-control-thumbs li {
        width: 55px !important;
        float: none !important;
        margin: 0 !important;
        display: inline-block;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .chromagi-gallery-container .flex-control-thumbs img {
        width: 100%;
        height: auto;
        cursor: pointer;
        opacity: 0.5;
        transition: opacity 0.2s ease;
    }
    .chromagi-gallery-container .flex-control-thumbs img.flex-active {
        opacity: 1;
        border: 1px solid var(--text-color, #000);
    }
    .chromagi-gallery-container .flex-control-thumbs .thumb-label {
        display: block;
        width: 100%;
        font-size: 9px;
        line-height: 1.2;
        text-align: center;
        margin-top: 4px;
        word-wrap: break-word;
        overflow-wrap: break-word;
        color: var(--dim-text-color, #666);
    }

    /* --- LIGHTBOX OVERLAY --- */
    .chromagi-lightbox {
        border: none;
        background: transparent;
        padding: 0;
        max-width: 100vw;
        max-height: 100vh;
        overflow: visible;
    }
    .chromagi-lightbox::backdrop {
        background: rgba(0, 0, 0, 0.85);
        backdrop-filter: blur(8px);
    }
    .lightbox-content {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
    }
    #lightbox-img {
        max-width: 90vw;
        max-height: 85vh;
        object-fit: contain;
        border-radius: 4px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    }
    .lightbox-close {
        position: fixed;
        top: 20px;
        right: 30px;
        background: none;
        border: none;
        color: white;
        font-size: 40px;
        cursor: pointer;
        z-index: 10;
    }
    .lightbox-nav {
        background: rgba(0,0,0,0.5);
        border: none;
        color: white;
        font-size: 30px;
        padding: 15px;
        cursor: pointer;
        position: absolute;
        border-radius: 5px;
        transition: background 0.2s;
    }
    .lightbox-nav:hover { background: rgba(0,0,0,0.8); }
    .lightbox-prev { left: -60px; }
    .lightbox-next { right: -60px; }
    .lightbox-caption {
        color: white;
        text-align: center;
        margin-top: 15px;
        font-size: 14px;
        font-family: var(--font-primary, sans-serif);
    }
    @media (max-width: 768px) {
        .lightbox-prev { left: 10px; }
        .lightbox-next { right: 10px; }
    }





/* ==========================================================================
   Datasheet Attribute Table
   ========================================================================== */
table.woocommerce-product-attributes {
    margin: 0;
    font-size: 0.9em;
}
@media (max-width:480px) {      /* On small screens size the table down*/
    table.woocommerce-product-attributes {
        font-size: 0.8em;
    }
}
table.datasheet th {
    width: 12em;
    white-space: nowrap; 
}
table.datasheet td,
table.datasheet th {
    padding: .3em .5em;
}

/* Logical Padding for Gradients */
table.datasheet tbody tr th {
    background-color: inherit;
    background: linear-gradient(to left, rgba(128,128,128,.10) , transparent);
    padding-inline-start: 10vw; /* RTL-Safe */
}
table.datasheet tbody tr:nth-child(2n) th {
    background-color: inherit;
    background: linear-gradient(to left, rgba(128,128,128,.01) , transparent);
}
table.datasheet tbody tr td {
    background-color: inherit;
    background: linear-gradient(to right, rgba(128,128,128,.10) , transparent);
}
table.datasheet tbody tr:nth-child(2n) td {
    background-color: inherit;
    background: linear-gradient(to right, rgba(128,128,128,.01) , transparent);
}

table.datasheet ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
table.datasheet li {
    display: inline-block;                         /* Same as a span */
    margin: 0;
    padding: 0;
}
/* Multi-line fields */
table.datasheet tr.pa-purchase-info li,
table.datasheet tr.pa-contents li,
table.datasheet tr.pa-condition li {
    display: contents;                         
    margin: 0;
    padding: 0;
}

table.datasheet li:not(:last-child)::after {
    content: "·";                      /* Default separator */
    margin-inline: 0.3em; /* Logical margin */
}

table.datasheet span::before, 
table.datasheet th::before,
table.datasheet td::before,
table.datasheet li::before,
table.datasheet ul::before {    
     font-family:"Font Awesome 5 Free";
    font-weight: 900;
    display: inline-block;
    width: 1.5em;
    text-align: center;
    margin-inline-end: 0.25em; /* Logical margin */
}

table.datasheet span:hover::before, 
table.datasheet ul:hover::before,
table.datasheet li:hover::before {
    color: var(--heading-color); /* Theme-synced */
}

table.datasheet .yes::before { content: "\f058"; }
table.datasheet .yes:hover::before { color: #28a745; /* Green */ }
table.datasheet .present::before { content: "\f058"; }
table.datasheet .present:hover::before { color: #28a745; /* Green */ }
table.datasheet .no::before { content: "\f057"; }
table.datasheet .no:hover::before { color: #dc3545; /* Red */ }
table.datasheet .missing::before { content: "\f057"; }
table.datasheet .missing:hover::before { color: #dc3545; /* Red */ }
table.datasheet .partial::before { content: "\f056"; }
table.datasheet .partial:hover::before { color: #fd7e14; /* Yellow */ }
table.datasheet .unknown::before { content: "\f059"; }
table.datasheet .unknown:hover::before { color: #6c757d; /* Gray */ }
table.datasheet .damaged::before { content: "\f06a"; }
table.datasheet .damaged:hover::before { color: #fd7e14; /* Orange */ }

.pa-territory .pa-value li::before {
    content: "";
    display: inline-block;
    
    /* Matches Font Awesome Box Model */
    width: 1.6em;
    margin-inline-end: 0.25em; /* Changed from 0.5em to sync with webfonts */
    
    /* 3:2 Flag Dimensions */
    height: 1.0em; 
    vertical-align: -0.1em; 
    
    /* Rendering */
    background-size: contain; 
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 2px;
    box-shadow: inset 0 0 0 1px rgba(128, 128, 128, 0.25);
    
    /* Interactive State */
    filter: saturate(0%) contrast(50%);
    transition: filter 0.3s ease;
}

.pa-territory .pa-value li:hover::before {
    filter: saturate(100%) contrast(100%);
}

table.datasheet li.australia::before        { background-image: var(--flag-au); }
table.datasheet li.china::before            { background-image: var(--flag-cn); }
table.datasheet li.eu::before               { background-image: var(--flag-eu); }
table.datasheet li.finland::before          { background-image: var(--flag-fi); }
table.datasheet li.france::before           { background-image: var(--flag-fr); }
table.datasheet li.hong-kong::before        { background-image: var(--flag-hk); }
table.datasheet li.germany::before          { background-image: var(--flag-de); }
table.datasheet li.italy::before            { background-image: var(--flag-it); }
table.datasheet li.japan::before            { background-image: var(--flag-jp); }
table.datasheet li.korea::before            { background-image: var(--flag-kr); }
table.datasheet li.new-zealand::before      { background-image: var(--flag-nz); }
table.datasheet li.singapore::before        { background-image: var(--flag-sg); }
table.datasheet li.spain::before            { background-image: var(--flag-es); }
table.datasheet li.the-netherlands::before  { background-image: var(--flag-nl); }
table.datasheet li.united-kingdom::before   { background-image: var(--flag-gb); }
table.datasheet li.united-states::before    { background-image: var(--flag-us); }

table.datasheet .hardware::before    { content: "\f233"; }
table.datasheet .software::before    { content: "\f2d0"; }
table.datasheet .merchandise::before { content: "\f553"; }
table.datasheet .development::before { content: "\f5fc"; }
table.datasheet .orphan::before      { content: "\f4be"; }

/* Classes are output with digits so need to use escaped numbers */
table.datasheet .\31 00v::before,
table.datasheet .\31 10v::before,
table.datasheet .\31 20v::before,
table.datasheet .\32 20v::before,
table.datasheet .\32 40v::before { content: "\e55b"; }

table.datasheet .ntsc::before,
table.datasheet .ntsc-c::before,
table.datasheet .ntsc-j::before,
table.datasheet .ntsc-k::before,
table.datasheet .ntsc-u::before,
table.datasheet .pal::before   { content: "\e163"; }
table.datasheet .bd::before, 
table.datasheet .dvd::before   { content: "\f51f"; }

table.datasheet .region-free::before { content: "\f5ab"; }
table.datasheet .dvb-s::before { content: "\f7c0"; }
table.datasheet .dvb-t::before { content: "\e585"; }
table.datasheet .anamorphic-169-widescreen::before { content: "\e209";}
table.datasheet .hdr::before   { content: "\e52f"; } 
table.datasheet .vr::before    { content: "\f729"; }

.pa-players li::after { content: " " !important; }
.pa-players li:first-child::before { content: "\e1b0"; }
.pa-players li[class^="link"]::before { content: "\f6ff"; }
.pa-players li:nth-child(2)[class^="online"]::before,
.pa-players li:nth-child(3)[class^="online"]::before { content: "\f0ac"; }

.pa-rating li::before {
    content: "";
    display: inline-block;
    height: 1.2em;
    vertical-align: .1em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    filter: saturate(0%) contrast(50%);
}
.pa-rating li:hover::before{ filter: saturate(100%); }
.pa-rating .cero-a-all-::before { background-image: url("../assets/ratings/cero-a.svg"); }

/* Item datasheet icons */
table.datasheet th::before {
    font-family:"Font Awesome 5 Free";
    font-weight: 900;
    width: 1.5em;
    display: inline-block;
    margin-inline-end: 0.25em; /* Logical margin */
    text-align: center;
}

.pa-item-name th::before {        content: "\f10d";}
.pa-localised-name th::before { content: "\f1ab";}
.pa-original-name th::before {  content: "\f1ab";}
.pa-item-code th::before {        content: "\e69b";}
.pa-gtin th::before {           content: "\f02a";}
.pa-quantity th::before {        content: "\e4e6";}
.pa-status th::before {            content: "\f071";}
.pa-theme th::before {          content: "\f6e8";}
.pa-characteristic th::before { content: "\f005";}
.pa-feature th::before {        content: "\f005";}
.pa-feature-tag th::before {    content: "\#";}
.pa-series th::before {            content: "\f6ad";}
.pa-item-type th::before {    content: "\f61f";}
.pa-class th::before {            content: "\f11b";}
.pa-color th::before {            content: "\f53f";}
.pa-genre th::before {            content: "\f630";}
.pa-region th::before {            content: "\f0ac";}
.pa-territory th::before {        content: "\f024";}
.pa-packaging th::before {      content: "\f466";}
.pa-documentation th::before {    content: "\f02d";}
.pa-developer th::before {        content: "\f5fc";}
.pa-manufacturer th::before {    content: "\f275";}
.pa-publisher th::before {       content: "\f1ad";}
.pa-distributor th::before {    content: "\f494";}
.pa-media th::before {            content: "\f453";}
.pa-players th::before {        content: "\f0c0";}
.pa-peripherals th::before {    content: "\f11b";}
.pa-video-modes th::before {    content: "\f26c";}
.pa-sound-modes th::before {    content: "\f028";}
.pa-os th::before {              content: "\f120";}
.pa-middleware th::before {     content: "\f550";}
.pa-classification th::before {    content: "\f05e";}
.pa-release-date th::before {    content: "\f073";}
.pa-retail-price th::before {    content: "\f02b";}
.pa-launch-price th::before {    content: "\f02b";}
.pa-external-links th::before { content: "\f0c1"; } 
.pa-fyeo th::before {            content: "\f21b";}
.pa-date-added th::before {        content: "\f271";}
.pa-purchase-date th::before {    content: "\f07a";}
.pa-purchase-price th::before,
.pa-cost th::before {           content: "\f571";}
.pa-seller th::before {          content: "\f54e";}
.pa-purchase-source th::before {content: "\f54e";}
.pa-purchase-info th::before {  content: "\f651";}
.pa-contents th::before {       content: "\f49e";}
.pa-condition th::before {      content: "\e561";}
.pa-dimensions th::before {     content: "\f546";}
.pa-weight th::before {          content: "\f515";}
.pa-serial th::before {         content: "\e59a";}
.pa-media-identity th::before { content: "\f577";}

/* Assign Font Awesome unicode to variables for each genre */
table.datasheet .pa-genre .action::before       { content: "\f504"; }
table.datasheet .pa-genre .adventure::before    { content: "\f6ec"; }
table.datasheet .pa-genre .compilation::before  { content: "\f00b"; }
table.datasheet .pa-genre .creative-arts::before{ content: "\f53f"; }
table.datasheet .pa-genre .demo::before         { content: "\f1da"; }
table.datasheet .pa-genre .fighting::before     { content: "\f6de"; }
table.datasheet .pa-genre .media::before        { content: "\f86d"; }
table.datasheet .pa-genre .minigames::before    { content: "\f00a"; }
table.datasheet .pa-genre .music::before        { content: "\f001"; }
table.datasheet .pa-genre .other::before        { content: "\f5fd"; }
table.datasheet .pa-genre .party::before        { content: "\f4b8"; }
table.datasheet .pa-genre .puzzle::before       { content: "\f12e"; }
table.datasheet .pa-genre .racing::before       { content: "\f11e"; }
table.datasheet .pa-genre .reference::before    { content: "\f02d"; }
table.datasheet .pa-genre .rpg::before          { content: "\f2c2"; }
table.datasheet .pa-genre .shooter::before      { content: "\f05b"; }
table.datasheet .pa-genre .sport::before        { content: "\f1e3"; }
table.datasheet .pa-genre .sandbox::before      { content: "\e589"; }
table.datasheet .pa-genre .simulation::before   { content: "\f439"; }
table.datasheet .pa-genre .soundtrack::before   { content: "\f001"; }
table.datasheet .pa-genre .strategy::before     { content: "\f439"; }
table.datasheet .pa-genre .tamer::before        { content: "\e572"; }
table.datasheet .pa-genre .tabletop::before     { content: "\f43c"; }
table.datasheet .pa-genre .utility::before      { content: "\f7d9"; }

/* Hierarchal formatting */
table.datasheet td > ul > li.pa-hierarchy-item::after { content: none !important; }

table.datasheet .pa-list > .pa-hierarchy-item {
    flex-basis: 100%; 
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}

table.datasheet .pa-list-child,
table.datasheet .pa-item-child {
    display: inline;
}

table.datasheet .pa-list-child::before {
    content: ">"; 
    font-family: "Font Awesome 5 Free";
    font-weight: 100;
    font-size: 0.8em;
    opacity: 0.4;
    margin: 0;
    display: inline-block;
}

table.datasheet .pa-item-child:not(:last-child)::after {
    content: "\2022"; 
    opacity: 0.4;
    margin-inline: 0.3em; /* Logical margin */
}

/* Hardware class iconography */
table.datasheet .pa-class .arcade-stick::before { content: "\f276"; }
table.datasheet .pa-class .audio-interface::before { content: "\f590"; }
table.datasheet .pa-class .av-cable::before { content: "\f03a"; transform: rotate(90deg); }
table.datasheet .pa-class .battery::before { content: "\f241"; }
table.datasheet .pa-class .camera::before { content: "\f030"; }
table.datasheet .pa-class .console::before { content: "\f566"; }
table.datasheet .pa-class .console-component::before { content: "\f812"; }
table.datasheet .pa-class .cradle-stand::before { content: "\f6bb"; }
table.datasheet .pa-class .display::before { content: "\f390"; }
table.datasheet .pa-class .extension-cable::before { content: "\f07e"; }
table.datasheet .pa-class .flight-controller::before { content: "\f533"; }
table.datasheet .pa-class .gamepad::before { content: "\f11b"; }
table.datasheet .pa-class .gun-controller::before { content: "\e19b"; }
table.datasheet .pa-class .haptic-feedback::before { content: "\f773"; }
table.datasheet .pa-class .head-mounted-display::before { content: "\f729"; }
table.datasheet .pa-class .joystick::before { content: "\f276"; }
table.datasheet .pa-class .keyboard::before { content: "\f11c"; }
table.datasheet .pa-class .media-remote::before { content: "\e527"; }
table.datasheet .pa-class .memory-storage::before { content: "\f0c7"; }
table.datasheet .pa-class .modification-tool::before { content: "\f2db"; }
table.datasheet .pa-class .motion-controller::before { content: "\e547"; }
table.datasheet .pa-class .mouse::before { content: "\f8cc"; }
table.datasheet .pa-class .multiplayer-interface::before { content: "\e695"; }
table.datasheet .pa-class .music-controller::before { content: "\f7a6"; }
table.datasheet .pa-class .network-interface::before { content: "\f796"; }
table.datasheet .pa-class .power-supply::before { content: "\f1e6"; }
table.datasheet .pa-class .racing-controller::before { content: "\f192"; }
table.datasheet .pa-class .serial-cable::before { content: "\e4ba"; }
table.datasheet .pa-class .sport-controller::before { content: "\f432"; }
table.datasheet .pa-class .storage-case::before { content: "\f0b1"; }
table.datasheet .pa-class .stylus::before { content: "\f044"; }
table.datasheet .pa-class .system-enhancement::before { content: "\f093"; }
table.datasheet .pa-class .wireless-adaptor::before { content: "\f519"; }
table.datasheet .pa-class .wireless-sensor::before { content: "\f1eb"; }

/* Peripheral iconography */
table.datasheet .pa-peripherals .\36-button-controller::before { content: "\f526"; transform: rotate(90deg); }
table.datasheet .pa-peripherals .\364gb-transfer-pack::before { content: "\f093"; }
table.datasheet .pa-peripherals .analogue-controller::before { content: "\f1ce"; }
table.datasheet .pa-peripherals .audio-headset::before { content: "\f590"; }
table.datasheet .pa-peripherals .arcade-stick::before { content: "\f276"; }
table.datasheet .pa-peripherals .barcode-scanner::before { content: "\f02a"; }
table.datasheet .pa-peripherals .camera::before { content: "\f030"; }
table.datasheet .pa-peripherals .classic-pro-controller::before { content: "\f11b"; }
table.datasheet .pa-peripherals .console-handheld-link::before { content: "\f149"; }
table.datasheet .pa-peripherals .cross-play::before { content: "\e4af"; transform: rotate(90deg); }
table.datasheet .pa-peripherals .disk-drive::before { content: "\f0a0"; }
table.datasheet .pa-peripherals .enhanced-hardware::before { content: "\f093"; }
table.datasheet .pa-peripherals .fishing-rod::before { content: "\e4f2"; }
table.datasheet .pa-peripherals .flight-stick::before { content: "\f533"; }
table.datasheet .pa-peripherals .floppy-disk-drive::before { content: "\f0c7"; }
table.datasheet .pa-peripherals .haptic-feedback::before { content: "\f773"; }
table.datasheet .pa-peripherals .keyboard::before { content: "\f11c"; }
table.datasheet .pa-peripherals .lan-adapter::before { content: "\f796"; }
table.datasheet .pa-peripherals .light-gun::before { content: "\e19b"; }
table.datasheet .pa-peripherals .memory-expansion::before { content: "\f538"; }
table.datasheet .pa-peripherals .microphone::before { content: "\f130"; }
table.datasheet .pa-peripherals .mobile-adapter::before { content: "\e527"; }
table.datasheet .pa-peripherals .modem::before { content: "\f796"; }
table.datasheet .pa-peripherals .motion-controller::before { content: "\e547"; }
table.datasheet .pa-peripherals .motion-sensor::before { content: "\f1eb"; transform: rotate(90deg); }
table.datasheet .pa-peripherals .mouse::before { content: "\f8cc"; }
table.datasheet .pa-peripherals .multitap::before { content: "\e695"; }
table.datasheet .pa-peripherals .musical-instrument::before { content: "\f7a6"; }
table.datasheet .pa-peripherals .printer::before { content: "\f02f"; }
table.datasheet .pa-peripherals .portable-app::before { content: "\f3cf"; }
table.datasheet .pa-peripherals .racing-wheel::before { content: "\f192"; }
table.datasheet .pa-peripherals .remote-play::before { content: "\e012"; }
table.datasheet .pa-peripherals .save-memory::before { content: "\f0c7"; }
table.datasheet .pa-peripherals .second-screen::before { content: "\f390"; }
table.datasheet .pa-peripherals .system-link-cable::before { content: "\e4ba"; }
table.datasheet .pa-peripherals .stylus::before { content: "\f044"; }
table.datasheet .pa-peripherals .toys-to-life::before { content: "\f21d"; }
table.datasheet .pa-peripherals .twin-stick::before { content: "\f04c"; }
table.datasheet .pa-peripherals .vga-box::before { content: "\e163"; }
table.datasheet .pa-peripherals .virtual-reality-headset::before { content: "\f729"; }
table.datasheet .pa-peripherals .wireless-link::before { content: "\f519"; }

/* Override default for media */
.pa-media li[class^="1"]::after,
.pa-media li[class^="2"]::after,
.pa-media li[class^="3"]::after,
.pa-media li[class^="4"]::after,
.pa-media li[class^="5"]::after,
.pa-media li[class^="6"]::after,
.pa-media li[class^="7"]::after,
.pa-media li[class^="8"]::after,
.pa-media li[class^="9"]::after,
.pa-media li:has(+ li.external_link_media-identity)::after { /* Remove separator from the item immediately preceding the Media Identity badge */
  content: "\00a0"!important;
  margin: 0!important;
}

ul:has(> .diskette, > .mini-diskette, > .micro-diskette)::before { content: "\f0c7"; }
ul:has(> .mini-optical-disk, .audio-cd-single)::before { content: "\f192"; }
ul:has(> .cd-rom, > .gd-rom, > .dvd-rom, > .bd-rom, > .audio-cd, > .dvd-video)::before { content: "\f51f"; }
ul:has(> .media-compact-cassette, >.media-vhs-cassette)::before { content: "\f4db"; }
ul:has(> .umd)::before { content: "\f8d9"; }
ul:has(> .cartridge)::before { content: "\f538"; }
ul:has(> .key)::before { content: "\f084"; }
ul:has(> .memory-card)::before { content: "\f7c2"; }

/* Audio formats supported */
table.datasheet .discrete-surround::before          { content: "\f5cb"; }
table.datasheet .matrix-encoded-surround::before    { content: "\f471"; transform: rotate(90deg); }
table.datasheet .object-based-surround::before      { content: "\f61f"; }
table.datasheet .virtualised-surround::before       { content: "\f2ce"; }
table.datasheet .hardware-source-synthesis::before  { content: "\f83e"; }

/* Currency icons */
table.datasheet .AUD::before, 
table.datasheet .SGD::before,
table.datasheet .USD::before { content: "\24"; }
table.datasheet .CNY::before,
table.datasheet .JPY::before { content: "\f157"; }
table.datasheet .EUR::before { content: "\f153"; }
table.datasheet .GBP::before { content: "\f154"; }
table.datasheet .KRW::before { content: "\f159"; }
table.datasheet .NFS::before { content: "\e071"; }

/* Media Identity Badge */
/* 1. Remove the default link icon */
.external_link_media-identity {
    margin-inline-start: .5em!important;
}
.external_link_media-identity .ext-link::before {
  content: none !important;
}

/* 2. The Stacked Badge (Base Rule) */
.external_link_media-identity .ext-link a {
  display: inline-flex;
  align-items: center; 
  gap: 4px; 
  
  vertical-align: middle; 
  transform: translateY(-1px);
  
  
  background-color: var(--btn-alt-bg); 
  color: var(--btn-alt-text) !important;
  opacity: 0.8; 
  padding: 2px 6px;
  border-radius: 4px;
  text-decoration: none;
  
  font-size: 0.55em; 
  font-weight: 500;
  line-height: 1.1;
  text-align: left;
  
  width: max-content; 
  word-break: keep-all; 
}

/* 3. The "ID" Prefix */
.external_link_media-identity .ext-link a::before {
  content: "ID";
  font-family: inherit;
  font-size: 1.6em; 
  font-weight: 800;
  line-height: 1;
  flex-shrink: 0; 
}

/* 4. The Inner Label */
.media-id-link-label {
  display: block;
  
  /* Strictly forces the browser to obey the PHP <br> tags */
  white-space: nowrap; 
}

.external_link_media-identity .ext-link a:hover {
  opacity: 1; 
}

/* External link icons */
.external_link .ext-link::before                     { content: "\f0c1"; } /* Default fallback */
.external_link_official-site .ext-link::before       { content: "\e066"; } /* Globe/Home */
.external_link_official-catalogue .ext-link::before  { content: "\f02b"; } /* Tag/List */
.external_link_press-release .ext-link::before       { content: "\f0a1"; } /* Megaphone */
.external_link_digital-manual .ext-link::before      { content: "\f15c"; } /* File/Document */
.external_link_support-information .ext-link::before { content: "\e4e3"; } /* Life-ring/FAQ */
.external_link_media-gallery .ext-link::before       { content: "\f03e"; } /* Image/Picture */
.external_link_retrospective-page .ext-link::before  { content: "\f1da"; } /* History/Clock */

/* Stack External Links on separate lines and remove the WooCommerce inline separator */
.pa-external-links .pa-list li {
    display: block;
    margin-bottom: 6px;
}
.pa-external-links .pa-list li::after {
    content: none !important;
}

.external_link_archived .ext-link::after {
  content: "Internet\00000AArchive"; 
  white-space: pre;                  
  display: inline-block;             
  background-color: var(--btn-alt-bg); /* Theme-synced */
  color: var(--btn-alt-text); /* Theme-synced */
  font-size: 0.4em;
  font-weight: 400;
  letter-spacing: 0.08em;
  padding: 1px 6px;
  border-radius: 4px;
  margin-inline-start: 1em; /* Logical margin */
  line-height: 1.1;
  text-align: center;
  vertical-align: middle;
}

/* Do not show ruby characters in table */
.pa-localised-name rt {  display:none;}
.pa-original-name rt {  display:none;}


.pa-color li::before {
    content:"\f043";
}
.pa-color li.transparent:hover::before  { opacity: 0.5;}
.pa-color li.black:hover::before        { color: black;}
.pa-color li.blue:hover::before         { color: blue;}
.pa-color li.brown:hover::before        { color: brown;}
.pa-color li.gold:hover::before         { color: gold;}
.pa-color li.green:hover::before        { color: green;}
.pa-color li.grey:hover::before         { color: grey;}
.pa-color li.orange:hover::before       { color: orange;}
.pa-color li.pink:hover::before         { color: pink;}
.pa-color li.purple:hover::before       { color: purple;}
.pa-color li.red:hover::before          { color: red;}
.pa-color li.silver:hover::before       { color: silver;}
.pa-color li.white:hover::before        { color: white; text-shadow: 0 0 2px rgba(0,0,0,0.6); }
.pa-color li.yellow:hover::before       { color: yellow;}

.pa-color td span {
    width: 1em;
    height: 1em;
    border-radius: 50%;
    margin-inline-end: 0.5em; /* Logical margin */
    border: 1px solid #ccc;
}

/* TEST NEW FONT */
@font-face {
    font-family: "chromagi-icons";
    src: url("../assets/fonts/chromagi-icons.woff2") format("woff2"),
        url("../assets/fonts/chromagi-icons.ttf") format("truetype"),
        url("../assets/fonts/chromagi-icons.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

.pa-purchase-source li[class*="-"]::before {
    font-family: "chromagi-icons" !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    letter-spacing: 0;
    -webkit-font-feature-settings: "liga";
    -moz-font-feature-settings: "liga=1";
    -moz-font-feature-settings: "liga";
    -ms-font-feature-settings: "liga" 1;
    font-feature-settings: "liga";
    -webkit-font-variant-ligatures: discretionary-ligatures;
    font-variant-ligatures: discretionary-ligatures;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.pa-purchase-source li[class^="amazon-"]::before            {  content: "store-amazon";}
.pa-purchase-source li[class^="ebay-"]::before              {  content: "\f000";}
.pa-purchase-source li[class^="eb-"]::before                {  content: "\f4f4";}
.pa-purchase-source li[class^="bigw-"]::before              {  content: "\f4f4";}
.pa-purchase-source li[class^="target-"]::before            {  content: "\f192";}
.pa-purchase-source li[class^="cash-converters-"]::before   {  content: "\f192";}
.pa-purchase-source li[class^="cex-"]::before               {  content: "\f4f4";}





/* ==========================================================================
   Grouped products section
   ========================================================================== */
.woocommerce-grouped-product-list {
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    margin-bottom: 2em;
}
.woocommerce-grouped-product-list-item {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 0;
}
.woocommerce-grouped-product-list-item span {
    display: flex;
}
.woocommerce-grouped-product-list-item__thumbnail {
    height: 4em;
}
.woocommerce-grouped-product-list-item__thumbnail img {
    max-width: 4em;
    max-height: 4em;
    height: auto;
    width: auto;
    margin: auto;
}
.woocommerce-grouped-product-list-item__label {
    font-size: 0.8em;
}
.woocommerce-grouped-product-list-item__label, 
.woocommerce-grouped-product-list-item__sku {
    text-align: center;
}
.woocommerce-grouped-product-list-item__sku {
    font-size: 0.6em;
}



/* ==========================================================================
   Related products section
   ========================================================================== */
.related {
    grid-area: related;
    order: 5;
}
.related ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 0.25em;
}
.related .itemloop-item {
    width: 25%; /* A hack but effective for now        */
    max-width: 20em;
}

@media (max-width: 720px) {
    .related .itemloop-item {
        width: 30%; 
    }
}
@media (max-width: 380px) {
    .related .itemloop-item:nth-child(n+4) { display: none; }
}
@media (max-width: 768px) {
    .related .itemloop-item:nth-child(n+5) { display: none; }
}
@media (max-width: 1200px) {
    .related .itemloop-item:nth-child(n+7) { display: none; }
}