/*
Theme Name: SSI FANZINE
Author: SSI FANZINE
Description: Lightweight custom sports news and magazine theme.
Version: 1.4.36
Text Domain: ssi-fanzine
*/

:root {
    --text: #111111;
    --muted: #656b74;
    --border: #e6e6e6;
    --background: #ffffff;
    --surface: #f7f7f7;
    --card: #ffffff;
    --header-bg: #ffffff;
    --header-icon: #111111;
    --accent: #ef2333;
    --dark: #050505;
    --shadow: rgba(0, 0, 0, 0.05);
    --max-width: 1200px;
    color-scheme: light;
}

:root[data-theme="dark"] {
    --text: #f4f4f5;
    --muted: #a5adba;
    --border: #292d33;
    --background: #0d0f12;
    --surface: #181b20;
    --card: #12151a;
    --header-bg: #101216;
    --header-icon: #ffffff;
    --shadow: rgba(0, 0, 0, 0.38);
    color-scheme: dark;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: var(--background);
    color: var(--text);
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.45;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: var(--accent);
}

.site-container {
    width: min(var(--max-width), calc(100% - 72px));
    margin-inline: auto;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 25;
    background: var(--header-bg);
    border-bottom: 1px solid var(--border);
    box-shadow: 0 10px 30px var(--shadow);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.site-header.is-hidden {
    transform: translateY(-100%);
    box-shadow: none;
}

body.admin-bar .site-header { top: 32px; }

@media screen and (max-width:782px) {
    body.admin-bar .site-header { top: 46px; }
}

.header-top {
    background: var(--dark);
    color: #ffffff;
    font-size: 12px;
}

.header-top-inner {
    min-height: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.utility-navigation {
    display: flex;
    align-items: center;
    gap: 22px;
}

.header-main {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.site-logo {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
}

.logo-mark {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.logo-rule {
    height: 2px;
    flex: 1;
    background: var(--text);
}

.logo-ssi {
    color: var(--accent);
    font-family: "Times New Roman", Georgia, serif;
    font-weight: 900;
    font-size: 34px;
    line-height: 1;
}

.logo-title {
    display: block;
    color: var(--text);
    font-size: 24px;
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: 0.34em;
    text-indent: 0.34em;
    text-transform: uppercase;
}

.site-logo small {
    margin-top: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2.2px;
    text-transform: uppercase;
    text-align: center;
}
.site-footer .logo-title { color:#fff; }
.site-footer .logo-rule { background:#fff; }

.header-search {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    max-width: 34px;
    flex: 0 0 34px;
}

.header-search .search-icon {
    width: 20px;
    height: 20px;
    color: var(--header-icon);
    display: block;
}

.nav-shell {
    border-top: 1px solid var(--border);
}

.site-ticker {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 0;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: var(--background);
    overflow: hidden;
}

.ticker-label {
    position: relative;
    flex: 0 0 auto;
    margin-left: 20px;
    padding: 4px 10px;
    border-radius: 3px;
    background: var(--accent);
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ticker-viewport {
    display: flex;
    overflow: hidden;
    min-width: 0;
}

.ticker-track {
    display: flex;
    gap: 30px;
    align-items: center;
    padding-left: 20px;
    white-space: nowrap;
    animation: ticker-scroll 30s linear infinite;
}

.ticker-item {
    color: var(--text);
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.ticker-item:hover {
    color: var(--accent);
}

.ticker-item::before {
    content: "•";
    margin-right: 10px;
    color: var(--accent);
}

@keyframes ticker-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.theme-toggle {
    position: relative;
    width: 46px;
    height: 26px;
    flex: 0 0 46px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface);
    cursor: pointer;
}

.theme-toggle-icon {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    color: #1a1a1a;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease;
}

.toggle-icon {
    width: 13px;
    height: 13px;
}

.icon-moon {
    display: none;
}

.theme-toggle[aria-pressed="true"] .theme-toggle-icon {
    transform: translateX(20px);
    background: #2a2f36;
    color: #ffffff;
}

.theme-toggle[aria-pressed="true"] .theme-toggle-icon .icon-sun {
    display: none;
}

.theme-toggle[aria-pressed="true"] .theme-toggle-icon .icon-moon {
    display: block;
}

.nav-row {
    min-height: 44px;
    display: flex;
    align-items: center;
}

.main-navigation {
    display: flex;
    align-items: stretch;
    gap: 0;
    overflow-x: auto;
}

.main-navigation a {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 17px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
}

.main-navigation a.is-active {
    color: var(--accent) !important;
}

.main-navigation a.is-active::after {
    content: "";
    position: absolute;
    right: 17px;
    bottom: 0;
    left: 17px;
    height: 2px;
    background: var(--accent);
}

.main-navigation .special-nav-link {
    color: var(--accent);
}

.main-navigation .special-nav-link::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-right: 8px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 4px rgba(239, 35, 51, 0.12);
}

.mobile-menu-button,
.mobile-navigation,
.bottom-tab-bar,
.live-score-fab {
    display: none;
}

.site-main {
    padding: 24px 0 0;
}

.home-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 32px;
}

.featured-story {
    position: relative;
    min-height: 360px;
    margin-bottom: 28px;
    overflow: hidden;
    border-radius: 4px;
    background: #111111;
}

.featured-image,
.featured-image img {
    width: 100%;
    height: 100%;
}

.featured-image {
    position: absolute;
    inset: 0;
}

.featured-image img {
    object-fit: cover;
}

.featured-story::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.22) 62%, rgba(0, 0, 0, 0.55));
}

.featured-content {
    position: relative;
    z-index: 1;
    width: min(620px, 80%);
    min-height: 360px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 26px 28px;
    color: #ffffff;
}

.post-category {
    margin-bottom: 8px;
    color: var(--accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.featured-content .post-category {
    display: inline-flex;
    align-self: flex-start;
    padding: 6px 10px;
    border-radius: 4px;
    background: var(--accent);
    color: #ffffff;
}

.featured-content h1 {
    margin: 0 0 10px;
    font-size: clamp(34px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: 0;
}

.featured-content h1 a,
.featured-content h1 a:hover {
    color: #ffffff;
}

.featured-content .post-excerpt {
    max-width: 560px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 16px;
}

.post-meta {
    margin: 9px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.featured-content .post-meta {
    display: flex;
    gap: 16px;
    color: #ffffff;
    font-weight: 700;
}

.section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
}

.section-title h2 {
    position: relative;
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 900;
    text-transform: uppercase;
}

.section-title h2::after {
    content: "";
    position: absolute;
    bottom: -11px;
    left: 0;
    width: 26px;
    height: 2px;
    background: var(--accent);
}

.section-title a {
    color: var(--text);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.article-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.article-card {
    min-width: 0;
    background: transparent;
}

.article-image {
    display: block;
    aspect-ratio: 16 / 9;
    margin-bottom: 12px;
    overflow: hidden;
    border-radius: 4px;
    background: var(--surface);
}

.article-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.25s ease;
}

.article-card:hover .article-image img {
    transform: scale(1.04);
}

.article-card h3 {
    margin: 0;
    font-size: 16px;
    line-height: 1.22;
    font-weight: 900;
}

.home-sidebar {
    min-width: 0;
}

.sidebar-section {
    margin-bottom: 28px;
}

.news-list {
    display: grid;
    gap: 14px;
}

.news-item {
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.news-image {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 4px;
    background: var(--surface);
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-item h3 {
    margin: 0;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 900;
}

.topic-list {
    display: grid;
    gap: 2px;
}

.topic-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 34px;
    gap: 12px;
    padding: 3px 0;
    font-size: 14px;
    font-weight: 700;
}

.topic-item::before {
    content: "";
    width: 19px;
    height: 19px;
    flex: 0 0 19px;
    border: 2px solid var(--accent);
    border-radius: 50%;
}

.topic-item span {
    margin-right: auto;
}

.topic-item em {
    min-width: 36px;
    padding: 3px 8px;
    border-radius: 4px;
    background: var(--surface);
    color: var(--text);
    font-size: 11px;
    font-style: normal;
    text-align: center;
}

.featured-categories {
    margin-top: 34px;
    margin-bottom: 20px;
}

.category-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.category-tile {
    position: relative;
    min-height: 86px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    overflow: hidden;
    border-radius: 4px;
    padding: 14px;
    background: #111111;
    color: #ffffff;
}

.category-tile img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.58;
}

.category-tile::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.82));
}

.category-tile span,
.category-tile small {
    position: relative;
    z-index: 1;
}

.category-tile span {
    font-size: 15px;
    font-weight: 900;
    text-transform: uppercase;
}

.category-tile small {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.site-footer {
    margin-top: 0;
    padding: 28px 0 18px;
    background: var(--dark);
    color: #ffffff;
}

.footer-inner {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 48px;
    align-items: start;
}

.footer-description {
    margin: 10px 0 0;
    color: #b8bcc4;
    font-size: 13px;
}

.footer-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(90px, 1fr));
    gap: 8px 22px;
    color: #c9cbd0;
    font-size: 13px;
}

.footer-links .menu-item {
    list-style: none;
}

.footer-right {
    text-align: left;
}

.single-article,
.commerce-shell {
    max-width: 940px;
    margin: 0 auto 60px;
}

.single-header,
.archive-header,
.author-header {
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border);
}

.single-header h1,
.archive-header h1,
.author-info h1 {
    margin: 0 0 12px;
    font-size: clamp(36px, 5vw, 58px);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: 0;
}

.single-meta,
.archive-description,
.author-info p {
    color: var(--muted);
    font-size: 14px;
}

.single-featured-image {
    margin: 0 0 34px;
    overflow: hidden;
    border-radius: 4px;
}

.single-featured-image img {
    width: 100%;
}

.single-content {
    max-width: 720px;
    margin: 0 auto;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 14px;
    line-height: 1.6;
}

.single-content p {
    margin: 0 0 24px;
}

.single-content h2,
.single-content h3 {
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.2;
}

.single-footer {
    max-width: 720px;
    margin: 45px auto 0;
    padding-top: 18px;
    border-top: 1px solid var(--border);
}

.article-categories a,
.nav-links a,
.nav-links span {
    display: inline-block;
    margin: 0 6px 8px 0;
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: 4px;
    font-size: 12px;
    font-weight: 800;
}

.author-header {
    display: flex;
    align-items: center;
    gap: 24px;
}

.author-avatar img {
    width: 112px;
    height: 112px;
    border-radius: 50%;
    object-fit: cover;
}

.error-page {
    max-width: 680px;
    margin: 70px auto;
    text-align: center;
}

.error-page h1 {
    margin: 0 0 12px;
    font-size: clamp(42px, 7vw, 72px);
    line-height: 1;
    font-weight: 900;
}

.error-home-link,
.button,
button,
input[type="submit"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    border: 0;
    border-radius: 4px;
    background: var(--accent);
    color: #ffffff;
    font-weight: 900;
    text-transform: uppercase;
}

input,
textarea,
select {
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
}

input[type="search"] {
    -webkit-appearance: none;
    appearance: none;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none;
    display: none;
}

.woocommerce table.shop_table,
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce div.product .woocommerce-tabs .panel,
.woocommerce-cart-form,
.woocommerce-checkout {
    border-color: var(--border);
    background: var(--card);
    color: var(--text);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    background: var(--surface);
    color: var(--text);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    color: var(--text);
    font-size: 16px;
    font-weight: 900;
}

.woocommerce ul.products li.product .price {
    color: var(--accent);
    font-weight: 900;
}

/* Force-visible safety net — ensures hidden elements show even if plugins override them.
   Only sets visibility/opacity/position — does NOT set font-size or display to avoid
   conflicting with the more specific rules below. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price .woocommerce-Price-amount,
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price del,
.elementor-widget-woocommerce-product-title,
.elementor-widget-woocommerce-product-price,
.elementor-widget-woocommerce-product-price .price {
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    position: static !important;
}
.woocommerce ul.products li.product .price,
.elementor-widget-woocommerce-product-price .price {
    color: var(--accent) !important;
    font-weight: 900 !important;
}

/* The ₹ character itself is correct in the markup (confirmed via
   inspecting the live DOM) — this site's font stack (Roboto's default
   Latin-only subset, falling back through Arial/sans-serif) is rendering
   it with the wrong glyph somewhere in that chain. Rather than chase
   which specific font/subset is at fault, pin these elements to a font
   stack with reliable, complete Rupee-sign coverage so it can't happen
   regardless of what the rest of the page is using.

   Two different selectors are needed because WooCommerce actually ships
   two unrelated price-rendering systems that don't share markup:
   - Classic (shop loop, Elementor widget): symbol gets its own
     <span class="woocommerce-Price-currencySymbol">.
   - WooCommerce Blocks (Cart/Checkout blocks, block-based mini-cart):
     the whole "₹200.00" string is one plain text node inside
     .wc-block-components-formatted-money-amount, no separate symbol
     span at all — so the first rule alone can never reach it.
*/
.woocommerce-Price-currencySymbol,
.wc-block-components-formatted-money-amount,
.wc-block-grid__product-price,
.wc-block-components-product-price,
.wc-block-components-totals-item__value {
    font-family: Arial, "Noto Sans", "Segoe UI", "Helvetica Neue", sans-serif !important;
}

/* Product images - show full image without cropping */
.woocommerce ul.products li.product a.woocommerce-loop-product__link img,
.woocommerce ul.products li.product .woocommerce-loop-product__link img,
.woocommerce div.product .woocommerce-product-gallery__image img,
.woocommerce-cart-form .product-thumbnail img,
.woocommerce-checkout .product-thumbnail img,
.widget_shopping_cart .product-thumbnail img,
.woocommerce .product-image-wrapper img,
.woocommerce .product-image img,
.woocommerce .attachment-woocommerce_thumbnail,
.woocommerce .attachment-shop_catalog,
.woocommerce .attachment-shop_single {
    object-fit: contain !important;
    object-position: center !important;
    background: var(--surface) !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
}

.woocommerce ul.products li.product a.woocommerce-loop-product__link,
.woocommerce ul.products li.product .woocommerce-loop-product__link {
    aspect-ratio: auto !important;
    overflow: visible !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    text-decoration: none !important;
}

.woocommerce div.product .woocommerce-product-gallery__image,
.woocommerce .product-image-wrapper,
.woocommerce .product-image {
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    background: var(--surface) !important;
    display: block !important;
}

.woocommerce ul.products li.product img {
    object-fit: cover !important;
    object-position: center !important;
    width: 100% !important;
    height: auto !important;
}

@media (max-width: 980px) {
    .home-layout {
        grid-template-columns: 1fr;
    }

    .home-sidebar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 28px;
    }

    .category-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    body {
        padding-bottom: 90px;
    }

    .site-container {
        width: calc(100% - 32px);
    }

    .site-header {
        position: static;
        z-index: 25;
        border-radius: 0 0 28px 28px;
    }

    .header-top-inner {
        justify-content: center;
        min-height: 48px;
    }

    .utility-navigation {
        display: none;
    }

    .header-main {
        min-height: 110px;
    }

    .site-logo {
        align-items: center;
        margin-inline: auto;
        font-size: 36px;
    }

    .site-logo small {
        font-size: 13px;
        text-align: center;
    }

    .mobile-menu-button {
        position: relative;
        display: block;
        width: 42px;
        height: 42px;
        border: 0;
        background: transparent;
        cursor: pointer;
    }

    .mobile-menu-button::before,
    .mobile-menu-button::after,
    .mobile-menu-button span {
        content: "";
        position: absolute;
        left: 7px;
        width: 28px;
        height: 2px;
        background: var(--header-icon);
        transition: transform 0.2s ease, opacity 0.2s ease;
    }

    .mobile-menu-button::before {
        top: 12px;
    }

    .mobile-menu-button span {
        top: 20px;
    }

    .mobile-menu-button::after {
        top: 28px;
    }

    .mobile-menu-button[aria-expanded="true"]::before {
        transform: translateY(8px) rotate(45deg);
    }

    .mobile-menu-button[aria-expanded="true"] span {
        opacity: 0;
    }

    .mobile-menu-button[aria-expanded="true"]::after {
        transform: translateY(-8px) rotate(-45deg);
    }

    .nav-shell {
        overflow-x: auto;
    }

    .nav-row {
        width: 100%;
    }

    .main-navigation {
        width: 100%;
    }

    .main-navigation a {
        min-height: 68px;
        padding-inline: 17px;
        font-size: 16px;
    }

    .mobile-navigation.is-open {
        display: block;
        border-top: 1px solid var(--border);
    }

    .mobile-navigation .site-container {
        display: grid;
        gap: 0;
        padding: 8px 0 16px;
    }

    .mobile-navigation a {
        padding: 12px 0;
        border-bottom: 1px solid var(--border);
        font-weight: 800;
    }

    .mobile-navigation .special-nav-link {
        color: var(--accent);
    }

    .bottom-tab-bar {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 30;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        min-height: 76px;
        padding: 8px max(10px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
        background: #050505;
        color: #ffffff;
        box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.22);
    }

    .bottom-tab {
        position: relative;
        display: flex;
        min-width: 0;
        min-height: 58px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #ffffff;
        font: inherit;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
        text-transform: none;
        cursor: pointer;
    }

    .bottom-tab:hover,
    .bottom-tab.is-active,
    .bottom-menu-toggle[aria-expanded="true"] {
        color: var(--accent);
    }

    .bottom-tab-icon {
        position: relative;
        display: block;
        width: 27px;
        height: 27px;
        color: currentColor;
    }

    .bottom-tab-home::before {
        content: "";
        position: absolute;
        top: 5px;
        left: 4px;
        width: 17px;
        height: 17px;
        border: 2px solid currentColor;
        border-top: 0;
    }

    .bottom-tab-home::after {
        content: "";
        position: absolute;
        top: 3px;
        left: 5px;
        width: 16px;
        height: 16px;
        border-top: 2px solid currentColor;
        border-left: 2px solid currentColor;
        transform: rotate(45deg);
    }

    .bottom-tab-magazine::before {
        content: "";
        position: absolute;
        top: 4px;
        left: 4px;
        width: 18px;
        height: 19px;
        border: 2px solid currentColor;
        border-radius: 2px;
    }

    .bottom-tab-magazine::after {
        content: "";
        position: absolute;
        top: 8px;
        left: 13px;
        width: 2px;
        height: 13px;
        background: currentColor;
        box-shadow: -5px 0 0 transparent, 5px 0 0 transparent;
    }

    .bottom-tab-authors::before,
    .bottom-tab-authors::after {
        content: "";
        position: absolute;
        border: 2px solid currentColor;
        border-radius: 999px;
    }

    .bottom-tab-authors::before {
        top: 4px;
        left: 10px;
        width: 7px;
        height: 7px;
    }

    .bottom-tab-authors::after {
        top: 15px;
        left: 6px;
        width: 15px;
        height: 8px;
        border-bottom: 0;
    }

    .bottom-tab-authors {
        box-shadow: inset -7px 2px 0 -5px currentColor, inset 7px 2px 0 -5px currentColor;
    }

    .bottom-tab-search::before {
        content: "";
        position: absolute;
        top: 4px;
        left: 4px;
        width: 15px;
        height: 15px;
        border: 2px solid currentColor;
        border-radius: 50%;
    }

    .bottom-tab-search::after {
        content: "";
        position: absolute;
        right: 4px;
        bottom: 5px;
        width: 10px;
        height: 2px;
        background: currentColor;
        transform: rotate(45deg);
    }

    .bottom-tab-menu::before,
    .bottom-tab-menu::after {
        content: "";
        position: absolute;
        left: 4px;
        width: 19px;
        height: 2px;
        background: currentColor;
    }

    .bottom-tab-menu::before {
        top: 7px;
        box-shadow: 0 7px 0 currentColor;
    }

    .bottom-tab-menu::after {
        top: 21px;
    }

    .live-score-fab {
        position: fixed;
        right: 14px;
        bottom: 86px;
        z-index: 31;
        display: flex;
        width: 62px;
        height: 62px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border: 2px solid #ffffff;
        border-radius: 50%;
        background: var(--accent);
        color: #ffffff;
        box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
        text-align: center;
        text-transform: uppercase;
    }

    .live-score-fab span {
        font-size: 10px;
        font-weight: 900;
        line-height: 1;
    }

    .live-score-fab strong {
        margin-top: 2px;
        font-size: 12px;
        line-height: 1;
    }

    .site-main {
        padding-top: 22px;
    }

    .featured-story {
        min-height: 520px;
        border-radius: 6px;
    }

    .featured-content {
        width: 100%;
        min-height: 520px;
        padding: 28px;
    }

    .featured-content h1 {
        font-size: 34px;
    }

    .article-grid {
        display: flex;
        gap: 16px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
    }

    .article-card {
        flex: 0 0 254px;
        scroll-snap-align: start;
        border: 1px solid var(--border);
        border-radius: 6px;
        overflow: hidden;
        background: var(--card);
    }

    .article-card .post-category,
    .article-card h3,
    .article-card .post-meta {
        margin-right: 14px;
        margin-left: 14px;
    }

    .article-card .post-meta {
        margin-bottom: 14px;
    }

    .article-image {
        border-radius: 0;
        margin-bottom: 12px;
    }

    .home-sidebar {
        display: block;
    }

    .news-list {
        gap: 18px;
    }

    .news-item {
        grid-template-columns: 38% minmax(0, 1fr);
        padding-bottom: 14px;
        border-bottom: 1px solid var(--border);
    }

    .news-item h3 {
        font-size: 18px;
    }

    .topic-list {
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;
    }

    .topic-item {
        min-height: 92px;
        flex-direction: column;
        justify-content: center;
        gap: 7px;
        border-right: 1px solid var(--border);
        text-align: center;
    }

    .topic-item span {
        margin: 0;
    }

    .category-strip {
        display: flex;
        overflow-x: auto;
    }

    .category-tile {
        flex: 0 0 220px;
    }

    .footer-inner {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .footer-right {
        text-align: left;
    }

    .single-header h1,
    .archive-header h1,
    .author-info h1 {
        font-size: 38px;
    }
}

@media (max-width: 520px) {
    .site-container {
        width: calc(100% - 24px);
    }

    .site-logo {
        font-size: 30px;
    }

    .site-logo small {
        font-size: 11px;
    }

    .main-navigation a {
        font-size: 14px;
        padding-inline: 14px;
    }

    .featured-story {
        min-height: 448px;
    }

    .featured-content {
        min-height: 448px;
        padding: 22px;
    }

    .featured-content h1 {
        font-size: 30px;
    }

    .featured-content .post-excerpt {
        font-size: 15px;
    }

    .topic-list {
        grid-template-columns: repeat(2, 1fr);
    }

    .news-item {
        grid-template-columns: 1fr;
    }
}

/* Reference layout refinements */
.social-links { display:flex; align-items:center; gap:12px; }
.social-links a { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border:1px solid rgba(255,255,255,.55); border-radius:50%; color:#fff; font-size:10px; font-weight:900; text-transform:uppercase; }
.social-links .social-svg { display:block; width:13px; height:13px; }
.header-banner-wrap { padding:12px 0; }
.header-banner { min-height:64px; width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 24px; border-radius:4px; background:linear-gradient(100deg,#08121d,#050505); color:#fff; font-size:16px; font-weight:900; line-height:1.05; text-transform:uppercase; }
.header-main > .header-banner { width:min(700px,62%); flex:1 1 auto; }
.header-banner strong { color:var(--accent); }
.header-banner > span { white-space:nowrap; }
.header-banner b { padding:12px 16px; border-radius:4px; background:var(--accent); font-size:11px; white-space:nowrap; }
.header-banner:hover, .header-banner:hover span { color:#fff; }
.header-banner:hover strong { color:var(--accent); }
.header-banner:hover b { color:#fff; }
.header-search { margin-left:auto; }
.mobile-header-search { display:flex; align-items:center; justify-content:center; }
.main-navigation .header-search { display:none; }
.article-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.featured-author { display:inline-flex; align-items:center; gap:8px; }
.featured-author img { width:28px; height:28px; border-radius:50%; }
.news-view-all { display:block; margin-top:14px; padding:7px; border:1px solid var(--border); border-radius:3px; color:var(--accent); font-size:11px; font-weight:900; text-align:center; text-transform:uppercase; }
.footer-inner { grid-template-columns:1.4fr 1fr 1fr 1fr; gap:34px; }
.footer-links, .footer-categories { display:grid; grid-template-columns:1fr 1fr; gap:5px 20px; color:#c9cbd0; font-size:13px; }
.footer-categories { grid-auto-flow:row; grid-template-columns:repeat(2,minmax(0,1fr)); }
.footer-links strong, .footer-categories strong, .footer-right strong { grid-column:1/-1; color:#fff; font-size:12px; text-transform:uppercase; }
.footer-right .social-links { margin-top:12px; }
.footer-bottom { padding:9px 0; background:#050505; border-top:1px solid #333; color:#aaa; font-size:11px; }
.footer-bottom .site-container { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; }
.footer-credit { text-align:center; color:#fff; }
.footer-legal { justify-self:end; }
.footer-bottom a { margin-left:28px; color:#fff; }

@media (max-width:800px) {
    /* No overflow-x on html/body: it turns them into a clipping/scroll
       container, which breaks position:sticky on .site-header, so the
       mobile menu ends up rendering near the page's document top instead
       of the header's current on-screen position. .site-main and the
       other inner wrappers already clip horizontal overflow on their own. */
    html, body { max-width:100%; }
    .site-header { border-radius:0 0 28px 28px; }
    .site-container { width:calc(100% - 40px); }
    .header-top-inner { justify-content:space-between; gap:8px; font-size:11px; }
    .header-top-inner > span { min-width:0; white-space:nowrap; }
    .header-top-inner .social-links { display:flex; flex:0 0 auto; }
    .header-main { position:relative; width:100%; min-width:0; overflow:hidden; display:grid !important; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; }
    .header-main .header-banner { display:none !important; }
    .header-main .mobile-menu-button { grid-column:1; flex:0 0 38px; }
    .header-main .site-logo { grid-column:2; justify-self:center; width:fit-content; min-width:0; }
    .header-main .header-actions { grid-column:3; display:flex; align-items:center; gap:8px; padding-right:4px; }
    .header-main .theme-toggle { width:44px; height:25px; }
    .site-ticker { margin-right:20px; margin-left:20px; }
    .header-main .mobile-header-search { display:block; }
    .site-logo span { white-space:nowrap; }
    .logo-ssi { font-size:30px; }
    .logo-title { font-size:20px; }
    .nav-shell { max-width:100%; overflow:hidden; }
    .nav-row { width:100%; min-width:0; }
    .main-navigation { max-width:100%; overflow-x:auto; overflow-y:hidden; }
    .home-layout { display:grid; grid-template-columns:1fr; gap:0; }
    .home-primary, .home-sidebar { display:contents; }
    .featured-story { order:1; width:calc(100% - 32px) !important; min-width:0; max-width:calc(100% - 32px); min-height:448px; margin:22px 16px 0; border-radius:7px; }
    .featured-content { width:100%; min-width:0; max-width:100%; min-height:448px; padding:28px; }
    .featured-content h1 { font-size:34px; }
    .featured-content h1, .featured-content .post-excerpt { overflow-wrap:anywhere; }
    .latest-news-section { order:2; margin-top:26px; }
    .latest-articles-section { order:3; margin-top:26px; }
    .popular-topics-section { order:4; margin-top:26px; }
    .article-grid { grid-template-columns:none; }
    .article-grid { width:100%; min-width:0; max-width:100%; }
    .article-card { min-width:0; }
    .news-item { min-width:0; max-width:100%; }
    .main-navigation .header-search { display:none; }
    .section-title a { color:var(--accent); font-size:12px; }
    .footer-inner { grid-template-columns:1fr; }
    .footer-categories { display:none; }
    .footer-bottom .site-container { display:block; text-align:center; }
    .footer-credit { display:block; margin:7px 0; }
    .footer-legal { display:block; }
    .footer-bottom .site-container > span { display:block; margin-top:4px; }
    .footer-bottom a { margin:0 18px 0 0; }
    .footer-bottom { padding-bottom:96px; }
    .footer-bottom .site-container { padding-right:12px; padding-left:12px; }
    .footer-legal { display:flex !important; justify-content:center; flex-wrap:wrap; gap:8px 16px; }
    .footer-legal a { margin:0; }
}

/* Compact category article grids */
.editorial-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.editorial-list { display:contents; }
.editorial-lead { grid-column:auto; grid-row:auto; }
.editorial-lead-image { aspect-ratio:16/9; max-height:none; }
.editorial-lead h3 { font-size:15px; line-height:1.22; }
.editorial-excerpt { display:none; }
.editorial-item { grid-column:auto; display:block; padding:0; border:0; }
.editorial-item-thumb { display:block; width:100%; aspect-ratio:16/9; margin-bottom:9px; }
.editorial-item-body h4 { font-size:15px; }
.editorial-item .post-meta { margin-top:8px; }

@media (max-width:800px) {
    .editorial-grid { display:flex; gap:16px; overflow-x:auto; }
    .editorial-item { flex:0 0 240px; }
    .editorial-item { display:block; }
}

@media screen and (min-width:801px) {
    .archive-header + .article-grid { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}

@media screen and (max-width:800px) {
    .archive-layout { display:flex; flex-direction:column; gap:28px; }
    .archive-main-column { order:1; width:100%; }
    .archive-dont-miss { order:2; width:100%; }
    .archive-popular-news { order:3; width:100%; }
    .archive-main-column .article-grid { display:flex; grid-template-columns:none; overflow-x:auto; }
    .archive-main-column .archive-card { flex:0 0 270px; }
}

@media screen and (max-width:800px) {
    .archive-layout { display:flex !important; flex-direction:column !important; width:100% !important; min-width:0; }
    .archive-main-column, .archive-dont-miss, .archive-popular-news { width:100% !important; min-width:0; }
    .archive-main-column { order:1; }
    .archive-dont-miss { order:2; }
    .archive-popular-news { order:3; }
    .archive-main-column .article-grid { display:grid !important; grid-template-columns:1fr !important; width:100%; overflow:visible; }
    .archive-main-column .archive-card { width:100%; min-width:0; }
    .site-search-form { width:100%; }
    .site-search-form button { padding:0 14px; }
    .article-card > .post-excerpt,
    .article-card > .editorial-excerpt,
    .editorial-lead > .editorial-excerpt { margin-right:14px; margin-left:14px; }
    .index-grid { grid-template-columns:1fr; }
}

@media (max-width:520px) {
    .logo-ssi { font-size:26px; }
    .logo-title { font-size:17px; }
    .header-top-inner .social-links a { width:20px; height:20px; }
    .social-links { gap:7px; }
}

@media screen and (max-width:800px) {
    .site-main { width:100%; max-width:100vw; overflow:hidden; }
    .home-layout { display:grid; grid-template-columns:minmax(0,1fr) !important; width:100%; min-width:0; max-width:100%; overflow:hidden; }
    .home-primary, .home-sidebar { min-width:0; max-width:100%; }
    .featured-slider { order:1; margin:22px 22px 0; }
    .featured-story { box-sizing:border-box; width:100% !important; max-width:100% !important; margin:0 !important; }
    .featured-content { box-sizing:border-box; width:100% !important; max-width:100% !important; }
    .featured-content h1 { width:100%; max-width:100%; overflow-wrap:anywhere; word-break:break-word; }
    .article-grid { width:100%; max-width:100%; overflow-x:auto; overflow-y:hidden; }
    .latest-news-section, .latest-articles-section, .popular-topics-section { margin-right:22px; margin-left:22px; }
    .latest-news-section > .section-title > a { width:72px; overflow:hidden; font-size:0; white-space:nowrap; }
    .latest-news-section > .section-title > a::after { content:"View All  >"; font-size:11px; }
    .popular-topics-section .topic-list { display:flex; gap:0; width:100%; overflow-x:auto; padding:4px 0 10px; }
    .popular-topics-section .topic-item { flex:0 0 84px; min-height:86px; flex-direction:column; justify-content:center; gap:7px; padding:8px 4px; border-right:1px solid var(--border); text-align:center; }
    .popular-topics-section .topic-icon { width:31px; height:31px; flex:0 0 31px; border-width:2px; }
    .popular-topics-section .topic-icon-more { border:0; }
    .popular-topics-section .topic-icon-more i { width:4px; height:4px; }
    .popular-topics-section .topic-name { margin:0; font-size:12px; text-align:center; }
    .popular-topics-section .topic-item em { min-width:28px; padding:2px 5px; font-size:10px; }
    .video-section { margin:0 22px 26px; }
    .video-grid { display:flex; gap:16px; overflow-x:auto; width:100%; min-width:0; max-width:100%; }
    .video-card { flex:0 0 254px; scroll-snap-align:start; }
    .video-play { width:40px; height:40px; }
}

/* Featured story slider */
.featured-slider { position:relative; margin-bottom:28px; overflow:hidden; border-radius:4px; }
.featured-track { display:flex; transition:transform 0.55s ease; }
.featured-slider .featured-story { flex:0 0 100%; min-width:100%; margin:0; border-radius:4px; }
.featured-dots { position:absolute; bottom:14px; left:50%; transform:translateX(-50%); display:flex; gap:6px; z-index:3; }
.featured-dot { width:22px; height:5px; padding:0; border:0; border-radius:999px; background:rgba(255,255,255,0.45); cursor:pointer; transition:background 0.2s ease; }
.featured-dot.is-active { background:var(--accent); }

/* Popular topics: sport icons */
.topic-item::before { content:none; }
.topic-item { position:relative; display:flex; align-items:center; gap:12px; min-height:36px; padding:4px 0; }
.topic-icon { width:27px; height:27px; flex:0 0 27px; display:flex; align-items:center; justify-content:center; border:2px solid var(--accent); border-radius:50%; color:var(--accent); }
.topic-svg { width:15px; height:15px; }
.topic-name { margin-right:auto; }
.topic-item .topic-icon { margin-right:0; }
.topic-icon-more { border:0; gap:2px; }
.topic-icon-more i { width:4px; height:4px; border-radius:50%; background:var(--accent); display:block; }

/* Clock icon beside dates */
.meta-date { display:inline-flex; align-items:center; }
.meta-date-inner { display:inline-flex; align-items:center; gap:5px; }
.meta-icon { width:12px; height:12px; color:currentColor; flex:0 0 12px; }

/* Latest Videos */
.video-section { margin-bottom:34px; }
.video-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.video-card { min-width:0; }
.video-thumb { position:relative; display:block; aspect-ratio:16/9; margin-bottom:12px; overflow:hidden; border-radius:4px; background:var(--surface); background-size:cover; background-position:center; }
.video-thumb .video-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.video-thumb::after { content:""; position:absolute; inset:0; background:rgba(0,0,0,0.22); border-radius:4px; }
.video-play { position:absolute; top:50%; left:50%; z-index:2; width:44px; height:44px; transform:translate(-50%,-50%); border-radius:50%; background:var(--accent); }
.video-play::before { content:""; position:absolute; top:50%; left:52%; width:0; height:0; transform:translate(-50%,-50%); border-left:13px solid #fff; border-top:8px solid transparent; border-bottom:8px solid transparent; }
.video-card h3 { margin:0; font-size:16px; line-height:1.22; font-weight:900; }

/* Newsletter box */
.newsletter-section { margin-bottom:28px; }
.newsletter-box { padding:20px; border-radius:6px; background:var(--dark); color:#fff; }
.newsletter-text { margin:0 0 14px; color:#c9cbd0; font-size:13px; }
.newsletter-form { position:relative; display:flex; flex-direction:column; gap:10px; }
.newsletter-input { width:100%; padding:12px 14px; border:1px solid #444; border-radius:4px; background:#111; color:#fff; font:inherit; font-size:14px; }
.newsletter-input::placeholder { color:#8b8f96; }
.newsletter-button { width:100%; min-height:40px; padding:13px 18px; border:0; border-radius:5px; background:var(--accent); color:#fff; font-weight:900; text-transform:uppercase; font-size:13px; line-height:1.2; cursor:pointer; box-sizing:border-box; }
.newsletter-button:hover { background:#d31f2e; }
.newsletter-msg { margin:0 0 12px; padding:9px 12px; border-radius:4px; font-size:13px; }
.newsletter-msg-success { background:rgba(46,204,113,0.16); color:#7ee2a8; }
.newsletter-msg-error { background:rgba(239,35,51,0.16); color:#ff8b95; }

/* Premium sports typography */
body { font-family: "Helvetica Neue", Helvetica, Arial, "Segoe UI", Roboto, sans-serif; }

/* Premium fallback gradients (used when a post has no featured image) */
.featured-story { background: radial-gradient(120% 110% at 18% 0%, #2a3947 0%, #131a22 48%, #07090c 100%); }
.article-image, .news-image { background: linear-gradient(135deg,#25303a,#11161b); }
.editorial-lead-image, .editorial-item-thumb, .video-thumb { background: linear-gradient(135deg,#25303a,#11161b); }
.category-tile { background: linear-gradient(135deg,#2a3947,#0c1116); }
.featured-story::after { background: linear-gradient(90deg, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.35) 55%, rgba(0,0,0,0.12) 100%); }
.section-title h2 { letter-spacing:0.02em; }
.section-title a { color:var(--accent); transition:opacity 0.15s ease; }
.section-title a:hover { opacity:0.75; }

/* Card meta (byline / time / read) */
.card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:10px 0 0; color:var(--muted); font-size:12px; }
.entry-author { display:inline-flex; align-items:center; gap:7px; font-weight:700; color:var(--text); }
.entry-avatar img { width:22px; height:22px; border-radius:50%; object-fit:cover; }
.card-date, .card-read { color:var(--muted); }

/* Archive card body spacing */
.archive-card { overflow:hidden; border:1px solid var(--border); border-radius:6px; background:var(--card); }
.archive-card { transition:transform 0.2s ease, box-shadow 0.2s ease; }
.archive-card:hover { transform:translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.10); }
.archive-card:focus-within { outline:2px solid var(--accent); outline-offset:3px; }
.archive-card > :not(.article-image) { margin-right:16px; margin-left:16px; }
.archive-card > .post-category { margin-top:12px; }
.archive-card > h3 { margin-top:4px; }
.archive-card > .post-meta { margin-top:10px; }
.archive-card > .post-excerpt { margin-bottom:16px; color:var(--muted); font-size:14px; line-height:1.45; }
.site-search-form { display:flex; max-width:720px; margin:0 auto 28px; gap:10px; }
.site-search-form input { min-width:0; flex:1; padding:13px 15px; border:1px solid var(--border); border-radius:4px; background:var(--card); color:var(--text); font:inherit; }
.site-search-form button { padding:0 20px; border:0; border-radius:4px; background:var(--accent); color:#fff; font-weight:900; text-transform:uppercase; cursor:pointer; }
.archive-layout { display:grid; grid-template-columns:220px minmax(0,1fr) 220px; gap:26px; align-items:start; }
.index-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
.archive-main-column { min-width:0; }
.archive-main-column .article-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.archive-side { min-width:0; }
.archive-side-title { position:relative; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid var(--border); font-size:16px; font-weight:900; text-transform:uppercase; }
.archive-side-title::after { content:""; position:absolute; bottom:-1px; left:0; width:26px; height:2px; background:var(--accent); }
.archive-side-card { margin-bottom:20px; }
.archive-side-image { display:block; aspect-ratio:16/10; margin-bottom:9px; overflow:hidden; border-radius:4px; background:linear-gradient(135deg,#25303a,#11161b); }
.archive-side-image img { width:100%; height:100%; object-fit:cover; }
.archive-side-card h3 { margin:0; font-size:14px; line-height:1.25; font-weight:900; }
.archive-side-card .post-category { margin-bottom:5px; }
.archive-side-card .post-meta { margin-top:6px; }
.sidebar-topic-list { display:grid; gap:0; }
.sidebar-topic-card { display:grid; grid-template-columns:128px minmax(0,1fr); gap:14px; align-items:start; padding:12px 0; border-bottom:1px solid var(--border); }
.sidebar-topic-card:first-child { padding-top:0; }
.sidebar-topic-image { aspect-ratio:16/10; overflow:hidden; border-radius:4px; background:linear-gradient(135deg,#25303a,#11161b); }
.sidebar-topic-image img { width:100%; height:100%; object-fit:cover; }
.sidebar-topic-card h3 { margin:0; font-size:14px; line-height:1.25; font-weight:900; }
.sidebar-topic-card .post-category { margin-bottom:5px; }
.sidebar-topic-card .post-meta { margin-top:6px; }
.sidebar-topic-section .section-title { margin-bottom:10px; }
.sidebar-topic-card { min-height:82px; }
.sidebar-topic-card > div { min-width:0; }
@media screen and (min-width:801px) {
    .archive-side { position:sticky; top:150px; align-self:start; }
}
.archive-card + .archive-card { margin-top:0; }
.archive-header + .article-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.nav-links { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:6px; margin:28px 0 36px; }
.nav-links a, .nav-links span { margin:0; min-width:36px; padding:9px 12px; border:1px solid var(--border); border-radius:4px; text-align:center; }
.nav-links .current { border-color:var(--accent); background:var(--accent); color:#fff; font-weight:900; }

/* Article card hover elevation */
.article-card { background:transparent; transition:transform 0.2s ease; }
.article-card h3 { transition:color 0.15s ease; }
.article-card:hover h3 { color:var(--accent); }
.post-categories { display:flex; flex-wrap:wrap; gap:5px; margin:8px 0 0; }
.post-categories a { color:var(--accent); font-size:10px; font-weight:800; text-transform:uppercase; }
.post-categories a + a::before { content:"/"; margin-right:5px; color:var(--muted); }
.recommended-section { margin:42px auto 36px; }
.recommended-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }

/* Trending strip */
.trending-strip { display:flex; align-items:center; gap:16px; margin-top:26px; padding:12px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.trending-label { flex:0 0 auto; padding:5px 12px; border-radius:4px; background:var(--accent); color:#fff; font-size:11px; font-weight:900; text-transform:uppercase; }
.trending-list { display:flex; flex-wrap:wrap; gap:8px 14px; }
.trending-tag { color:var(--text); font-size:13px; font-weight:800; }
.trending-tag::before { content:"#"; color:var(--accent); margin-right:3px; }
.trending-tag:hover { color:var(--accent); }

/* Editorial category sections */
.editorial-section { margin:38px auto 0; padding-bottom:28px; border-bottom:1px solid var(--border); }
.editorial-section .section-title h2 { text-transform:none; font-size:22px; }
.editorial-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:26px; align-items:start; }
.editorial-lead { grid-column:1; grid-row:1; min-width:0; }
.editorial-list { grid-column:2; display:grid; gap:0; min-width:0; }
.editorial-lead-image { display:block; aspect-ratio:16/10; max-height:300px; margin-bottom:12px; overflow:hidden; border-radius:6px; background:var(--surface); }
.editorial-lead-image img { width:100%; height:100%; object-fit:cover; transition:transform 0.35s ease; }
.editorial-lead:hover .editorial-lead-image img { transform:scale(1.05); }
.editorial-lead h3 { margin:0; font-size:clamp(20px,2.2vw,25px); line-height:1.15; font-weight:900; }
.editorial-lead h3 a:hover { color:var(--accent); }
.editorial-excerpt { margin:10px 0 0; color:var(--muted); font-size:15px; }
.editorial-item { display:grid; grid-template-columns:96px minmax(0,1fr); gap:14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--border); }
.editorial-item:first-of-type { padding-top:0; }
.editorial-item.no-thumb { grid-template-columns:1fr; }
.editorial-item-thumb { aspect-ratio:16/10; overflow:hidden; border-radius:4px; background:var(--surface); }
.editorial-item-thumb img { width:100%; height:100%; object-fit:cover; }
.editorial-item-body h4 { margin:2px 0 0; font-size:15px; line-height:1.25; font-weight:800; }
.editorial-item-body h4 a:hover { color:var(--accent); }
.editorial-item .post-meta { margin-top:5px; }
.editorial-item .post-category { margin-bottom:0; }
.editorial-list { padding-left:0; }
.editorial-item:hover h4 a { color:var(--accent); }
.editorial-carousel { position:relative; }
.section-title-actions { display:flex; align-items:center; gap:14px; }
.editorial-controls { display:flex; align-items:center; gap:6px; }
.editorial-nav { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:50%; background:transparent; color:var(--text); font-size:18px; line-height:1; cursor:pointer; transition:opacity .2s ease, background .2s ease, color .2s ease; }
.editorial-nav:hover { background:var(--accent); border-color:var(--accent); color:#fff; }
.editorial-nav[disabled] { opacity:0.3; pointer-events:none; }
.editorial-grid { scroll-behavior:smooth; }

/* Magazine (WooCommerce) carousel section — subtly highlighted panel */
.magazine-section {
    margin: 34px auto 0;
    padding: 22px 24px 26px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(239, 35, 51, 0.06), rgba(239, 35, 51, 0.015));
}
.magazine-section .section-title { margin-bottom: 16px; }
.magazine-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    margin-right: 9px;
    border-radius: 4px;
    background: var(--accent);
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    vertical-align: middle;
}

/* Always a horizontal scroll-snap carousel, at every breakpoint,
   regardless of what .editorial-grid does elsewhere. */
.magazine-grid {
    display: flex !important;
    gap: 18px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 4px 2px 10px;
}
.magazine-grid::-webkit-scrollbar { display: none; }
.magazine-grid > .magazine-item {
    flex: 0 0 168px;
    scroll-snap-align: start;
}
@media (min-width: 600px) {
    .magazine-grid > .magazine-item { flex-basis: 190px; }
}
@media (min-width: 1000px) {
    .magazine-grid > .magazine-item { flex-basis: 210px; }
}

.magazine-item { display: block; }
.magazine-thumb {
    position: relative;
    display: block;
    aspect-ratio: 3 / 4;
    overflow: hidden;
    border-radius: 6px;
    background: var(--surface);
    border: 1px solid var(--border);
    margin-bottom: 10px;
}
/* Full magazine cover shown, never cropped — same rule as the rest of
   the shop's product images. */
.magazine-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: var(--surface);
}
.magazine-item-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2;
    padding: 3px 8px;
    border-radius: 3px;
    background: var(--accent);
    color: #fff;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.magazine-item-body h4 {
    margin: 0 0 4px;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;
}
.magazine-item-body h4 a:hover { color: var(--accent); }
.magazine-item-price {
    font-size: 13px;
    font-weight: 700;
    color: var(--accent);
    margin-bottom: 9px;
}
.magazine-item-price del { color: var(--muted); font-weight: 400; margin-right: 6px; }
.magazine-item-price ins { text-decoration: none; }
.magazine-item-cta {
    display: inline-block;
    padding: 7px 14px;
    border-radius: 4px;
    border: 1px solid var(--text);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    transition: background 0.15s ease, color 0.15s ease;
}
.magazine-item-cta:hover { background: var(--text); color: var(--background); }

@media (max-width: 800px) {
    .magazine-section { margin: 26px 16px 0; padding: 18px 16px 20px; }
    .magazine-section .section-title-actions { gap: 8px; }
    .magazine-section .section-title-actions > a { width: 72px; overflow: hidden; font-size: 0; white-space: nowrap; }
    .magazine-section .section-title-actions > a::after { content: "View All  >"; font-size: 11px; }
}

/* Compact editorial fillers for the main column */
.spotlight-section, .briefs-section { margin-top:30px; }
.spotlight-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.spotlight-card { min-width:0; }
.spotlight-thumb { display:block; aspect-ratio:16/9; margin-bottom:9px; overflow:hidden; border-radius:5px; background:linear-gradient(135deg,#25303a,#11161b); }
.spotlight-thumb img { width:100%; height:100%; object-fit:cover; }
.spotlight-card h3 { margin:0; font-size:15px; line-height:1.2; font-weight:900; }
.briefs-list { border-top:1px solid var(--border); }
.brief-item { display:grid; grid-template-columns:100px minmax(0,1fr) auto; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid var(--border); }
.brief-category { color:var(--accent); font-size:10px; font-weight:900; text-transform:uppercase; }
.brief-item strong { font-size:14px; line-height:1.2; }
.brief-item small { color:var(--muted); font-size:11px; white-space:nowrap; }
.radar-section { margin-top:30px; }
.radar-list { display:grid; grid-template-columns:1fr 1fr; gap:0 24px; border-top:1px solid var(--border); }
.radar-item { display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; align-items:start; padding:12px 0; border-bottom:1px solid var(--border); }
.radar-number { color:var(--accent); font-size:18px; font-weight:900; }
.radar-item small { display:block; margin-bottom:3px; color:var(--accent); font-size:9px; font-weight:900; text-transform:uppercase; }
.radar-item strong { display:block; font-size:13px; line-height:1.2; }
.spotlight-section, .briefs-section, .radar-section { display:none; }
.more-stories-section { margin-top:34px; }
.more-stories-list { display:grid; gap:14px; }
.more-story-item { display:grid; grid-template-columns:150px minmax(0,1fr); gap:14px; align-items:center; padding-bottom:14px; border-bottom:1px solid var(--border); }
.more-story-item:last-child { border-bottom:0; }
.more-story-thumb { aspect-ratio:16/10; overflow:hidden; border-radius:5px; background:linear-gradient(135deg,#25303a,#11161b); }
.more-story-thumb img { width:100%; height:100%; object-fit:cover; }
.more-story-body h3 { margin:0 0 5px; font-size:15px; line-height:1.22; font-weight:900; }
.more-story-body .post-meta { margin-top:0; }
.more-stories-intro { margin:-4px 0 16px; color:var(--muted); font-family:"PT Serif",Georgia,serif; font-size:14px; line-height:1.45; }
.channel-videos-section { margin-bottom:38px; }
.video-tabs { display:flex; gap:8px; margin:-4px 0 18px; }
.video-tabs button { padding:8px 14px; border:0; border-radius:6px; background:var(--surface); color:var(--text); font-size:12px; font-weight:800; cursor:pointer; }
.video-tabs button.is-active, .video-tabs button:hover { background:var(--accent); color:#fff; }
.channel-video-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }

/* Force dark container fallbacks even before the placeholder img loads */
.article-image, .news-image, .editorial-lead-image, .editorial-item-thumb, .video-thumb {
    background: linear-gradient(135deg,#25303a,#11161b);
}

/* Final mobile overrides (kept last so they win over later base rules) */
@media (max-width:800px) {
    .site-main { padding:22px 20px 0; }
    .site-main > .site-container { width:100%; max-width:100%; margin-right:0; margin-left:0; }
    .home-layout { width:100%; max-width:100%; }
    .featured-slider { margin-right:0; margin-left:0; }
    .latest-news-section, .latest-articles-section, .popular-topics-section { margin-right:0; margin-left:0; }
    .video-section, .editorial-section, .trending-strip, .featured-categories { margin-right:0; margin-left:0; }
    .video-section { margin:0 22px 26px; }
    .video-grid { display:flex !important; gap:16px; width:100%; min-width:0; max-width:100%; overflow-x:auto; scroll-snap-type:x mandatory; }
    .video-card { flex:0 0 262px; min-width:262px; scroll-snap-align:start; }
    .trending-strip { margin:0 22px; }
    .trending-list { flex-wrap:nowrap; overflow-x:auto; width:100%; min-width:0; }
    .trending-tag { white-space:nowrap; }
    .editorial-section { margin:26px 16px 0; }
    .editorial-grid { grid-template-columns:1fr; gap:18px; }
    .editorial-lead { grid-column:1; grid-row:auto; }
    .editorial-list { grid-column:1; }
    .editorial-item { grid-column:1; grid-row:auto; grid-template-columns:110px minmax(0,1fr); }
    .article-card .card-meta { margin-left:14px; margin-right:14px; margin-bottom:14px; }
    .card-meta { gap:7px; font-size:11px; }
    .recommended-grid { display:flex; overflow-x:auto; gap:16px; }
    .recommended-grid .article-card { flex:0 0 254px; }
    .spotlight-grid { display:flex; overflow-x:auto; gap:16px; }
    .spotlight-card { flex:0 0 220px; }
    .brief-item { grid-template-columns:72px minmax(0,1fr); gap:8px; }
    .brief-item small { grid-column:2; }
    .radar-list { grid-template-columns:1fr; }
    .more-story-item { grid-template-columns:110px minmax(0,1fr); }
    .channel-video-grid { display:flex; overflow-x:auto; gap:16px; }
    .channel-video-grid .video-card { flex:0 0 250px; }
}

@media (max-width:800px) {
    .site-main { padding-right:20px; padding-left:20px; }
    .site-main > .site-container,
    .home-layout,
    .featured-slider,
    .video-section,
    .trending-strip,
    .featured-categories,
    .editorial-section,
    .latest-news-section,
    .latest-articles-section,
    .popular-topics-section { width:100%; max-width:100%; margin-right:0; margin-left:0; }
    .archive-header + .article-grid { grid-template-columns:none; }
    .site-logo small { display:block; width:max-content; max-width:none; white-space:nowrap; font-size:9px; letter-spacing:1px; }
    .header-main { display:flex !important; justify-content:space-between; }
    .header-main .site-logo { position:absolute; top:50%; left:50%; z-index:1; width:max-content; transform:translate(-50%,-50%); }
    .header-main .mobile-menu-button { position:relative; z-index:2; }
    .header-main .header-actions { position:relative; z-index:2; margin-left:auto; }
}

/* Minimal editorial type scale */
body { font-family:Roboto, Arial, sans-serif; font-size:15px; }
h1, h2, h3, h4, h5, h6, .main-navigation a, .post-category, .section-title a, button { font-family:"Roboto Condensed", Arial, sans-serif; letter-spacing:-0.01em; }
.main-navigation a { font-size:12px; letter-spacing:0.02em; }
.section-title h2 { font-size:16px; letter-spacing:0.04em; }
.featured-content h1 { font-size:clamp(28px,3.4vw,42px); line-height:1.08; }
.featured-content .post-excerpt { font-size:14px; line-height:1.5; }
.article-card h3, .video-card h3 { font-size:15px; line-height:1.25; }
.news-item h3 { font-size:14px; }
.post-category { font-size:10px; letter-spacing:0.06em; }
.card-meta, .post-meta { font-size:11px; }
.editorial-section .section-title h2 { font-size:18px; }
.editorial-lead h3 { font-size:clamp(19px,2vw,23px); }
.post-excerpt, .editorial-excerpt, .single-content { font-family:"PT Serif", Georgia, serif; }
.editorial-item-body h4 { font-size:14px; }
.trending-tag { font-size:12px; }

@media (max-width:800px) {
    .featured-content h1 { font-size:clamp(26px,7vw,34px); }
    .section-title h2 { font-size:15px; }
    .main-navigation a { font-size:12px; }
    .article-card h3, .video-card h3 { font-size:14px; }
    .news-item h3 { font-size:16px; }
    .sidebar-topic-card { grid-template-columns:38% minmax(0,1fr); }
    .sidebar-topic-section { margin-bottom:22px; }
    .sidebar-topic-card { gap:12px; padding:10px 0; }
    .sidebar-topic-card h3 { font-size:14px; line-height:1.2; }
    .sidebar-topic-section { padding-top:14px; }
    .sidebar-topic-section .section-title { padding-bottom:10px; }
    .sidebar-topic-card { padding:14px 0; }
}

/* Compact title scale */
.featured-content h1 { font-size:clamp(26px,3vw,38px); }
.article-card h3, .video-card h3 { font-size:14px; }
.archive-card h3 { font-size:15px; line-height:1.2; }
.archive-side-card h3 { font-size:13px; }
.editorial-lead h3 { font-size:clamp(18px,1.8vw,22px); }
.editorial-item-body h4 { font-size:13px; }
.single-header h1, .archive-header h1, .author-info h1 { font-size:clamp(32px,4vw,46px); }

@media (max-width:800px) {
    .featured-content h1 { font-size:clamp(24px,6.5vw,30px); }
    .archive-card h3 { font-size:14px; }
    .single-header h1, .archive-header h1, .author-info h1 { font-size:32px; }
}

/* Compact four-card category carousel */
.editorial-grid { display:flex; gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding:4px 2px; }
.editorial-grid::-webkit-scrollbar { display:none; }
.editorial-grid > * { flex:0 0 calc((100% - 80px)/6); scroll-snap-align:start; }
.editorial-item { display:block; padding:0; border:0; min-width:0; }
.editorial-item-thumb { display:block; width:100%; aspect-ratio:16/10; margin-bottom:8px; }
.editorial-item-body h4 { font-size:13px; line-height:1.25; }

@media (max-width:800px) {
    .editorial-grid { gap:14px; }
    .editorial-grid > * { flex:0 0 200px; }
}

@media (max-width:800px) {
    .footer-bottom .site-container { display:flex; flex-direction:column; align-items:center; gap:6px; padding-right:16px; padding-left:16px; }
    .footer-bottom .site-container > span,
    .footer-credit,
    .footer-legal { text-align:center; display:block; }
    .footer-legal { display:flex !important; justify-content:center; flex-wrap:wrap; gap:8px 16px; }
    .footer-bottom a { margin:0; }
}

@media screen and (max-width:800px) {
    .header-main { width:100% !important; max-width:none !important; margin-right:0 !important; margin-left:0 !important; }
    .header-main .site-logo { left:50% !important; transform:translate(-50%,-50%) !important; }
}

@media (max-width:800px) {
    .featured-slider { order:1; }
    .latest-articles-section { order:2; }
    .sidebar-topic-1 { order:3; }
    .latest-news-section { order:4; }
    .sidebar-topic-0 { order:5; }
    .more-stories-section { order:6; }
    .popular-topics-section { order:7; }
    .newsletter-section { order:8; }
}



/* SSI FANZINE FINAL SMART HEADER
   Same header design at all times:
   visible at top -> hide on downward scroll -> show on upward scroll. */
.site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    /* No permanent transform here (only .is-hidden gets one below). A
       transform applied at all times — even translate3d(0,0,0) — puts the
       header's compositing layer between the mobile menu and the page,
       which is a well-known cause of the menu's touch/momentum scroll
       being silently ignored on iOS Safari and other WebKit browsers. */
    transition: transform 320ms ease, box-shadow 320ms ease !important;
    will-change: transform;
}

.site-header.is-hidden {
    transform: translate3d(0, -105%, 0) !important;
    box-shadow: none !important;
}

@media screen and (max-width: 800px) {
    .site-header {
        position: sticky !important;
        top: 0 !important;
    }

    .site-header.is-hidden {
        transform: translate3d(0, -105%, 0) !important;
    }

    /* Do not change the fixed bottom mobile navigation. */
    .bottom-tab-bar {
        position: fixed;
    }
}

@media screen and (min-width: 801px) {
    .site-header {
        position: sticky !important;
        top: 0 !important;
    }
}


/* SSI FANZINE — FINAL MOBILE MENU
   The mobile menu lives inside .site-header. Because the smart header uses
   transform for the slide animation, a fixed child can become trapped inside
   the transformed header. Use an absolute overlay below the header instead. */
@media screen and (max-width: 800px) {
    .site-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 1000 !important;
        overflow: visible !important;
    }

    .site-header.is-hidden {
        transform: translate3d(0, -105%, 0) !important;
    }

    .mobile-navigation {
        display: none !important;
        position: absolute !important;
        top: 100% !important;
        right: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-height: calc(100vh - 170px) !important;
        height: auto !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
        background: var(--header-bg, #fff) !important;
        border-top: 1px solid var(--border) !important;
        box-shadow: 0 18px 35px rgba(0,0,0,.16) !important;
        z-index: 1100 !important;
        -webkit-overflow-scrolling: touch;
        /* The locked body below sets touch-action:none, which also disables
           touch panning on descendants unless they opt back in — without
           this the menu can't be swipe-scrolled on a real touch device. */
        touch-action: pan-y !important;
        overscroll-behavior: contain !important;
    }

    .mobile-navigation.is-open {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .mobile-navigation .site-container {
        display: grid !important;
        gap: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        /* Extra bottom padding so the last links (Videos, More, Search,
           Shop) can scroll clear of the fixed bottom-tab-bar, which sits
           on top of the menu (z-index 1200 vs 1100) and would otherwise
           visually hide them even though they're still reachable. */
        padding: 8px 16px calc(20px + 156px + max(8px, env(safe-area-inset-bottom))) !important;
        box-sizing: border-box !important;
    }

    .mobile-navigation a {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        min-height: 48px !important;
        padding: 14px 0 !important;
        border-bottom: 1px solid var(--border) !important;
        font-weight: 800 !important;
        color: var(--text) !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    /* Keep the mobile quick-navigation above the expanded menu. */
    .bottom-tab-bar {
        position: fixed !important;
        z-index: 1200 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
    }

    body.mobile-menu-open {
        overflow: hidden !important;
        touch-action: none !important;
    }
}


/* WooCommerce cart navigation */
.nav-cart-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.nav-cart-icon, .bottom-tab-cart-icon {
    font-size: 17px;
    line-height: 1;
}
.nav-cart-count, .bottom-cart-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 999px;
    background: #ed1c2e;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}
@media screen and (max-width: 800px) {
    .main-navigation .nav-cart-link { display: none !important; }
    .mobile-navigation .mobile-nav-cart-link {
        display: flex !important;
        align-items: center;
        gap: 8px;
        min-height: 48px;
        padding: 14px 0;
    }
    .bottom-tab-cart { position: relative; }
    .bottom-tab-cart .bottom-cart-count {
        position: absolute;
        top: 4px;
        right: 10px;
        min-width: 15px;
        height: 15px;
        font-size: 9px;
    }
}


/* SSI FANZINE DESKTOP CART ONLY */
@media screen and (min-width: 801px) {
    .main-navigation .nav-cart-link {
        display: inline-flex !important;
        align-items: center;
        gap: 6px;
        white-space: nowrap;
    }
    .main-navigation .nav-cart-icon {
        font-size: 17px;
        line-height: 1;
    }
    .main-navigation .nav-cart-count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 17px;
        height: 17px;
        padding: 0 4px;
        border-radius: 999px;
        background: #ed1c2e;
        color: #fff;
        font-size: 10px;
        font-weight: 800;
        line-height: 1;
    }
}


/* SSI FANZINE post subtitle */
.ssi-fanzine-subtitle {
    margin: 8px 0 20px;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 400;
    color: #666;
}


/* SSI FANZINE AUTHOR AVATAR ROUND FIX */
.ssi-author-avatar,
.ssi-author-avatar img,
.author-header .author-avatar,
.author-header .author-avatar img,
.author-profile .author-avatar,
.author-profile .author-avatar img,
.author-box .author-avatar,
.author-box .author-avatar img {
    border-radius: 50% !important;
    overflow: hidden;
}

.ssi-author-avatar img,
.author-header .author-avatar img,
.author-profile .author-avatar img,
.author-box .author-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* SSI FANZINE CARD AUTHOR AVATAR */
.ssi-card-author-avatar {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    overflow: hidden !important;
}

/* SSI FANZINE 28PX CARD AUTHOR AVATAR */
.featured-author .ssi-card-author-avatar,
.featured-author img.avatar {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: inline-block !important;
    vertical-align: middle !important;
}


/* SSI FANZINE SITEWIDE AUTHOR AVATAR CONSISTENCY */
.ssi-card-author-avatar,
.ssi-author-avatar,
.featured-author img,
.post-meta img.avatar,
.post-author img.avatar,
.author-meta img.avatar,
.author-info img.avatar,
.entry-author img.avatar,
.author-box img.avatar,
.author-header img.avatar,
.author-profile img.avatar,
.post-card img.avatar,
.article-card img.avatar {
    border-radius: 50% !important;
    object-fit: cover !important;
    overflow: hidden !important;
    display: inline-block;
}

.ssi-card-author-avatar {
    width: 32px !important;
    height: 32px !important;
}

.ssi-author-avatar {
    width: 120px !important;
    height: 120px !important;
}


/* =========================================================
 * SSI FANZINE AUTHORS DIRECTORY
 * ========================================================= */
.ssi-authors-page {
    padding: 54px 0 70px;
    background: var(--background);
    color: var(--text);
}

.ssi-authors-heading {
    border-bottom: 1px solid var(--border);
    margin-bottom: 30px;
    padding-bottom: 22px;
}

.ssi-authors-heading .post-category {
    margin-bottom: 8px;
}

.ssi-authors-heading h1 {
    margin: 0 0 8px;
    color: var(--text);
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1;
}

.ssi-authors-heading p {
    margin: 0;
    color: var(--muted);
    font-size: 16px;
}

.ssi-authors-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.ssi-author-card {
    display: flex;
    gap: 22px;
    padding: 24px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    transition: transform .2s ease, box-shadow .2s ease;
}

.ssi-author-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px var(--shadow);
}

.ssi-author-card-avatar {
    flex: 0 0 120px;
    width: 120px;
    height: 120px;
}

.ssi-author-directory-avatar {
    width: 120px !important;
    height: 120px !important;
    min-width: 120px !important;
    min-height: 120px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: block !important;
}

.ssi-author-card-content {
    min-width: 0;
}

.ssi-author-card-content .post-category {
    margin-bottom: 7px;
}

.ssi-author-card-content h2 {
    margin: 0 0 9px;
    color: var(--text);
    font-size: 25px;
    line-height: 1.1;
}

.ssi-author-card-content h2 a {
    color: var(--text);
    text-decoration: none;
}

.ssi-author-card-content p {
    margin: 0 0 14px;
    color: var(--muted);
    line-height: 1.55;
}

.ssi-author-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    color: var(--muted);
}

.ssi-author-card-meta a {
    color: var(--accent);
    font-weight: 700;
    text-decoration: none;
}

.ssi-authors-empty {
    padding: 50px 0;
    color: var(--muted);
    text-align: center;
}

@media (max-width: 800px) {
    .ssi-authors-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .ssi-author-card {
        padding: 18px;
        gap: 16px;
    }

    .ssi-author-card-avatar {
        flex-basis: 86px;
        width: 86px;
        height: 86px;
    }

    .ssi-author-directory-avatar {
        width: 86px !important;
        height: 86px !important;
        min-width: 86px !important;
        min-height: 86px !important;
    }

    .ssi-author-card-content h2 {
        font-size: 21px;
    }

    .ssi-author-card-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}


/* SSI FANZINE SEO breadcrumbs */
.ssi-breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 auto 18px;max-width:var(--content-width,1200px);padding:0 20px;font-size:.82rem;line-height:1.4}
.ssi-breadcrumbs a{color:inherit;text-decoration:none;opacity:.75}
.ssi-breadcrumbs a:hover{text-decoration:underline;opacity:1}
.ssi-breadcrumbs span:last-child{opacity:.62}
@media (max-width:640px){.ssi-breadcrumbs{padding:0 14px;gap:6px;font-size:.78rem}.ssi-breadcrumbs span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55vw}}

/* =========================================================
 * SSI FANZINE — Premium single article layout
 * Three-column editorial layout on desktop; clean single column on mobile.
 * ========================================================= */
.single-layout {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr) 260px;
    gap: 26px;
    align-items: start;
    margin-top: 4px;
}

.single-main-column {
    min-width: 0;
}

.single-main-column .ssi-breadcrumbs {
    margin-bottom: 18px;
}

.single-layout .single-article {
    max-width: none;
    margin: 0;
}

.single-layout .single-header {
    margin-bottom: 22px;
    padding-bottom: 18px;
}

.single-layout .single-header h1 {
    font-size: clamp(34px, 3.5vw, 52px);
    line-height: 1.03;
}

.single-layout .single-featured-image {
    margin: 0 auto 26px;
    max-width: 100%;
    border: 1px solid var(--border);
    background: var(--surface);
}

.single-layout .single-featured-image img {
    display: block;
    width: 100%;
    max-height: 430px;
    object-fit: cover;
    object-position: center;
}

.single-layout .single-content {
    max-width: 760px;
    font-size: 17px;
    line-height: 1.72;
}

.single-layout .single-content p {
    margin-bottom: 24px;
}

.single-layout .single-content h2 {
    margin: 34px 0 14px;
    font-size: 26px;
    font-weight: 900;
}

.single-layout .single-content h3 {
    margin: 28px 0 12px;
    font-size: 21px;
    font-weight: 900;
}

.single-sidebar {
    min-width: 0;
}

.single-side-section {
    margin-bottom: 28px;
    padding: 16px;
    border: 1px solid var(--border);
    background: var(--card);
}

.single-side-section .section-title {
    margin-bottom: 12px;
}

.single-side-list {
    display: grid;
    gap: 0;
}

.single-side-story {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
}

.single-side-story:first-child {
    padding-top: 0;
}

.single-side-story:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.single-side-thumb {
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 4px;
    background: var(--surface);
}

.single-side-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.single-side-story .post-category,
.editor-pick-story .post-category {
    margin-bottom: 3px;
    font-size: 9px;
}

.single-side-story h3,
.editor-pick-story h3 {
    margin: 0;
    font-size: 13px;
    line-height: 1.22;
    font-weight: 900;
}

.single-side-story h3 a:hover,
.editor-pick-story h3 a:hover,
.single-category-link:hover {
    color: var(--accent);
}

.single-side-story .post-meta {
    margin-top: 5px;
    font-size: 10px;
}

.single-category-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 0;
    border-bottom: 1px solid var(--border);
    font-size: 12px;
    font-weight: 700;
}

.single-category-link:last-child {
    border-bottom: 0;
}

.single-category-link strong {
    color: var(--accent);
    font-size: 11px;
}

.single-social-links {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.single-social-links a {
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 1;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    transition: background .15s ease, color .15s ease, transform .15s ease;
}

.single-social-links a:hover {
    background: var(--accent);
    color: #fff;
    transform: translateY(-2px);
}

.single-social-links .social-svg {
    width: 19px;
    height: 19px;
}

.single-sidebar .newsletter-section {
    margin-bottom: 28px;
    padding: 0;
    border: 0;
    background: transparent;
}

.single-sidebar .newsletter-section .section-title {
    padding: 0 0 10px;
}

.single-sidebar .newsletter-box {
    padding: 16px;
    border: 1px solid var(--border);
    background: var(--card);
}

.single-sidebar .newsletter-text {
    margin: 0 0 12px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.5;
}

.editor-pick-list {
    gap: 18px;
}

.editor-pick-story {
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border);
}

.editor-pick-story:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.editor-pick-thumb {
    display: block;
    aspect-ratio: 16 / 9;
    margin-bottom: 8px;
    overflow: hidden;
    border-radius: 4px;
    background: var(--surface);
}

.editor-pick-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.single-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.single-tags a {
    padding: 6px 8px;
    border: 1px solid var(--border);
    border-radius: 4px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
}

.single-tags a:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.contextual-links {
    max-width: 760px;
    margin: 36px auto 0;
    padding-top: 22px;
    border-top: 1px solid var(--border);
}

.contextual-link-list {
    display: grid;
    gap: 8px;
}

.contextual-link {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 11px 12px;
    border: 1px solid var(--border);
    background: var(--surface);
}

.contextual-link .post-category {
    margin: 0;
    font-size: 9px;
}

.contextual-link strong {
    font-size: 13px;
    line-height: 1.25;
}

.contextual-link:hover strong {
    color: var(--accent);
}

@media (max-width: 1120px) {
    .single-layout {
        grid-template-columns: 190px minmax(0, 1fr) 220px;
        gap: 18px;
    }

    .single-layout .single-header h1 {
        font-size: clamp(32px, 3.8vw, 46px);
    }
}

@media (max-width: 900px) {
    .single-layout {
        grid-template-columns: minmax(0, 1fr) 250px;
    }

    .single-sidebar-left {
        display: none;
    }
}

@media (max-width: 800px) {
    .single-layout {
        display: block;
        width: 100%;
        margin-top: 0;
    }

    .single-layout .single-header h1 {
        font-size: 32px;
    }

    .single-layout .single-featured-image img {
        max-height: 300px;
    }

    .single-layout .single-content {
        max-width: none;
        font-size: 16px;
        line-height: 1.65;
    }

    .single-sidebar-right {
        display: grid;
        grid-template-columns: 1fr;
        margin-top: 30px;
    }

    .single-side-section,
    .single-sidebar .newsletter-section {
        margin-bottom: 20px;
    }

    .contextual-links {
        margin-top: 28px;
    }
}


/* SSI FANZINE — Article typography refinement v1.4 */
@media (min-width: 801px) {
    .single-layout {
        grid-template-columns: 220px minmax(0, 1fr) 260px;
        gap: 24px;
    }

    .single-layout .single-header {
        margin-bottom: 18px;
        padding-bottom: 14px;
    }

    .single-layout .single-header h1 {
        font-family: "Roboto Condensed", Arial, sans-serif;
        font-size: clamp(30px, 2.45vw, 38px);
        line-height: 1.08;
        letter-spacing: -0.45px;
        margin-bottom: 10px;
        max-width: 780px;
    }

    .single-layout .ssi-fanzine-subtitle {
        max-width: 740px;
        margin: 0 0 14px;
        font-family: "Roboto", Arial, sans-serif;
        font-size: 16px;
        line-height: 1.5;
        font-weight: 400;
        color: var(--muted);
    }

    .single-layout .single-meta {
        font-family: "Roboto", Arial, sans-serif;
        font-size: 12px;
        line-height: 1.4;
    }

    .single-layout .single-featured-image {
        max-width: 760px;
        margin: 0 auto 24px;
        border-radius: 4px;
        overflow: hidden;
    }

    .single-layout .single-featured-image img {
        width: 100%;
        max-height: 360px;
        object-fit: cover;
        object-position: center;
    }

    .single-layout .single-content,
    .single-layout .single-content p {
        font-family: "Roboto", Arial, Helvetica, sans-serif;
    }

    .single-layout .single-content {
        max-width: 760px;
        font-size: 15.5px;
        line-height: 1.68;
        letter-spacing: 0;
    }

    .single-layout .single-content p {
        margin: 0 0 20px;
    }

    .single-layout .single-content h2 {
        margin: 30px 0 10px;
        font-family: "Roboto Condensed", Arial, sans-serif;
        font-size: 22px;
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: -0.2px;
    }

    .single-layout .single-content h3 {
        margin: 24px 0 9px;
        font-family: "Roboto Condensed", Arial, sans-serif;
        font-size: 18px;
        line-height: 1.25;
        font-weight: 800;
    }
}

@media (max-width: 800px) {
    .single-layout .single-header h1 {
        font-family: "Roboto Condensed", Arial, sans-serif;
        font-size: 29px;
        line-height: 1.08;
        letter-spacing: -0.25px;
    }

    .single-layout .ssi-fanzine-subtitle {
        font-family: "Roboto", Arial, sans-serif;
        font-size: 15px;
        line-height: 1.5;
    }

    .single-layout .single-featured-image img {
        max-height: 280px;
    }

    .single-layout .single-content {
        font-family: "Roboto", Arial, Helvetica, sans-serif;
        font-size: 15px;
        line-height: 1.65;
    }

    .single-layout .single-content h2 {
        font-size: 21px;
        line-height: 1.2;
    }

    .single-layout .single-content h3 {
        font-size: 18px;
    }
}

/* Footer credit: keep the signature compact and remove artificial spacing. */
.footer-bottom .site-container {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0;
    text-align: center;
}

.footer-bottom .site-container > span {
    display: inline;
}

.footer-bottom .site-container > span + span::before {
    content: " | ";
    margin: 0 8px;
    color: var(--muted);
}

.footer-credit {
    text-align: center;
}

.footer-bottom a {
    margin-left: 0;
}

@media (max-width: 800px) {
    .footer-bottom .site-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 0;
        padding-right: 12px;
        padding-left: 12px;
    }

    .footer-bottom .site-container > span {
        display: inline;
        margin-top: 0;
    }

    .footer-credit {
        display: inline;
        margin: 0;
    }

    .footer-legal {
        display: inline-flex !important;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0;
    }

    .footer-legal a {
        margin: 0;
    }

    .footer-bottom .site-container > span + span::before {
        margin: 0 6px;
    }
}


/* =========================================================
   SSI FANZINE - Custom Login
   ========================================================= */
.header-login-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 30px;
    padding: 7px 13px;
    border: 1px solid var(--accent);
    border-radius: 3px;
    background: var(--accent);
    color: #fff !important;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .35px;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    transition: opacity .15s ease, transform .15s ease;
}

.header-login-button:hover,
.header-login-button:focus-visible {
    color: #fff !important;
    opacity: .88;
    transform: translateY(-1px);
}

.mobile-login-link {
    font-weight: 900 !important;
    color: var(--accent) !important;
}

.ssi-login-page {
    min-height: calc(100vh - 220px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 58px 20px 72px;
    background:
        radial-gradient(circle at 50% 0%, rgba(239, 35, 51, .10), transparent 38%),
        var(--background);
}

.ssi-login-shell {
    width: min(100%, 430px);
    text-align: center;
}

.ssi-login-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 auto;
    max-width: 280px;
}

.ssi-login-rule {
    height: 2px;
    flex: 1;
    background: var(--text);
}

.ssi-login-ssi {
    color: var(--accent);
    font-family: "Times New Roman", Georgia, serif;
    font-size: 36px;
    font-weight: 900;
    line-height: 1;
}

.ssi-login-title {
    margin-top: 4px;
    color: var(--text);
    font-size: 25px;
    font-weight: 900;
    letter-spacing: .34em;
    line-height: 1;
    text-transform: uppercase;
}

.ssi-login-kicker {
    margin: 10px 0 24px;
    color: var(--muted);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.ssi-login-card {
    padding: 30px;
    border: 1px solid var(--border);
    border-radius: 5px;
    background: var(--card);
    box-shadow: 0 18px 50px var(--shadow);
    text-align: left;
}

.ssi-login-card-heading {
    margin-bottom: 22px;
}

.ssi-login-label {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--accent);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.ssi-login-card h1 {
    margin: 0 0 6px;
    color: var(--text);
    font-size: 28px;
    line-height: 1.05;
    font-weight: 900;
}

.ssi-login-card-heading p {
    margin: 0;
    color: var(--muted);
    font-family: "Roboto", Arial, sans-serif;
    font-size: 13px;
    line-height: 1.5;
}

#ssi-loginform {
    margin: 0;
}

#ssi-loginform label {
    display: block;
    margin-bottom: 7px;
    color: var(--text);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
}

#ssi-loginform input[type="text"],
#ssi-loginform input[type="email"],
#ssi-loginform input[type="password"] {
    width: 100%;
    min-height: 43px;
    margin: 0 0 15px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 3px;
    background: var(--background);
    color: var(--text);
    font-family: "Roboto", Arial, sans-serif;
    font-size: 14px;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}

#ssi-loginform input[type="text"]:focus,
#ssi-loginform input[type="email"]:focus,
#ssi-loginform input[type="password"]:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(239, 35, 51, .10);
}

#ssi-loginform .login-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 17px;
}

#ssi-loginform .login-remember label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    color: var(--muted);
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
}

#ssi-loginform .login-remember input {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: var(--accent);
}

#ssi-loginform .login-submit {
    margin: 0;
}

#ssi-loginform input[type="submit"] {
    width: 100%;
    min-height: 43px;
    padding: 10px 16px;
    border: 1px solid var(--accent);
    border-radius: 3px;
    background: var(--accent);
    color: #fff;
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .6px;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity .15s ease, transform .15s ease;
}

#ssi-loginform input[type="submit"]:hover,
#ssi-loginform input[type="submit"]:focus-visible {
    opacity: .9;
    transform: translateY(-1px);
}

.ssi-login-links {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid var(--border);
    text-align: center;
}

.ssi-login-links a {
    color: var(--muted);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
}

.ssi-login-links a:hover {
    color: var(--accent);
}

.ssi-login-back {
    display: inline-block;
    margin-top: 20px;
    color: var(--muted);
    font-family: "Roboto Condensed", Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.ssi-login-back:hover {
    color: var(--accent);
}

@media (max-width: 800px) {
    .ssi-login-page {
        min-height: calc(100vh - 170px);
        padding: 42px 16px 56px;
    }

    .ssi-login-card {
        padding: 24px 20px;
    }

    .ssi-login-card h1 {
        font-size: 25px;
    }

    .header-login-button {
        min-height: 28px;
        padding: 6px 10px;
        font-size: 10px;
    }
}


/* SSI FANZINE - COMPACT SIDEBAR */
@media (min-width: 901px) {
  .single-post .sidebar-left .trending-item,
  .single-post .left-sidebar .trending-item,
  .single-post .sidebar .trending-item {
    padding: 7px 0;
    gap: 9px;
  }

  .single-post .sidebar-left .trending-item img,
  .single-post .left-sidebar .trending-item img,
  .single-post .sidebar .trending-item img {
    width: 58px;
    height: 58px;
    object-fit: cover;
  }

  .single-post .sidebar-left .trending-item h3,
  .single-post .left-sidebar .trending-item h3,
  .single-post .sidebar .trending-item h3 {
    font-size: 10.5px;
    line-height: 1.2;
    margin-bottom: 2px;
  }

  .single-post .sidebar-left .trending-item .date,
  .single-post .left-sidebar .trending-item .date,
  .single-post .sidebar .trending-item .date {
    font-size: 8.5px;
  }

  .single-post .sidebar-left .widget,
  .single-post .left-sidebar .widget {
    margin-bottom: 10px;
  }

  /* Categories: compact 2-column layout */
  .single-post .sidebar-left .widget_categories ul,
  .single-post .left-sidebar .widget_categories ul,
  .single-post .sidebar-left .categories-list,
  .single-post .left-sidebar .categories-list,
  .single-post .sidebar-left .category-list,
  .single-post .left-sidebar .category-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 12px;
  }

  .single-post .sidebar-left .widget_categories li,
  .single-post .left-sidebar .widget_categories li,
  .single-post .sidebar-left .cat-item,
  .single-post .left-sidebar .cat-item,
  .single-post .sidebar-left .categories-list li,
  .single-post .left-sidebar .categories-list li {
    padding: 5px 0;
    margin: 0;
    font-size: 10px;
    line-height: 1.25;
  }
}

@media (max-width: 900px) {
  .single-post .sidebar-left .widget_categories ul,
  .single-post .left-sidebar .widget_categories ul,
  .single-post .sidebar-left .categories-list,
  .single-post .left-sidebar .categories-list {
    grid-template-columns: 1fr 1fr;
  }
}

/* SSI FANZINE — Compact right sidebar */
@media (min-width: 901px) {
  .single-layout {
    grid-template-columns: 220px minmax(0, 1fr) 255px;
    gap: 22px;
  }

  .single-sidebar-right .single-side-section {
    margin-bottom: 18px;
    padding: 15px;
  }

  .single-sidebar-right .single-side-section .section-title {
    margin-bottom: 10px;
    padding-bottom: 8px;
  }

  .single-sidebar-right .single-social-links {
    gap: 8px;
  }

  .single-sidebar-right .single-social-links a {
    min-height: 42px;
  }

  .single-sidebar-right .single-social-links .social-svg {
    width: 17px;
    height: 17px;
  }

  .single-sidebar-right .newsletter-section {
    margin-bottom: 18px;
  }

  .single-sidebar-right .newsletter-section .section-title {
    padding-bottom: 7px;
  }

  .single-sidebar-right .newsletter-box {
    padding: 15px;
  }

  .single-sidebar-right .newsletter-text {
    margin-bottom: 9px;
    font-size: 12px;
    line-height: 1.4;
  }

  .single-sidebar-right .newsletter-box input[type="email"],
  .single-sidebar-right .newsletter-box input[type="text"] {
    min-height: 40px;
    padding: 9px 11px;
    font-size: 12px;
  }

  .single-sidebar-right .newsletter-box button,
  .single-sidebar-right .newsletter-box input[type="submit"] {
    min-height: 40px;
    padding: 9px 11px;
    font-size: 12px;
  }

  .single-sidebar-right .editor-pick-list {
    gap: 12px;
  }

  .single-sidebar-right .editor-pick-story {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    column-gap: 11px;
    row-gap: 4px;
    padding-bottom: 12px;
  }

  .single-sidebar-right .editor-pick-thumb {
    grid-column: 1;
    grid-row: 1 / span 3;
    width: 112px;
    height: 70px;
    margin: 0;
    overflow: hidden;
  }

  .single-sidebar-right .editor-pick-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .single-sidebar-right .editor-pick-story .post-category {
    grid-column: 2;
    margin: 0;
    font-size: 8.5px;
    line-height: 1.1;
  }

  .single-sidebar-right .editor-pick-story h3 {
    grid-column: 2;
    font-size: 12px;
    line-height: 1.25;
  }

  .single-sidebar-right .single-tags {
    gap: 6px;
  }

  .single-sidebar-right .single-tags a {
    padding: 5px 7px;
    font-size: 9.5px;
  }
}

@media (max-width: 900px) {
  .single-sidebar-right .editor-pick-story {
    display: block;
  }

  .single-sidebar-right .editor-pick-thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    margin-bottom: 7px;
  }
}

/* ==========================================================
   SSI FANZINE Custom Social Media Share Buttons
   ========================================================== */

.ssi-share-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
}

.ssi-share-bar-top {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  flex-wrap: wrap;
}

.ssi-share-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--muted);
}

.ssi-share-buttons {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.ssi-share-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  text-decoration: none;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  box-sizing: border-box;
  padding: 0;
}

.ssi-share-btn svg {
  width: 16px;
  height: 16px;
  display: block;
  fill: currentColor;
  transition: transform 0.2s ease;
}

.ssi-share-btn:hover {
  transform: translateY(-2px);
}

.ssi-share-btn:hover svg {
  transform: scale(1.08);
}

/* Specific Network Hover Styles */
.ssi-share-btn-whatsapp:hover {
  background: #25d366 !important;
  color: #ffffff !important;
  border-color: #25d366 !important;
  box-shadow: 0 4px 14px rgba(37, 211, 102, 0.35);
}

.ssi-share-btn-x:hover {
  background: #000000 !important;
  color: #ffffff !important;
  border-color: #000000 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

:root[data-theme="dark"] .ssi-share-btn-x:hover {
  background: #ffffff !important;
  color: #000000 !important;
  border-color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(255, 255, 255, 0.25);
}

.ssi-share-btn-facebook:hover {
  background: #1877f2 !important;
  color: #ffffff !important;
  border-color: #1877f2 !important;
  box-shadow: 0 4px 14px rgba(24, 119, 242, 0.35);
}

.ssi-share-btn-linkedin:hover {
  background: #0a66c2 !important;
  color: #ffffff !important;
  border-color: #0a66c2 !important;
  box-shadow: 0 4px 14px rgba(10, 102, 194, 0.35);
}

.ssi-share-btn-telegram:hover {
  background: #229ed9 !important;
  color: #ffffff !important;
  border-color: #229ed9 !important;
  box-shadow: 0 4px 14px rgba(34, 158, 217, 0.35);
}

.ssi-share-btn-email:hover {
  background: #ea4335 !important;
  color: #ffffff !important;
  border-color: #ea4335 !important;
  box-shadow: 0 4px 14px rgba(234, 67, 53, 0.35);
}

.ssi-share-btn-copy:hover {
  background: var(--dark) !important;
  color: #ffffff !important;
  border-color: var(--dark) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

:root[data-theme="dark"] .ssi-share-btn-copy:hover {
  background: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
  box-shadow: 0 4px 14px rgba(239, 35, 51, 0.35);
}

.ssi-share-btn-copy.is-copied {
  background: #10b981 !important;
  color: #ffffff !important;
  border-color: #10b981 !important;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4) !important;
  transform: scale(1.05);
}

/* Tooltip on Copy */
.ssi-copy-tooltip {
  position: absolute;
  bottom: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: #10b981;
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  z-index: 10;
}

.ssi-copy-tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 4px;
  border-style: solid;
  border-color: #10b981 transparent transparent transparent;
}

.ssi-share-btn-copy.is-copied .ssi-copy-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Bottom Share Box */
.ssi-share-box {
  margin: 36px 0 24px;
  padding: 20px 22px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 4px solid var(--accent);
  border-radius: 6px;
  display: block;
}

.ssi-share-box-header {
  margin-bottom: 14px;
}

.ssi-share-box-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ssi-share-box-title h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  color: var(--text);
  letter-spacing: -0.2px;
}

.ssi-share-box-icon {
  color: var(--accent);
  flex-shrink: 0;
}

.ssi-share-box-desc {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--muted);
  line-height: 1.4;
}

.ssi-share-buttons-bottom {
  gap: 10px;
}

.ssi-share-btn-pill {
  width: auto;
  height: auto;
  padding: 7px 14px;
  border-radius: 30px;
  gap: 7px;
  background: var(--card);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.1px;
}

.ssi-share-btn-pill svg {
  width: 15px;
  height: 15px;
}

.ssi-share-btn-pill .ssi-share-btn-label {
  display: inline-block;
  line-height: 1;
}

/* Mobile Responsive */
@media (max-width: 680px) {
  .ssi-share-bar-top {
    gap: 8px;
  }

  .ssi-share-bar-top .ssi-share-btn {
    width: 34px;
    height: 34px;
  }

  .ssi-share-box {
    padding: 16px;
    margin: 28px 0 20px;
  }

  .ssi-share-box-title h3 {
    font-size: 16px;
  }

  .ssi-share-buttons-bottom {
    gap: 8px;
  }

  .ssi-share-btn-pill {
    padding: 6px 11px;
    font-size: 11.5px;
  }

  .ssi-share-btn-pill svg {
    width: 14px;
    height: 14px;
  }
}



/* Social share: accessibility + mobile robustness */
.ssi-share-btn:focus-visible,
.ssi-share-btn-pill:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.ssi-share-buttons-bottom {
  min-width: 0;
}

@media (max-width: 480px) {
  .ssi-share-bar-top {
    align-items: flex-start;
  }

  .ssi-share-bar-top .ssi-share-buttons {
    flex: 1 1 100%;
  }

  .ssi-share-buttons-bottom {
    display: flex;
    width: 100%;
  }

  .ssi-share-btn-pill {
    max-width: 100%;
  }
}

/* ==========================================================
   Interactive WooCommerce Magazine Store & Shopping Suite
   ========================================================== */

.magazine-section {
  position: relative;
}

.magazine-section-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 14px;
}

.section-subtitle {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--muted);
  font-weight: 400;
  line-height: 1.4;
}

/* 1. Interactive Filter Pills */
.magazine-filter-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 18px 0;
  padding-bottom: 2px;
}

.magazine-filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
}

.magazine-filter-pill:hover {
  background: var(--border);
  color: var(--text);
  transform: translateY(-1px);
}

.magazine-filter-pill.is-active {
  background: var(--dark) !important;
  color: #ffffff !important;
  border-color: var(--dark) !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

:root[data-theme="dark"] .magazine-filter-pill.is-active {
  background: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
}

.magazine-filter-pill .filter-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1px 6px;
  border-radius: 10px;
  font-size: 10px;
  background: rgba(0, 0, 0, 0.1);
}

.magazine-filter-pill.is-active .filter-count {
  background: rgba(255, 255, 255, 0.25);
  color: #ffffff;
}

/* 2. Interactive Magazine Item Cards */
.magazine-item {
  display: block;
  transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.25s ease;
}

.magazine-thumb-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  margin-bottom: 10px;
  box-shadow: 0 4px 14px var(--shadow);
}

.magazine-thumb {
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
}

.magazine-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.magazine-item:hover .magazine-thumb img {
  transform: scale(1.06);
}

.magazine-format-pill {
  position: absolute;
  bottom: 8px;
  left: 8px;
  z-index: 2;
  padding: 3px 7px;
  border-radius: 4px;
  font-size: 9.5px;
  font-weight: 800;
  background: rgba(10, 17, 40, 0.85);
  color: #ffffff;
  backdrop-filter: blur(4px);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.magazine-item-badge.is-sale {
  background: var(--accent);
}

.magazine-item-badge.is-new {
  background: #10b981;
}

/* Hover Action Buttons Overlay */
.magazine-hover-actions {
  position: absolute;
  inset: 0;
  background: rgba(10, 17, 40, 0.55);
  backdrop-filter: blur(3px);
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 14px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.magazine-thumb-wrap:hover .magazine-hover-actions {
  opacity: 1;
  visibility: visible;
}

.magazine-action-btn {
  width: 100%;
  max-width: 130px;
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 11.5px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  text-decoration: none;
}

.js-quick-view-btn {
  background: #ffffff;
  color: #0b132b;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.js-quick-view-btn:hover {
  background: #f0f0f0;
  transform: translateY(-2px);
}

.magazine-action-cart {
  background: var(--accent);
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(239, 35, 51, 0.4);
}

.magazine-action-cart:hover {
  background: #d81c2b;
  transform: translateY(-2px);
}

.magazine-action-cart .action-icon-check {
  display: none;
}

.magazine-action-cart.is-added {
  background: #10b981 !important;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4) !important;
}

.magazine-action-cart.is-added .action-icon-cart {
  display: none;
}

.magazine-action-cart.is-added .action-icon-check {
  display: block;
}

/* Card Body & Meta */
.magazine-item-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.magazine-stock-status {
  font-size: 11px;
  font-weight: 700;
}

.magazine-stock-status.in-stock {
  color: #10b981;
}

.magazine-stock-status.out-stock {
  color: var(--muted);
}

.magazine-card-footer {
  display: flex;
  align-items: center;
  gap: 6px;
}

.magazine-card-footer .magazine-item-cta {
  flex: 1;
  text-align: center;
  padding: 6px 10px;
}

.magazine-cart-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  border-radius: 4px;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}

.magazine-cart-btn:hover {
  background: var(--accent);
  color: #ffffff;
  border-color: var(--accent);
}

.magazine-cart-btn.is-added {
  background: #10b981 !important;
  color: #ffffff !important;
  border-color: #10b981 !important;
}

/* 3. Magazine Perks Strip */
.magazine-perks-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-top: 24px;
  padding: 16px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
}

.magazine-perk-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  color: var(--text);
}

.magazine-perk-item svg {
  color: var(--accent);
  flex-shrink: 0;
}

.magazine-perk-item strong {
  font-weight: 800;
}

/* 4. Quick View Modal */
.ssi-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.ssi-modal.is-open {
  opacity: 1;
  visibility: visible;
}

.ssi-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 5, 10, 0.75);
  backdrop-filter: blur(6px);
}

.ssi-modal-dialog {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 660px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.45);
  overflow: hidden;
  transform: scale(0.94) translateY(12px);
  transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.ssi-modal.is-open .ssi-modal-dialog {
  transform: scale(1) translateY(0);
}

.ssi-modal-close {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 10;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  font-size: 20px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
}

.ssi-modal-close:hover {
  background: var(--dark);
  color: #ffffff;
}

.ssi-modal-body {
  display: grid;
  grid-template-columns: 210px 1fr;
  gap: 24px;
  padding: 26px;
}

.ssi-modal-image-wrap {
  position: relative;
  aspect-ratio: 3 / 4;
  border-radius: 6px;
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--border);
}

.ssi-modal-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ssi-modal-badge {
  position: absolute;
  bottom: 8px;
  left: 8px;
  padding: 3px 8px;
  border-radius: 4px;
  background: rgba(10, 17, 40, 0.9);
  color: #ffffff;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ssi-modal-cat {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: var(--accent);
  margin-bottom: 4px;
}

.ssi-modal-title {
  margin: 0 0 10px 0;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.25;
  color: var(--text);
}

.ssi-modal-price-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.ssi-modal-price {
  font-size: 20px;
  font-weight: 800;
  color: var(--accent);
}

.ssi-modal-price del {
  color: var(--muted);
  font-size: 15px;
  font-weight: normal;
  margin-right: 6px;
}

.ssi-modal-stock {
  font-size: 12px;
  font-weight: 700;
}

.ssi-modal-stock.in-stock {
  color: #10b981;
}

.ssi-modal-stock.out-stock {
  color: #ef2333;
}

.ssi-modal-desc {
  margin: 0 0 16px 0;
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.5;
}

.ssi-modal-highlights {
  display: grid;
  gap: 8px;
  margin-bottom: 20px;
  padding: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
}

.ssi-highlight-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text);
  font-weight: 600;
}

.ssi-highlight-item svg {
  color: var(--accent);
  flex-shrink: 0;
}

.ssi-modal-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.ssi-qty-selector {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface);
  overflow: hidden;
}

.ssi-qty-btn {
  width: 32px;
  height: 38px;
  border: none;
  background: transparent;
  color: var(--text);
  font-size: 16px;
  cursor: pointer;
  transition: background 0.15s ease;
}

.ssi-qty-btn:hover {
  background: var(--border);
}

.ssi-qty-input {
  width: 36px;
  height: 38px;
  border: none;
  background: transparent;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  -moz-appearance: textfield;
}

.ssi-qty-input::-webkit-outer-spin-button,
.ssi-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.ssi-modal-add-btn {
  flex: 1;
  height: 40px;
  padding: 0 20px;
  border-radius: 6px;
  background: var(--accent);
  color: #ffffff;
  border: none;
  font-size: 13.5px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 4px 14px rgba(239, 35, 51, 0.35);
}

.ssi-modal-add-btn:hover {
  background: #d81c2b;
  transform: translateY(-1px);
}

.ssi-modal-add-btn .modal-btn-icon-check {
  display: none;
}

.ssi-modal-add-btn.is-added {
  background: #10b981 !important;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4) !important;
}

.ssi-modal-add-btn.is-added .modal-btn-icon-cart {
  display: none;
}

.ssi-modal-add-btn.is-added .modal-btn-icon-check {
  display: block;
}

.ssi-modal-footer-links {
  border-top: 1px solid var(--border);
  padding-top: 12px;
}

.ssi-modal-detail-link {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: color 0.15s ease;
}

.ssi-modal-detail-link:hover {
  color: var(--accent);
}

/* 5. Cart Slide-in Toast Notification */
.ssi-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999999;
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 4px solid #10b981;
  border-radius: 8px;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.3);
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 16px;
  transform: translateY(140%);
  opacity: 0;
  visibility: hidden;
  transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
  max-width: 440px;
}

.ssi-toast.is-visible {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}

.ssi-toast-content {
  display: flex;
  align-items: center;
  gap: 12px;
}

.ssi-toast-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: rgba(16, 185, 129, 0.15);
  color: #10b981;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ssi-toast-details strong {
  display: block;
  font-size: 13.5px;
  font-weight: 800;
  color: var(--text);
}

.ssi-toast-details span {
  display: block;
  font-size: 12px;
  color: var(--muted);
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ssi-toast-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ssi-toast-btn {
  padding: 6px 11px;
  border-radius: 4px;
  font-size: 11.5px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.15s ease;
}

.ssi-toast-btn-cart {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
}

.ssi-toast-btn-cart:hover {
  background: var(--border);
}

.ssi-toast-btn-checkout {
  background: var(--accent);
  color: #ffffff;
}

.ssi-toast-btn-checkout:hover {
  background: #d81c2b;
}

.ssi-toast-close {
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 18px;
  cursor: pointer;
  padding: 0 4px;
  line-height: 1;
}

.ssi-toast-close:hover {
  color: var(--text);
}

/* Modal and Mobile Responsive */
@media (max-width: 640px) {
  .ssi-modal-body {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 18px;
  }

  .ssi-modal-image-wrap {
    max-width: 160px;
    margin: 0 auto;
  }

  .ssi-modal-title {
    font-size: 17px;
  }

  .ssi-toast {
    left: 16px;
    right: 16px;
    bottom: 76px;
    max-width: none;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .ssi-toast-actions {
    width: 100%;
    justify-content: flex-end;
  }
}

/* ==========================================================================
   SSI FANZINE SHOP ARCHIVE & CATALOG ENHANCEMENTS
   ========================================================================== */

.commerce-shop-archive {
  max-width: 1200px;
  margin: 0 auto 60px;
  padding: 0 20px;
}

.shop-hero-header {
  text-align: center;
  padding: 36px 20px 24px;
  margin-bottom: 24px;
  background: linear-gradient(180deg, rgba(255, 95, 3, 0.05) 0%, rgba(0, 0, 0, 0) 100%);
  border-radius: 12px;
  border-bottom: 1px solid var(--border);
}

.shop-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--accent);
  color: #ffffff;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 14px;
}

.shop-hero-title {
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--text);
  margin: 0 0 10px;
  text-transform: uppercase;
}

.shop-hero-sub {
  font-size: 15px;
  color: var(--muted);
  max-width: 620px;
  margin: 0 auto;
  line-height: 1.5;
}

.shop-perks-strip {
  margin-bottom: 36px;
}

/* Shop Controls (Ordering & Count) */
.woocommerce .woocommerce-result-count {
  float: left;
  margin: 0 0 24px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  line-height: 38px;
}

.woocommerce .woocommerce-ordering {
  float: right;
  margin: 0 0 24px;
}

.woocommerce .woocommerce-ordering select {
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce .woocommerce-ordering select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(255, 95, 3, 0.15);
}

/* Clearfix for shop header controls */
.shop-content-wrapper::before,
.shop-content-wrapper::after {
  content: "";
  display: table;
  clear: both;
}

/* Modern Shop Product Grid */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 24px !important;
  margin: 0 0 40px !important;
  padding: 0 !important;
  list-style: none !important;
  align-items: stretch !important;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
  display: none !important;
}

/* Card: strict flex column so price+buttons always sit at bottom */
.woocommerce ul.products li.product {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 14px !important;
  box-sizing: border-box !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease, border-color 0.25s ease !important;
  position: relative !important;
  overflow: visible !important;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12) !important;
  border-color: rgba(255, 95, 3, 0.4) !important;
}

/* Product link stretches to fill space above the price/button area */
.woocommerce ul.products li.product a.woocommerce-loop-product__link {
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 auto !important;
  text-decoration: none !important;
  color: inherit !important;
}

/* UNIFORM IMAGE CONTAINER — fixed height, object-fit cover */
.woocommerce ul.products li.product a.woocommerce-loop-product__link img {
  display: block !important;
  width: 100% !important;
  height: 220px !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 8px !important;
  margin-bottom: 12px !important;
  background: var(--surface) !important;
  transition: transform 0.3s ease !important;
  flex-shrink: 0 !important;
}

.woocommerce ul.products li.product:hover a.woocommerce-loop-product__link img {
  transform: scale(1.03) !important;
}

/* TITLE — fixed 2-line clamp so price always starts at same Y position */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  color: var(--text) !important;
  margin: 0 0 8px !important;
  /* Clamp to exactly 2 lines */
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  /* Reserve height for exactly 2 lines so price aligns */
  min-height: calc(1.35em * 2) !important;
  max-height: calc(1.35em * 2) !important;
}

/* Explicitly visible, high-contrast price styling — pushed to bottom via flex */
.woocommerce ul.products li.product .price,
.woocommerce div.product .price {
  font-size: 16px !important;
  font-weight: 900 !important;
  color: var(--accent) !important;
  margin: 8px 0 10px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.woocommerce ul.products li.product .price .woocommerce-Price-amount,
.woocommerce div.product .price .woocommerce-Price-amount {
  color: var(--accent) !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
}

.woocommerce ul.products li.product .price del,
.woocommerce div.product .price del {
  font-size: 12px !important;
  color: var(--muted) !important;
  font-weight: 500 !important;
  opacity: 0.7 !important;
}

.woocommerce ul.products li.product .price ins,
.woocommerce div.product .price ins {
  text-decoration: none !important;
  color: var(--accent) !important;
  font-weight: 900 !important;
}

/* Dual Action Buttons — always at bottom of card */
.ssi-loop-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  width: 100% !important;
  margin-top: auto !important;
  padding-top: 4px !important;
  box-sizing: border-box !important;
  /* Pin to bottom by being last flex child */
  align-self: flex-end !important;
}

/* Buy Now Button (Catalog) */
.ssi-btn-buy-now {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  background: var(--accent) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 10px 8px !important;
  border-radius: 8px !important;
  border: none !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

.ssi-btn-buy-now:hover {
  background: #d81c2b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(239, 35, 51, 0.3) !important;
}

/* Add to Cart Button (Catalog) */
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product .button.product_type_simple,
.woocommerce ul.products li.product .button.product_type_variable {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  padding: 10px 8px !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  margin: 0 !important;
  cursor: pointer !important;
  line-height: 1 !important;
}

.woocommerce ul.products li.product .button.add_to_cart_button:hover {
  background: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(255, 95, 3, 0.2) !important;
}

/* Homepage Magazine Card Buy Now & Cart buttons */
.magazine-card-footer {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

.magazine-buy-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  background: var(--accent) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.03em !important;
  padding: 8px 10px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}

.magazine-buy-btn:hover {
  background: #d81c2b !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

.magazine-cart-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  background: var(--surface) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 8px 10px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.magazine-cart-btn:hover {
  background: var(--border) !important;
  color: var(--text) !important;
}

/* Single Product Buy Now Button */
.ssi-single-buy-now {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  background: #10b981 !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 12px 24px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  margin-left: 10px !important;
  vertical-align: middle !important;
  transition: all 0.2s ease !important;
  border: none !important;
  cursor: pointer !important;
}

.ssi-single-buy-now:hover {
  background: #059669 !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.3) !important;
}

/* Modal Buy Now Button */
.ssi-modal-buynow-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  background: #10b981 !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 12px 20px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  flex: 1 1 auto !important;
}

.ssi-modal-buynow-btn:hover {
  background: #059669 !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 14px rgba(16, 185, 129, 0.3) !important;
}

/* Sale Badge on Shop Grid */
.woocommerce ul.products li.product .onsale {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  margin: 0 !important;
  background: #10b981 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  line-height: 1 !important;
  min-height: 0 !important;
  min-width: 0 !important;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3) !important;
  z-index: 2 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .commerce-shop-archive {
    padding: 0 14px;
    margin-bottom: 40px;
  }

  .woocommerce ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }

  .ssi-loop-actions {
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  .shop-hero-header {
    padding: 24px 14px 18px;
  }

  .shop-hero-title {
    font-size: 22px;
  }

  .woocommerce .woocommerce-result-count,
  .woocommerce .woocommerce-ordering {
    float: none;
    width: 100%;
    margin-bottom: 12px;
  }

  .woocommerce .woocommerce-ordering select {
    width: 100%;
  }
}





/* ==========================================================================
   SSI FANZINE SHOP — REFINED PRODUCT CARDS + CATEGORY BROWSER
   ========================================================================== */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  margin: 8px 0 6px !important;
  min-height: 35px;
}
.woocommerce ul.products li.product .price {
  font-size: 15px !important;
  line-height: 1.2 !important;
  margin: 5px 0 10px !important;
  font-weight: 850 !important;
}
.ssi-loop-actions { gap: 7px !important; }
.ssi-btn-buy-now,
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product .button.product_type_simple,
.woocommerce ul.products li.product .button.product_type_variable {
  min-height: 38px !important;
  padding: 9px 8px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.025em !important;
  border-radius: 7px !important;
}
.ssi-btn-buy-now svg { width: 12px !important; height: 12px !important; }

.ssi-shop-categories {
  margin: 0 0 30px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(255,255,255,0.018);
}
.ssi-shop-categories-head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 16px; margin-bottom: 14px;
}
.ssi-shop-section-kicker {
  display:block; color:var(--accent); font-size:10px; font-weight:900;
  text-transform:uppercase; letter-spacing:.12em; margin-bottom:3px;
}
.ssi-shop-categories-head h2 {
  margin:0; color:var(--text); font-size:18px; line-height:1.1; font-weight:850;
}
.ssi-shop-all-link {
  color:var(--text); font-size:11px; font-weight:800; text-decoration:none; white-space:nowrap;
}
.ssi-shop-all-link:hover { color:var(--accent); }
.ssi-shop-category-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:9px;
}
.ssi-shop-category-card {
  position:relative; display:grid; grid-template-columns:25px minmax(0,1fr) auto;
  grid-template-rows:auto auto; align-items:center; column-gap:8px; row-gap:2px;
  min-height:58px; padding:10px 11px; border:1px solid var(--border);
  border-radius:8px; background:var(--surface); color:var(--text); text-decoration:none;
  transition:border-color .18s ease,transform .18s ease,background .18s ease;
}
.ssi-shop-category-card:hover {
  border-color:var(--accent); background:rgba(255,95,3,.055); transform:translateY(-1px);
}
.ssi-shop-category-icon {
  grid-row:1 / span 2; display:grid; place-items:center; width:25px; height:25px;
  border-radius:7px; background:rgba(255,95,3,.1); color:var(--accent); font-size:14px;
}
.ssi-shop-category-name {
  min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  font-size:11px; line-height:1.2; font-weight:800;
}
.ssi-shop-category-count { color:var(--muted); font-size:9px; line-height:1.2; }
.ssi-shop-category-arrow {
  grid-column:3; grid-row:1 / span 2; color:var(--muted); font-size:14px;
  transition:color .18s ease,transform .18s ease;
}
.ssi-shop-category-card:hover .ssi-shop-category-arrow { color:var(--accent); transform:translate(1px,-1px); }

@media (max-width:768px) {
  .ssi-shop-categories { padding:14px; margin-bottom:22px; }
  .ssi-shop-categories-head { align-items:center; }
  .ssi-shop-categories-head h2 { font-size:16px; }
  .ssi-shop-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size:12px !important; }
  .ssi-btn-buy-now,
  .woocommerce ul.products li.product .button.add_to_cart_button,
  .woocommerce ul.products li.product .button.product_type_simple,
  .woocommerce ul.products li.product .button.product_type_variable {
    min-height:36px !important; font-size:10px !important;
  }
}


/* ==========================================================================
   SSI SHOP — PERFECTLY MATCHED CATALOG BUTTON TYPOGRAPHY
   ========================================================================== */
.woocommerce ul.products li.product .ssi-loop-actions > a,
.woocommerce ul.products li.product .ssi-loop-actions > .button,
.woocommerce ul.products li.product .ssi-loop-actions .ssi-btn-buy-now,
.woocommerce ul.products li.product .ssi-loop-actions .add_to_cart_button,
.woocommerce ul.products li.product .ssi-loop-actions .product_type_simple,
.woocommerce ul.products li.product .ssi-loop-actions .product_type_variable {
  height: 38px !important;
  min-height: 38px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  margin: 0 !important;
  padding: 0 8px !important;

  font-family: Arial, "Noto Sans", "Segoe UI", sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.025em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.woocommerce ul.products li.product .ssi-loop-actions > a svg,
.woocommerce ul.products li.product .ssi-loop-actions > a span,
.woocommerce ul.products li.product .ssi-loop-actions > .button svg,
.woocommerce ul.products li.product .ssi-loop-actions > .button span {
  font: inherit !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

.woocommerce ul.products li.product .ssi-loop-actions > .button {
  gap: 5px !important;
}

.woocommerce ul.products li.product .ssi-loop-actions .ssi-btn-buy-now {
  background: var(--accent) !important;
  color: #fff !important;
  border: 1px solid var(--accent) !important;
  border-radius: 7px !important;
}

.woocommerce ul.products li.product .ssi-loop-actions .add_to_cart_button,
.woocommerce ul.products li.product .ssi-loop-actions .product_type_simple,
.woocommerce ul.products li.product .ssi-loop-actions .product_type_variable {
  background: var(--surface) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 7px !important;
}

@media (max-width: 768px) {
  .woocommerce ul.products li.product .ssi-loop-actions > a,
  .woocommerce ul.products li.product .ssi-loop-actions > .button {
    height: 36px !important;
    min-height: 36px !important;
    font-size: 10px !important;
  }
}


/* ==========================================================================
   SSI SHOP — PREVENT PRODUCT TITLE CLIPPING
   ========================================================================== */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  line-height: 1.35 !important;
  margin: 8px 0 6px !important;
}

/* Keep cards aligned while allowing 2–3 line product names. */
.woocommerce ul.products li.product {
  display: flex !important;
  flex-direction: column !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  min-height: 52px !important;
}

.woocommerce ul.products li.product .price {
  margin-top: auto !important;
}

.woocommerce ul.products li.product .ssi-loop-actions {
  margin-top: 2px !important;
}

@media (max-width: 768px) {
  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    min-height: 48px !important;
    line-height: 1.3 !important;
  }
}


/* ==========================================================================
   SSI FANZINE — DARK CHECKOUT INPUT TEXT / PLACEHOLDER FIX
   Force WooCommerce Blocks to use readable SSI colors inside fields.
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  body.woocommerce-checkout .wc-block-components-text-input input,
  body.woocommerce-checkout .wc-block-components-text-input textarea,
  body.woocommerce-checkout .wc-block-components-combobox input,
  body.woocommerce-checkout .wc-block-components-address-form input,
  body.woocommerce-checkout .wc-block-components-address-form select,
  body.woocommerce-checkout .wc-block-components-form input,
  body.woocommerce-checkout .wc-block-components-form select,
  body.woocommerce-checkout .wc-block-components-form textarea {
    color: #f4f4f5 !important;
    -webkit-text-fill-color: #f4f4f5 !important;
    caret-color: #f4f4f5 !important;
    background-color: #181b20 !important;
    border-color: #3a3f47 !important;
  }

  body.woocommerce-checkout .wc-block-components-text-input input::placeholder,
  body.woocommerce-checkout .wc-block-components-text-input textarea::placeholder,
  body.woocommerce-checkout .wc-block-components-combobox input::placeholder,
  body.woocommerce-checkout .wc-block-components-address-form input::placeholder,
  body.woocommerce-checkout .wc-block-components-form input::placeholder,
  body.woocommerce-checkout .wc-block-components-form textarea::placeholder {
    color: #8f98a5 !important;
    -webkit-text-fill-color: #8f98a5 !important;
    opacity: 1 !important;
  }

  /* WooCommerce floating labels */
  body.woocommerce-checkout .wc-block-components-text-input label,
  body.woocommerce-checkout .wc-block-components-combobox label,
  body.woocommerce-checkout .wc-block-components-address-form label,
  body.woocommerce-checkout .wc-block-components-form label {
    color: #aeb6c2 !important;
    opacity: 1 !important;
  }

  body.woocommerce-checkout .wc-block-components-text-input input:focus,
  body.woocommerce-checkout .wc-block-components-text-input textarea:focus,
  body.woocommerce-checkout .wc-block-components-combobox input:focus,
  body.woocommerce-checkout .wc-block-components-address-form input:focus,
  body.woocommerce-checkout .wc-block-components-address-form select:focus,
  body.woocommerce-checkout .wc-block-components-form input:focus,
  body.woocommerce-checkout .wc-block-components-form select:focus,
  body.woocommerce-checkout .wc-block-components-form textarea:focus {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background-color: #1c2026 !important;
    border-color: #ef2333 !important;
    box-shadow: 0 0 0 2px rgba(239,35,51,.14) !important;
  }

  /* Country/state selected values and native select options */
  body.woocommerce-checkout .wc-block-components-combobox .components-combobox-control__input,
  body.woocommerce-checkout select {
    color: #f4f4f5 !important;
    -webkit-text-fill-color: #f4f4f5 !important;
    background-color: #181b20 !important;
  }

  body.woocommerce-checkout select option {
    color: #f4f4f5 !important;
    background: #181b20 !important;
  }
}


/* ==========================================================================
   SSI FANZINE — CHECKOUT MODE ISOLATION
   Keep light mode light; apply dark field styling only to active dark mode.
   ========================================================================== */

/* LIGHT MODE: explicitly restore WooCommerce's light checkout controls. */
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"]) {
  background: #fff !important;
  color: #111 !important;
}

body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-text-input input,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-text-input textarea,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-combobox input,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-address-form input,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-address-form select,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-form input,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-form select,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-form textarea {
  background: #fff !important;
  color: #111 !important;
  -webkit-text-fill-color: #111 !important;
  border-color: #8a8a8a !important;
  caret-color: #111 !important;
}

body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-text-input input::placeholder,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-text-input textarea::placeholder,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-address-form input::placeholder,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-form input::placeholder {
  color: #777 !important;
  -webkit-text-fill-color: #777 !important;
  opacity: 1 !important;
}

body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-text-input label,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-address-form label,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
  .wc-block-components-form label {
  color: #555 !important;
}

/* DARK MODE: support the common selectors used by the theme toggle. */
body.dark-mode.woocommerce-checkout,
body.dark-theme.woocommerce-checkout,
body.woocommerce-checkout.dark-mode,
body.woocommerce-checkout.dark-theme,
body.woocommerce-checkout[data-theme="dark"] {
  background: #0d0f12 !important;
  color: #f4f4f5 !important;
}

body.dark-mode.woocommerce-checkout .wc-block-components-text-input input,
body.dark-mode.woocommerce-checkout .wc-block-components-text-input textarea,
body.dark-mode.woocommerce-checkout .wc-block-components-combobox input,
body.dark-mode.woocommerce-checkout .wc-block-components-address-form input,
body.dark-mode.woocommerce-checkout .wc-block-components-address-form select,
body.dark-mode.woocommerce-checkout .wc-block-components-form input,
body.dark-mode.woocommerce-checkout .wc-block-components-form select,
body.dark-mode.woocommerce-checkout .wc-block-components-form textarea,
body.dark-theme.woocommerce-checkout .wc-block-components-text-input input,
body.dark-theme.woocommerce-checkout .wc-block-components-text-input textarea,
body.dark-theme.woocommerce-checkout .wc-block-components-combobox input,
body.dark-theme.woocommerce-checkout .wc-block-components-address-form input,
body.dark-theme.woocommerce-checkout .wc-block-components-address-form select,
body.dark-theme.woocommerce-checkout .wc-block-components-form input,
body.dark-theme.woocommerce-checkout .wc-block-components-form select,
body.dark-theme.woocommerce-checkout .wc-block-components-form textarea,
body.woocommerce-checkout.dark-mode .wc-block-components-text-input input,
body.woocommerce-checkout.dark-mode .wc-block-components-text-input textarea,
body.woocommerce-checkout.dark-mode .wc-block-components-combobox input,
body.woocommerce-checkout.dark-mode .wc-block-components-address-form input,
body.woocommerce-checkout.dark-mode .wc-block-components-address-form select,
body.woocommerce-checkout.dark-mode .wc-block-components-form input,
body.woocommerce-checkout.dark-mode .wc-block-components-form select,
body.woocommerce-checkout.dark-mode .wc-block-components-form textarea,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-text-input input,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-text-input textarea,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-combobox input,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-address-form input,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-address-form select,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-form input,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-form select,
body.woocommerce-checkout[data-theme="dark"] .wc-block-components-form textarea {
  background: #181b20 !important;
  color: #f4f4f5 !important;
  -webkit-text-fill-color: #f4f4f5 !important;
  border-color: #3a3f47 !important;
  caret-color: #f4f4f5 !important;
}

body.dark-mode.woocommerce-checkout .wc-block-components-text-input input::placeholder,
body.dark-mode.woocommerce-checkout .wc-block-components-text-input textarea::placeholder,
body.dark-mode.woocommerce-checkout .wc-block-components-address-form input::placeholder,
body.dark-mode.woocommerce-checkout .wc-block-components-form input::placeholder,
body.dark-theme.woocommerce-checkout .wc-block-components-text-input input::placeholder,
body.dark-theme.woocommerce-checkout .wc-block-components-text-input textarea::placeholder,
body.dark-theme.woocommerce-checkout .wc-block-components-address-form input::placeholder,
body.dark-theme.woocommerce-checkout .wc-block-components-form input::placeholder {
  color: #8f98a5 !important;
  -webkit-text-fill-color: #8f98a5 !important;
  opacity: 1 !important;
}

body.dark-mode.woocommerce-checkout .wc-block-components-text-input label,
body.dark-mode.woocommerce-checkout .wc-block-components-address-form label,
body.dark-mode.woocommerce-checkout .wc-block-components-form label,
body.dark-theme.woocommerce-checkout .wc-block-components-text-input label,
body.dark-theme.woocommerce-checkout .wc-block-components-address-form label,
body.dark-theme.woocommerce-checkout .wc-block-components-form label {
  color: #aeb6c2 !important;
}

body.dark-mode.woocommerce-checkout .wc-block-components-text-input input:focus,
body.dark-mode.woocommerce-checkout .wc-block-components-address-form input:focus,
body.dark-mode.woocommerce-checkout .wc-block-components-form input:focus,
body.dark-theme.woocommerce-checkout .wc-block-components-text-input input:focus,
body.dark-theme.woocommerce-checkout .wc-block-components-address-form input:focus,
body.dark-theme.woocommerce-checkout .wc-block-components-form input:focus {
  border-color: #ef2333 !important;
  box-shadow: 0 0 0 2px rgba(239,35,51,.14) !important;
}

/* ========================================================================
   SSI FANZINE — CHECKOUT DARK MODE / HEADER SYNC FIX
   The theme stores the active mode on <html data-theme="dark">, not on
   <body>. The previous checkout rules checked body for data-theme, which
   caused the dark checkout page to retain WooCommerce's white background
   and made the header/navigation unreadable.
   ======================================================================== */

:root[data-theme="dark"] body.woocommerce-checkout,
:root[data-theme="dark"] body.woocommerce-checkout .site-main,
:root[data-theme="dark"] body.woocommerce-checkout .commerce-shell {
    background: #0d0f12 !important;
    color: #f4f4f5 !important;
}

/* Keep the complete SSI header dark on checkout, including the nav row
   that WooCommerce/theme defaults can otherwise paint white. */
:root[data-theme="dark"] body.woocommerce-checkout .site-header,
:root[data-theme="dark"] body.woocommerce-checkout .header-main,
:root[data-theme="dark"] body.woocommerce-checkout .nav-shell,
:root[data-theme="dark"] body.woocommerce-checkout .nav-row,
:root[data-theme="dark"] body.woocommerce-checkout .site-ticker {
    background: #101216 !important;
    color: #f4f4f5 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .main-navigation a,
:root[data-theme="dark"] body.woocommerce-checkout .header-search,
:root[data-theme="dark"] body.woocommerce-checkout .utility-navigation a,
:root[data-theme="dark"] body.woocommerce-checkout .site-logo,
:root[data-theme="dark"] body.woocommerce-checkout .site-logo small,
:root[data-theme="dark"] body.woocommerce-checkout .ticker-item {
    color: #f4f4f5 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .header-search .search-icon {
    color: #ffffff !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .nav-shell,
:root[data-theme="dark"] body.woocommerce-checkout .site-ticker {
    border-color: #292d33 !important;
}

/* WooCommerce Blocks checkout canvas and order-summary areas. */
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-checkout,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-checkout__form,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-step,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-main,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-sidebar,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-order-summary,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-totals-wrapper,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-order-summary-item,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-place-order {
    background: transparent !important;
    color: #f4f4f5 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-step,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-totals-wrapper,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-order-summary {
    border-color: #292d33 !important;
}

/* Fix all checkout labels, headings and inline text. */
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-step__heading,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-step__heading-content,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-title,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-form label,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-address-form label,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-text-input label,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-totals-item__label,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-totals-item__value,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-order-summary-item__description,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-product-price,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-step__description,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-place-order__terms {
    color: #f4f4f5 !important;
}

/* The quantity badge is a small circular badge overlaid on the product
   thumbnail (showing "1", "2", etc.), not plain text — it was caught by
   the blanket text-color rule above, which set its text to near-white
   without touching its own background. If that background was already
   light, this made the number unreadable — a plain pale circle with
   invisible text sitting on the product thumbnail. Styling it explicitly
   here, with both properties set, fixes that regardless of what its
   original unstyled background was. */
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-order-summary-item__quantity {
    background: var(--accent) !important;
    color: #ffffff !important;
}

/* Inputs: dark surface + clearly readable entered text and placeholders. */
:root[data-theme="dark"] body.woocommerce-checkout input,
:root[data-theme="dark"] body.woocommerce-checkout textarea,
:root[data-theme="dark"] body.woocommerce-checkout select,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-text-input input,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-text-input textarea,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-combobox input,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-address-form input,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-address-form select {
    background: #181b20 !important;
    color: #f4f4f5 !important;
    -webkit-text-fill-color: #f4f4f5 !important;
    border-color: #3a3f47 !important;
    caret-color: #ffffff !important;
}

:root[data-theme="dark"] body.woocommerce-checkout input::placeholder,
:root[data-theme="dark"] body.woocommerce-checkout textarea::placeholder,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-text-input input::placeholder,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-text-input textarea::placeholder,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-address-form input::placeholder {
    color: #9aa3af !important;
    -webkit-text-fill-color: #9aa3af !important;
    opacity: 1 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout select option {
    background: #181b20 !important;
    color: #f4f4f5 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout input:focus,
:root[data-theme="dark"] body.woocommerce-checkout textarea:focus,
:root[data-theme="dark"] body.woocommerce-checkout select:focus {
    border-color: #ef2333 !important;
    box-shadow: 0 0 0 2px rgba(239,35,51,.14) !important;
}

/* Prevent WooCommerce from introducing a white checkout wrapper/card. */
:root[data-theme="dark"] body.woocommerce-checkout .wp-block-woocommerce-checkout,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-form,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-checkout-step__container,
:root[data-theme="dark"] body.woocommerce-checkout .wc-block-components-order-summary__content {
    background: transparent !important;
    color: #f4f4f5 !important;
}

/* ========================================================================
   SSI FANZINE — FINAL CHECKOUT / CART VISUAL + NOTICE FIXES
   ======================================================================== */
:root[data-theme="dark"] body.woocommerce-checkout,
:root[data-theme="dark"] body.woocommerce-checkout .site-main,
:root[data-theme="dark"] body.woocommerce-checkout main.site-main,
:root[data-theme="dark"] body.woocommerce-checkout .commerce-shell {
    background: #0d0f12 !important;
    color: #f4f4f5 !important;
}

/* The main element owns the area between checkout and footer. Keep it dark
   so no white band appears above the footer in dark mode. */
:root[data-theme="dark"] body.woocommerce-checkout main.site-main {
    min-height: 0 !important;
    padding-bottom: 0 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .site-header,
:root[data-theme="dark"] body.woocommerce-checkout .header-top,
:root[data-theme="dark"] body.woocommerce-checkout .header-top-inner,
:root[data-theme="dark"] body.woocommerce-checkout .header-main,
:root[data-theme="dark"] body.woocommerce-checkout .nav-shell,
:root[data-theme="dark"] body.woocommerce-checkout .nav-row,
:root[data-theme="dark"] body.woocommerce-checkout .site-ticker {
    background: #101216 !important;
    color: #f4f4f5 !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .main-navigation a,
:root[data-theme="dark"] body.woocommerce-checkout .main-navigation a span,
:root[data-theme="dark"] body.woocommerce-checkout .nav-cart-link,
:root[data-theme="dark"] body.woocommerce-checkout .nav-cart-icon,
:root[data-theme="dark"] body.woocommerce-checkout .header-search,
:root[data-theme="dark"] body.woocommerce-checkout .header-search svg,
:root[data-theme="dark"] body.woocommerce-checkout .header-search .search-icon,
:root[data-theme="dark"] body.woocommerce-checkout .utility-navigation a,
:root[data-theme="dark"] body.woocommerce-checkout .ticker-item {
    color: #f4f4f5 !important;
    fill: currentColor !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .theme-toggle {
    background: #181b20 !important;
    border-color: #3a3f47 !important;
    color: #fff !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .site-main,
:root[data-theme="dark"] body.woocommerce-checkout .site-main > * {
    border-color: #292d33;
}

/* Never allow the checkout page's trailing main-area margin to reveal a
   white background. */
:root[data-theme="dark"] body.woocommerce-checkout .commerce-shell {
    margin-bottom: 0 !important;
}

/* In light mode preserve the normal white checkout canvas. */
:root:not([data-theme="dark"]) body.woocommerce-checkout,
:root:not([data-theme="dark"]) body.woocommerce-checkout .site-main {
    background: #fff;
    color: #111;
}

/* Success notices are handled once by the SSI cart feedback. Remove
   duplicate WooCommerce success banners that can be produced by the
   classic + Blocks combination. Error/info notices remain untouched. */
.woocommerce-message.ssi-duplicate-cart-notice,
.wc-block-components-notice-banner.ssi-duplicate-cart-notice {
    display: none !important;
}


/* ========================================================================
   SSI FANZINE — CHECKOUT PAGE FINAL POLISH
   1) The commerce shell previously had a 60px bottom margin. On dark
      checkout that margin exposed the light body background as a white band.
   2) The active nav state is now route-aware; Home is no longer forced active.
   ======================================================================== */
:root[data-theme="dark"] body.woocommerce-checkout .site-main {
    background: #0d0f12 !important;
    padding-bottom: 60px !important;
}

:root[data-theme="dark"] body.woocommerce-checkout .commerce-shell {
    margin-bottom: 0 !important;
}

/* Never show a stale add-to-cart success banner twice. The SSI toast/feedback
   is the single visible confirmation mechanism after an add-to-cart action. */
.woocommerce-message,
.wc-block-components-notice-banner.is-success {
    display: none !important;
}

/* Route-aware desktop navigation. */
.main-navigation a.is-active {
    color: var(--accent) !important;
}

.main-navigation .nav-cart-link.is-active {
    color: var(--accent) !important;
}

@media (max-width: 800px) {
    .mobile-navigation a.is-active {
        color: var(--accent) !important;
    }
}

/* ========================================================================
   CHECKOUT DARK MODE — ELIMINATE THE FINAL WHITE GAP
   Some WooCommerce/theme wrappers can sit between .site-main and the footer.
   Paint the entire checkout document canvas dark in dark mode while leaving
   the actual footer/header styling intact.
   ======================================================================== */
html[data-theme="dark"] body.woocommerce-checkout,
html[data-theme="dark"] body.woocommerce-checkout .site-main,
html[data-theme="dark"] body.woocommerce-checkout .site-main::before,
html[data-theme="dark"] body.woocommerce-checkout .site-main::after {
    background-color: #0d0f12 !important;
}

html[data-theme="dark"] body.woocommerce-checkout > .site-main {
    min-height: 100vh !important;
    margin-bottom: 0 !important;
    padding-bottom: 60px !important;
}

/* If an empty wrapper is generated after the main content, do not let it
   reveal the light page background before the black footer begins. */
html[data-theme="dark"] body.woocommerce-checkout > :not(.site-header):not(.site-main):not(.site-footer):not(.footer-bottom):not(.admin-bar):not(.bottom-tab-bar):not(.live-score-fab) {
    background-color: #0d0f12 !important;
}

/* The rule above only catches direct children of <body> — a spacer/
   wrapper div injected one level deeper (e.g. inside .site-main or
   .commerce-shell, which is common for WooCommerce Blocks and Elementor)
   would slip past it entirely and still show its own unstyled light
   background. This applies the same "paint anything unaccounted-for
   dark" approach one level further in, on both of the checkout's actual
   content containers, so a wrapper nested at that depth is covered too. */
html[data-theme="dark"] body.woocommerce-checkout .site-main > :not(script):not(style),
html[data-theme="dark"] body.woocommerce-checkout .commerce-shell > :not(script):not(style) {
    background-color: #0d0f12 !important;
}

html[data-theme="dark"] body.woocommerce-checkout .site-footer,
html[data-theme="dark"] body.woocommerce-checkout .footer-bottom {
    background-color: #050505 !important;
}

/* ========================================================================
   SSI FANZINE — CHECKOUT DARK MODE: NO GAP BETWEEN CONTENT AND FOOTER
   The checkout page can inherit a white margin/spacer from WooCommerce or
   the page builder. Paint the whole transition area dark and remove any
   vertical margin that can expose the page background.
   ======================================================================== */
html[data-theme="dark"] body.woocommerce-checkout {
    background: #0d0f12 !important;
    min-height: 100vh !important;
}

html[data-theme="dark"] body.woocommerce-checkout .site-main {
    background: #0d0f12 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

html[data-theme="dark"] body.woocommerce-checkout .site-main + .site-footer {
    margin-top: 0 !important;
}

/* Catch a real spacer/wrapper immediately before the footer. */
html[data-theme="dark"] body.woocommerce-checkout .site-main ~ *:not(.site-footer):not(.footer-bottom) {
    background: #0d0f12 !important;
}

/* If the visible band is caused by a collapsed/outer margin, extend the dark
   checkout canvas behind it without changing the footer's own black color. */
html[data-theme="dark"] body.woocommerce-checkout .commerce-shell {
    margin-bottom: 0 !important;
}

/* Keep the footer flush against the dark checkout canvas. */
html[data-theme="dark"] body.woocommerce-checkout .site-footer {
    background: #050505 !important;
    margin-top: 0 !important;
}

/* ======================================================================
   SSI FANZINE HOMEPAGE — MAGAZINE SECTION REFINEMENT
   Compact editorial spacing, cleaner hierarchy and balanced card sizing.
   ====================================================================== */
.magazine-section {
    margin-top: 26px !important;
    margin-bottom: 0 !important;
    padding: 16px 18px 18px !important;
    border-radius: 10px !important;
    box-sizing: border-box;
}

.magazine-section-title {
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 11px !important;
    padding: 0 0 10px !important;
}

.magazine-section-title > div:first-child {
    min-width: 0;
}

.magazine-section-title h2 {
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1.15 !important;
    letter-spacing: .035em !important;
}

.magazine-section-title h2::after {
    bottom: -11px !important;
    width: 24px !important;
    height: 2px !important;
}

.magazine-badge {
    padding: 3px 8px !important;
    margin-right: 7px !important;
    border-radius: 3px !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
    letter-spacing: .04em !important;
}

.magazine-section .section-subtitle {
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.magazine-section .section-title-actions {
    flex: 0 0 auto;
    gap: 10px !important;
}

.magazine-section .editorial-controls {
    gap: 4px !important;
}

.magazine-section .editorial-nav {
    width: 25px !important;
    height: 25px !important;
    font-size: 15px !important;
}

.magazine-section .section-title-actions > a {
    font-size: 9px !important;
    letter-spacing: .035em;
    white-space: nowrap;
}

.magazine-filter-bar {
    gap: 6px !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
}

.magazine-filter-pill {
    min-height: 27px;
    padding: 5px 10px !important;
    border-radius: 16px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    letter-spacing: .01em;
}

.magazine-filter-pill .filter-count {
    padding: 1px 5px !important;
    font-size: 9px !important;
}

.magazine-grid {
    gap: 14px !important;
    padding: 0 1px 7px !important;
}

.magazine-grid > .magazine-item {
    flex: 0 0 180px !important;
}

.magazine-thumb-wrap {
    margin-bottom: 7px !important;
    border-radius: 5px !important;
    box-shadow: 0 3px 10px var(--shadow) !important;
}

.magazine-thumb {
    border-radius: 5px !important;
}

.magazine-format-pill {
    bottom: 6px !important;
    left: 6px !important;
    padding: 3px 6px !important;
    font-size: 8.5px !important;
}

.magazine-item-badge {
    top: 6px !important;
    left: 6px !important;
    padding: 3px 6px !important;
    font-size: 8.5px !important;
}

.magazine-item-body h4 {
    margin: 0 0 3px !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
}

.magazine-item-meta {
    gap: 5px !important;
    margin-bottom: 6px !important;
    align-items: baseline !important;
}

.magazine-item-price {
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
}

.magazine-stock-status {
    font-size: 8.5px !important;
    white-space: nowrap;
}

.magazine-card-footer {
    gap: 6px !important;
    margin-top: 7px !important;
}

.magazine-buy-btn,
.magazine-cart-btn {
    min-height: 29px !important;
    padding: 6px 7px !important;
    border-radius: 5px !important;
    font-size: 9px !important;
    line-height: 1 !important;
}

.magazine-perks-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 13px !important;
    padding: 9px 12px !important;
    border-radius: 5px !important;
}

.magazine-perk-item {
    min-width: 0;
    gap: 7px !important;
    font-size: 9px !important;
    line-height: 1.25 !important;
}

.magazine-perk-item svg {
    width: 14px !important;
    height: 14px !important;
}

.magazine-perk-item span {
    min-width: 0;
}

@media (max-width: 800px) {
    .magazine-section {
        margin: 22px 0 0 !important;
        padding: 14px 12px 15px !important;
    }

    .magazine-section-title {
        align-items: flex-start !important;
        margin-bottom: 10px !important;
        padding-bottom: 9px !important;
    }

    .magazine-section .section-subtitle {
        max-width: 70vw;
        font-size: 10px !important;
    }

    .magazine-section .section-title-actions {
        gap: 6px !important;
    }

    .magazine-section .section-title-actions > a {
        width: auto !important;
        font-size: 9px !important;
        overflow: visible !important;
    }

    .magazine-section .editorial-nav {
        width: 23px !important;
        height: 23px !important;
    }

    .magazine-filter-bar {
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scrollbar-width: none;
        padding-bottom: 2px !important;
    }

    .magazine-filter-bar::-webkit-scrollbar { display: none; }

    .magazine-filter-pill {
        flex: 0 0 auto;
    }

    .magazine-grid > .magazine-item {
        flex-basis: 155px !important;
    }

    .magazine-perks-strip {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
        padding: 9px 10px !important;
    }
}

@media (max-width: 520px) {
    .magazine-section {
        margin-top: 18px !important;
        padding: 13px 10px 13px !important;
    }

    .magazine-section-title {
        display: block !important;
    }

    .magazine-section .section-title-actions {
        margin-top: 8px;
        justify-content: space-between;
    }

    .magazine-section .section-subtitle {
        max-width: 100%;
        white-space: normal;
    }

    .magazine-grid > .magazine-item {
        flex-basis: 145px !important;
    }
}


/* ======================================================================
   SSI FANZINE HOMEPAGE — MAGAZINE STORE FINAL LAYOUT
   Static magazine grid (not a slider/carousel) + tighter section spacing.
   ====================================================================== */
.magazine-section {
    margin: 18px auto 0 !important;
    padding: 11px 14px 12px !important;
    border-radius: 9px !important;
}

.magazine-section-title {
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
    padding: 0 0 8px !important;
}

.magazine-section-title h2 {
    font-size: 16px !important;
    line-height: 1.1 !important;
}

.magazine-section .section-subtitle {
    margin: 3px 0 0 !important;
    font-size: 10.5px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
}

.magazine-section .section-title-actions {
    gap: 0 !important;
}

/* The magazine section is a normal grid, not a horizontal carousel. */
.magazine-section .editorial-carousel {
    overflow: visible !important;
}

.magazine-section .magazine-grid {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 16px !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    scroll-snap-type: none !important;
}

.magazine-section .magazine-grid > .magazine-item {
    min-width: 0 !important;
    width: auto !important;
    flex: initial !important;
    scroll-snap-align: none !important;
}

.magazine-section .magazine-thumb-wrap {
    margin-bottom: 6px !important;
}

.magazine-section .magazine-item-body h4 {
    margin-bottom: 2px !important;
    font-size: 10.5px !important;
    line-height: 1.22 !important;
}

.magazine-section .magazine-item-meta {
    margin-bottom: 5px !important;
}

.magazine-section .magazine-card-footer {
    margin-top: 5px !important;
}

.magazine-section .magazine-perks-strip {
    margin-top: 10px !important;
    padding: 8px 10px !important;
    gap: 8px !important;
}

/* No carousel arrows in the static layout. */
.magazine-section .editorial-controls,
.magazine-section .editorial-nav {
    display: none !important;
}

/* Pull the next homepage section closer to the magazine store. */
.magazine-section + .video-section {
    margin-top: 10px !important;
}

.magazine-section + .video-section .section-title {
    margin-bottom: 12px !important;
}

@media (max-width: 1100px) {
    .magazine-section .magazine-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    .magazine-section .magazine-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 680px) {
    .magazine-section {
        margin-top: 14px !important;
        padding: 10px 10px 11px !important;
    }
    .magazine-section .magazine-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

@media (max-width: 460px) {
    .magazine-section .magazine-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

/* ======================================================================
   SSI FANZINE HOMEPAGE — MAGAZINE LOOPING CAROUSEL
   Clean header spacing + seamless auto-looping product rail.
   ====================================================================== */
.magazine-section {
    margin-top: 20px !important;
    margin-bottom: 0 !important;
    padding: 18px 14px 12px !important;
    overflow: hidden !important;
}

.magazine-section-title {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 16px !important;
    margin: 0 0 10px !important;
    padding: 0 0 11px !important;
    min-height: 58px !important;
    overflow: visible !important;
}

.magazine-section-title > div:first-child {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    overflow: visible !important;
}

.magazine-section-title h2 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.magazine-section .section-subtitle {
    display: block !important;
    margin: 5px 0 0 !important;
    padding: 0 !important;
    font-size: 10.5px !important;
    line-height: 1.45 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.magazine-section .section-title-actions {
    flex: 0 0 auto !important;
    padding-top: 5px !important;
    align-self: flex-start !important;
}

.magazine-section .section-title-actions > a {
    font-size: 9px !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.magazine-section .magazine-filter-bar {
    margin: 0 0 11px !important;
    padding: 0 !important;
}

/* The rail itself is clipped by the viewport, not the individual cards. */
.magazine-section .editorial-carousel {
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
}

.magazine-section .magazine-grid.ssi-magazine-loop-track {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    max-width: none !important;
    gap: 16px !important;
    padding: 0 0 7px !important;
    margin: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    will-change: transform !important;
    transition: none !important;
}

.magazine-section .magazine-grid.ssi-magazine-loop-track > .magazine-item {
    display: block !important;
    flex: 0 0 180px !important;
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    scroll-snap-align: none !important;
}

.magazine-section .magazine-grid.ssi-magazine-loop-track > .magazine-item[data-carousel-clone="1"] {
    /* Clones are real cards so hover, quick view and add-to-bag continue to work. */
}

.magazine-section .magazine-perks-strip {
    margin-top: 10px !important;
    padding: 8px 10px !important;
}

.magazine-section + .video-section {
    margin-top: 9px !important;
}

@media (min-width: 1200px) {
    .magazine-section .magazine-grid.ssi-magazine-loop-track > .magazine-item {
        flex-basis: 180px !important;
    }
}

@media (max-width: 800px) {
    .magazine-section {
        margin-top: 16px !important;
        padding: 15px 10px 11px !important;
    }

    .magazine-section-title {
        min-height: 0 !important;
        gap: 10px !important;
        padding-bottom: 10px !important;
    }

    .magazine-section .section-subtitle {
        white-space: normal !important;
        max-width: 100% !important;
    }

    .magazine-section .magazine-grid.ssi-magazine-loop-track {
        gap: 12px !important;
    }

    .magazine-section .magazine-grid.ssi-magazine-loop-track > .magazine-item {
        flex-basis: 155px !important;
        width: 155px !important;
        min-width: 155px !important;
        max-width: 155px !important;
    }
}

@media (max-width: 520px) {
    .magazine-section-title h2 {
        white-space: normal !important;
    }

    .magazine-section .section-title-actions {
        padding-top: 2px !important;
    }

    .magazine-section .section-title-actions > a {
        font-size: 8.5px !important;
    }
}
\n\n/* ======================================================================\n   SSI FANZINE HOMEPAGE — MAGAZINE HEADER BREATHING ROOM + MANUAL LOOP\n   ====================================================================== */\n.magazine-section-title {\n    padding-top: 6px !important;\n    padding-bottom: 14px !important;\n    margin-bottom: 14px !important;\n    min-height: 58px;\n    box-sizing: border-box;\n}\n\n.magazine-section-title > div:first-child {\n    padding-top: 2px !important;\n    padding-bottom: 3px !important;\n}\n\n.magazine-section-title h2 {\n    line-height: 1.3 !important;\n    min-height: 22px;\n}\n\n.magazine-section .section-subtitle {\n    display: block !important;\n    margin: 7px 0 0 !important;\n    line-height: 1.5 !important;\n    min-height: 17px;\n    white-space: normal !important;\n    overflow: visible !important;\n    text-overflow: clip !important;\n}\n\n.magazine-filter-bar {\n    margin-top: 2px !important;\n    margin-bottom: 14px !important;\n}\n\n.magazine-section .editorial-carousel {\n    overflow: hidden !important;\n    cursor: grab;\n    user-select: none;\n    -webkit-user-select: none;\n    touch-action: pan-y;\n}\n\n.magazine-section .editorial-carousel.is-dragging {\n    cursor: grabbing;\n}\n\n.magazine-section .editorial-carousel.is-dragging a,\n.magazine-section .editorial-carousel.is-dragging button {\n    pointer-events: none;\n}\n\n.magazine-section .magazine-grid {\n    will-change: transform;\n}\n\n@media (max-width: 800px) {\n    .magazine-section-title {\n        padding-top: 5px !important;\n        padding-bottom: 12px !important;\n        min-height: 62px;\n    }\n\n    .magazine-section-title > div:first-child {\n        padding-bottom: 2px !important;\n    }\n\n    .magazine-section .section-subtitle {\n        margin-top: 7px !important;\n        line-height: 1.45 !important;\n    }\n}\n

/* ======================================================================
   SSI FANZINE — MAGAZINE HEADER FINAL VISIBILITY FIX
   Subtitle must never be clipped or sit under the divider.
   ====================================================================== */
.magazine-section .magazine-section-title {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 0 14px !important;
    padding: 8px 0 18px !important;
    border-bottom: 1px solid var(--border) !important;
    overflow: visible !important;
}

.magazine-section .magazine-section-title > div:first-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
}

.magazine-section .magazine-section-title h2 {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
    overflow: visible !important;
}

.magazine-section .magazine-section-title h2::after {
    bottom: -7px !important;
    z-index: 0 !important;
}

.magazine-section .magazine-section-title .section-subtitle {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 9px 0 0 !important;
    padding: 0 !important;
    line-height: 1.6 !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
}

.magazine-section .magazine-section-title .section-title-actions {
    flex: 0 0 auto !important;
    align-self: flex-start !important;
    padding-top: 5px !important;
    margin-left: 18px !important;
}

@media (max-width: 800px) {
    .magazine-section .magazine-section-title {
        padding: 7px 0 16px !important;
        margin-bottom: 12px !important;
    }

    .magazine-section .magazine-section-title .section-subtitle {
        white-space: normal !important;
        line-height: 1.55 !important;
    }

    .magazine-section .magazine-section-title .section-title-actions {
        margin-left: 10px !important;
    }
}



/* ======================================================================
   SSI FANZINE — MAGAZINE CAROUSEL ARROW CONTROLS
   ====================================================================== */
.magazine-section .magazine-carousel-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex: 0 0 auto !important;
}

.magazine-section .magazine-carousel-controls {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.magazine-section .magazine-carousel-controls .editorial-nav {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid var(--border) !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: var(--text) !important;
    font-size: 18px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease !important;
}

.magazine-section .magazine-carousel-controls .editorial-nav:hover {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
}

.magazine-section .magazine-carousel-controls .editorial-nav:active {
    transform: scale(.94) !important;
}

.magazine-section .magazine-carousel-actions > a {
    margin-left: 2px !important;
}

@media (max-width: 800px) {
    /* On phones show one clear "View All Magazines" link; an older
       mobile rule added a second pseudo-element label. */
    .magazine-section .section-title-actions > a::after {
        content: none !important;
        display: none !important;
    }

    .magazine-section .magazine-carousel-actions {
        gap: 8px !important;
    }
    .magazine-section .magazine-carousel-controls {
        gap: 4px !important;
    }
    .magazine-section .magazine-carousel-controls .editorial-nav {
        width: 25px !important;
        height: 25px !important;
        min-width: 25px !important;
        font-size: 16px !important;
    }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT MOBILE TICKER ONLY
   Keep the original homepage mobile header/nav geometry. The checkout
   page should not receive separate header/nav sizing rules. Only the
   breaking ticker is widened to the full header width.
   ====================================================================== */
@media screen and (max-width: 800px) {
    html[data-theme="dark"] body.woocommerce-checkout .site-ticker {
        width: calc(100% + 40px) !important;
        max-width: none !important;
        margin-left: -20px !important;
        margin-right: -20px !important;
        box-sizing: border-box !important;
        background: #101216 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        overflow: hidden !important;
    }

    html[data-theme="dark"] body.woocommerce-checkout .site-ticker .ticker-label {
        margin-left: 20px !important;
        flex: 0 0 auto !important;
    }
}

/* No floating Live Score control on checkout. */
body.woocommerce-checkout .live-score-fab {
    display: none !important;
}

/* ======================================================================
   SSI FANZINE — CART + CHECKOUT REDESIGN
   Matches the refined shop visual language while keeping WooCommerce
   markup and payment/cart functionality intact.
   ====================================================================== */
.commerce-cart-page,
.commerce-checkout-page {
  max-width: 1200px;
  margin: 0 auto 48px;
  padding: 0 20px;
  box-sizing: border-box;
}

.ssi-commerce-page-header {
  margin: 24px 0 24px;
  padding: 24px 26px 22px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255,95,3,.055), rgba(0,0,0,0));
}
.ssi-commerce-kicker {
  display: inline-flex;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.ssi-commerce-page-header h1 {
  margin: 0 0 6px;
  color: var(--text);
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: -.02em;
}
.ssi-commerce-page-header p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

/* ---------- Classic WooCommerce cart ---------- */
.commerce-cart-page .woocommerce-cart-form,
.commerce-cart-page .cart-collaterals .cart_totals,
.commerce-cart-page .cross-sells {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  color: var(--text) !important;
}
.commerce-cart-page .woocommerce-cart-form {
  padding: 18px !important;
  margin-bottom: 20px !important;
}
.commerce-cart-page table.shop_table {
  border: 0 !important;
  background: transparent !important;
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 10px !important;
}
.commerce-cart-page table.shop_table thead th {
  color: var(--muted) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  border: 0 !important;
  padding: 8px 10px !important;
}
.commerce-cart-page table.shop_table tbody tr {
  background: var(--card) !important;
}
.commerce-cart-page table.shop_table td {
  border-top: 1px solid var(--border) !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 14px 10px !important;
  color: var(--text) !important;
  vertical-align: middle !important;
}
.commerce-cart-page table.shop_table td:first-child {
  border-left: 1px solid var(--border) !important;
  border-radius: 9px 0 0 9px !important;
}
.commerce-cart-page table.shop_table td:last-child {
  border-right: 1px solid var(--border) !important;
  border-radius: 0 9px 9px 0 !important;
}
.commerce-cart-page .product-thumbnail img {
  width: 72px !important;
  height: 92px !important;
  object-fit: contain !important;
  border-radius: 7px !important;
  background: var(--surface) !important;
  padding: 3px !important;
}
.commerce-cart-page .product-name a {
  color: var(--text) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
.commerce-cart-page .product-name a:hover { color: var(--accent) !important; }
.commerce-cart-page .product-price,
.commerce-cart-page .product-subtotal {
  color: var(--accent) !important;
  font-weight: 900 !important;
}
.commerce-cart-page .quantity .qty {
  width: 70px !important;
  height: 38px !important;
  border: 1px solid var(--border) !important;
  border-radius: 7px !important;
  background: var(--background) !important;
  color: var(--text) !important;
  text-align: center !important;
}
.commerce-cart-page .product-remove a {
  color: var(--muted) !important;
  font-size: 20px !important;
}
.commerce-cart-page .product-remove a:hover { color: var(--accent) !important; }
.commerce-cart-page .coupon input.input-text {
  min-height: 42px !important;
  border-radius: 7px !important;
  background: var(--background) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.commerce-cart-page .coupon button,
.commerce-cart-page .actions button[name="update_cart"] {
  min-height: 42px !important;
  border-radius: 7px !important;
  padding: 10px 16px !important;
}
.commerce-cart-page .cart-collaterals {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 380px !important;
  gap: 24px !important;
  align-items: start !important;
}
.commerce-cart-page .cart_totals {
  float: none !important;
  width: auto !important;
  padding: 22px !important;
}
.commerce-cart-page .cart_totals h2 {
  margin: 0 0 16px !important;
  font-size: 20px !important;
  color: var(--text) !important;
}
.commerce-cart-page .cart_totals table {
  border: 0 !important;
  margin: 0 0 16px !important;
}
.commerce-cart-page .cart_totals th,
.commerce-cart-page .cart_totals td {
  border: 0 !important;
  border-bottom: 1px solid var(--border) !important;
  padding: 12px 0 !important;
  color: var(--text) !important;
}
.commerce-cart-page .cart_totals .order-total th,
.commerce-cart-page .cart_totals .order-total td {
  color: var(--accent) !important;
  font-size: 17px !important;
  font-weight: 900 !important;
}
.commerce-cart-page .wc-proceed-to-checkout { padding: 0 !important; }
.commerce-cart-page .wc-proceed-to-checkout a.checkout-button {
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  border-radius: 8px !important;
  background: var(--accent) !important;
  color: #fff !important;
  padding: 13px 18px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}
.commerce-cart-page .return-to-shop { margin-top: 20px !important; }
.commerce-cart-page .return-to-shop a {
  border: 1px solid var(--border) !important;
  background: transparent !important;
  color: var(--text) !important;
  border-radius: 8px !important;
  padding: 11px 16px !important;
}

/* ---------- WooCommerce Blocks cart/checkout ---------- */
.commerce-cart-page .wc-block-cart,
.commerce-checkout-page .wc-block-checkout {
  color: var(--text) !important;
}
.commerce-cart-page .wc-block-components-main,
.commerce-cart-page .wc-block-components-sidebar,
.commerce-checkout-page .wc-block-components-checkout-step,
.commerce-checkout-page .wc-block-components-order-summary,
.commerce-checkout-page .wc-block-components-sidebar {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.commerce-checkout-page .wc-block-components-checkout-step,
.commerce-checkout-page .wc-block-components-order-summary {
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 20px !important;
  margin-bottom: 16px !important;
}
.commerce-checkout-page .wc-block-components-checkout-step__heading {
  color: var(--text) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}
.commerce-checkout-page .wc-block-components-checkout-step__description,
.commerce-checkout-page .wc-block-components-formatted-money-amount,
.commerce-checkout-page .wc-block-components-totals-item__label,
.commerce-checkout-page .wc-block-components-totals-item__value {
  color: var(--text) !important;
}
.commerce-checkout-page .wc-block-components-text-input input,
.commerce-checkout-page .wc-block-components-combobox .components-combobox-control__input,
.commerce-checkout-page .wc-block-components-select select,
.commerce-checkout-page .wc-block-components-address-form input,
.commerce-checkout-page .wc-block-components-address-form select {
  min-height: 48px !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--background) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
.commerce-checkout-page .wc-block-components-text-input label,
.commerce-checkout-page .wc-block-components-address-form label,
.commerce-checkout-page .wc-block-components-combobox label {
  color: var(--muted) !important;
}
.commerce-checkout-page .wc-block-components-text-input input:focus,
.commerce-checkout-page .wc-block-components-address-form input:focus,
.commerce-checkout-page .wc-block-components-address-form select:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(255,95,3,.14) !important;
}
.commerce-checkout-page .wc-block-components-checkout-place-order-button {
  min-height: 52px !important;
  border-radius: 8px !important;
  background: var(--accent) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}
.commerce-checkout-page .wc-block-components-checkout-place-order-button:hover {
  filter: brightness(.94);
}
.commerce-checkout-page .wc-block-components-radio-control-accordion-option,
.commerce-checkout-page .wc-block-components-radio-control__option,
.commerce-checkout-page .wc-block-components-totals-wrapper {
  border-color: var(--border) !important;
}

/* Classic checkout fallback */
.commerce-checkout-page form.checkout,
.commerce-checkout-page #order_review,
.commerce-checkout-page .woocommerce-checkout-payment {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  color: var(--text) !important;
  padding: 20px !important;
}
.commerce-checkout-page .form-row label { color: var(--text) !important; font-weight: 700 !important; }
.commerce-checkout-page .form-row input.input-text,
.commerce-checkout-page .form-row select,
.commerce-checkout-page .form-row textarea {
  min-height: 46px !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--background) !important;
  color: var(--text) !important;
}
.commerce-checkout-page #place_order {
  width: 100% !important;
  border-radius: 8px !important;
  background: var(--accent) !important;
  color: #fff !important;
  padding: 14px 18px !important;
}

/* Dark mode: keep commerce surfaces consistent with the shop */
html[data-theme="dark"] .commerce-cart-page,
html[data-theme="dark"] .commerce-checkout-page {
  color-scheme: dark;
}
html[data-theme="dark"] .commerce-cart-page .woocommerce-cart-form,
html[data-theme="dark"] .commerce-cart-page .cart_totals,
html[data-theme="dark"] .commerce-checkout-page .wc-block-components-checkout-step,
html[data-theme="dark"] .commerce-checkout-page .wc-block-components-order-summary,
html[data-theme="dark"] .commerce-checkout-page form.checkout,
html[data-theme="dark"] .commerce-checkout-page #order_review,
html[data-theme="dark"] .commerce-checkout-page .woocommerce-checkout-payment {
  background: #121416 !important;
}

/* Mobile */
@media (max-width: 800px) {
  .commerce-cart-page,
  .commerce-checkout-page {
    padding: 0 14px !important;
    margin-bottom: 28px !important;
  }
  .ssi-commerce-page-header {
    margin: 16px 0 16px !important;
    padding: 18px !important;
    border-radius: 10px !important;
  }
  .ssi-commerce-page-header h1 { font-size: 30px !important; }
  .ssi-commerce-page-header p { font-size: 13px !important; }

  .commerce-cart-page table.shop_table thead { display: none !important; }
  .commerce-cart-page table.shop_table tbody tr {
    display: grid !important;
    grid-template-columns: 72px minmax(0,1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    padding: 10px !important;
    border: 1px solid var(--border) !important;
    border-radius: 9px !important;
  }
  .commerce-cart-page table.shop_table td,
  .commerce-cart-page table.shop_table td:first-child,
  .commerce-cart-page table.shop_table td:last-child {
    border: 0 !important;
    border-radius: 0 !important;
    padding: 5px !important;
  }
  .commerce-cart-page .product-thumbnail { grid-column: 1; grid-row: 1 / span 4; }
  .commerce-cart-page .product-name { grid-column: 2 / span 2; grid-row: 1; }
  .commerce-cart-page .product-price { grid-column: 2; grid-row: 2; }
  .commerce-cart-page .product-quantity { grid-column: 2; grid-row: 3; }
  .commerce-cart-page .product-subtotal { grid-column: 3; grid-row: 2 / span 2; text-align: right; }
  .commerce-cart-page .product-remove { grid-column: 3; grid-row: 1; text-align: right; }
  .commerce-cart-page .cart-collaterals { grid-template-columns: 1fr !important; gap: 14px !important; }
  .commerce-cart-page .cart_totals { padding: 18px !important; }

  .commerce-checkout-page .wc-block-components-checkout-step,
  .commerce-checkout-page .wc-block-components-order-summary {
    padding: 16px !important;
    border-radius: 10px !important;
  }
  .commerce-checkout-page .wc-block-components-checkout-step__heading { font-size: 17px !important; }
}

/* ======================================================================
   SSI FANZINE — CART + CHECKOUT VISUAL REDESIGN V2
   Stronger visual treatment to match the Magazine Store page.
   ====================================================================== */

/* Commerce page canvas */
.commerce-cart-page,
.commerce-checkout-page{
  max-width:1200px !important;
  padding:28px 20px 54px !important;
  margin:0 auto !important;
}

/* Page hero: same visual language as Shop */
.commerce-cart-page .ssi-commerce-page-header,
.commerce-checkout-page .ssi-commerce-page-header{
  position:relative !important;
  margin:0 0 22px !important;
  padding:22px 24px 20px !important;
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,rgba(255,95,3,.10),rgba(255,95,3,.025) 55%,transparent) !important;
  overflow:hidden !important;
}
.commerce-cart-page .ssi-commerce-page-header::before,
.commerce-checkout-page .ssi-commerce-page-header::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:5px !important;
  height:100% !important;
  background:var(--accent) !important;
}
.commerce-cart-page .ssi-commerce-kicker,
.commerce-checkout-page .ssi-commerce-kicker{
  margin:0 0 9px 0 !important;
  padding:5px 9px !important;
  border-radius:4px !important;
  font-size:9px !important;
  letter-spacing:.08em !important;
  background:var(--accent) !important;
}
.commerce-cart-page .ssi-commerce-page-header h1,
.commerce-checkout-page .ssi-commerce-page-header h1{
  margin:0 !important;
  font-size:clamp(28px,4vw,40px) !important;
  line-height:1 !important;
  letter-spacing:-.025em !important;
}
.commerce-cart-page .ssi-commerce-page-header p,
.commerce-checkout-page .ssi-commerce-page-header p{
  margin:9px 0 0 !important;
  font-size:13px !important;
}

/* Content area */
.commerce-cart-page .shop-content-wrapper,
.commerce-checkout-page .shop-content-wrapper{
  width:100% !important;
  max-width:none !important;
}

/* CART — strong two-column magazine-store layout */
.commerce-cart-page .woocommerce-cart-form{
  padding:18px !important;
  border-radius:12px !important;
  background:var(--surface) !important;
}
.commerce-cart-page .cart-collaterals{
  grid-template-columns:minmax(0,1fr) 350px !important;
  gap:20px !important;
}
.commerce-cart-page .cart_totals{
  position:sticky !important;
  top:20px !important;
  padding:22px !important;
  border-radius:12px !important;
  background:linear-gradient(180deg,var(--surface),var(--card)) !important;
  box-shadow:0 12px 32px var(--shadow) !important;
}
.commerce-cart-page .cart_totals h2{
  font-size:18px !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}
.commerce-cart-page .cart_totals .order-total th,
.commerce-cart-page .cart_totals .order-total td{
  font-size:19px !important;
}
.commerce-cart-page .wc-proceed-to-checkout a.checkout-button{
  min-height:48px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  letter-spacing:.03em !important;
}

/* Cart product rows */
.commerce-cart-page table.shop_table tbody tr{
  transition:transform .18s ease,border-color .18s ease !important;
}
.commerce-cart-page table.shop_table tbody tr:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(255,95,3,.45) !important;
}
.commerce-cart-page .product-thumbnail img{
  width:78px !important;
  height:100px !important;
  object-fit:contain !important;
}
.commerce-cart-page .product-name a{
  font-size:14px !important;
}

/* CHECKOUT — clear section cards */
.commerce-checkout-page .wc-block-components-checkout-step,
.commerce-checkout-page .wc-block-components-order-summary{
  position:relative !important;
  padding:22px !important;
  margin-bottom:16px !important;
  border-radius:12px !important;
  border:1px solid var(--border) !important;
  background:var(--surface) !important;
  box-shadow:0 10px 26px var(--shadow) !important;
}
.commerce-checkout-page .wc-block-components-checkout-step__heading{
  margin-bottom:14px !important;
  font-size:18px !important;
  letter-spacing:-.01em !important;
}
.commerce-checkout-page .wc-block-components-checkout-step__heading::before{
  content:"" !important;
  display:inline-block !important;
  width:4px !important;
  height:18px !important;
  margin-right:9px !important;
  vertical-align:-3px !important;
  border-radius:2px !important;
  background:var(--accent) !important;
}
.commerce-checkout-page .wc-block-components-text-input input,
.commerce-checkout-page .wc-block-components-combobox .components-combobox-control__input,
.commerce-checkout-page .wc-block-components-select select,
.commerce-checkout-page .wc-block-components-address-form input,
.commerce-checkout-page .wc-block-components-address-form select{
  min-height:50px !important;
  border-radius:8px !important;
  padding-left:14px !important;
  padding-right:14px !important;
  font-size:14px !important;
}
.commerce-checkout-page .wc-block-components-text-input label,
.commerce-checkout-page .wc-block-components-address-form label,
.commerce-checkout-page .wc-block-components-combobox label{
  font-size:11px !important;
  font-weight:800 !important;
  letter-spacing:.02em !important;
}
.commerce-checkout-page .wc-block-components-checkout-place-order-button,
.commerce-checkout-page #place_order{
  min-height:54px !important;
  border-radius:8px !important;
  font-size:14px !important;
  letter-spacing:.04em !important;
  box-shadow:0 8px 20px rgba(255,95,3,.18) !important;
}
.commerce-checkout-page .wc-block-components-checkout-place-order-button:hover,
.commerce-checkout-page #place_order:hover{
  transform:translateY(-1px) !important;
}

/* Order summary */
.commerce-checkout-page .wc-block-components-order-summary{
  background:linear-gradient(180deg,var(--surface),var(--card)) !important;
}
.commerce-checkout-page .wc-block-components-totals-wrapper{
  padding-top:12px !important;
  padding-bottom:12px !important;
}

/* Dark mode */
html[data-theme="dark"] .commerce-cart-page .ssi-commerce-page-header,
html[data-theme="dark"] .commerce-checkout-page .ssi-commerce-page-header{
  background:linear-gradient(180deg,rgba(255,95,3,.09),rgba(18,20,22,.88)) !important;
}
html[data-theme="dark"] .commerce-cart-page .woocommerce-cart-form,
html[data-theme="dark"] .commerce-cart-page .cart_totals,
html[data-theme="dark"] .commerce-checkout-page .wc-block-components-checkout-step,
html[data-theme="dark"] .commerce-checkout-page .wc-block-components-order-summary{
  background:#121416 !important;
}

/* Light mode */
html[data-theme="light"] .commerce-cart-page .ssi-commerce-page-header,
html[data-theme="light"] .commerce-checkout-page .ssi-commerce-page-header{
  background:linear-gradient(180deg,rgba(255,95,3,.07),rgba(255,255,255,.96)) !important;
}

/* Mobile */
@media (max-width:800px){
  .commerce-cart-page,
  .commerce-checkout-page{
    padding:18px 14px 38px !important;
  }
  .commerce-cart-page .ssi-commerce-page-header,
  .commerce-checkout-page .ssi-commerce-page-header{
    margin-bottom:14px !important;
    padding:18px 18px 17px !important;
    border-radius:10px !important;
  }
  .commerce-cart-page .ssi-commerce-page-header h1,
  .commerce-checkout-page .ssi-commerce-page-header h1{
    font-size:30px !important;
  }
  .commerce-cart-page .ssi-commerce-page-header p,
  .commerce-checkout-page .ssi-commerce-page-header p{
    font-size:12px !important;
    line-height:1.45 !important;
  }
  .commerce-cart-page .cart-collaterals{
    gap:12px !important;
  }
  .commerce-cart-page .cart_totals{
    position:static !important;
    padding:18px !important;
  }
  .commerce-cart-page .product-thumbnail img{
    width:66px !important;
    height:86px !important;
  }
  .commerce-checkout-page .wc-block-components-checkout-step,
  .commerce-checkout-page .wc-block-components-order-summary{
    padding:16px !important;
    border-radius:10px !important;
    margin-bottom:12px !important;
  }
  .commerce-checkout-page .wc-block-components-checkout-step__heading{
    font-size:17px !important;
  }
}

/* ======================================================================
   SSI FANZINE — CART / CHECKOUT V3
   Dedicated page templates. The previous redesign was not visible when
   WooCommerce rendered the Cart/Checkout page through page.php. These
   styles belong to the dedicated page-{slug}.php templates above.
   ====================================================================== */
.ssi-commerce-page{
  max-width:1200px;
  margin:0 auto;
  padding:28px 20px 60px;
}
.ssi-commerce-hero{
  position:relative;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:14px;
  padding:24px 26px 22px;
  background:linear-gradient(135deg,rgba(255,95,3,.13),rgba(255,95,3,.035) 45%,var(--surface) 100%);
  box-shadow:0 16px 40px var(--shadow);
}
.ssi-commerce-hero:after{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  right:-70px;
  top:-90px;
  border-radius:50%;
  border:1px solid rgba(255,95,3,.20);
}
.ssi-commerce-hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  padding:5px 9px;
  border-radius:4px;
  background:var(--accent);
  color:#fff;
  font:800 9px/1 var(--font-sans,Arial,sans-serif);
  letter-spacing:.08em;
}
.ssi-commerce-hero-kicker span{
  width:6px;height:6px;border-radius:50%;background:#fff;display:block;
}
.ssi-commerce-hero-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
}
.ssi-commerce-hero h1{
  margin:0;
  font-size:clamp(34px,5vw,52px);
  line-height:.96;
  letter-spacing:-.035em;
}
.ssi-commerce-hero p{
  margin:10px 0 0;
  max-width:650px;
  font-size:14px;
  color:var(--muted);
}
.ssi-commerce-hero-badge{
  flex:0 0 auto;
  padding:9px 12px;
  border:1px solid var(--border);
  border-radius:6px;
  background:var(--card);
  color:var(--text);
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
  white-space:nowrap;
}
.ssi-commerce-trust{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin:12px 0 18px;
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
  background:var(--border);
}
.ssi-commerce-trust>div{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:52px;
  padding:10px 14px;
  background:var(--surface);
}
.ssi-commerce-trust strong{
  color:var(--accent);
  font-size:10px;
  letter-spacing:.08em;
}
.ssi-commerce-trust span{
  font-size:11px;
  font-weight:700;
}
.ssi-commerce-content{width:100%;}
.ssi-checkout-shell,
.ssi-cart-shell{
  min-width:0;
}

/* Checkout block / classic form — deliberately target both WooCommerce UIs. */
.ssi-checkout-page .wc-block-checkout,
.ssi-checkout-page .woocommerce-checkout,
.ssi-checkout-page form.checkout{
  width:100%;
  max-width:none;
}
.ssi-checkout-page .wc-block-components-checkout-step,
.ssi-checkout-page .wc-block-components-order-summary,
.ssi-checkout-page form.checkout,
.ssi-checkout-page #order_review,
.ssi-checkout-page .woocommerce-checkout-payment{
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  background:var(--surface) !important;
  box-shadow:0 12px 30px var(--shadow) !important;
}
.ssi-checkout-page .wc-block-components-checkout-step{
  padding:22px !important;
  margin-bottom:14px !important;
}
.ssi-checkout-page .wc-block-components-checkout-step__heading{
  font-size:19px !important;
  font-weight:900 !important;
}
.ssi-checkout-page .wc-block-components-checkout-step__heading:before{
  content:"" !important;
  display:inline-block !important;
  width:4px !important;
  height:19px !important;
  margin-right:9px !important;
  vertical-align:-3px !important;
  border-radius:2px !important;
  background:var(--accent) !important;
}
.ssi-checkout-page .wc-block-components-order-summary{
  padding:18px !important;
}
.ssi-checkout-page input,
.ssi-checkout-page select,
.ssi-checkout-page textarea,
.ssi-checkout-page .wc-block-components-combobox .components-combobox-control__input{
  border-radius:8px !important;
}
.ssi-checkout-page .wc-block-components-checkout-place-order-button,
.ssi-checkout-page #place_order{
  min-height:54px !important;
  border-radius:8px !important;
  background:var(--accent) !important;
  color:#fff !important;
  font-weight:900 !important;
  letter-spacing:.04em !important;
}

/* Classic cart */
.ssi-cart-page .woocommerce-cart-form,
.ssi-cart-page .cart_totals{
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  background:var(--surface) !important;
  box-shadow:0 12px 30px var(--shadow) !important;
}
.ssi-cart-page .woocommerce-cart-form{padding:18px !important;}
.ssi-cart-page .cart_totals{padding:22px !important;}
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button{
  min-height:52px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:8px !important;
  background:var(--accent) !important;
  color:#fff !important;
  font-weight:900 !important;
}

html[data-theme="dark"] .ssi-commerce-hero,
html[data-theme="dark"] .ssi-commerce-trust>div,
html[data-theme="dark"] .ssi-checkout-page .wc-block-components-checkout-step,
html[data-theme="dark"] .ssi-checkout-page .wc-block-components-order-summary,
html[data-theme="dark"] .ssi-checkout-page form.checkout,
html[data-theme="dark"] .ssi-checkout-page #order_review,
html[data-theme="dark"] .ssi-checkout-page .woocommerce-checkout-payment,
html[data-theme="dark"] .ssi-cart-page .woocommerce-cart-form,
html[data-theme="dark"] .ssi-cart-page .cart_totals{
  background:#121416 !important;
}

@media(max-width:800px){
  .ssi-commerce-page{padding:18px 14px 44px;}
  .ssi-commerce-hero{padding:19px 18px 18px;border-radius:11px;}
  .ssi-commerce-hero-row{align-items:flex-start;}
  .ssi-commerce-hero h1{font-size:31px;}
  .ssi-commerce-hero p{font-size:12px;line-height:1.45;}
  .ssi-commerce-hero-badge{display:none;}
  .ssi-commerce-trust{grid-template-columns:1fr;margin-bottom:14px;}
  .ssi-commerce-trust>div{min-height:42px;padding:8px 12px;}
  .ssi-checkout-page .wc-block-components-checkout-step{padding:16px !important;}
}


/* ======================================================================
   SSI FANZINE — CART CHECKOUT CTA
   Match the earlier SSI checkout-button treatment.
   ====================================================================== */
.ssi-cart-page .wc-block-cart__submit-button,
.ssi-cart-page .wc-block-components-button.wc-block-cart__submit-button,
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button {
  position: relative !important;
  width: 100% !important;
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  box-sizing: border-box !important;
  padding: 14px 52px 14px 20px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--accent) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}
.ssi-cart-page .wc-block-cart__submit-button::after,
.ssi-cart-page .wc-block-components-button.wc-block-cart__submit-button::after,
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button::after {
  content: '→' !important;
  position: absolute !important;
  right: 19px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}
.ssi-cart-page .wc-block-cart__submit-button:hover,
.ssi-cart-page .wc-block-components-button.wc-block-cart__submit-button:hover,
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 22px rgba(239,35,51,.22) !important;
}
.ssi-cart-page .wc-block-cart__submit-button:active,
.ssi-cart-page .wc-block-components-button.wc-block-cart__submit-button:active,
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button:active {
  transform: translateY(0) !important;
}
@media (max-width:800px){
  .ssi-cart-page .wc-block-cart__submit-button,
  .ssi-cart-page .wc-block-components-button.wc-block-cart__submit-button,
  .ssi-cart-page .wc-proceed-to-checkout a.checkout-button {
    min-height: 52px !important;
    font-size: 12px !important;
  }
}

/* ======================================================================
   SSI FANZINE — CART MOBILE FINAL FIX
   1. Remove Live Score from the Cart page only.
   2. Keep the cart checkout button safely above the fixed mobile bottom bar.
   ====================================================================== */
body.woocommerce-cart .live-score-fab,
body.woocommerce-cart-page .live-score-fab {
  display: none !important;
}

@media (max-width: 800px) {
  /* The bottom navigation is fixed, so reserve enough scroll space below
     the cart content instead of letting it cover the checkout CTA. */
  body.woocommerce-cart .ssi-cart-page,
  body.woocommerce-cart-page .ssi-cart-page {
    padding-bottom: 125px !important;
  }

  body.woocommerce-cart .ssi-cart-page .wc-proceed-to-checkout,
  body.woocommerce-cart-page .ssi-cart-page .wc-proceed-to-checkout {
    margin-bottom: 28px !important;
  }

  body.woocommerce-cart .ssi-cart-page .wc-proceed-to-checkout a.checkout-button,
  body.woocommerce-cart-page .ssi-cart-page .wc-proceed-to-checkout a.checkout-button {
    position: relative !important;
    z-index: 2 !important;
    margin-bottom: 0 !important;
  }

  /* WooCommerce Blocks cart CTA fallback */
  body.woocommerce-cart .ssi-cart-page .wc-block-cart__submit,
  body.woocommerce-cart-page .ssi-cart-page .wc-block-cart__submit {
    margin-bottom: 28px !important;
    position: relative !important;
    z-index: 2 !important;
  }
}

/* ======================================================================
   SSI FANZINE — CART MOBILE BOTTOM BAR CLEANUP
   Keep the SEO/help floating icon untouched. Remove only the halo/shadow
   immediately above the fixed mobile navigation on the Cart page.
   ====================================================================== */
@media screen and (max-width: 800px) {
  body.woocommerce-cart .bottom-tab-bar,
  body.woocommerce-cart-page .bottom-tab-bar {
    box-shadow: none !important;
    border-top: 1px solid #292d33 !important;
  }

  body.woocommerce-cart .ssi-cart-page,
  body.woocommerce-cart-page .ssi-cart-page {
    padding-bottom: 110px !important;
  }
}

/* ======================================================================
   SSI FANZINE — CART MOBILE FINAL STICKY-NAV FIX v7
   Apply to the actual Cart page template as well as WooCommerce cart body
   classes. The SEO/help widget is intentionally NOT touched.
   ====================================================================== */
@media screen and (max-width: 800px) {
  /* The fixed bottom navigation must be a solid, clean edge — no halo. */
  body.woocommerce-cart .bottom-tab-bar,
  body.woocommerce-cart-page .bottom-tab-bar,
  body.page-template-page-cart .bottom-tab-bar,
  body.page-template-page-cart-php .bottom-tab-bar,
  body.woocommerce-page .bottom-tab-bar {
    background: #050505 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    filter: none !important;
    -webkit-filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-top: 1px solid #292d33 !important;
    outline: none !important;
  }

  /* Remove any pseudo-element that could create a light/blurred strip. */
  body.woocommerce-cart .bottom-tab-bar::before,
  body.woocommerce-cart .bottom-tab-bar::after,
  body.woocommerce-cart-page .bottom-tab-bar::before,
  body.woocommerce-cart-page .bottom-tab-bar::after,
  body.page-template-page-cart .bottom-tab-bar::before,
  body.page-template-page-cart .bottom-tab-bar::after,
  body.page-template-page-cart-php .bottom-tab-bar::before,
  body.page-template-page-cart-php .bottom-tab-bar::after {
    content: none !important;
    display: none !important;
    box-shadow: none !important;
  }

  /* Keep the entire Cart content above the fixed navigation. */
  body.woocommerce-cart .site-main,
  body.woocommerce-cart-page .site-main,
  body.page-template-page-cart .site-main,
  body.page-template-page-cart-php .site-main {
    padding-bottom: 125px !important;
  }

  body.woocommerce-cart .ssi-cart-page,
  body.woocommerce-cart-page .ssi-cart-page,
  body.page-template-page-cart .ssi-cart-page,
  body.page-template-page-cart-php .ssi-cart-page {
    padding-bottom: 30px !important;
  }

  /* CTA is part of normal document flow — never fixed/sticky. */
  body.woocommerce-cart .ssi-cart-page .wc-proceed-to-checkout,
  body.woocommerce-cart-page .ssi-cart-page .wc-proceed-to-checkout,
  body.page-template-page-cart .ssi-cart-page .wc-proceed-to-checkout,
  body.page-template-page-cart-php .ssi-cart-page .wc-proceed-to-checkout {
    position: relative !important;
    bottom: auto !important;
    top: auto !important;
    margin: 18px 0 22px !important;
    padding: 0 !important;
    z-index: 1 !important;
  }

  body.woocommerce-cart .ssi-cart-page .wc-proceed-to-checkout a.checkout-button,
  body.woocommerce-cart-page .ssi-cart-page .wc-proceed-to-checkout a.checkout-button,
  body.page-template-page-cart .ssi-cart-page .wc-proceed-to-checkout a.checkout-button,
  body.page-template-page-cart-php .ssi-cart-page .wc-proceed-to-checkout a.checkout-button {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    margin: 0 !important;
    box-shadow: none !important;
    filter: none !important;
  }

  /* WooCommerce Blocks cart CTA fallback. */
  body.woocommerce-cart .wc-block-cart__submit,
  body.woocommerce-cart-page .wc-block-cart__submit,
  body.page-template-page-cart .wc-block-cart__submit,
  body.page-template-page-cart-php .wc-block-cart__submit {
    position: relative !important;
    bottom: auto !important;
    margin: 18px 0 22px !important;
    box-shadow: none !important;
  }
}

/* ======================================================================
   SSI FANZINE — CART BLOCK MOBILE STICKY CHECKOUT FIX v8
   WooCommerce Cart Blocks creates its own fixed mobile checkout footer.
   Its default white background + top shadow is the white glow seen above
   SSI's mobile bottom navigation. Disable that sticky container on Cart so
   the checkout button stays in the normal cart flow.
   ====================================================================== */
@media screen and (max-width: 800px) {
  body.woocommerce-cart .wc-block-cart__submit-container,
  body.woocommerce-cart-page .wc-block-cart__submit-container,
  body.page-template-page-cart .wc-block-cart__submit-container,
  body.page-template-page-cart-php .wc-block-cart__submit-container {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 18px 0 28px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
    z-index: auto !important;
  }

  body.woocommerce-cart .wc-block-cart__submit-container::before,
  body.woocommerce-cart .wc-block-cart__submit-container::after,
  body.woocommerce-cart-page .wc-block-cart__submit-container::before,
  body.woocommerce-cart-page .wc-block-cart__submit-container::after,
  body.page-template-page-cart .wc-block-cart__submit-container::before,
  body.page-template-page-cart .wc-block-cart__submit-container::after,
  body.page-template-page-cart-php .wc-block-cart__submit-container::before,
  body.page-template-page-cart-php .wc-block-cart__submit-container::after {
    display: none !important;
    content: none !important;
    box-shadow: none !important;
  }

  body.woocommerce-cart .wc-block-cart__submit-container--sticky,
  body.woocommerce-cart-page .wc-block-cart__submit-container--sticky,
  body.page-template-page-cart .wc-block-cart__submit-container--sticky,
  body.page-template-page-cart-php .wc-block-cart__submit-container--sticky {
    position: static !important;
    inset: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: auto !important;
    margin: 18px 0 28px !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.woocommerce-cart .wc-block-cart__submit-container--sticky::before,
  body.woocommerce-cart .wc-block-cart__submit-container--sticky::after,
  body.woocommerce-cart-page .wc-block-cart__submit-container--sticky::before,
  body.woocommerce-cart-page .wc-block-cart__submit-container--sticky::after,
  body.page-template-page-cart .wc-block-cart__submit-container--sticky::before,
  body.page-template-page-cart .wc-block-cart__submit-container--sticky::after,
  body.page-template-page-cart-php .wc-block-cart__submit-container--sticky::before,
  body.page-template-page-cart-php .wc-block-cart__submit-container--sticky::after {
    display: none !important;
    content: none !important;
    box-shadow: none !important;
  }

  /* The SSI bottom navigation remains the only fixed element at the bottom. */
  body.woocommerce-cart .bottom-tab-bar,
  body.woocommerce-cart-page .bottom-tab-bar,
  body.page-template-page-cart .bottom-tab-bar,
  body.page-template-page-cart-php .bottom-tab-bar {
    box-shadow: none !important;
    filter: none !important;
  }

  /* Keep the final cart content clear of SSI's fixed navigation. */
  body.woocommerce-cart .site-main,
  body.woocommerce-cart-page .site-main,
  body.page-template-page-cart .site-main,
  body.page-template-page-cart-php .site-main {
    padding-bottom: 110px !important;
  }
}

/* ======================================================================
   SSI FANZINE — MOBILE BOTTOM NAV FIX v11
   Keep the quick-navigation bar as a normal viewport-fixed element.
   Do not calculate or change its bottom offset during scrolling: modern
   mobile browsers already position fixed elements against the visual
   viewport. Dynamic visualViewport offsets can make the bar jump upward.
   ====================================================================== */
@media screen and (max-width: 800px) {
  .bottom-tab-bar {
    position: fixed !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    z-index: 1200 !important;
    transform: none !important;
    -webkit-transform: none !important;
    will-change: auto !important;
  }
}

/* Footer legal links: separate Privacy Policy and Terms & Conditions. */
.footer-legal a + a::before {
    content: " | ";
    margin: 0 8px;
    color: var(--muted);
}

@media (max-width: 800px) {
    .footer-legal a + a::before {
        margin: 0 6px;
    }
}


/* ======================================================================
   SSI FANZINE — CHECKOUT MOBILE HORIZONTAL-OVERFLOW FIX v13
   Prevent the WooCommerce Checkout block from creating a wider canvas than
   the phone viewport. This stops sideways swiping from revealing the
   white page/background beside the checkout.
   ====================================================================== */
@media screen and (max-width: 800px) {
  html:has(body.woocommerce-checkout),
  html:has(body.page-template-page-checkout),
  html:has(body.page-template-page-checkout-php) {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body.woocommerce-checkout,
  body.woocommerce-checkout.woocommerce-page,
  body.page-template-page-checkout,
  body.page-template-page-checkout-php {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    background: var(--background) !important;
  }

  html[data-theme="dark"]:has(body.woocommerce-checkout),
  html[data-theme="dark"]:has(body.page-template-page-checkout),
  html[data-theme="dark"]:has(body.page-template-page-checkout-php),
  html[data-theme="dark"] body.woocommerce-checkout,
  html[data-theme="dark"] body.page-template-page-checkout,
  html[data-theme="dark"] body.page-template-page-checkout-php {
    background: #0d0f12 !important;
  }

  .ssi-checkout-page,
  .ssi-commerce-content,
  .ssi-checkout-shell,
  .ssi-checkout-shell > *,
  .ssi-checkout-page .wp-block-woocommerce-checkout,
  .ssi-checkout-page .wc-block-checkout,
  .ssi-checkout-page .wc-block-components-main,
  .ssi-checkout-page .wc-block-components-sidebar,
  .ssi-checkout-page form.checkout {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Some WooCommerce Block layouts use a minimum column width or
     viewport-relative width on small screens. Force both columns to shrink. */
  .ssi-checkout-page .wc-block-checkout__main,
  .ssi-checkout-page .wc-block-checkout__sidebar,
  .ssi-checkout-page .wc-block-components-order-summary,
  .ssi-checkout-page .wc-block-components-checkout-step {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Neutralize any negative horizontal margins/translated checkout wrapper. */
  .ssi-checkout-page .wp-block-woocommerce-checkout,
  .ssi-checkout-page .wc-block-checkout {
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  /* Keep controls inside the viewport even when WooCommerce adds long
     labels, addresses, payment text, or summary content. */
  .ssi-checkout-page img,
  .ssi-checkout-page iframe,
  .ssi-checkout-page table,
  .ssi-checkout-page input,
  .ssi-checkout-page select,
  .ssi-checkout-page textarea,
  .ssi-checkout-page button {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}



/* ======================================================================
   SSI FANZINE — MOBILE MAGAZINE SWIPE FIX
   Allow intentional horizontal finger swipes without fighting page scroll.
   ====================================================================== */
@media (max-width: 800px) {
    .magazine-section .editorial-carousel {
        touch-action: pan-y !important;
        -webkit-user-select: none !important;
        user-select: none !important;
        overscroll-behavior-x: contain !important;
    }

    .magazine-section .magazine-grid.ssi-magazine-loop-track {
        cursor: grab !important;
    }

    .magazine-section .magazine-grid.ssi-magazine-loop-track.is-touch-dragging {
        cursor: grabbing !important;
    }
}

/* ======================================================================
   SSI FANZINE — MOBILE MAGAZINE HEADER ALIGNMENT
   Keep carousel arrows on the left and "View All Magazines" flush right.
   ====================================================================== */
@media (max-width: 520px) {
    .magazine-section .magazine-section-title .magazine-carousel-actions {
        width: 100% !important;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        margin-left: 0 !important;
        margin-top: 8px !important;
        padding-top: 0 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions .magazine-carousel-controls {
        flex: 0 0 auto !important;
        margin-right: auto !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a {
        flex: 0 0 auto !important;
        margin-left: auto !important;
        text-align: right !important;
        font-size: 9px !important;
        white-space: nowrap !important;
    }
}

/* ======================================================================
   SSI FANZINE — MOBILE MAGAZINE HEADER ACTIONS: RIGHT ALIGN
   Keep the arrows together with "View All Magazines" on the right.
   ====================================================================== */
@media (max-width: 520px) {
    .magazine-section .magazine-section-title .magazine-carousel-actions {
        justify-content: flex-end !important;
        gap: 8px !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions .magazine-carousel-controls {
        flex: 0 0 auto !important;
        margin-right: 0 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a {
        flex: 0 0 auto !important;
        margin-left: 0 !important;
        text-align: right !important;
    }
}


/* ======================================================================
   SSI FANZINE — MOBILE MAGAZINE HEADER: STORE / DIVIDER / TITLE + ACTIONS
   Mobile hierarchy:
   Magazine Store
   ------------------------------
   SSI Fanzine Issues        ‹ › View All Magazines
   Explore physical...
   ====================================================================== */
.magazine-section .magazine-heading-wrap {
    min-width: 0;
}

@media (min-width: 521px) {
    .magazine-section .magazine-heading-wrap .magazine-badge {
        display: inline-block !important;
        vertical-align: middle !important;
    }
    .magazine-section .magazine-heading-wrap h2 {
        display: inline-block !important;
        vertical-align: middle !important;
    }
    .magazine-section .magazine-heading-wrap .section-subtitle {
        display: block !important;
    }
}

@media (max-width: 520px) {
    .magazine-section .magazine-section-title {
        position: relative !important;
        display: block !important;
        padding: 7px 0 14px !important;
        margin-bottom: 12px !important;
        min-height: 0 !important;
        border-bottom: 1px solid var(--border) !important;
    }

    .magazine-section .magazine-heading-wrap {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Magazine Store sits alone above the divider. */
    .magazine-section .magazine-heading-wrap .magazine-badge {
        display: block !important;
        width: max-content !important;
        margin: 0 0 9px !important;
        padding: 3px 7px !important;
    }

    .magazine-section .magazine-heading-wrap .magazine-badge::after {
        content: "" !important;
    }

    /* Full horizontal divider immediately below Magazine Store. */
    .magazine-section .magazine-heading-wrap::before {
        content: "" !important;
        display: block !important;
        width: 100% !important;
        height: 1px !important;
        background: var(--border) !important;
        margin: 0 0 9px !important;
    }

    /* Title occupies the left side; carousel controls sit directly to its right. */
    .magazine-section .magazine-heading-wrap h2 {
        display: block !important;
        width: calc(100% - 145px) !important;
        min-height: 25px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 25px !important;
        font-size: 15px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        z-index: 2 !important;
    }

    .magazine-section .magazine-heading-wrap h2::after {
        display: none !important;
    }

    .magazine-section .magazine-carousel-actions {
        position: absolute !important;
        top: 43px !important;
        right: 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 6px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .magazine-section .magazine-carousel-controls {
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
        margin: 0 !important;
    }

    .magazine-section .magazine-carousel-controls .editorial-nav {
        width: 23px !important;
        height: 23px !important;
        min-width: 23px !important;
        font-size: 14px !important;
    }

    .magazine-section .magazine-carousel-actions > a {
        display: inline-block !important;
        margin: 0 !important;
        font-size: 8px !important;
        line-height: 23px !important;
        white-space: nowrap !important;
    }

    /* Explore text remains below the title/action row. */
    .magazine-section .magazine-heading-wrap .section-subtitle {
        display: block !important;
        width: 100% !important;
        margin: 5px 0 0 !important;
        padding: 0 !important;
        font-size: 10px !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

/* ======================================================================
   SSI FANZINE — FINAL MOBILE MAGAZINE HEADER LAYOUT
   Mobile:
   [MAGAZINE STORE]
   short thick accent rule
   SSI FANZINE ISSUES        < >  VIEW ALL MAGAZINES
   Explore physical print...
   ====================================================================== */
@media (max-width: 520px) {
    .magazine-section .magazine-section-title {
        position: relative !important;
        display: block !important;
        padding: 0 0 12px !important;
        margin: 0 0 12px !important;
        min-height: 0 !important;
        border-bottom: 1px solid var(--border) !important;
    }

    .magazine-section .magazine-heading-wrap {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Store badge on its own line. */
    .magazine-section .magazine-heading-wrap .magazine-badge {
        display: inline-flex !important;
        width: max-content !important;
        margin: 0 0 8px !important;
        padding: 3px 7px !important;
        line-height: 1.2 !important;
    }

    /* Short, thick desktop-style accent rule directly below the badge. */
    .magazine-section .magazine-heading-wrap::before {
        content: "" !important;
        display: block !important;
        width: 28px !important;
        height: 3px !important;
        margin: 0 0 8px !important;
        background: var(--accent) !important;
        border-radius: 2px !important;
    }

    /* Title stays left; actions share the exact same row on the right. */
    .magazine-section .magazine-heading-wrap h2 {
        display: block !important;
        width: calc(100% - 142px) !important;
        min-height: 23px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 15px !important;
        line-height: 23px !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

    .magazine-section .magazine-heading-wrap h2::after {
        display: none !important;
    }

    /* Arrows + View All are one compact, single-line action group. */
    .magazine-section .magazine-section-title .magazine-carousel-actions {
        position: absolute !important;
        top: 52px !important;
        right: 0 !important;
        width: auto !important;
        height: 23px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 5px !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
    }

    .magazine-section .magazine-carousel-controls {
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        gap: 4px !important;
        margin: 0 !important;
    }

    .magazine-section .magazine-carousel-controls .editorial-nav {
        display: inline-flex !important;
        width: 23px !important;
        height: 23px !important;
        min-width: 23px !important;
        padding: 0 !important;
        margin: 0 !important;
        font-size: 14px !important;
        line-height: 1 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a {
        display: inline-flex !important;
        align-items: center !important;
        height: 23px !important;
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 8px !important;
        line-height: 23px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a::after {
        content: none !important;
        display: none !important;
    }

    /* Description is always below the title/action row. */
    .magazine-section .magazine-heading-wrap .section-subtitle {
        display: block !important;
        width: 100% !important;
        margin: 5px 0 0 !important;
        padding: 0 !important;
        font-size: 10px !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}


/* ======================================================================
   SSI FANZINE — FINAL MOBILE MAGAZINE HEADER / v18
   Mobile structure:
   [MAGAZINE STORE]
   short thick accent rule
   SSI FANZINE ISSUES             < > VIEW ALL MAGAZINES
   Explore physical print hard-copies & digital research editions...
   ====================================================================== */
@media (max-width: 520px) {
    .magazine-section .magazine-section-title {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto auto !important;
        column-gap: 6px !important;
        row-gap: 0 !important;
        align-items: center !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 0 12px !important;
        padding: 2px 0 12px !important;
        box-sizing: border-box !important;
        overflow: visible !important;
        border-bottom: 0 !important;
    }

    /* Flatten the wrapper so badge/title/subtitle can occupy explicit grid rows. */
    .magazine-section .magazine-heading-wrap {
        display: contents !important;
    }

    /* Magazine Store: full-width first row. */
    .magazine-section .magazine-heading-wrap .magazine-badge {
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-self: start !important;
        width: max-content !important;
        margin: 0 0 11px !important;
        padding: 3px 7px !important;
        line-height: 1.2 !important;
        box-sizing: border-box !important;
    }

    /* Short, thick desktop-style accent directly under the badge. */
    .magazine-section .magazine-heading-wrap .magazine-badge::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        top: calc(100% + 6px) !important;
        width: 28px !important;
        height: 3px !important;
        margin: 0 !important;
        background: var(--accent) !important;
        border-radius: 2px !important;
    }

    /* Title: left side of the same row as the controls. */
    .magazine-section .magazine-heading-wrap h2 {
        grid-column: 1 !important;
        grid-row: 2 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 15px !important;
        line-height: 22px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .magazine-section .magazine-heading-wrap h2::after {
        display: none !important;
    }

    /* Arrows + View All: same row as title, vertically centered and kept on one line. */
    .magazine-section .magazine-section-title .magazine-carousel-actions {
        grid-column: 2 !important;
        grid-row: 2 !important;
        position: static !important;
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 4px !important;
        width: auto !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-controls {
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        gap: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-controls .editorial-nav {
        display: inline-flex !important;
        flex: 0 0 22px !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        min-height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 13px !important;
        line-height: 1 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        width: auto !important;
        height: 22px !important;
        min-width: max-content !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 8px !important;
        line-height: 22px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a::after {
        content: none !important;
        display: none !important;
    }

    /* Description sits cleanly below the title/action row. */
    .magazine-section .magazine-heading-wrap .section-subtitle {
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 5px 0 0 !important;
        padding: 0 !important;
        font-size: 10px !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}


/* ======================================================================
   SSI FANZINE — MOBILE MAGAZINE HEADER CLEAN OVERRIDE v19
   One authoritative mobile layout. Fixes the stacked/overlapping controls
   caused by the previous absolute-position/grid experiments.
   ====================================================================== */
@media (max-width: 520px) {
    .magazine-section .magazine-section-title {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto auto auto auto !important;
        column-gap: 7px !important;
        row-gap: 0 !important;
        align-items: center !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 0 12px !important;
        padding: 2px 0 12px !important;
        border: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .magazine-section .magazine-heading-wrap {
        display: contents !important;
    }

    /* Never allow an older heading underline to appear here. */
    .magazine-section .magazine-section-title h2::after,
    .magazine-section .magazine-heading-wrap h2::after,
    .magazine-section .magazine-section-title > h2::after {
        content: none !important;
        display: none !important;
    }

    /* 1 — MAGAZINE STORE */
    .magazine-section .magazine-heading-wrap .magazine-badge {
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-self: start !important;
        width: max-content !important;
        margin: 0 0 8px !important;
        padding: 3px 7px !important;
        line-height: 1.2 !important;
        box-sizing: border-box !important;
    }

    /* 2 — short, thick accent rule immediately UNDER the badge */
    .magazine-section .magazine-heading-wrap .magazine-badge::after {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        left: 0 !important;
        top: auto !important;
        right: auto !important;
        bottom: -7px !important;
        width: 28px !important;
        height: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
        background: var(--accent) !important;
        border-radius: 2px !important;
        transform: none !important;
    }

    /* Remove all full-width divider tricks from older revisions. */
    .magazine-section .magazine-heading-wrap::before,
    .magazine-section .magazine-heading-wrap::after,
    .magazine-section .magazine-section-title::before,
    .magazine-section .magazine-section-title::after {
        content: none !important;
        display: none !important;
    }

    /* 3 — title left, arrows + view-all right, same row */
    .magazine-section .magazine-heading-wrap h2 {
        grid-column: 1 !important;
        grid-row: 3 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 15px !important;
        line-height: 22px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
        align-self: center !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions {
        grid-column: 2 !important;
        grid-row: 3 !important;
        position: static !important;
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 5px !important;
        width: auto !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
        align-self: center !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-controls {
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        gap: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-controls .editorial-nav {
        display: inline-flex !important;
        flex: 0 0 22px !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        min-height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        font-size: 13px !important;
        line-height: 1 !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        width: auto !important;
        min-width: max-content !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 8px !important;
        line-height: 22px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .magazine-section .magazine-section-title .magazine-carousel-actions > a::after {
        content: none !important;
        display: none !important;
    }

    /* 4 — description below the complete title/action row */
    .magazine-section .magazine-heading-wrap .section-subtitle {
        grid-column: 1 / -1 !important;
        grid-row: 4 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 5px 0 0 !important;
        padding: 0 !important;
        font-size: 10px !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

/* ======================================================================
   SSI FANZINE — MAGAZINE HEADER ROOT FIX
   The title and carousel actions are now siblings inside a dedicated
   .magazine-title-row. This avoids the previous flex/grid/absolute rules
   fighting over two separate DOM branches.
   ====================================================================== */
.magazine-section .magazine-section-title {
    display: flex !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

.magazine-section .magazine-heading-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.magazine-section .magazine-badge {
    align-self: flex-start !important;
    width: max-content !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.magazine-section .magazine-title-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

.magazine-section .magazine-title-row h2 {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.magazine-section .magazine-title-row h2::after {
    content: none !important;
    display: none !important;
}

.magazine-section .magazine-title-row .magazine-carousel-actions {
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    width: auto !important;
    min-width: max-content !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    white-space: nowrap !important;
    transform: none !important;
}

.magazine-section .magazine-title-row .magazine-carousel-controls {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.magazine-section .magazine-title-row .magazine-carousel-controls .editorial-nav {
    display: inline-flex !important;
    flex: 0 0 27px !important;
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    min-height: 27px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.magazine-section .magazine-title-row .magazine-carousel-actions > a {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    height: 27px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: flex-end !important;
    font-size: 9px !important;
    line-height: 27px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

.magazine-section .magazine-title-row .magazine-carousel-actions > a::after {
    content: none !important;
    display: none !important;
}

.magazine-section .magazine-heading-wrap .section-subtitle {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

@media (max-width: 520px) {
    .magazine-section .magazine-section-title {
        display: block !important;
        padding: 2px 0 12px !important;
        margin: 0 0 12px !important;
        border: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        text-align: left !important;
    }

    .magazine-section .magazine-heading-wrap {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        text-align: left !important;
    }

    .magazine-section .magazine-badge {
        order: 1 !important;
        margin: 0 0 8px !important;
        padding: 3px 7px !important;
    }

    /* The short thick desktop-style accent belongs below the badge. */
    .magazine-section .magazine-badge::after {
        content: "" !important;
        position: absolute !important;
        left: 0 !important;
        bottom: -7px !important;
        width: 28px !important;
        height: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
        background: var(--accent) !important;
        border-radius: 2px !important;
        transform: none !important;
    }

    .magazine-section .magazine-title-row {
        order: 2 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 5px !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .magazine-section .magazine-title-row h2 {
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 15px !important;
        line-height: 22px !important;
        text-align: left !important;
        white-space: nowrap !important;
    }

    .magazine-section .magazine-title-row .magazine-carousel-actions {
        flex: 0 0 auto !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 4px !important;
        width: auto !important;
        min-width: max-content !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        white-space: nowrap !important;
    }

    .magazine-section .magazine-title-row .magazine-carousel-controls {
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        gap: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .magazine-section .magazine-title-row .magazine-carousel-controls .editorial-nav {
        flex: 0 0 22px !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        min-height: 22px !important;
        font-size: 13px !important;
        line-height: 1 !important;
    }

    .magazine-section .magazine-title-row .magazine-carousel-actions > a {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: max-content !important;
        height: 22px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 8px !important;
        line-height: 22px !important;
        white-space: nowrap !important;
        text-align: right !important;
    }

    .magazine-section .magazine-heading-wrap .section-subtitle {
        order: 3 !important;
        display: block !important;
        width: 100% !important;
        margin: 5px 0 0 !important;
        padding: 0 !important;
        font-size: 10px !important;
        line-height: 1.45 !important;
        text-align: left !important;
        white-space: normal !important;
    }

    /* Kill legacy pseudo-elements/positioning that targeted the old DOM. */
    .magazine-section .magazine-heading-wrap::before,
    .magazine-section .magazine-heading-wrap::after,
    .magazine-section .magazine-section-title::before,
    .magazine-section .magazine-section-title::after,
    .magazine-section .magazine-title-row h2::before,
    .magazine-section .magazine-title-row h2::after,
    .magazine-section .magazine-title-row .magazine-carousel-actions > a::after {
        content: none !important;
        display: none !important;
    }
}

/* ======================================================================
   SSI SHOP — UNIVERSAL CATEGORY FILTER
   Available on desktop and mobile. Category cards remain visible; the
   filter opens the full category list so long names are never truncated.
   ====================================================================== */
.ssi-mobile-category-filter-toggle {
  width: auto;
  min-height: 40px;
  margin: 2px 0 12px;
  padding: 0 13px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font: 800 11px/1 Arial, "Noto Sans", sans-serif;
  text-align: left;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, color .18s ease;
}
.ssi-mobile-category-filter-toggle:hover,
.ssi-mobile-category-filter-toggle:focus-visible {
  border-color: var(--accent);
  background: rgba(255,95,3,.055);
  outline: none;
}
.ssi-mobile-filter-icon { color: var(--accent); font-size: 13px; line-height: 1; }
.ssi-mobile-filter-count {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(255,95,3,.12);
  color: var(--accent);
  font-size: 9px;
}
.ssi-mobile-category-filter[hidden] { display: none !important; }
.ssi-mobile-category-filter:not([hidden]) {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 99999;
}
.ssi-mobile-category-filter-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.62);
}
.ssi-mobile-category-filter-panel {
  position: absolute;
  left: 50%;
  bottom: 24px;
  width: min(560px, calc(100vw - 32px));
  max-height: min(78vh, 620px);
  overflow: auto;
  transform: translateX(-50%);
  padding: 18px 16px calc(18px + env(safe-area-inset-bottom));
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--background);
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
}
.ssi-mobile-category-filter-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--border);
}
.ssi-mobile-category-filter-head h3 {
  margin: 3px 0 0;
  color: var(--text);
  font-size: 19px;
  line-height: 1.05;
  font-weight: 900;
}
.ssi-mobile-category-filter-close {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: var(--surface);
  color: var(--text);
  font-size: 21px;
  line-height: 1;
  cursor: pointer;
}
.ssi-mobile-category-filter-list {
  display: grid;
  gap: 8px;
  padding-top: 12px;
}
.ssi-mobile-category-filter-item {
  min-height: 48px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  text-decoration: none;
  font-size: 12px;
  line-height: 1.25;
  font-weight: 800;
}
.ssi-mobile-category-filter-item span {
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
.ssi-mobile-category-filter-item strong {
  flex: 0 0 auto;
  min-width: 26px;
  padding: 4px 7px;
  border-radius: 12px;
  background: rgba(255,95,3,.1);
  color: var(--accent);
  font-size: 9px;
  text-align: center;
}
.ssi-mobile-category-filter-item:hover,
.ssi-mobile-category-filter-item:focus-visible {
  border-color: var(--accent);
  outline: none;
}
.ssi-mobile-category-filter-item.is-all { border-color: var(--accent); }
body.ssi-mobile-filter-open { overflow: hidden; }

@media (max-width:768px) {
  .ssi-mobile-category-filter-toggle {
    width: 100%;
    margin: 2px 0 10px;
  }
  .ssi-mobile-category-filter-panel {
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    max-height: min(82vh, 680px);
    transform: none;
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
  }
}

/* ======================================================================
   SSI FANZINE — MAGAZINE CARD ROW ALIGNMENT
   Keep product card content at equal vertical positions even when titles
   wrap to different numbers of lines.
   ====================================================================== */
.magazine-section .magazine-item {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    height: 100% !important;
}

.magazine-section .magazine-thumb-wrap {
    flex: 0 0 auto !important;
}

.magazine-section .magazine-item-body {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

/* Reserve the same title height for every magazine card. */
.magazine-section .magazine-item-body h4 {
    min-height: calc(2 * 1.22em) !important;
    max-height: calc(2 * 1.22em) !important;
    overflow: hidden !important;
    margin-top: 0 !important;
    margin-bottom: 2px !important;
}

/* Keep price/stock and CTA rows aligned across every card. */
.magazine-section .magazine-item-meta {
    min-height: 17px !important;
    margin-bottom: 5px !important;
}

.magazine-section .magazine-card-footer {
    margin-top: auto !important;
    min-height: 38px !important;
    align-items: stretch !important;
}

.magazine-section .magazine-card-footer > .magazine-buy-btn,
.magazine-section .magazine-card-footer > .magazine-cart-btn {
    height: 38px !important;
    min-height: 38px !important;
    box-sizing: border-box !important;
}

.magazine-section .magazine-card-footer > .magazine-buy-btn,
.magazine-section .magazine-card-footer > .magazine-cart-btn {
    min-width: 0 !important;
}

/* ======================================================================
   SSI FANZINE — CHECKOUT 3-STEP FLOW v6
   Functional Review -> Details -> Payment navigation for the native
   WooCommerce Checkout block. Does not replace gateway functionality.
   ====================================================================== */
.ssi-checkout-stepper{
  width:100%; display:grid; grid-template-columns:1fr 70px 1fr 70px 1fr;
  align-items:center; gap:0; margin:0 0 24px; padding:12px 14px;
  border:1px solid var(--border); border-radius:14px;
  background:var(--surface); box-shadow:0 10px 28px var(--shadow);
}
.ssi-checkout-step{
  appearance:none; border:0; background:transparent; color:var(--text);
  display:flex; align-items:center; gap:11px; text-align:left; padding:7px 8px;
  cursor:pointer; min-width:0;
}
.ssi-checkout-step .ssi-step-number{
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--border);font-weight:900;font-size:13px;flex:0 0 40px;
}
.ssi-checkout-step b{display:block;font-size:14px;line-height:1.15}.ssi-checkout-step small{display:block;font-size:10px;opacity:.65;margin-top:3px}
.ssi-checkout-step.is-active .ssi-step-number,.ssi-checkout-step.is-complete .ssi-step-number{background:#f5223a;color:#fff;border-color:#f5223a}
.ssi-checkout-step.is-active b,.ssi-checkout-step.is-complete b{color:var(--text)}
.ssi-step-line{height:2px;background:var(--border);position:relative}.ssi-step-line.is-complete{background:#f5223a}
.ssi-checkout-step-title{margin:0 0 16px}.ssi-checkout-step-title h2{margin:0;font-size:28px;font-weight:900}.ssi-checkout-step-title p{margin:5px 0 0;opacity:.7}
.ssi-checkout-step-title[hidden]{display:none!important}
.ssi-checkout-nav-actions{display:flex;gap:12px;margin:18px 0 8px}.ssi-checkout-nav-actions button{min-height:52px;padding:0 24px;border-radius:9px;border:1px solid var(--border);font-weight:900;cursor:pointer}.ssi-checkout-nav-actions .ssi-next{background:var(--accent);color:#fff;border-color:var(--accent)}
.ssi-checkout-page .wc-block-components-checkout-step[data-ssi-stage-hidden="1"],
.ssi-checkout-page .wc-block-components-order-summary[data-ssi-stage-hidden="1"]{display:none!important}
.ssi-checkout-page .wc-block-components-checkout-step[data-ssi-stage="payment"]{scroll-margin-top:20px}

@media(max-width:800px){
 .ssi-checkout-stepper{grid-template-columns:1fr 28px 1fr 28px 1fr;padding:8px 5px;margin-bottom:20px}
 .ssi-checkout-step{display:flex;flex-direction:column;justify-content:center;text-align:center;gap:5px;padding:5px 2px}.ssi-checkout-step>span:last-child{display:block}.ssi-checkout-step .ssi-step-number{width:34px;height:34px;flex-basis:34px}.ssi-checkout-step b{font-size:12px}.ssi-checkout-step small{font-size:9px}.ssi-checkout-step-title h2{font-size:25px}
}

/* ======================================================================
   SSI FANZINE — CART UI REFRESH v9
   Bring the Cart page closer to the approved mobile checkout/cart concept
   while leaving WooCommerce cart controls and calculations native.
   ====================================================================== */
.ssi-cart-page .ssi-commerce-content{max-width:1180px;margin:0 auto;}
.ssi-cart-page .ssi-commerce-trust{margin-bottom:26px;}
.ssi-cart-page .ssi-cart-shell{width:100%;}
.ssi-cart-page .wc-block-cart,
.ssi-cart-page .woocommerce{width:100%;max-width:none;}

/* Product rows */
.ssi-cart-page .wc-block-cart-items,
.ssi-cart-page .woocommerce-cart-form{background:transparent!important;border:0!important;box-shadow:none!important;}
.ssi-cart-page .wc-block-cart-item,
.ssi-cart-page .woocommerce-cart-form__cart-item{border-bottom:1px solid var(--border)!important;}
.ssi-cart-page .wc-block-cart-item__image img,
.ssi-cart-page .woocommerce-cart-form__cart-item img{border-radius:4px!important;object-fit:cover!important;}
.ssi-cart-page .wc-block-cart-item__product,
.ssi-cart-page .woocommerce-cart-form__cart-item td.product-name{font-weight:800;}

/* Totals card */
.ssi-cart-page .wc-block-cart__sidebar,
.ssi-cart-page .cart_totals{border:1px solid var(--border)!important;border-radius:14px!important;background:var(--surface)!important;box-shadow:0 12px 30px var(--shadow)!important;}
.ssi-cart-page .wc-block-cart__sidebar{padding:0!important;}
.ssi-cart-page .wc-block-cart__submit-container{padding:18px!important;background:transparent!important;}
.ssi-cart-page .wc-block-components-totals-wrapper{border-color:var(--border)!important;}
.ssi-cart-page .wc-block-components-totals-footer-item{font-size:18px!important;font-weight:900!important;}

/* Mobile: make the cart read like the reference: item card, coupon, total,
   CTA, then enough breathing room above the fixed navigation. */
@media(max-width:800px){
  .ssi-cart-page{padding-left:14px!important;padding-right:14px!important;}
  .ssi-cart-page .ssi-commerce-hero{margin-bottom:12px!important;}
  .ssi-cart-page .ssi-commerce-trust{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:0!important;margin-bottom:18px!important;border:1px solid var(--border);border-radius:12px;overflow:hidden;}
  .ssi-cart-page .ssi-commerce-trust>div{min-height:58px!important;padding:9px 7px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:3px!important;border-right:1px solid var(--border);}
  .ssi-cart-page .ssi-commerce-trust>div:last-child{border-right:0;}
  .ssi-cart-page .ssi-commerce-trust strong{font-size:11px!important;}
  .ssi-cart-page .ssi-commerce-trust span{font-size:10px!important;line-height:1.15!important;}

  .ssi-cart-page .wc-block-cart__main,
  .ssi-cart-page .wc-block-cart-items{width:100%!important;min-width:0!important;}
  .ssi-cart-page .wc-block-cart-item{display:grid!important;grid-template-columns:78px minmax(0,1fr)!important;gap:12px!important;padding:16px 0!important;}
  .ssi-cart-page .wc-block-cart-item__image{width:78px!important;}
  .ssi-cart-page .wc-block-cart-item__image img{width:78px!important;height:108px!important;}
  .ssi-cart-page .wc-block-cart-item__product{min-width:0!important;}
  .ssi-cart-page .wc-block-cart-item__product .wc-block-components-product-name{font-size:13px!important;line-height:1.25!important;}
  .ssi-cart-page .wc-block-cart-item__quantity{margin-top:10px!important;}
  .ssi-cart-page .wc-block-cart__sidebar{margin-top:18px!important;border-radius:12px!important;}
  .ssi-cart-page .wc-block-cart__submit-container{padding:14px!important;}

  /* Classic-cart fallback */
  .ssi-cart-page .woocommerce-cart-form{padding:10px!important;}
  .ssi-cart-page .woocommerce-cart-form__cart-item{display:grid!important;grid-template-columns:78px minmax(0,1fr)!important;gap:12px!important;padding:14px 0!important;}
  .ssi-cart-page .woocommerce-cart-form__cart-item td{display:block!important;width:auto!important;border:0!important;padding:0!important;}
  .ssi-cart-page .woocommerce-cart-form__cart-item td.product-thumbnail{grid-row:1 / span 3;}
  .ssi-cart-page .woocommerce-cart-form__cart-item td.product-thumbnail img{width:78px!important;height:108px!important;}
  .ssi-cart-page .woocommerce-cart-form__cart-item td.product-remove{position:absolute!important;right:10px!important;}
  .ssi-cart-page .woocommerce-cart-form__cart-item td.product-quantity{margin-top:8px!important;}

  .ssi-cart-page .cart_totals{margin-top:18px!important;padding:16px!important;}
  .ssi-cart-page .wc-proceed-to-checkout a.checkout-button,
  .ssi-cart-page .wc-block-cart__submit-button{min-height:56px!important;border-radius:9px!important;font-size:12px!important;}
}

/* ======================================================================
   SSI FANZINE — CHECKOUT DETAILS EDITOR STAYS OPEN
   When the Details stage is entered, automatically open WooCommerce's
   collapsed billing/address card. Once open, it remains available for entry.
   ====================================================================== */
.ssi-checkout-page [data-ssi-stage-hidden="1"]{display:none!important;}
@media(min-width:801px){
  .ssi-checkout-page .wc-block-components-checkout-step{min-width:0!important;}
}

/* SSI checkout stages must survive WooCommerce block hydration/rerenders. */
.ssi-checkout-page [data-ssi-stage-hidden="1"]{display:none !important;}

/* SSI checkout flow v11: robust WooCommerce Blocks step visibility */
.ssi-checkout-page [data-ssi-stage-hidden="1"],
.ssi-checkout-page .wc-block-components-checkout-step[data-ssi-stage-hidden="1"],
.ssi-checkout-page .wc-block-checkout__contact-information[data-ssi-stage-hidden="1"],
.ssi-checkout-page .wc-block-checkout__billing-fields[data-ssi-stage-hidden="1"],
.ssi-checkout-page .wc-block-checkout__payment-method[data-ssi-stage-hidden="1"]{display:none!important;}
.ssi-checkout-page .ssi-checkout-nav-actions{display:flex;gap:12px;margin:18px 0 22px;align-items:center;}
.ssi-checkout-page .ssi-checkout-nav-actions button{border:1px solid #30343a;background:#181b20;color:#fff;border-radius:10px;padding:14px 22px;font-weight:800;cursor:pointer;}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{background:#f52335;border-color:#f52335;min-width:210px;}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-back{background:#181b20;}
@media(max-width:800px){.ssi-checkout-page .ssi-checkout-nav-actions{flex-direction:column;align-items:stretch}.ssi-checkout-page .ssi-checkout-nav-actions button{width:100%}.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{min-width:0}}

/* ======================================================================
   SSI FANZINE — CHECKOUT FLOW v12
   Stable classic WooCommerce checkout presentation: Review -> Details -> Payment.
   ====================================================================== */
.ssi-checkout-page [data-ssi-stage-hidden="1"]{display:none!important;}
.ssi-checkout-page .ssi-checkout-nav-actions{display:flex;gap:12px;margin:18px 0 22px;align-items:center;}
.ssi-checkout-page .ssi-checkout-nav-actions button{border:1px solid #30343a;background:#181b20;color:#fff;border-radius:10px;padding:14px 22px;font-weight:800;cursor:pointer;min-height:52px;}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{background:#f52335;border-color:#f52335;min-width:220px;}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-back{background:#181b20;}
.ssi-checkout-page .woocommerce-checkout{width:100%;}
.ssi-checkout-page #customer_details{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;}
.ssi-checkout-page .woocommerce-billing-fields,
.ssi-checkout-page .woocommerce-shipping-fields,
.ssi-checkout-page #order_review,
.ssi-checkout-page #payment{border:1px solid var(--border);border-radius:14px;background:var(--surface);padding:20px;box-shadow:0 10px 28px var(--shadow);}
.ssi-checkout-page #order_review{margin-top:18px;}
.ssi-checkout-page #payment{margin-top:18px;}
.ssi-checkout-page .woocommerce-checkout-review-order-table{width:100%;border-collapse:collapse;}
.ssi-checkout-page .woocommerce-checkout-review-order-table th,
.ssi-checkout-page .woocommerce-checkout-review-order-table td{padding:12px 8px;border-bottom:1px solid var(--border);text-align:left;}
.ssi-checkout-page .woocommerce-checkout-review-order-table tfoot td{text-align:right;font-weight:800;}
.ssi-checkout-page .woocommerce-checkout-review-order-table .product-total{white-space:nowrap;text-align:right;}
.ssi-checkout-page #place_order{min-height:54px;border-radius:9px;font-weight:900;}
@media(max-width:800px){
  .ssi-checkout-page .ssi-checkout-nav-actions{flex-direction:column;align-items:stretch;}
  .ssi-checkout-page .ssi-checkout-nav-actions button{width:100%;}
  .ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{min-width:0;}
  .ssi-checkout-page .woocommerce-billing-fields,
  .ssi-checkout-page .woocommerce-shipping-fields,
  .ssi-checkout-page #order_review,
  .ssi-checkout-page #payment{padding:16px;border-radius:12px;}
  .ssi-checkout-page .woocommerce-checkout-review-order-table th,
  .ssi-checkout-page .woocommerce-checkout-review-order-table td{padding:10px 5px;font-size:13px;}
}

/* ======================================================================
   SSI FANZINE — CHECKOUT UI POLISH v13
   Details keeps the product summary visible; Payment focuses on the
   order + gateway. Desktop uses a clean two-column layout and mobile
   collapses to a single column.
   ====================================================================== */
.ssi-checkout-page .ssi-checkout-shell{
  max-width:1180px;
  margin:0 auto;
}
.ssi-checkout-page form.checkout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(320px,.75fr);
  gap:22px;
  align-items:start;
}
.ssi-checkout-page form.checkout > .ssi-checkout-nav-actions{
  grid-column:1 / -1;
  margin:0 0 2px;
  padding:0;
}
.ssi-checkout-page form.checkout > #customer_details{
  grid-column:1;
  min-width:0;
  display:block;
}
.ssi-checkout-page form.checkout > #order_review{
  grid-column:2;
  grid-row:2;
  min-width:0;
  margin:0;
  position:sticky;
  top:24px;
}
.ssi-checkout-page form.checkout > #order_review:only-child{
  grid-column:1 / -1;
  grid-row:auto;
}
.ssi-checkout-page .woocommerce-billing-fields,
.ssi-checkout-page .woocommerce-shipping-fields{
  padding:24px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  box-shadow:0 12px 32px var(--shadow);
}
.ssi-checkout-page .woocommerce-billing-fields h3,
.ssi-checkout-page .woocommerce-shipping-fields h3{
  margin:0 0 20px;
  font-size:20px;
  font-weight:900;
}
.ssi-checkout-page .form-row{margin-bottom:16px;}
.ssi-checkout-page .form-row label{
  display:block;
  margin:0 0 7px;
  font-size:13px;
  font-weight:800;
}
.ssi-checkout-page .form-row input.input-text,
.ssi-checkout-page .form-row select,
.ssi-checkout-page .form-row textarea{
  width:100%;
  min-height:48px;
  border:1px solid #353a42;
  border-radius:9px;
  background:#171a1f;
  color:var(--text);
  padding:11px 13px;
  box-sizing:border-box;
}
.ssi-checkout-page .form-row textarea{min-height:100px;}
.ssi-checkout-page .woocommerce-checkout-review-order-table{
  margin:0;
  background:transparent;
}
.ssi-checkout-page #order_review{
  padding:22px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  box-shadow:0 12px 32px var(--shadow);
}
.ssi-checkout-page #order_review_heading{
  margin:0 0 16px;
  font-size:20px;
  font-weight:900;
}
.ssi-checkout-page .ssi-checkout-product-line{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.ssi-checkout-page .ssi-checkout-product-thumb{
  width:58px!important;
  height:78px!important;
  flex:0 0 58px;
  object-fit:cover;
  border-radius:6px;
  border:1px solid var(--border);
  background:#111;
}
.ssi-checkout-page .ssi-checkout-product-name{
  min-width:0;
  font-weight:800;
  line-height:1.3;
}
.ssi-checkout-page .woocommerce-checkout-review-order-table td.product-name{
  width:100%;
}
.ssi-checkout-page .woocommerce-checkout-review-order-table .product-total{
  vertical-align:middle;
}
.ssi-checkout-page #payment{
  margin-top:20px;
  padding:18px;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(0,0,0,.08);
}
.ssi-checkout-page #payment .place-order{padding:18px 0 0;}
.ssi-checkout-page #place_order{
  width:100%;
  min-height:56px;
  border:0;
  border-radius:10px;
  font-size:14px;
  font-weight:900;
  letter-spacing:.2px;
  background:#f52335;
  color:#fff;
  cursor:pointer;
  transition:transform .15s ease,filter .15s ease;
}
.ssi-checkout-page #place_order:hover{filter:brightness(1.06);transform:translateY(-1px);}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-back,
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{
  min-height:54px;
  padding:0 24px;
  border-radius:10px;
  font-size:13px;
  font-weight:900;
  letter-spacing:.1px;
}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{
  min-width:230px;
}

@media(max-width:900px){
  .ssi-checkout-page form.checkout{
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  .ssi-checkout-page form.checkout > .ssi-checkout-nav-actions,
  .ssi-checkout-page form.checkout > #customer_details,
  .ssi-checkout-page form.checkout > #order_review{
    width:100%;
  }
  .ssi-checkout-page form.checkout > #order_review{position:static;}
  .ssi-checkout-page .woocommerce-billing-fields,
  .ssi-checkout-page .woocommerce-shipping-fields,
  .ssi-checkout-page #order_review{padding:17px;}
}

@media(max-width:600px){
  .ssi-checkout-page .ssi-checkout-stepper{margin-left:0;margin-right:0;}
  .ssi-checkout-page .ssi-checkout-step small{display:none;}
  .ssi-checkout-page .ssi-checkout-step b{font-size:11px;}
  .ssi-checkout-page .ssi-checkout-nav-actions{gap:9px;}
  .ssi-checkout-page .ssi-checkout-nav-actions button{width:100%;}
  .ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{min-width:0;}
  .ssi-checkout-page .ssi-checkout-product-thumb{width:52px!important;height:70px!important;flex-basis:52px;}
  .ssi-checkout-page .woocommerce-checkout-review-order-table th,
  .ssi-checkout-page .woocommerce-checkout-review-order-table td{padding:10px 4px;}
}


/* ======================================================================
   SSI FANZINE — CHECKOUT UI POLISH v14
   Remove empty shipping container and tighten the action row.
   ====================================================================== */
.ssi-checkout-page form.checkout > #customer_details{
  display:block !important;
  width:100%;
}
.ssi-checkout-page #customer_details > .col-1,
.ssi-checkout-page #customer_details > .col-2{
  float:none !important;
  width:100% !important;
  max-width:none !important;
  padding:0 !important;
}
/* Hide WooCommerce's shipping panel when it contains no usable fields. */
.ssi-checkout-page #customer_details .woocommerce-shipping-fields:has(.woocommerce-shipping-fields__field-wrapper:empty),
.ssi-checkout-page #customer_details .woocommerce-shipping-fields:has(.shipping_address:empty){
  display:none !important;
}
.ssi-checkout-page #customer_details .woocommerce-shipping-fields:has(.woocommerce-shipping-fields__field-wrapper){
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
  margin:0 0 18px;
}
.ssi-checkout-page #customer_details .woocommerce-shipping-fields__field-wrapper:empty{
  display:none !important;
}
.ssi-checkout-page #customer_details .woocommerce-additional-fields{
  margin-top:18px;
  padding:24px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  box-shadow:0 12px 32px var(--shadow);
}
.ssi-checkout-page #customer_details .woocommerce-additional-fields h3{
  margin:0 0 18px;
  font-size:20px;
  font-weight:900;
}
.ssi-checkout-page .ssi-checkout-nav-actions{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  min-height:56px;
  margin:0 0 4px !important;
  padding:0 !important;
}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-back{
  min-width:112px;
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{
  min-width:250px;
  background:#f52335;
  color:#fff;
  border:1px solid #f52335;
}
.ssi-checkout-page .ssi-checkout-nav-actions button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:56px;
  line-height:1;
  margin:0;
}
@media(max-width:800px){
  .ssi-checkout-page .ssi-checkout-nav-actions{
    flex-direction:row;
  }
  .ssi-checkout-page .ssi-checkout-nav-actions button{width:auto;flex:1;min-width:0;}
}
@media(max-width:600px){
  .ssi-checkout-page .ssi-checkout-nav-actions{flex-direction:column;align-items:stretch;}
  .ssi-checkout-page .ssi-checkout-nav-actions button{width:100%;flex:0 0 auto;}
  .ssi-checkout-page #customer_details .woocommerce-additional-fields{padding:17px;}
}
.ssi-checkout-page [data-ssi-empty-shipping="1"]{display:none!important;}


/* ======================================================================
   SSI FANZINE — CHECKOUT UI POLISH v15
   Keep WooCommerce's classic checkout columns in a real desktop grid.
   Explicitly cancel WooCommerce's legacy floats/clear rules so the order
   summary cannot drop underneath the details column.
   ====================================================================== */
.ssi-checkout-page form.checkout{
  display:grid !important;
  grid-template-columns:minmax(0,1.42fr) minmax(340px,.78fr) !important;
  grid-template-rows:auto auto !important;
  column-gap:24px !important;
  row-gap:20px !important;
  align-items:start !important;
  width:100% !important;
  float:none !important;
  clear:none !important;
}
.ssi-checkout-page form.checkout > .ssi-checkout-nav-actions{
  grid-column:1 / -1 !important;
  grid-row:1 !important;
  width:100% !important;
  float:none !important;
  clear:none !important;
  margin:0 !important;
  padding:0 !important;
  justify-content:flex-start !important;
}
.ssi-checkout-page form.checkout > #customer_details{
  grid-column:1 !important;
  grid-row:2 !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  float:none !important;
  clear:none !important;
}
.ssi-checkout-page form.checkout > #order_review{
  grid-column:2 !important;
  grid-row:2 !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:22px !important;
  box-sizing:border-box !important;
  float:none !important;
  clear:none !important;
  position:sticky !important;
  top:24px !important;
  align-self:start !important;
}
.ssi-checkout-page form.checkout > #order_review::before,
.ssi-checkout-page form.checkout > #order_review::after{
  display:none !important;
}
.ssi-checkout-page #customer_details::before,
.ssi-checkout-page #customer_details::after{
  display:none !important;
}
.ssi-checkout-page #customer_details .col-1,
.ssi-checkout-page #customer_details .col-2{
  float:none !important;
  width:100% !important;
  max-width:none !important;
  clear:none !important;
  box-sizing:border-box !important;
}
.ssi-checkout-page #customer_details .woocommerce-additional-fields{
  width:100% !important;
  box-sizing:border-box !important;
}
.ssi-checkout-page #order_review_heading{
  display:block !important;
  margin:0 0 16px !important;
}
.ssi-checkout-page #order_review .shop_table{
  width:100% !important;
  margin:0 !important;
  table-layout:auto !important;
}
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-back,
.ssi-checkout-page .ssi-checkout-nav-actions .ssi-next{
  height:56px !important;
  min-height:56px !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

@media(max-width:900px){
  .ssi-checkout-page form.checkout{
    display:flex !important;
    flex-direction:column !important;
    gap:16px !important;
  }
  .ssi-checkout-page form.checkout > .ssi-checkout-nav-actions,
  .ssi-checkout-page form.checkout > #customer_details,
  .ssi-checkout-page form.checkout > #order_review{
    width:100% !important;
    grid-column:auto !important;
    grid-row:auto !important;
    position:static !important;
  }
}


/* ======================================================================
   SSI FANZINE — CHECKOUT UI v16
   Stable page-level action bar + clean order summary heading.
   ====================================================================== */
.ssi-checkout-page .ssi-checkout-page-actions{
  width:100%;
  max-width:1250px;
  margin:0 auto 18px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  box-sizing:border-box;
}
.ssi-checkout-page .ssi-checkout-page-actions button{
  height:56px;
  min-height:56px;
  border-radius:10px;
  border:1px solid var(--border);
  padding:0 25px;
  font:900 13px/1 inherit;
  letter-spacing:.2px;
  cursor:pointer;
  box-sizing:border-box;
  transition:transform .15s ease,filter .15s ease,background .15s ease;
}
.ssi-checkout-page .ssi-checkout-action-back{
  background:var(--surface);
  color:var(--text);
  min-width:108px;
}
.ssi-checkout-page .ssi-checkout-action-next{
  background:#f52335;
  border-color:#f52335;
  color:#fff;
  min-width:245px;
}
.ssi-checkout-page .ssi-checkout-page-actions button:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}
.ssi-checkout-page .ssi-checkout-page-actions button[hidden]{display:none!important;}

/* The native heading is retained, but presented as the summary card title. */
.ssi-checkout-page form.checkout > #order_review #order_review_heading{
  display:block!important;
  padding:0 0 14px!important;
  margin:0 0 14px!important;
  border-bottom:1px solid var(--border)!important;
  font-size:22px!important;
  line-height:1.15!important;
}
.ssi-checkout-page form.checkout > #order_review{
  padding:20px!important;
  border-radius:16px!important;
}
.ssi-checkout-page form.checkout > #order_review .shop_table{
  border-collapse:collapse!important;
}
.ssi-checkout-page form.checkout > #order_review .shop_table th,
.ssi-checkout-page form.checkout > #order_review .shop_table td{
  vertical-align:middle!important;
}
.ssi-checkout-page form.checkout > #customer_details{
  min-width:0!important;
}

@media(max-width:900px){
  .ssi-checkout-page .ssi-checkout-page-actions{
    margin-bottom:14px;
    gap:9px;
  }
  .ssi-checkout-page .ssi-checkout-page-actions button{
    flex:1 1 0;
    min-width:0;
    padding:0 12px;
  }
}
@media(max-width:560px){
  .ssi-checkout-page .ssi-checkout-page-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .ssi-checkout-page .ssi-checkout-page-actions button{width:100%;}
}
\n\n/* ======================================================================\n   SSI FANZINE — CHECKOUT UI v17\n   Navigation lives directly below the order/product summary.\n   ====================================================================== */\n.ssi-checkout-page form.checkout > #order_review{\n  display:flex !important;\n  flex-direction:column !important;\n  align-items:stretch !important;\n}\n.ssi-checkout-page form.checkout > #order_review .woocommerce-checkout-review-order-table{\n  order:2 !important;\n}\n.ssi-checkout-page form.checkout > #order_review #order_review_heading{\n  order:1 !important;\n}\n.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions{\n  order:3 !important;\n  width:100% !important;\n  max-width:none !important;\n  margin:16px 0 0 !important;\n  padding:16px 0 0 !important;\n  border-top:1px solid var(--border) !important;\n  display:flex !important;\n  align-items:stretch !important;\n  justify-content:flex-end !important;\n  gap:10px !important;\n}\n.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions .ssi-checkout-action-back,\n.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions .ssi-checkout-action-next{\n  flex:0 0 auto !important;\n  width:auto !important;\n  min-width:0 !important;\n  margin:0 !important;\n}\n.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions .ssi-checkout-action-next{\n  min-width:220px !important;\n}\n@media(max-width:560px){\n  .ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions{\n    flex-direction:column !important;\n  }\n  .ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions button{\n    width:100% !important;\n    min-width:0 !important;\n  }\n}\n
/* ======================================================================
   SSI FANZINE — CHECKOUT UI v18
   Refine order-summary action spacing/padding.
   ====================================================================== */
.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions{
  margin:16px 0 0 !important;
  padding:16px 0 18px !important;
  border-top:1px solid var(--border) !important;
  box-sizing:border-box !important;
  width:100% !important;
}
.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions .ssi-checkout-action-next{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-width:0 !important;
  min-height:68px !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions .ssi-checkout-action-back{
  min-height:68px !important;
  box-sizing:border-box !important;
}
@media(max-width:560px){
  .ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions{
    padding:14px 0 16px !important;
  }
}


/* ======================================================================
   SSI FANZINE — CHECKOUT UI v19
   Light-mode form controls, clean "Your order" heading placement,
   and strict required-field validation presentation.
   ====================================================================== */
/* Classic WooCommerce checkout fields were inheriting the dark field
   treatment even when the site is in light mode. */
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row input.input-text,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row select,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row textarea{
  background:#fff !important;
  color:#111 !important;
  -webkit-text-fill-color:#111 !important;
  border-color:#c7cbd1 !important;
  caret-color:#111 !important;
  box-shadow:none !important;
}
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row input.input-text::placeholder,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row textarea::placeholder{
  color:#7a8088 !important;
  -webkit-text-fill-color:#7a8088 !important;
  opacity:1 !important;
}
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row input.input-text:focus,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row select:focus,
body.woocommerce-checkout:not(.dark-mode):not(.dark-theme):not([data-theme="dark"])
.ssi-checkout-page .form-row textarea:focus{
  border-color:#f52335 !important;
  box-shadow:0 0 0 3px rgba(245,35,53,.10) !important;
  outline:none !important;
}

/* Put WooCommerce's native "Your order" heading above the summary card,
   instead of letting the browser place it at the top of the whole grid. */
.ssi-checkout-page form.checkout > #order_review_heading{
  grid-column:2 !important;
  grid-row:2 !important;
  align-self:start !important;
  margin:0 !important;
  padding:0 20px 12px !important;
  border:0 !important;
  font-size:21px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
  color:var(--text) !important;
  box-sizing:border-box !important;
  position:relative !important;
  z-index:2 !important;
  transform:translateY(-2px) !important;
}
.ssi-checkout-page form.checkout > #order_review{
  grid-column:2 !important;
  grid-row:2 !important;
  margin-top:44px !important;
  align-self:start !important;
}
.ssi-checkout-page form.checkout > #customer_details{
  grid-column:1 !important;
  grid-row:2 !important;
}

/* When Details are visible, keep the summary heading and card together. */
.ssi-checkout-page form.checkout > #customer_details[data-ssi-stage-hidden="1"] ~ #order_review_heading,
.ssi-checkout-page form.checkout > #customer_details[data-ssi-stage-hidden="1"] ~ #order_review{
  grid-column:1 / -1 !important;
}
.ssi-checkout-page form.checkout > #customer_details[data-ssi-stage-hidden="1"] ~ #order_review_heading{
  padding-left:20px !important;
}
.ssi-checkout-page form.checkout > #customer_details[data-ssi-stage-hidden="1"] ~ #order_review{
  margin-top:0 !important;
}

/* Make validation errors visually obvious without changing WooCommerce's
   native validation behavior. */
.ssi-checkout-page .form-row.woocommerce-invalid input.input-text,
.ssi-checkout-page .form-row.woocommerce-invalid select,
.ssi-checkout-page .form-row.woocommerce-invalid textarea,
.ssi-checkout-page .form-row input.input-text:invalid,
.ssi-checkout-page .form-row select:invalid,
.ssi-checkout-page .form-row textarea:invalid{
  border-color:#f52335 !important;
}

@media(max-width:900px){
  .ssi-checkout-page form.checkout > #order_review_heading,
  .ssi-checkout-page form.checkout > #order_review{
    grid-column:1 / -1 !important;
  }
  .ssi-checkout-page form.checkout > #order_review_heading{
    grid-row:auto !important;
    padding:0 17px 10px !important;
    margin-top:4px !important;
  }
  .ssi-checkout-page form.checkout > #order_review{
    grid-row:auto !important;
    margin-top:0 !important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT UI v20
   Fix the native WooCommerce "Your order" heading overlap.
   WooCommerce renders #order_review_heading as a sibling of #order_review,
   not as a child. Previous grid rules placed both in the same grid cell.
   ====================================================================== */
.ssi-checkout-page form.checkout > #order_review_heading{
  display:none !important;
}

.ssi-checkout-page form.checkout > #order_review{
  grid-column:2 !important;
  grid-row:2 !important;
  margin-top:0 !important;
  padding:20px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}

.ssi-checkout-page form.checkout > #order_review::before{
  content:"Your order" !important;
  display:block !important;
  margin:0 0 14px !important;
  padding:0 0 14px !important;
  border-bottom:1px solid var(--border) !important;
  color:var(--text) !important;
  font-size:22px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
  letter-spacing:-.3px !important;
}

.ssi-checkout-page form.checkout > #order_review .woocommerce-checkout-review-order-table{
  margin:0 !important;
}

/* Keep the action button visually attached to the summary without
   introducing another overlapping layer. */
.ssi-checkout-page form.checkout > #order_review > .ssi-checkout-page-actions{
  position:static !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin:16px 0 0 !important;
  padding:16px 0 0 !important;
}

@media(max-width:900px){
  .ssi-checkout-page form.checkout > #order_review_heading{
    display:none !important;
  }
  .ssi-checkout-page form.checkout > #order_review{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
    margin-top:0 !important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW = CART
   Step 1 intentionally uses WooCommerce's real cart so customers can
   change quantities/remove editions/apply coupons before Details.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell{
  width:100%;
  max-width:1180px;
  margin:0 auto;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell > .woocommerce{
  width:100%;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form,
.ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals{
  margin-bottom:0;
}
.ssi-checkout-page.ssi-checkout-stage-1 .wc-proceed-to-checkout{
  margin-top:16px!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .wc-proceed-to-checkout a.ssi-review-continue{
  display:flex!important;
  width:100%!important;
  min-height:58px!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  border-radius:10px!important;
  font-weight:900!important;
  letter-spacing:.1px!important;
  text-transform:uppercase!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .cart_totals{
  margin-bottom:0!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-commerce-content{
  padding-top:0!important;
}

/* Stage 2/3 navigation is above the checkout columns, never inside them. */
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions,
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions{
  width:100%;
  max-width:1180px;
  margin:0 auto 18px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  box-sizing:border-box;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-action-back,
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-back,
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-action-next{
  min-height:52px;
  padding:0 24px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  text-decoration:none;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-action-next{min-width:230px;}
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-back{margin-right:auto;}
.ssi-checkout-page [data-ssi-stage-hidden="1"]{display:none!important;}

@media(max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell{padding:0 14px;box-sizing:border-box;}
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions,
  .ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions{padding:0 14px;flex-direction:column;align-items:stretch;}
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-action-back,
  .ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-back,
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-action-next{width:100%;margin:0;}
}


/* ======================================================================
   SSI FANZINE — CART DIRECT REVIEW UI v22
   The Cart page is the Review stage. Keep WooCommerce functionality,
   but present it as a deliberate first checkout step.
   ====================================================================== */
.ssi-cart-page .ssi-commerce-content{
  max-width:1180px!important;
  margin:0 auto!important;
  padding-top:4px!important;
}
.ssi-cart-page .ssi-commerce-hero{
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding:30px 28px!important;
}
.ssi-cart-page .ssi-commerce-hero h1{
  margin:0!important;
  font-size:clamp(40px,5vw,68px)!important;
  line-height:.96!important;
  letter-spacing:-2.5px!important;
}
.ssi-cart-page .ssi-commerce-hero p{
  margin:10px 0 0!important;
  max-width:650px!important;
  font-size:15px!important;
}
.ssi-cart-page .ssi-commerce-trust{
  max-width:1180px!important;
  margin:14px auto 24px!important;
}
.ssi-cart-page .ssi-commerce-trust>div{
  transition:background .2s ease,border-color .2s ease;
}
.ssi-cart-page .ssi-commerce-trust>div.is-active{
  background:rgba(245,34,58,.07)!important;
}
.ssi-cart-page .ssi-commerce-trust>div.is-active strong{
  color:var(--accent)!important;
}

/* Give the actual cart a two-column Review layout. */
.ssi-cart-page .ssi-cart-shell > .woocommerce{
  display:grid!important;
  grid-template-columns:minmax(0,1.65fr) minmax(310px,.75fr)!important;
  gap:26px!important;
  align-items:start!important;
}
.ssi-cart-page .woocommerce-cart-form{
  min-width:0!important;
  margin:0!important;
  padding:24px!important;
  border:1px solid var(--border)!important;
  border-radius:16px!important;
  background:var(--surface)!important;
  box-shadow:0 14px 36px var(--shadow)!important;
}
.ssi-cart-page .woocommerce-cart-form::before{
  content:'YOUR EDITIONS';
  display:block;
  margin:0 0 18px;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.4px;
  color:var(--muted);
}
.ssi-cart-page .woocommerce-cart-form table.shop_table{
  width:100%!important;
  border:0!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
.ssi-cart-page .woocommerce-cart-form thead th{
  padding:12px 10px!important;
  border-bottom:1px solid var(--border)!important;
  font-size:11px!important;
  text-transform:uppercase!important;
  letter-spacing:.7px!important;
}
.ssi-cart-page .woocommerce-cart-form tbody td{
  padding:20px 10px!important;
  vertical-align:middle!important;
  border-bottom:1px solid var(--border)!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-thumbnail img{
  width:84px!important;
  height:112px!important;
  object-fit:cover!important;
  border-radius:6px!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-name a{
  font-size:15px!important;
  font-weight:900!important;
  line-height:1.3!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-price,
.ssi-cart-page .woocommerce-cart-form td.product-subtotal{
  font-weight:900!important;
  white-space:nowrap!important;
}
.ssi-cart-page .woocommerce-cart-form .quantity{
  display:inline-flex!important;
  align-items:center!important;
}
.ssi-cart-page .woocommerce-cart-form .quantity input.qty{
  min-height:40px!important;
  width:62px!important;
  text-align:center!important;
  border:1px solid var(--border)!important;
  border-radius:7px!important;
  background:var(--surface-2)!important;
  color:var(--text)!important;
}
.ssi-cart-page .woocommerce-cart-form .product-remove a.remove{
  display:inline-grid!important;
  place-items:center!important;
  width:32px!important;
  height:32px!important;
  border-radius:7px!important;
  color:var(--muted)!important;
  background:transparent!important;
}
.ssi-cart-page .woocommerce-cart-form .product-remove a.remove:hover{
  color:#fff!important;
  background:var(--accent)!important;
}
.ssi-cart-page .woocommerce-cart-form .actions{
  padding:18px 0 0!important;
  border:0!important;
}
.ssi-cart-page .woocommerce-cart-form .actions .coupon{
  display:flex!important;
  gap:9px!important;
  align-items:center!important;
}
.ssi-cart-page .woocommerce-cart-form .actions .coupon input.input-text{
  min-height:44px!important;
  width:190px!important;
  box-sizing:border-box!important;
}
.ssi-cart-page .woocommerce-cart-form .actions button[name="update_cart"],
.ssi-cart-page .woocommerce-cart-form .actions .button{
  min-height:44px!important;
  border-radius:8px!important;
  font-weight:900!important;
}

/* Summary is the final review card. */
.ssi-cart-page .cart-collaterals{
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.ssi-cart-page .cart_totals{
  width:100%!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:22px!important;
  border:1px solid var(--border)!important;
  border-radius:16px!important;
  background:var(--surface)!important;
  box-shadow:0 14px 36px var(--shadow)!important;
}
.ssi-cart-page .cart_totals h2{
  margin:0 0 18px!important;
  font-size:22px!important;
  line-height:1.1!important;
}
.ssi-cart-page .cart_totals table{
  width:100%!important;
  border:0!important;
  margin:0!important;
}
.ssi-cart-page .cart_totals th,
.ssi-cart-page .cart_totals td{
  padding:14px 0!important;
  border-bottom:1px solid var(--border)!important;
  background:transparent!important;
}
.ssi-cart-page .cart_totals .order-total th,
.ssi-cart-page .cart_totals .order-total td{
  border-bottom:0!important;
  padding-top:18px!important;
  font-size:20px!important;
  font-weight:900!important;
}
.ssi-cart-page .wc-proceed-to-checkout{
  padding:0!important;
  margin:18px 0 0!important;
}
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:58px!important;
  margin:0!important;
  border-radius:9px!important;
  background:var(--accent)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  letter-spacing:.3px!important;
  box-shadow:none!important;
}
.ssi-cart-page .wc-proceed-to-checkout a.checkout-button:hover{
  transform:translateY(-1px);
}

@media(max-width:800px){
  .ssi-cart-page .ssi-commerce-hero{padding:24px 18px!important;}
  .ssi-cart-page .ssi-commerce-hero h1{font-size:40px!important;letter-spacing:-1.8px!important;}
  .ssi-cart-page .ssi-commerce-trust{margin-bottom:18px!important;}
  .ssi-cart-page .ssi-cart-shell > .woocommerce{display:block!important;}
  .ssi-cart-page .woocommerce-cart-form{padding:16px!important;margin-bottom:16px!important;}
  .ssi-cart-page .woocommerce-cart-form thead{display:none!important;}
  .ssi-cart-page .woocommerce-cart-form table.shop_table,
  .ssi-cart-page .woocommerce-cart-form tbody,
  .ssi-cart-page .woocommerce-cart-form tr,
  .ssi-cart-page .woocommerce-cart-form td{display:block!important;width:100%!important;box-sizing:border-box!important;}
  .ssi-cart-page .woocommerce-cart-form tbody tr.cart_item{
    display:grid!important;
    grid-template-columns:72px minmax(0,1fr) 28px!important;
    gap:12px!important;
    padding:16px 0!important;
  }
  .ssi-cart-page .woocommerce-cart-form tbody tr.cart_item td{padding:0!important;border:0!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail{grid-column:1;grid-row:1 / span 4!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail img{width:72px!important;height:96px!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-name{grid-column:2;grid-row:1;}
  .ssi-cart-page .woocommerce-cart-form td.product-price{grid-column:2;grid-row:2;margin-top:4px!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-quantity{grid-column:2;grid-row:3;margin-top:9px!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-subtotal{display:none!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-remove{grid-column:3;grid-row:1;}
  .ssi-cart-page .woocommerce-cart-form .actions{display:flex!important;flex-direction:column!important;gap:10px!important;}
  .ssi-cart-page .woocommerce-cart-form .actions .coupon{width:100%!important;}
  .ssi-cart-page .woocommerce-cart-form .actions .coupon input.input-text{width:100%!important;flex:1!important;}
  .ssi-cart-page .woocommerce-cart-form .actions .coupon button{min-width:110px!important;}
  .ssi-cart-page .woocommerce-cart-form .actions button[name="update_cart"]{width:100%!important;}
  .ssi-cart-page .cart_totals{padding:18px!important;}
}

/* Light-mode form controls on Cart */
body.light-mode .ssi-cart-page .quantity input.qty,
body.light-mode .ssi-cart-page input.input-text,
body.light-mode .ssi-cart-page select{
  background:#fff!important;
  color:#17191d!important;
  border-color:#cfd3d8!important;
}

/* SSI FANZINE — Review stage cart thumbnails: keep only WooCommerce's native
   thumbnail. The checkout product-name filter intentionally adds a second
   thumbnail for Details/Payment, but Review must stay compact. */
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail,
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img,
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .product-thumbnail img{
  width:84px!important;
  min-width:84px!important;
  max-width:84px!important;
  height:112px!important;
  max-height:112px!important;
  object-fit:contain!important;
  object-position:center!important;
  display:block!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name img,
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .ssi-checkout-product-thumb{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .ssi-checkout-product-line{
  display:contents!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
  max-width:none!important;
}
@media(max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .product-thumbnail img{
    width:72px!important; min-width:72px!important; max-width:72px!important;
    height:96px!important; max-height:96px!important;
  }
}

/* ======================================================================
   SSI FANZINE — CART REVIEW UI v25
   Final alignment pass: product header/image, coupon controls, responsive rows.
   ====================================================================== */
.ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name{
  position:relative!important;
  text-align:left!important;
  padding-left:108px!important;
}
.ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name::before{
  content:'PRODUCT'!important;
  position:absolute!important;
  left:10px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.7px!important;
  color:var(--text)!important;
}
.ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name{
  font-size:0!important;
}
.ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name::after{
  content:'Edition'!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.4px!important;
  color:var(--muted)!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-thumbnail{
  width:104px!important;
  min-width:104px!important;
  padding-left:10px!important;
  padding-right:4px!important;
  text-align:center!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-thumbnail img{
  display:block!important;
  width:84px!important;
  height:112px!important;
  margin:0 auto!important;
  object-fit:cover!important;
  object-position:center!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-name{
  padding-left:12px!important;
}
.ssi-cart-page .woocommerce-cart-form td.product-name a{
  display:block!important;
  max-width:100%!important;
}

/* Coupon controls: give the code field enough room and keep the actions
   balanced instead of letting the placeholder get clipped. */
.ssi-cart-page .woocommerce-cart-form .actions{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  flex-wrap:wrap!important;
}
.ssi-cart-page .woocommerce-cart-form .actions .coupon{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex:1 1 420px!important;
  min-width:0!important;
}
.ssi-cart-page .woocommerce-cart-form .actions .coupon input.input-text{
  width:260px!important;
  min-width:0!important;
  flex:1 1 260px!important;
  height:44px!important;
  padding:0 13px!important;
  box-sizing:border-box!important;
}
.ssi-cart-page .woocommerce-cart-form .actions .coupon button{
  flex:0 0 auto!important;
  min-height:44px!important;
  white-space:nowrap!important;
  padding:0 18px!important;
}
.ssi-cart-page .woocommerce-cart-form .actions button[name="update_cart"]{
  flex:0 0 auto!important;
  min-height:44px!important;
  margin-left:auto!important;
  white-space:nowrap!important;
  padding:0 20px!important;
}

/* Mobile: one predictable product card per row. */
@media(max-width:800px){
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name{
    display:block!important;
    width:100%!important;
    height:34px!important;
    padding:0 0 10px 84px!important;
    box-sizing:border-box!important;
    position:relative!important;
    text-align:left!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name::before{
    left:0!important;
    top:10px!important;
    transform:none!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name::after{
    display:none!important;
  }
  .ssi-cart-page .woocommerce-cart-form tbody tr.cart_item{
    grid-template-columns:72px minmax(0,1fr) 30px!important;
    align-items:start!important;
    gap:12px!important;
    min-height:128px!important;
    padding:16px 0!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail{
    width:72px!important;
    min-width:72px!important;
    padding:0!important;
    grid-column:1!important;
    grid-row:1 / span 4!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail img{
    width:72px!important;
    height:96px!important;
    margin:0!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-name{
    padding:0!important;
    min-width:0!important;
    grid-column:2!important;
    grid-row:1!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-name a{
    font-size:14px!important;
    line-height:1.3!important;
    overflow-wrap:anywhere!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-price{
    grid-column:2!important;
    grid-row:2!important;
    margin-top:6px!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-quantity{
    grid-column:2!important;
    grid-row:3!important;
    margin-top:8px!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-remove{
    grid-column:3!important;
    grid-row:1!important;
    padding:0!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    width:100%!important;
    gap:8px!important;
    flex:none!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon input.input-text{
    width:100%!important;
    min-width:0!important;
    flex:none!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon button{
    min-width:112px!important;
    padding:0 14px!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions button[name="update_cart"]{
    width:100%!important;
    margin:0!important;
  }
}

/* ======================================================================
   SSI FANZINE — CART REVIEW UI v26
   Rebuild the cart table alignment instead of patching WooCommerce's
   default table layout. Desktop uses a fixed review grid; mobile uses
   compact product cards.
   ====================================================================== */
.ssi-cart-page .woocommerce-cart-form{
  overflow:hidden!important;
}

/* Desktop review table ------------------------------------------------ */
@media(min-width:801px){
  .ssi-cart-page .woocommerce-cart-form table.shop_table{
    display:block!important;
    width:100%!important;
    table-layout:fixed!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead,
  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody{
    display:block!important;
    width:100%!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead tr,
  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    display:grid!important;
    grid-template-columns:72px minmax(0,1fr) 100px 84px 100px 32px!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead tr{
    min-height:40px!important;
    align-items:center!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    height:40px!important;
    padding:8px 8px!important;
    box-sizing:border-box!important;
    border-bottom:1px solid var(--border)!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name{
    grid-column:1 / span 2!important;
    grid-row:1!important;
    position:static!important;
    padding:8px 8px!important;
    font-size:12px!important;
    text-align:left!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name::before,
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-name::after{
    display:none!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-price{grid-column:3!important;grid-row:1!important;justify-content:flex-end!important;}
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-quantity{grid-column:4!important;grid-row:1!important;justify-content:center!important;}
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-subtotal{grid-column:5!important;grid-row:1!important;justify-content:flex-end!important;}
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead th.product-remove{display:none!important;}

  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    position:relative!important;
    align-items:center!important;
    min-height:100px!important;
    padding:8px 0!important;
    border-bottom:1px solid var(--border)!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody tr.cart_item td{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    box-sizing:border-box!important;
    padding:8px 8px!important;
    border:0!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    grid-row:1!important;
    justify-content:center!important;
    width:auto!important;
    min-width:0!important;
    padding:8px 6px!important;
    text-align:center!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;
    width:56px!important;
    height:76px!important;
    max-width:56px!important;
    max-height:76px!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:5px!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-name{
    grid-column:2!important;
    grid-row:1!important;
    padding-left:8px!important;
    padding-right:16px!important;
    text-align:left!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-name a{
    display:block!important;
    width:100%!important;
    font-size:15px!important;
    line-height:1.35!important;
    font-weight:800!important;
    overflow-wrap:anywhere!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-price{grid-column:3!important;grid-row:1!important;justify-content:flex-end!important;white-space:nowrap!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-quantity{grid-column:4!important;grid-row:1!important;justify-content:center!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-subtotal{grid-column:5!important;grid-row:1!important;justify-content:flex-end!important;white-space:nowrap!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-remove{
    grid-column:6!important;
    grid-row:1!important;
    justify-content:center!important;
    padding:10px 0!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-remove a.remove{
    width:28px!important;
    height:28px!important;
    margin:0!important;
  }

  /* Coupon/update controls sit below the product rows with equal spacing. */
  .ssi-cart-page .woocommerce-cart-form .actions{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
    padding:18px 0 0!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    flex:0 1 430px!important;
    min-width:0!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon input.input-text{
    flex:1 1 250px!important;
    width:250px!important;
    min-width:0!important;
    height:44px!important;
    padding:0 13px!important;
    box-sizing:border-box!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon button{
    flex:0 0 auto!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 17px!important;
    white-space:nowrap!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions button[name="update_cart"]{
    flex:0 0 auto!important;
    height:44px!important;
    min-height:44px!important;
    margin-left:auto!important;
    padding:0 20px!important;
    white-space:nowrap!important;
  }
}

/* Mobile review cards ------------------------------------------------- */
@media(max-width:800px){
  .ssi-cart-page .woocommerce-cart-form{
    padding:14px!important;
  }
  .ssi-cart-page .woocommerce-cart-form::before{
    content:'PRODUCTS'!important;
    display:block!important;
    margin:0 0 12px!important;
    font-size:12px!important;
    font-weight:900!important;
    letter-spacing:1px!important;
    color:var(--text)!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table{
    display:block!important;
    width:100%!important;
    border:0!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table thead{
    display:none!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody{
    display:block!important;
    width:100%!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    display:grid!important;
    grid-template-columns:76px minmax(0,1fr) 28px!important;
    grid-template-rows:auto auto auto!important;
    align-items:start!important;
    column-gap:12px!important;
    row-gap:6px!important;
    width:100%!important;
    min-height:0!important;
    padding:16px 0!important;
    box-sizing:border-box!important;
    border-bottom:1px solid var(--border)!important;
  }
  .ssi-cart-page .woocommerce-cart-form table.shop_table tbody tr.cart_item td{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    padding:0!important;
    border:0!important;
    box-sizing:border-box!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    grid-row:1 / span 3!important;
    width:76px!important;
    min-width:76px!important;
    padding:0!important;
    text-align:left!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;
    width:68px!important;
    height:92px!important;
    max-width:68px!important;
    max-height:92px!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:5px!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-name{
    grid-column:2!important;
    grid-row:1!important;
    padding:0!important;
    text-align:left!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-name a{
    display:block!important;
    width:100%!important;
    font-size:13px!important;
    line-height:1.32!important;
    font-weight:800!important;
    overflow-wrap:anywhere!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-price{
    grid-column:2!important;
    grid-row:2!important;
    margin:2px 0 0!important;
    font-size:13px!important;
    font-weight:800!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-quantity{
    grid-column:2!important;
    grid-row:3!important;
    margin:2px 0 0!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-subtotal{display:none!important;}
  .ssi-cart-page .woocommerce-cart-form td.product-remove{
    grid-column:3!important;
    grid-row:1!important;
    padding:0!important;
    text-align:right!important;
  }
  .ssi-cart-page .woocommerce-cart-form td.product-remove a.remove{
    display:inline-grid!important;
    place-items:center!important;
    width:24px!important;
    height:24px!important;
    margin:0!important;
    font-size:20px!important;
  }
  .ssi-cart-page .woocommerce-cart-form .quantity{
    display:inline-flex!important;
    align-items:center!important;
    width:auto!important;
  }
  .ssi-cart-page .woocommerce-cart-form .quantity input.qty{
    width:54px!important;
    min-height:34px!important;
    height:34px!important;
    padding:0 4px!important;
  }

  .ssi-cart-page .woocommerce-cart-form .actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
    padding:16px 0 0!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    width:100%!important;
    gap:8px!important;
    margin:0!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon input.input-text{
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    padding:0 11px!important;
    box-sizing:border-box!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions .coupon button{
    min-width:108px!important;
    height:42px!important;
    min-height:42px!important;
    padding:0 12px!important;
    white-space:nowrap!important;
  }
  .ssi-cart-page .woocommerce-cart-form .actions button[name="update_cart"]{
    width:100%!important;
    height:44px!important;
    min-height:44px!important;
    margin:0!important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW STAGE v27
   The header Cart button opens /checkout/?ssi_checkout_step=1.  That means
   the Review screen is the WooCommerce cart rendered inside .ssi-review-cart-shell,
   not .ssi-cart-page.  Give this embedded cart its own final layout.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell{
  width:100%!important;
  max-width:100%!important;
  overflow:visible!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell > .woocommerce{
  width:100%!important;
  max-width:100%!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
}

/* Keep the review table as one predictable desktop grid. */
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table{
    display:block!important;
    width:100%!important;
    margin:0!important;
    border:1px solid var(--border)!important;
    border-radius:10px!important;
    overflow:hidden!important;
    table-layout:fixed!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody{
    display:block!important;
    width:100%!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr) 120px 92px 125px 42px!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr{
    min-height:50px!important;
    align-items:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    height:50px!important;
    margin:0!important;
    padding:10px 10px!important;
    box-sizing:border-box!important;
    border:0!important;
    border-bottom:1px solid var(--border)!important;
  }
  /* PRODUCT heading sits above the cover + product-name area. */
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name{
    grid-column:1 / span 2!important;
    grid-row:1!important;
    justify-content:flex-start!important;
    padding-left:14px!important;
    font-size:14px!important;
    font-weight:900!important;
    text-align:left!important;
    position:static!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name::after{
    display:none!important;
    content:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-price{
    grid-column:3!important;grid-row:1!important;justify-content:flex-end!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-quantity{
    grid-column:4!important;grid-row:1!important;justify-content:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-subtotal{
    grid-column:5!important;grid-row:1!important;justify-content:flex-end!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-remove{
    display:none!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    min-height:138px!important;
    align-items:center!important;
    padding:12px 0!important;
    border:0!important;
    border-bottom:1px solid var(--border)!important;
    box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item:last-child{
    border-bottom:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item td{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    margin:0!important;
    padding:10px!important;
    border:0!important;
    box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;grid-row:1!important;
    justify-content:center!important;
    width:auto!important;min-width:0!important;
    padding:10px 8px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;
    width:76px!important;height:102px!important;
    min-width:76px!important;max-width:76px!important;
    max-height:102px!important;
    margin:0 auto!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:5px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
    grid-column:2!important;grid-row:1!important;
    justify-content:flex-start!important;
    padding:10px 14px!important;
    text-align:left!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name a{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    font-size:15px!important;
    line-height:1.35!important;
    font-weight:800!important;
    overflow-wrap:anywhere!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name::before{
    display:none!important;
    content:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price{
    grid-column:3!important;grid-row:1!important;justify-content:flex-end!important;white-space:nowrap!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity{
    grid-column:4!important;grid-row:1!important;justify-content:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal{
    grid-column:5!important;grid-row:1!important;justify-content:flex-end!important;white-space:nowrap!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    grid-column:6!important;grid-row:1!important;justify-content:center!important;padding:10px 4px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove{
    display:grid!important;place-items:center!important;
    width:28px!important;height:28px!important;margin:0!important;
    font-size:22px!important;line-height:1!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    flex-wrap:wrap!important;
    padding:16px!important;
    margin:0!important;
    border-top:1px solid var(--border)!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    display:flex!important;align-items:center!important;gap:8px!important;
    flex:1 1 420px!important;min-width:320px!important;margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon input.input-text{
    flex:1 1 auto!important;width:auto!important;min-width:0!important;
    height:44px!important;margin:0!important;padding:0 13px!important;box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon button{
    flex:0 0 auto!important;height:44px!important;min-height:44px!important;
    margin:0!important;padding:0 18px!important;white-space:nowrap!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    flex:0 0 auto!important;width:auto!important;height:44px!important;min-height:44px!important;
    margin:0 0 0 auto!important;padding:0 20px!important;white-space:nowrap!important;
  }
}

/* Mobile: compact cards, no WooCommerce responsive pseudo-labels/colons. */
@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table{
    display:block!important;width:100%!important;margin:0!important;border:1px solid var(--border)!important;
    border-radius:10px!important;overflow:hidden!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead{
    display:block!important;width:100%!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr{
    display:block!important;width:100%!important;min-height:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th{
    display:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name{
    display:block!important;height:44px!important;width:100%!important;
    padding:13px 14px!important;border:0!important;border-bottom:1px solid var(--border)!important;
    font-size:13px!important;font-weight:900!important;text-align:left!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name::before{
    content:'PRODUCT'!important;display:block!important;position:static!important;transform:none!important;
    font-size:13px!important;font-weight:900!important;letter-spacing:.4px!important;color:var(--text)!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name::after{
    display:none!important;content:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody{
    display:block!important;width:100%!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    display:grid!important;
    grid-template-columns:78px minmax(0,1fr) 28px!important;
    grid-template-rows:auto auto auto!important;
    align-items:start!important;
    column-gap:12px!important;row-gap:7px!important;
    width:100%!important;min-height:0!important;
    padding:16px 12px!important;margin:0!important;
    border:0!important;border-bottom:1px solid var(--border)!important;
    box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item:last-child{
    border-bottom:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item td{
    display:block!important;width:auto!important;min-width:0!important;
    margin:0!important;padding:0!important;border:0!important;box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;grid-row:1 / span 3!important;
    width:78px!important;min-width:78px!important;padding:0!important;text-align:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;width:72px!important;height:96px!important;
    min-width:72px!important;max-width:72px!important;max-height:96px!important;
    margin:0 auto!important;object-fit:cover!important;border-radius:5px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
    grid-column:2!important;grid-row:1!important;padding:0!important;text-align:left!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name::after{
    display:none!important;content:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name a{
    display:block!important;width:100%!important;margin:0!important;
    font-size:13px!important;line-height:1.35!important;font-weight:800!important;
    overflow-wrap:anywhere!important;text-align:left!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price{
    grid-column:2!important;grid-row:2!important;
    padding-top:1px!important;font-size:13px!important;font-weight:800!important;text-align:left!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price::after{
    display:none!important;content:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity{
    grid-column:2!important;grid-row:3!important;text-align:left!important;padding-top:2px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity::after,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal::after,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove::after{
    display:none!important;content:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal{display:none!important;}
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    grid-column:3!important;grid-row:1!important;text-align:right!important;padding:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove{
    display:grid!important;place-items:center!important;width:24px!important;height:24px!important;
    margin:0 0 0 auto!important;font-size:20px!important;line-height:1!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .quantity{
    display:inline-flex!important;align-items:center!important;width:auto!important;margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .quantity input.qty{
    width:54px!important;height:34px!important;min-height:34px!important;padding:0 4px!important;margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important;
    padding:14px 12px!important;margin:0!important;border-top:1px solid var(--border)!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
    width:100%!important;gap:8px!important;margin:0!important;min-width:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon input.input-text{
    width:100%!important;min-width:0!important;height:42px!important;margin:0!important;padding:0 11px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon button{
    width:auto!important;min-width:112px!important;height:42px!important;min-height:42px!important;
    margin:0!important;padding:0 12px!important;white-space:nowrap!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    width:100%!important;height:44px!important;min-height:44px!important;margin:0!important;
  }
}

/* ======================================================================
   SSI FANZINE — REVIEW REFINEMENT v28
   Final polish for the embedded WooCommerce cart used as Checkout Review.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table{
  overflow:visible!important;
}
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    padding-left:26px!important;
    padding-right:12px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    margin-left:0!important;
    margin-right:auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    flex-wrap:nowrap!important;
    justify-content:space-between!important;
    align-items:center!important;
    gap:14px!important;
    padding:18px 20px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    flex:0 1 590px!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon input.input-text{
    flex:1 1 320px!important;
    width:auto!important;
    min-width:180px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon button{
    flex:0 0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    flex:0 0 auto!important;
    margin-left:auto!important;
  }

  /* Make the native cart totals an intentional review-total block. */
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals{
    width:100%!important;
    float:none!important;
    clear:both!important;
    margin:18px 0 0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals{
    width:100%!important;
    float:none!important;
    clear:both!important;
    margin:0!important;
    padding:18px 20px!important;
    border:1px solid var(--border)!important;
    border-radius:10px!important;
    background:var(--surface)!important;
    box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals h2{
    margin:0 0 10px!important;
    font-size:18px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals table{
    width:100%!important;
    margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals .order-total th,
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals .order-total td{
    font-size:20px!important;
    font-weight:900!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .wc-proceed-to-checkout{
    margin-top:14px!important;
    padding:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .wc-proceed-to-checkout a.ssi-review-continue{
    width:100%!important;
    min-height:54px!important;
  }
}

/* Real +/- controls around the native quantity input. */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  border:1px solid var(--border)!important;
  border-radius:8px!important;
  overflow:hidden!important;
  background:var(--surface)!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .ssi-review-qty-btn{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--text)!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .ssi-review-qty-btn:hover{
  background:rgba(245,34,58,.10)!important;
  color:#f5223a!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .quantity{
  margin:0!important;
  display:flex!important;
  align-items:center!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty{
  width:42px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-left:1px solid var(--border)!important;
  border-right:1px solid var(--border)!important;
  border-radius:0!important;
  text-align:center!important;
  background:transparent!important;
  color:var(--text)!important;
  box-shadow:none!important;
}
@media(max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    padding:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    margin:0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    flex-direction:row!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:8px!important;
    padding:12px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    flex:1 1 100%!important;
    width:100%!important;
    min-width:0!important;
    gap:8px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    flex:1 1 100%!important;
    width:100%!important;
    margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals{
    width:100%!important;
    float:none!important;
    margin-top:14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals{
    width:100%!important;
    float:none!important;
    padding:16px!important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW REFINEMENT v29
   Final alignment: centered covers, visible total, real trash icon.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .ssi-review-total-fallback{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
  min-height:62px!important;
  margin:0!important;
  padding:14px 20px!important;
  box-sizing:border-box!important;
  border:1px solid var(--border)!important;
  border-top:0!important;
  background:var(--surface)!important;
  color:var(--text)!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-total-label{
  font-size:17px!important;
  font-weight:900!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-total-value{
  font-size:21px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove{
  color:#f5223a!important;
  text-decoration:none!important;
  font-size:0!important;
  line-height:0!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove svg{
  display:block!important;
  width:19px!important;
  height:19px!important;
  fill:currentColor!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove:hover{
  color:#fff!important;
  background:#f5223a!important;
}
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    justify-content:center!important;
    padding:10px 8px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    margin:0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .ssi-review-total-fallback{
    border-radius:0 0 10px 10px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals{
    display:none!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .wc-proceed-to-checkout{
    margin-top:14px!important;
  }
}
@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .ssi-review-total-fallback{
    min-height:56px!important;
    padding:13px 14px!important;
    border-radius:0 0 10px 10px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-total-label{font-size:15px!important;}
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-total-value{font-size:18px!important;}
  .ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .cart_totals{display:none!important;}
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW REFINEMENT v30
   Match the approved cart/review composition: centered covers, aligned
   price/quantity/subtotal columns, compact +/- controls, trash icon.
   ====================================================================== */
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    grid-template-columns:180px minmax(0,1fr) 120px 92px 125px 42px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    justify-content:center!important;
    align-items:center!important;
    padding:10px 16px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    width:84px!important;
    height:112px!important;
    min-width:84px!important;
    max-width:84px!important;
    max-height:112px!important;
    margin:0 auto!important;
    object-fit:cover!important;
    object-position:center!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal{
    justify-content:flex-end!important;
    text-align:right!important;
    white-space:nowrap!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-price,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-subtotal{
    justify-content:flex-end!important;
    text-align:right!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity{
    justify-content:center!important;
    text-align:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    justify-content:center!important;
    padding:10px 4px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    flex:0 1 650px!important;
    min-width:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    margin-left:0!important;
  }
}

/* Hide the browser's native number spinners: the visible controls are our
   explicit minus / value / plus buttons. */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty,
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input[type="number"]{
  -moz-appearance:textfield!important;
  appearance:textfield!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty::-webkit-outer-spin-button,
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty::-webkit-inner-spin-button,
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input[type="number"]::-webkit-outer-spin-button,
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input[type="number"]::-webkit-inner-spin-button{
  -webkit-appearance:none!important;
  appearance:none!important;
  margin:0!important;
}

.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control{
  height:36px!important;
  min-height:36px!important;
  border-radius:9px!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .ssi-review-qty-btn{
  width:40px!important;
  min-width:40px!important;
  height:36px!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty{
  width:42px!important;
  min-width:42px!important;
  height:36px!important;
}

/* Keep the trash icon clean and centered. */
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove{
  width:30px!important;
  height:30px!important;
  padding:0!important;
  margin:0!important;
  border-radius:6px!important;
  display:grid!important;
  place-items:center!important;
  font-size:0!important;
  line-height:0!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove svg{
  width:19px!important;
  height:19px!important;
  display:block!important;
}

@media (max-width:800px){
  /* Mobile keeps a true compact item card while centering the cover. */
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    justify-content:center!important;
    align-items:center!important;
    padding:10px 6px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    width:72px!important;
    height:96px!important;
    min-width:72px!important;
    max-width:72px!important;
    max-height:96px!important;
    margin:0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control{
    height:34px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .ssi-review-qty-btn{
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty{
    width:38px!important;
    min-width:38px!important;
    height:34px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    align-items:center!important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW v31
   Precision desktop grid + guaranteed +/- control visibility.
   ====================================================================== */
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    grid-template-columns:190px minmax(0,1fr) 120px 100px 135px 48px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:10px 20px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;
    width:84px!important;
    height:112px!important;
    min-width:84px!important;
    max-width:84px!important;
    min-height:112px!important;
    max-height:112px!important;
    margin:0 auto!important;
    object-fit:cover!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
    padding-left:14px!important;
    padding-right:14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    text-align:right!important;
    white-space:nowrap!important;
    padding-left:8px!important;
    padding-right:16px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:10px 4px!important;
    overflow:visible!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:10px 6px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    align-items:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    flex:0 0 auto!important;
    width:590px!important;
    max-width:calc(100% - 190px)!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    margin-left:0!important;
  }
}

/* Force the custom review quantity control to always render as - value +. */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control{
  display:flex!important;
  flex:0 0 auto!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  width:110px!important;
  min-width:110px!important;
  max-width:110px!important;
  height:36px!important;
  min-height:36px!important;
  overflow:hidden!important;
  border:1px solid var(--border)!important;
  border-radius:9px!important;
  box-sizing:border-box!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .ssi-review-qty-btn{
  display:flex!important;
  flex:0 0 34px!important;
  width:34px!important;
  min-width:34px!important;
  max-width:34px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  margin:0!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--text)!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:900!important;
  visibility:visible!important;
  opacity:1!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .quantity{
  display:flex!important;
  flex:0 0 40px!important;
  width:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  height:34px!important;
  margin:0!important;
  align-items:center!important;
  justify-content:center!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty{
  display:block!important;
  width:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-left:1px solid var(--border)!important;
  border-right:1px solid var(--border)!important;
  border-radius:0!important;
  box-sizing:border-box!important;
  text-align:center!important;
}

@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    grid-template-columns:94px minmax(0,1fr) 30px!important;
    column-gap:12px!important;
    padding:16px 14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    grid-row:1 / span 3!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:94px!important;
    padding:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    width:78px!important;
    height:104px!important;
    min-width:78px!important;
    max-width:78px!important;
    min-height:104px!important;
    max-height:104px!important;
    margin:0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control{
    width:108px!important;
    min-width:108px!important;
    max-width:108px!important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW v32
   Approved reference composition: fixed product-image column, aligned
   price/quantity/subtotal columns, large centered covers and clean actions.
   ====================================================================== */
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    grid-template-columns:210px minmax(0,1fr) 140px 130px 150px 55px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-name{
    grid-column:1 / span 2!important;
    padding-left:18px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    min-height:190px!important;
    padding:14px 0!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    padding:12px 20px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail a{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:120px!important;
    height:160px!important;
    margin:0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;
    width:120px!important;
    height:160px!important;
    min-width:120px!important;
    max-width:120px!important;
    min-height:160px!important;
    max-height:160px!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:6px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
    grid-column:2!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    padding:14px 24px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name a{
    font-size:16px!important;
    line-height:1.35!important;
    font-weight:800!important;
    text-align:left!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price{
    grid-column:3!important;
    justify-content:flex-end!important;
    padding:14px 16px!important;
    text-align:right!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity{
    grid-column:4!important;
    justify-content:center!important;
    padding:14px 0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal{
    grid-column:5!important;
    justify-content:flex-end!important;
    padding:14px 18px!important;
    text-align:right!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    grid-column:6!important;
    justify-content:center!important;
    padding:14px 8px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    gap:14px!important;
    padding:20px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    display:flex!important;
    align-items:center!important;
    flex:0 0 590px!important;
    width:590px!important;
    max-width:none!important;
    gap:12px!important;
    margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon input.input-text{
    flex:1 1 auto!important;
    width:auto!important;
    height:54px!important;
    margin:0!important;
    padding:0 18px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon button,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:0 24px!important;
    white-space:nowrap!important;
  }
}

/* Match the reference quantity control exactly: − | value | +. */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control{
  width:110px!important;
  min-width:110px!important;
  max-width:110px!important;
  height:40px!important;
  min-height:40px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  border:1px solid var(--border)!important;
  border-radius:10px!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .ssi-review-qty-btn{
  flex:0 0 36px!important;
  width:36px!important;
  min-width:36px!important;
  max-width:36px!important;
  height:38px!important;
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  color:var(--text)!important;
  font-size:19px!important;
  font-weight:900!important;
  line-height:1!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control .quantity{
  flex:0 0 38px!important;
  width:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty{
  width:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  height:38px!important;
  min-height:38px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-left:1px solid var(--border)!important;
  border-right:1px solid var(--border)!important;
  border-radius:0!important;
  text-align:center!important;
  -moz-appearance:textfield!important;
  appearance:textfield!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty::-webkit-outer-spin-button,
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-quantity-control input.qty::-webkit-inner-spin-button{
  -webkit-appearance:none!important;
  appearance:none!important;
  margin:0!important;
}

/* Reference-style red trash icon. */
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove{
  width:32px!important;
  height:32px!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  font-size:0!important;
  line-height:0!important;
  color:#f5223a!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove svg{
  width:20px!important;
  height:20px!important;
  display:block!important;
  fill:currentColor!important;
}

@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    display:grid!important;
    grid-template-columns:92px minmax(0,1fr) 34px!important;
    column-gap:14px!important;
    min-height:0!important;
    padding:16px 14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    grid-row:1 / span 4!important;
    width:92px!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail a,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img{
    width:78px!important;
    min-width:78px!important;
    max-width:78px!important;
    height:104px!important;
    min-height:104px!important;
    max-height:104px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
    grid-column:2!important;
    grid-row:1!important;
    padding:0 0 8px!important;
    display:flex!important;
    align-items:flex-start!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price{
    grid-column:2!important;
    grid-row:2!important;
    justify-content:flex-start!important;
    padding:4px 0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity{
    grid-column:2!important;
    grid-row:3!important;
    justify-content:flex-start!important;
    padding:4px 0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal{
    grid-column:2!important;
    grid-row:4!important;
    justify-content:flex-start!important;
    padding:4px 0 0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    grid-column:3!important;
    grid-row:1!important;
    align-self:start!important;
    padding:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:10px!important;
    padding:14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon{
    display:flex!important;
    flex:1 1 100%!important;
    width:100%!important;
    gap:8px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon input.input-text{
    flex:1 1 auto!important;
    min-width:0!important;
    height:46px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions .coupon button,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .actions button[name="update_cart"]{
    height:46px!important;
    min-height:46px!important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW v33
   Match the approved reference composition precisely: the cover sits
   centered in the first product-image column, while the title begins at
   the same fixed boundary and the price/quantity/subtotal columns remain
   locked to their headings.
   ====================================================================== */
@media (min-width:801px){
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead tr,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table tbody tr.cart_item{
    grid-template-columns:210px minmax(0,1fr) 140px 130px 150px 55px!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail{
    grid-column:1!important;
    width:210px!important;
    min-width:210px!important;
    max-width:210px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail a{
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
    height:160px!important;
    min-height:160px!important;
    max-height:160px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 auto!important;
    padding:0!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-thumbnail img,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form .product-thumbnail img{
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
    height:160px!important;
    min-height:160px!important;
    max-height:160px!important;
    margin:0!important;
    object-fit:cover!important;
    object-position:center!important;
    display:block!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-name{
    grid-column:2!important;
    width:auto!important;
    min-width:0!important;
    padding:0 24px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-price{
    grid-column:3!important;
    width:140px!important;
    min-width:140px!important;
    max-width:140px!important;
    padding:0 18px 0 8px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    text-align:right!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-price{
    grid-column:3!important;
    justify-content:flex-end!important;
    padding:10px 18px 10px 8px!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-quantity,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-quantity{
    grid-column:4!important;
    width:130px!important;
    min-width:130px!important;
    max-width:130px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-subtotal,
  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form table.shop_table thead th.product-subtotal{
    grid-column:5!important;
    width:150px!important;
    min-width:150px!important;
    max-width:150px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    text-align:right!important;
    white-space:nowrap!important;
    padding-left:8px!important;
    padding-right:18px!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove{
    grid-column:6!important;
    width:55px!important;
    min-width:55px!important;
    max-width:55px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  .ssi-checkout-page.ssi-checkout-stage-1 .woocommerce-cart-form td.product-remove a.remove{
    width:28px!important;
    height:28px!important;
    margin:0!important;
    display:grid!important;
    place-items:center!important;
  }
}


/* ======================================================================
   SSI FANZINE — CHECKOUT REVIEW MOBILE CLEANUP v34
   Remove WooCommerce's responsive data-label/pseudo content from the
   embedded Review cart. The mobile view uses our own compact card layout,
   so native generated labels such as "Product" and ":" must never appear.
   ====================================================================== */
@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table{
    display:block!important;
    width:100%!important;
    overflow:hidden!important;
  }

  /* The heading cell already contains "Product"; do not duplicate it with
     the theme pseudo label. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table thead th.product-name{
    display:block!important;
    width:100%!important;
    height:44px!important;
    padding:13px 14px!important;
    font-size:0!important;
    line-height:0!important;
    text-align:left!important;
    box-sizing:border-box!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table thead th.product-name::before{
    content:"PRODUCT"!important;
    display:block!important;
    font-size:13px!important;
    line-height:1.2!important;
    font-weight:900!important;
    letter-spacing:.4px!important;
    color:var(--text)!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table thead th.product-name::after{
    display:none!important;
    content:none!important;
  }

  /* Absolutely no WooCommerce mobile data-label colons/labels. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table tbody tr.cart_item td::before,
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form table.shop_table tbody tr.cart_item td::after{
    display:none!important;
    content:none!important;
  }

  /* Keep only the information deliberately shown by our mobile card. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-name,
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-price,
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-quantity,
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-remove{
    font-size:13px!important;
  }

  /* Subtotal is represented by the final Review Total block on mobile;
     never render a second subtotal underneath quantity. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-subtotal{
    display:none!important;
    visibility:hidden!important;
    width:0!important;
    height:0!important;
    overflow:hidden!important;
  }

  /* Keep the cover centered inside its mobile image column. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-thumbnail{
    width:82px!important;
    min-width:82px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-thumbnail a{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:72px!important;
    height:96px!important;
    margin:0 auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form td.product-thumbnail img{
    display:block!important;
    width:72px!important;
    height:96px!important;
    min-width:72px!important;
    max-width:72px!important;
    min-height:96px!important;
    max-height:96px!important;
    margin:0 auto!important;
    object-fit:cover!important;
  }

  /* Keep the custom quantity control intact and hide native number arrows. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .ssi-review-quantity-control{
    display:flex!important;
    width:108px!important;
    min-width:108px!important;
    max-width:108px!important;
    height:34px!important;
    min-height:34px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .ssi-review-quantity-control input.qty{
    -moz-appearance:textfield!important;
    appearance:textfield!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .ssi-review-quantity-control input.qty::-webkit-inner-spin-button,
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .ssi-review-quantity-control input.qty::-webkit-outer-spin-button{
    -webkit-appearance:none!important;
    appearance:none!important;
    margin:0!important;
  }

  /* Mobile coupon controls: input + Apply on one row, Update below. */
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .actions{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:10px!important;
    padding:14px!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .actions .coupon{
    display:flex!important;
    flex:1 1 100%!important;
    width:100%!important;
    min-width:0!important;
    gap:8px!important;
    margin:0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .actions .coupon input.input-text{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .actions button[name="update_cart"]{
    width:100%!important;
    margin:0!important;
  }
}


/* ======================================================================
   SSI FANZINE — REVIEW STAGE CTA FIX v37
   Always provide a visible Continue to Details button below the Review
   Total. This does not depend on WooCommerce rendering its native CTA.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-proceed-button{
  display:flex!important;
  width:100%!important;
  min-height:54px!important;
  margin:14px 0 0!important;
  padding:14px 20px!important;
  box-sizing:border-box!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:10px!important;
  background:#f5223a!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:16px!important;
  font-weight:900!important;
  line-height:1.2!important;
  letter-spacing:.2px!important;
  text-transform:uppercase!important;
  box-shadow:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-proceed-button:hover{
  background:#d91d32!important;
  color:#fff!important;
  text-decoration:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-proceed-button:active{
  transform:translateY(1px);
}
/* The custom CTA replaces WooCommerce's native CTA on the Review stage. */
.ssi-checkout-page.ssi-checkout-stage-1 .cart-collaterals .wc-proceed-to-checkout{
  display:none!important;
}
@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-proceed-button{
    min-height:54px!important;
    margin-top:14px!important;
    margin-bottom:4px!important;
    border-radius:7px!important;
    font-size:14px!important;
  }
}


/* ======================================================================
   SSI FANZINE — REVIEW CTA FINAL POSITION v38
   Keep the Review CTA outside the WooCommerce cart markup so it cannot be
   hidden or displaced by WooCommerce cart layout rules on desktop/mobile.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-1 main.ssi-review-content > .ssi-review-proceed-button{
  display:flex!important;
  position:relative!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  max-width:100%!important;
  min-height:54px!important;
  margin:14px 0 20px!important;
  padding:14px 20px!important;
  box-sizing:border-box!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:10px!important;
  background:#f5223a!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:16px!important;
  font-weight:900!important;
  line-height:1.2!important;
  letter-spacing:.2px!important;
  text-transform:uppercase!important;
  z-index:5!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 main.ssi-review-content > .ssi-review-proceed-button:hover{
  background:#d91d32!important;
  color:#fff!important;
}
@media (max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-1 main.ssi-review-content > .ssi-review-proceed-button{
    min-height:54px!important;
    margin:14px 0 20px!important;
    border-radius:7px!important;
    font-size:14px!important;
  }
}
\n\n/* ======================================================================\n   SSI FANZINE — CHECKOUT v39\n   Remove empty WooCommerce shipping cards and keep Payment on stage 3\n   after a failed payment/validation redirect.\n   ====================================================================== */\n.ssi-checkout-page #customer_details .woocommerce-shipping-fields[data-ssi-empty-shipping="1"]{\n  display:none!important;\n}\n.ssi-checkout-page.ssi-checkout-stage-3 #payment{\n  scroll-margin-top:24px;\n}\n
/* ======================================================================
   SSI FANZINE — CHECKOUT v40 PAYMENT FLOW HARDENING
   Details must not expose Place Order. Payment owns the Place Order button.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-2 #payment,
.ssi-checkout-page.ssi-checkout-stage-2 .woocommerce-checkout-payment{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-2 #order_review .place-order,
.ssi-checkout-page.ssi-checkout-stage-2 #order_review #payment{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 #payment,
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-checkout-payment{
  display:block!important;
}

/* ======================================================================
   SSI FANZINE — DETAILS NAVIGATION v41
   Details stage: replace WooCommerce Place Order with explicit Back /
   Continue to Payment navigation below the customer details form.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation{
  width:100%;
  max-width:1180px;
  margin:18px auto 24px;
  padding:0 14px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-back,
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-next{
  min-height:52px;
  height:52px;
  padding:0 24px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  font:900 13px/1 inherit;
  text-decoration:none;
  cursor:pointer;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-back{
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
  min-width:108px;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-next{
  background:#f52335;
  color:#fff;
  border:1px solid #f52335;
  min-width:245px;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-next:hover,
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-back:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}
@media(max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation{
    padding:0 14px;
    flex-direction:column;
    align-items:stretch;
  }
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-back,
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-details-navigation .ssi-checkout-action-next{
    width:100%;
    min-width:0;
  }
}

/* ======================================================================
   SSI FANZINE — DETAILS ACTIONS INSIDE ORDER SUMMARY v43
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions{
  width:100% !important;
  max-width:none !important;
  margin:16px 0 0 !important;
  padding:16px 0 0 !important;
  border-top:1px solid var(--border) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  box-sizing:border-box !important;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions .ssi-checkout-action-back,
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions .ssi-checkout-action-next{
  min-height:56px !important;
  height:56px !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
  border-radius:10px !important;
  font:900 13px/1 inherit !important;
  text-decoration:none !important;
  cursor:pointer !important;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions .ssi-checkout-action-back{
  min-width:108px !important;
  padding:0 22px !important;
  background:var(--surface) !important;
  color:var(--text) !important;
  border:1px solid var(--border) !important;
}
.ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions .ssi-checkout-action-next{
  min-width:245px !important;
  padding:0 24px !important;
  background:#f52335 !important;
  color:#fff !important;
  border:1px solid #f52335 !important;
}
@media(max-width:560px){
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions{
    flex-direction:column !important;
    align-items:stretch !important;
  }
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions .ssi-checkout-action-back,
  .ssi-checkout-page.ssi-checkout-stage-2 .ssi-checkout-page-actions .ssi-checkout-action-next{
    width:100% !important;
    min-width:0 !important;
  }
}

/* ======================================================================
   SSI FANZINE — PAYMENT MOBILE CLEANUP + BACK ACTION v44
   Payment stage shows payment only; hide customer/details and place Back
   at the bottom-right of the order/payment summary on all viewports.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-3 #customer_details,
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-billing-fields,
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-shipping-fields,
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-additional-fields{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions{
  width:100%!important;
  margin:18px 0 0!important;
  padding:16px 0 0!important;
  border-top:1px solid var(--border)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  box-sizing:border-box!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions .ssi-checkout-action-back{
  min-width:120px!important;
  min-height:52px!important;
  height:52px!important;
  padding:0 24px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  border-radius:10px!important;
  background:var(--surface)!important;
  color:var(--text)!important;
  border:1px solid var(--border)!important;
  font:900 13px/1 inherit!important;
  text-decoration:none!important;
  cursor:pointer!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions .ssi-checkout-action-back:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}
@media(max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions{
    justify-content:flex-end!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions .ssi-checkout-action-back{
    width:auto!important;
    min-width:120px!important;
  }
}

/* ======================================================================
   SSI FANZINE — CHECKOUT v46
   Switch Details -> Payment in-place so mobile never loads a second
   checkout/details form and the already-entered billing fields remain in
   the same WooCommerce checkout form for Place Order validation.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-3 #customer_details,
.ssi-checkout-page.ssi-checkout-stage-3 #customer_details > *,
.ssi-checkout-page.ssi-checkout-stage-3 #customer_details .woocommerce-billing-fields,
.ssi-checkout-page.ssi-checkout-stage-3 #customer_details .woocommerce-shipping-fields,
.ssi-checkout-page.ssi-checkout-stage-3 #customer_details .woocommerce-additional-fields{
  display:none !important;
}
.ssi-checkout-page.ssi-checkout-stage-3 #payment,
.ssi-checkout-page.ssi-checkout-stage-3 #payment.woocommerce-checkout-payment{
  display:block !important;
  visibility:visible !important;
}

/* ======================================================================
   SSI FANZINE — CHECKOUT v48
   Payment stage: mobile shows Back only, with no overlap. The navigation
   is kept at the bottom of the payment section rather than inside the
   order-summary content.
   ====================================================================== */
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions .ssi-checkout-action-next{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions{
  width:100%!important;
  margin:22px 0 0!important;
  padding:16px 0 0!important;
  border-top:1px solid var(--border)!important;
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  box-sizing:border-box!important;
  clear:both!important;
  position:relative!important;
  z-index:2!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions .ssi-checkout-action-back{
  display:inline-flex!important;
  width:auto!important;
  min-width:120px!important;
  min-height:52px!important;
  height:52px!important;
  margin:0!important;
  box-sizing:border-box!important;
}
@media(max-width:800px){
  .ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions{
    justify-content:flex-end!important;
    margin-top:24px!important;
    padding:16px 0 0!important;
  }
  .ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-page-actions .ssi-checkout-action-back{
    width:auto!important;
    min-width:120px!important;
  }
}


/* SSI FANZINE — CHECKOUT v49
 * Payment is the final checkout stage: never show a Continue-to-Payment
 * button here, even if stale cached markup is present. */
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-next,
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-details-navigation{
  display:none!important;
}
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-NoticeGroup-checkout:has(.woocommerce-error li){
  /* JS removes only stale required-field notices once saved values are
     restored; genuine gateway errors remain visible. */
}

/* SSI FANZINE — CHECKOUT v50
 * Payment is a clean final stage. Any required-field notice left over from
 * an earlier Details render must not appear on the Payment screen. */
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-NoticeGroup-checkout,
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-NoticeGroup-checkout .woocommerce-error,
.ssi-checkout-page.ssi-checkout-stage-3 .woocommerce-NoticeGroup-checkout .woocommerce-error li{
  display:none!important;
}
/* Never allow a stale Details navigation/Continue button to render on Payment. */
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-next,
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-details-navigation{
  display:none!important;
}

/* SSI FANZINE — CHECKOUT v51
 * Payment is final. Never display a Details-stage Continue-to-Payment control,
 * including controls left behind by cached/legacy markup. */
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-next,
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-details-navigation,
.ssi-checkout-page.ssi-checkout-stage-3 a[href*="ssi_checkout_step=3"]:not(.ssi-checkout-step),
.ssi-checkout-page.ssi-checkout-stage-3 button[data-ssi-action="continue-payment"]{
  display:none!important;
}

/* SSI FANZINE — CHECKOUT v52
 * The Details -> Payment transition happens in-place. When that happens,
 * remove the Details-only Continue button immediately; Payment keeps Back. */
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-checkout-action-next,
.ssi-checkout-page.ssi-checkout-stage-3 .ssi-details-navigation,
.ssi-checkout-page.ssi-checkout-stage-3 [class*="continue-to-payment"] {
  display:none!important;
}

/* SSI FANZINE — stable empty Review state after the final cart item is removed. */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty{
  min-height:300px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  padding:56px 28px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:14px!important;
  background:#111419!important;
}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty-icon{font-size:42px!important;line-height:1!important;margin-bottom:18px!important;}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty h3{margin:0 0 10px!important;font-size:28px!important;}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty p{max-width:620px!important;margin:0 auto 24px!important;opacity:.72!important;line-height:1.6!important;}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:48px!important;padding:0 24px!important;border-radius:8px!important;background:#f52235!important;color:#fff!important;text-decoration:none!important;font-weight:800!important;}
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty-button:hover{opacity:.9!important;}
@media(max-width:700px){
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty{min-height:260px!important;padding:42px 20px!important;}
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty h3{font-size:24px!important;}
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty p{font-size:14px!important;}
  .ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-empty-button{width:100%!important;max-width:280px!important;}
}

/* v60: Hide native Update Cart button on the unified Review stage. */
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .actions button[name="update_cart"],
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell .woocommerce-cart-form .actions input[name="update_cart"],
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell button[name="update_cart"],
.ssi-checkout-page.ssi-checkout-stage-1 .ssi-review-cart-shell input[name="update_cart"]{display:none!important;}

/* SSI FANZINE — Sponsored ads directly below the existing Magazine section. */
.ssi-sponsored-ads-section{
  margin-top:22px !important;
  margin-bottom:42px !important;
  padding:16px 20px 14px !important;
  border:1px solid var(--border) !important;
  border-radius:12px !important;
  background:var(--card) !important;
  box-shadow:0 10px 30px var(--shadow) !important;
}
.ssi-sponsored-ads-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:0 0 10px;
}
.ssi-sponsored-ads-heading h2{
  position:relative;
  margin:0;
  padding-left:12px;
  color:var(--text);
  font-size:18px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:-.25px;
  text-transform:uppercase;
}
.ssi-sponsored-ads-heading h2::before{
  content:"";
  position:absolute;
  left:0;
  top:1px;
  bottom:1px;
  width:3px;
  border-radius:3px;
  background:var(--accent);
}
.ssi-sponsored-ads-heading h2 span{color:var(--accent);}
.ssi-sponsored-ads-heading p{
  margin:0;
  color:var(--muted);
  font-size:10px;
  font-weight:700;
  white-space:nowrap;
}
.ssi-sponsored-ads-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.ssi-sponsored-ad-card{min-width:0;margin:0;}
.ssi-sponsored-ad-media{
  position:relative;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:9px;
  background:#07579d;
  line-height:0;
}
.ssi-sponsored-ad-media img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:contain;
}
/* Website CTA: separate from the artwork so the BIOTEK creative stays untouched. */
.ssi-sponsored-ad-learn{
  position:absolute;
  left:3.8%;
  bottom:5.5%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:118px;
  min-height:42px;
  padding:9px 16px;
  border:1px solid rgba(255,255,255,.9);
  border-radius:9px;
  background:#fff !important;
  color:#0b4386 !important;
  font-size:13px;
  line-height:1;
  font-weight:800;
  letter-spacing:.1px;
  text-decoration:none !important;
  box-shadow:0 5px 16px rgba(0,0,0,.22);
  z-index:3;
  transition:transform .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
}
.ssi-sponsored-ad-learn span{font-size:18px;line-height:1;}
.ssi-sponsored-ad-learn:hover,
.ssi-sponsored-ad-learn:focus-visible{
  background:var(--accent) !important;
  color:#fff !important;
  border-color:var(--accent) !important;
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(0,0,0,.28);
  outline:none;
}

/* Make the section naturally follow the original Magazine -> Videos order. */
@media(max-width:900px){
  .ssi-sponsored-ads-section{padding:14px 14px 12px !important;}
  .ssi-sponsored-ads-grid{gap:12px;}
}
@media(max-width:700px){
  .ssi-sponsored-ads-heading{align-items:flex-start;flex-direction:column;gap:4px;}
  .ssi-sponsored-ads-heading p{white-space:normal;}
  .ssi-sponsored-ads-grid{grid-template-columns:1fr;gap:12px;}
}

/* v74: responsive Learn More CTA stays clear of the right-side trust information. */
@media(max-width:900px){
  .ssi-sponsored-ad-learn{min-width:108px;min-height:38px;padding:8px 13px;font-size:12px;gap:6px;}
}
@media(max-width:700px){
  .ssi-sponsored-ad-learn{left:4%;bottom:5%;min-width:112px;min-height:40px;font-size:12px;}
}
@media(max-width:420px){
  .ssi-sponsored-ad-learn{min-width:102px;min-height:36px;padding:7px 11px;font-size:11px;}
}

/* SSI FANZINE sidebar order: Newsletter, Athletics, Sports Science Blogs, Popular Topics.
   Popular-topic icons remain visible on desktop and mobile. */
@media (max-width:800px) {
    .newsletter-section { order: 2 !important; }
    .sidebar-topic-0 { order: 3 !important; }
    .sidebar-topic-1 { order: 4 !important; }
    .popular-topics-section { order: 5 !important; }
}

/* Mobile homepage section order: Newsletter above Latest Articles.
   Desktop layout remains unchanged. */
@media (max-width:800px) {
    .home-layout .featured-slider { order: 1 !important; }
    .home-layout .newsletter-section { order: 2 !important; }
    .home-layout .latest-articles-section { order: 3 !important; }
    .home-layout .sidebar-topic-0 { order: 4 !important; }
    .home-layout .sidebar-topic-1 { order: 5 !important; }
    .home-layout .popular-topics-section { order: 6 !important; }
}

/* v104: Most Read sidebar section above Popular Topics. */
.most-read-section { margin-top:26px; }
.most-read-section .section-title { margin-bottom:10px; }
.most-read-list { display:grid; gap:0; }
.most-read-item { display:grid; grid-template-columns:28px 92px minmax(0,1fr); gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid var(--border); }
.most-read-item:first-child { padding-top:0; }
.most-read-number { font-size:16px; line-height:1; font-weight:900; color:var(--accent); text-align:center; }
.most-read-image { display:block; width:92px; aspect-ratio:16/10; overflow:hidden; border-radius:4px; background:linear-gradient(135deg,#25303a,#11161b); }
.most-read-image img { width:100%; height:100%; object-fit:cover; }
.most-read-body { min-width:0; }
.most-read-body .post-category { margin-bottom:4px; }
.most-read-body h3 { margin:0; font-size:13px; line-height:1.22; font-weight:900; }
.most-read-body h3 a { color:inherit; text-decoration:none; }
.most-read-body .post-meta { margin-top:5px; }

@media (max-width:800px) {
    .most-read-section { order:6 !important; margin-top:26px; }
    .popular-topics-section { order:7 !important; }
    .home-layout .most-read-section { order:6 !important; }
    .home-layout .popular-topics-section { order:7 !important; }
    .most-read-item { grid-template-columns:28px 38% minmax(0,1fr); gap:12px; padding:12px 0; }
    .most-read-image { width:100%; }
    .most-read-body h3 { font-size:14px; line-height:1.2; }
}

/* v106: Product cards link directly to the product page; Quick View and overlay Add removed. */


/* ==========================================================================
   v108 — SSI FANZINE PREMIUM SINGLE PRODUCT PAGE (consolidated)
   Replaces v107 and all of its later duplicate/overriding blocks — that
   accumulation was the reason earlier edits kept silently losing to a
   later rule. This is the single, authoritative ruleset. Preserves
   native cart, checkout, Razorpay and Buy Now functionality (same
   WooCommerce classes/markup; styling only).
   ========================================================================== */

.single-product .commerce-shell {
    max-width: 1080px;
}

.single-product .shop-content-wrapper {
    margin-top: 32px;
}

.single-product .woocommerce div.product {
    display: grid !important;
    grid-template-columns: minmax(0, 360px) minmax(0, 1fr) !important;
    gap: 64px !important;
    align-items: start !important;
    margin: 0 0 56px !important;
}

/* ---- Gallery: intentionally small and quiet, not the page's focal point ---- */

.single-product .woocommerce div.product .woocommerce-product-gallery {
    width: 100% !important;
    max-width: 360px !important;
    margin: 0 !important;
    float: none !important;
    display: block !important;
}

.single-product .woocommerce div.product .woocommerce-product-gallery__wrapper {
    margin: 0 !important;
}

.single-product .woocommerce div.product .woocommerce-product-gallery__image {
    aspect-ratio: 3 / 4 !important;
    min-height: 0 !important;
    max-height: 420px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    padding: 20px !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    background: var(--surface) !important;
    box-shadow: none !important;
}

.single-product .woocommerce div.product .woocommerce-product-gallery__image a {
    display: grid !important;
    place-items: center !important;
    width: 100% !important;
    height: 100% !important;
}

.single-product .woocommerce div.product .woocommerce-product-gallery__image img {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 4px !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.14) !important;
}

.single-product .woocommerce div.product .flex-control-thumbs {
    display: flex !important;
    gap: 8px !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    scrollbar-width: thin;
}

.single-product .woocommerce div.product .flex-control-thumbs li {
    flex: 0 0 52px !important;
    width: 52px !important;
    margin: 0 !important;
    padding: 3px !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    background: var(--surface) !important;
    transition: border-color .15s ease !important;
}

.single-product .woocommerce div.product .flex-control-thumbs li:hover,
.single-product .woocommerce div.product .flex-control-thumbs li.flex-active {
    border-color: var(--accent) !important;
}

.single-product .woocommerce div.product .flex-control-thumbs li img {
    width: 100% !important;
    height: 56px !important;
    object-fit: contain !important;
    border-radius: 3px !important;
}

/* ---- Summary: quiet, confident, no card chrome ---- */

.single-product .woocommerce div.product .summary {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.single-product .woocommerce div.product .summary::before {
    content: "SSI Fanzine \2014 Official Edition";
    display: block;
    margin-bottom: 12px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.single-product .woocommerce div.product .product_title {
    margin: 0 0 10px !important;
    color: var(--text) !important;
    font-size: clamp(24px, 2.4vw, 32px) !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
    text-transform: none !important;
}

.single-product .woocommerce div.product .summary > .price {
    display: block !important;
    margin: 0 0 20px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid var(--border) !important;
    color: var(--text) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
}

.single-product .woocommerce div.product .summary > .price .woocommerce-Price-amount {
    color: inherit !important;
}

.single-product .woocommerce div.product .woocommerce-product-details__short-description {
    margin: 0 0 18px !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    color: var(--muted) !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

.single-product .woocommerce div.product .summary ul {
    margin: 0 0 26px !important;
    padding-left: 0 !important;
    list-style: none !important;
}

.single-product .woocommerce div.product .summary li {
    position: relative;
    margin: 0 0 9px !important;
    padding-left: 16px !important;
    color: var(--text) !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

.single-product .woocommerce div.product .summary li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--accent);
}

.single-product .woocommerce div.product form.cart {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
}

.single-product .woocommerce div.product form.cart .quantity {
    margin: 0 !important;
}

.single-product .woocommerce div.product form.cart .quantity input.qty {
    width: 56px !important;
    height: 46px !important;
    padding: 0 6px !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    background: var(--card) !important;
    color: var(--text) !important;
    text-align: center !important;
    font-weight: 700 !important;
}

.single-product .woocommerce div.product form.cart .single_add_to_cart_button,
.single-product .woocommerce div.product .ssi-single-buy-now {
    min-height: 46px !important;
    border-radius: 6px !important;
    padding: 0 22px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
    box-sizing: border-box !important;
    border: 0 !important;
    transition: opacity .15s ease !important;
}

.single-product .woocommerce div.product form.cart .single_add_to_cart_button {
    background: var(--text) !important;
    color: var(--background) !important;
}

.single-product .woocommerce div.product .ssi-single-buy-now {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--accent) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.single-product .woocommerce div.product form.cart .single_add_to_cart_button:hover,
.single-product .woocommerce div.product .ssi-single-buy-now:hover {
    opacity: .88;
}

.single-product .woocommerce div.product .product_meta {
    margin-top: 8px !important;
    padding-top: 16px !important;
    border-top: 1px solid var(--border) !important;
    color: var(--muted) !important;
    font-size: 12px !important;
    line-height: 1.7 !important;
}

.single-product .woocommerce div.product .product_meta a {
    color: var(--text) !important;
    font-weight: 600 !important;
}

/* ---- Tabs: minimal underline style, no boxed panels ---- */

.single-product .woocommerce div.product .woocommerce-tabs {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    margin: 8px 0 48px !important;
    padding-top: 32px !important;
    border-top: 1px solid var(--border) !important;
}

.single-product .woocommerce div.product .woocommerce-tabs ul.tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    list-style: none !important;
}

.single-product .woocommerce div.product .woocommerce-tabs ul.tabs::before,
.single-product .woocommerce div.product .woocommerce-tabs ul.tabs::after {
    display: none !important;
}

.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}

.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li a {
    display: inline-block !important;
    padding: 0 0 10px !important;
    color: var(--muted) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    border-bottom: 2px solid transparent !important;
}

.single-product .woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--text) !important;
    border-bottom-color: var(--accent) !important;
}

.single-product .woocommerce div.product .woocommerce-tabs .panel {
    padding: 24px 0 0 !important;
    border: 0 !important;
    color: var(--muted) !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

.single-product .woocommerce div.product .woocommerce-tabs .panel h2 {
    margin: 0 0 16px !important;
    color: var(--text) !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

/* Additional Information tab: WooCommerce's default attributes table had
   no theme styling at all, so it was rendering with the browser/WC
   defaults — a plain light table with black text, clashing hard against
   the dark theme around it. */
.single-product .woocommerce div.product table.woocommerce-product-attributes {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-collapse: collapse !important;
    background: none !important;
}

.single-product .woocommerce div.product table.woocommerce-product-attributes tr {
    border-bottom: 1px solid var(--border) !important;
}

.single-product .woocommerce div.product table.woocommerce-product-attributes tr:first-child {
    border-top: 1px solid var(--border) !important;
}

.single-product .woocommerce div.product table.woocommerce-product-attributes th,
.single-product .woocommerce div.product table.woocommerce-product-attributes td {
    padding: 13px 4px !important;
    border: 0 !important;
    background: none !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    vertical-align: top !important;
}

.single-product .woocommerce div.product table.woocommerce-product-attributes th.woocommerce-product-attributes-item__label {
    width: 38% !important;
    color: var(--text) !important;
    font-weight: 700 !important;
    text-align: left !important;
}

.single-product .woocommerce div.product table.woocommerce-product-attributes td.woocommerce-product-attributes-item__value {
    color: var(--muted) !important;
}

.single-product .woocommerce div.product table.woocommerce-product-attributes td.woocommerce-product-attributes-item__value p {
    margin: 0 !important;
}

/* WooCommerce shows this note only when a product genuinely has no
   attributes set — style it instead of leaving it in the browser
   default appearance, but this can't add attributes that don't exist;
   that's product data, set per-product in wp-admin. */
.single-product .woocommerce div.product .woocommerce-Tabs-panel--additional_information > p:only-child {
    margin: 0 !important;
    padding: 20px 0 !important;
    color: var(--muted) !important;
    font-size: 13px !important;
    font-style: italic !important;
}

.single-product .woocommerce div.product .related.products,
.single-product .woocommerce div.product .upsells.products {
    grid-column: 1 / -1 !important;
    margin-top: 8px !important;
    padding-top: 40px !important;
    border-top: 1px solid var(--border) !important;
}

.single-product .woocommerce div.product .related.products > h2,
.single-product .woocommerce div.product .upsells.products > h2 {
    margin: 0 0 20px !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}

/* ---- Mobile: single column, image genuinely small and centered ---- */

@media (max-width: 800px) {

    .single-product .woocommerce div.product {
        grid-template-columns: 1fr !important;
        gap: 28px !important;
        margin: 0 0 40px !important;
    }

    .single-product .woocommerce div.product .woocommerce-product-gallery {
        max-width: 240px !important;
        margin: 0 auto !important;
    }

    .single-product .woocommerce div.product .woocommerce-product-gallery__image {
        max-height: 300px !important;
        padding: 14px !important;
    }

    .single-product .woocommerce div.product .product_title {
        text-align: left !important;
    }

    .single-product .woocommerce div.product form.cart {
        gap: 8px !important;
    }

    .single-product .woocommerce div.product form.cart .quantity input.qty,
    .single-product .woocommerce div.product form.cart .single_add_to_cart_button,
    .single-product .woocommerce div.product .ssi-single-buy-now {
        min-height: 44px !important;
        height: 44px !important;
    }

    .single-product .woocommerce div.product form.cart .single_add_to_cart_button,
    .single-product .woocommerce div.product .ssi-single-buy-now {
        flex: 1 1 auto !important;
        padding: 0 12px !important;
        font-size: 10.5px !important;
    }

    .single-product .woocommerce div.product .woocommerce-tabs ul.tabs {
        gap: 18px !important;
        overflow-x: auto !important;
    }

    .single-product .woocommerce div.product .woocommerce-tabs ul.tabs li {
        flex: 0 0 auto !important;
    }

}

/* ==========================================================================\n   v111 — TRUE WooCommerce PRODUCT PAGE\n   The single-product branch lives in woocommerce.php because this theme's\n   woocommerce.php wrapper takes precedence over WooCommerce's template loader.\n   This namespace intentionally avoids earlier product CSS.\n   ========================================================================== */
.ssi-v111-product-page{padding:44px 0 70px;background:var(--background);}
.ssi-v111-product{max-width:1180px;margin:0 auto;}
.ssi-v111-product-crumb{display:flex;align-items:center;gap:10px;margin:0 0 22px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;}
.ssi-v111-rule{width:34px;height:2px;background:var(--accent);display:inline-block;}
.ssi-v111-dot{color:var(--accent);}
.ssi-v111-hero{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:52px;align-items:start;}
.ssi-v111-gallery{min-width:0;}
.ssi-v111-gallery-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;}
.ssi-v111-gallery-line{height:1px;flex:1;background:var(--border);}
.ssi-v111-cover-stage{position:relative;padding:28px;background:linear-gradient(145deg,var(--surface),var(--card));border:1px solid var(--border);box-shadow:0 18px 55px rgba(0,0,0,.13);overflow:hidden;}
.ssi-v111-cover-stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(239,35,51,.08),transparent 34%,transparent 70%,rgba(0,0,0,.04));}
.ssi-v111-cover-stage .woocommerce-product-gallery{width:100%!important;float:none!important;margin:0!important;}
.ssi-v111-cover-stage .woocommerce-product-gallery__wrapper{margin:0!important;}
.ssi-v111-cover-stage .woocommerce-product-gallery__image{display:flex!important;align-items:center!important;justify-content:center!important;min-height:0!important;aspect-ratio:3/4!important;padding:0!important;background:transparent!important;border:0!important;overflow:hidden!important;}
.ssi-v111-cover-stage .woocommerce-product-gallery__image a{display:block;width:100%;height:100%;}
.ssi-v111-cover-stage .woocommerce-product-gallery__image img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;box-shadow:0 18px 38px rgba(0,0,0,.22)!important;border-radius:2px!important;}
.ssi-v111-cover-stage .flex-control-thumbs{display:flex!important;gap:9px!important;margin:16px 0 0!important;padding:0!important;overflow-x:auto!important;list-style:none!important;}
.ssi-v111-cover-stage .flex-control-thumbs li{float:none!important;flex:0 0 62px!important;width:62px!important;margin:0!important;padding:3px!important;border:1px solid var(--border)!important;background:var(--card)!important;border-radius:4px!important;}
.ssi-v111-cover-stage .flex-control-thumbs li.flex-active{border-color:var(--accent)!important;}
.ssi-v111-cover-stage .flex-control-thumbs li img{width:100%!important;height:72px!important;object-fit:cover!important;opacity:1!important;}
.ssi-v111-gallery-note{display:flex;justify-content:space-between;gap:15px;margin-top:12px;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;}
.ssi-v111-summary{position:relative;background:var(--card);border:1px solid var(--border);padding:26px 30px 26px;box-shadow:0 16px 45px rgba(0,0,0,.09);}
.ssi-v111-summary:before{content:"";position:absolute;left:0;top:0;width:5px;height:100%;background:var(--accent);}
.ssi-v111-eyebrow-row{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.ssi-v111-pill{padding:7px 10px;background:var(--text);color:var(--background);font-size:9px;font-weight:900;letter-spacing:.12em;}
.ssi-v111-stock{color:#168b57;font-size:10px;font-weight:900;letter-spacing:.08em;}
.ssi-v111-stock i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#18a768;margin-right:5px;}
.ssi-v111-summary .summary{width:100%!important;float:none!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important;}
.ssi-v111-summary .summary:before{display:none!important;}
.ssi-v111-summary .product_title{font-size:clamp(27px,2.65vw,36px)!important;line-height:1.06!important;margin:0 0 13px!important;color:var(--text)!important;font-weight:900!important;letter-spacing:-.035em!important;text-transform:uppercase!important;}
.ssi-v111-summary .price{display:flex!important;align-items:baseline;gap:8px;margin:0 0 18px!important;padding:0 0 16px!important;border-bottom:1px solid var(--border)!important;color:var(--accent)!important;font-size:25px!important;font-weight:900!important;}
.ssi-v111-summary .woocommerce-product-details__short-description{margin:0 0 24px!important;padding:0 0 2px!important;color:var(--muted)!important;font-size:16px!important;line-height:1.72!important;max-width:760px!important;} .ssi-v111-summary .woocommerce-product-details__short-description p{margin:0!important;color:inherit!important;} .ssi-v111-summary .ssi-v111-short-description{font-weight:500!important;}
/* v123: compact editorial scale for Product short description.
   The editor content remains fully dynamic; only presentation is tightened. */
.ssi-v111-summary .ssi-v111-short-description{font-size:13px!important;line-height:1.48!important;font-weight:500!important;margin-bottom:18px!important;}
.ssi-v111-summary .ssi-v111-short-description p{font-size:13px!important;line-height:1.48!important;margin:0 0 8px!important;}
.ssi-v111-summary .ssi-v111-short-description h1{font-size:20px!important;line-height:1.12!important;margin:0 0 9px!important;}
.ssi-v111-summary .ssi-v111-short-description h2{font-size:18px!important;line-height:1.16!important;margin:0 0 8px!important;}
.ssi-v111-summary .ssi-v111-short-description h3{font-size:16px!important;line-height:1.2!important;margin:0 0 7px!important;}
.ssi-v111-summary .ssi-v111-short-description h4{font-size:14px!important;line-height:1.25!important;margin:0 0 6px!important;}
.ssi-v111-summary .ssi-v111-short-description h5{font-size:13px!important;line-height:1.3!important;margin:0 0 5px!important;}
.ssi-v111-summary .ssi-v111-short-description h6{font-size:12px!important;line-height:1.35!important;margin:0 0 5px!important;}
.ssi-v111-summary .ssi-v111-short-description ul,.ssi-v111-summary .ssi-v111-short-description ol{font-size:13px!important;line-height:1.45!important;margin:0 0 8px!important;padding-top:0!important;padding-bottom:0!important;}
.ssi-v111-summary .ssi-v111-short-description li{font-size:13px!important;line-height:1.45!important;margin-bottom:3px!important;}
.ssi-v111-summary .ssi-v111-short-description strong,.ssi-v111-summary .ssi-v111-short-description b{font-size:inherit!important;}

.ssi-v111-summary .summary ul{margin:0 0 24px!important;padding:18px 18px 14px!important;background:var(--surface)!important;border-left:3px solid var(--accent)!important;list-style:none!important;}
.ssi-v111-summary .summary li{position:relative;margin:0 0 8px!important;padding-left:15px!important;color:var(--text)!important;font-size:13px!important;line-height:1.45!important;}
.ssi-v111-summary .summary li:before{content:"";position:absolute;left:0;top:.55em;width:5px;height:5px;background:var(--accent);}
.ssi-v111-summary form.cart{display:grid!important;grid-template-columns:74px 1fr 1fr;gap:8px!important;align-items:stretch!important;margin:0 0 18px!important;padding:0!important;border:0!important;background:none!important;}
.ssi-v111-summary form.cart .quantity{margin:0!important;}
.ssi-v111-summary form.cart .quantity input.qty{width:100%!important;height:52px!important;border:1px solid var(--border)!important;background:var(--background)!important;color:var(--text)!important;font-weight:900!important;text-align:center!important;}
.ssi-v111-summary form.cart .single_add_to_cart_button,.ssi-v111-summary .ssi-single-buy-now{height:52px!important;min-height:52px!important;margin:0!important;border-radius:0!important;padding:0 16px!important;border:1px solid var(--text)!important;font-size:11px!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;box-sizing:border-box!important;}
.ssi-v111-summary form.cart .single_add_to_cart_button{background:var(--text)!important;color:var(--background)!important;}
.ssi-v111-summary .ssi-single-buy-now{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important;text-decoration:none!important;}
.ssi-v111-summary form.cart .single_add_to_cart_button:hover{opacity:.88!important;}
.ssi-v111-summary .ssi-single-buy-now:hover{filter:brightness(.92)!important;}
.ssi-v111-summary .product_meta{padding-top:17px!important;border-top:1px solid var(--border)!important;margin:0!important;color:var(--muted)!important;font-size:11px!important;line-height:1.7!important;}
.ssi-v111-summary .product_meta a{color:var(--text)!important;font-weight:700!important;}
.ssi-v111-benefits{display:grid;grid-template-columns:repeat(3,1fr);margin-top:20px;border:1px solid var(--border);background:var(--card);}
.ssi-v111-benefits>div{display:flex;gap:12px;padding:18px 20px;border-right:1px solid var(--border);}
.ssi-v111-benefits>div:last-child{border-right:0;}
.ssi-v111-benefits b{color:var(--accent);font-size:11px;line-height:1.4;}
.ssi-v111-benefits strong,.ssi-v111-benefits small{display:block;}
.ssi-v111-benefits strong{font-size:10px;letter-spacing:.09em;color:var(--text);}
.ssi-v111-benefits small{margin-top:5px;color:var(--muted);font-size:10px;line-height:1.4;}
.ssi-v111-information,.ssi-v111-content{margin-top:52px;padding-top:30px;border-top:2px solid var(--text);}
.ssi-v111-section-heading>span{color:var(--accent);font-size:9px;font-weight:900;letter-spacing:.15em;}
.ssi-v111-section-heading h2{margin:6px 0 22px!important;color:var(--text)!important;font-size:26px!important;line-height:1.1!important;font-weight:900!important;text-transform:uppercase!important;}
.ssi-v111-info-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);background:var(--card);}
.ssi-v111-info-grid>div{min-width:0;padding:20px;border-right:1px solid var(--border);}
.ssi-v111-info-grid>div:last-child{border-right:0;}
.ssi-v111-info-grid span,.ssi-v111-attributes span{display:block;color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:7px;}
.ssi-v111-info-grid strong,.ssi-v111-attributes strong{display:block;color:var(--text);font-size:13px;line-height:1.45;word-break:break-word;}
.ssi-v111-attributes{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--border);border-top:0;background:var(--surface);}
.ssi-v111-attributes>div{padding:16px 20px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);}
.ssi-v111-description{padding:28px;background:var(--card);border:1px solid var(--border);color:var(--text);font-size:14px;line-height:1.8;}
.ssi-v111-description p:last-child{margin-bottom:0;}
.ssi-v111-standard-lower{margin-top:48px;}
.ssi-v111-standard-lower .woocommerce-tabs{margin:0!important;padding-top:30px!important;border-top:1px solid var(--border)!important;}
.ssi-v111-standard-lower .woocommerce-tabs ul.tabs{display:flex!important;gap:26px!important;margin:0!important;padding:0!important;list-style:none!important;border:0!important;}
.ssi-v111-standard-lower .woocommerce-tabs ul.tabs:before,.ssi-v111-standard-lower .woocommerce-tabs ul.tabs:after{display:none!important;}
.ssi-v111-standard-lower .woocommerce-tabs ul.tabs li{margin:0!important;padding:0!important;border:0!important;background:none!important;}
.ssi-v111-standard-lower .woocommerce-tabs ul.tabs li a{padding:0 0 10px!important;border-bottom:2px solid transparent!important;color:var(--muted)!important;font-size:10px!important;font-weight:900!important;letter-spacing:.08em;text-transform:uppercase;}
.ssi-v111-standard-lower .woocommerce-tabs ul.tabs li.active a{color:var(--text)!important;border-bottom-color:var(--accent)!important;}
.ssi-v111-standard-lower .woocommerce-tabs .panel{padding:22px 0 0!important;border:0!important;color:var(--muted)!important;}
.ssi-v111-standard-lower .related.products,.ssi-v111-standard-lower .upsells.products{margin-top:50px!important;padding-top:30px!important;border-top:1px solid var(--border)!important;}
.ssi-v111-standard-lower .related.products>h2,.ssi-v111-standard-lower .upsells.products>h2{font-size:22px!important;color:var(--text)!important;font-weight:900!important;text-transform:uppercase!important;}
@media(max-width:800px){
 .ssi-v111-product-page{padding:24px 0 50px;}
 .ssi-v111-product{padding:0 14px;}
 .ssi-v111-hero{grid-template-columns:1fr;gap:24px;}
 .ssi-v111-cover-stage{padding:14px;}
 .ssi-v111-cover-stage .woocommerce-product-gallery__image{aspect-ratio:3/4!important;}
 .ssi-v111-gallery-note{font-size:8px;}
 .ssi-v111-summary{padding:24px 20px 22px;}
 .ssi-v111-summary .product_title{font-size:27px!important;}
 .ssi-v111-summary form.cart{grid-template-columns:62px 1fr 1fr;gap:6px!important;}
 .ssi-v111-summary form.cart .single_add_to_cart_button,.ssi-v111-summary .ssi-single-buy-now{padding:0 8px!important;font-size:9px!important;letter-spacing:.04em!important;}
 .ssi-v111-benefits{grid-template-columns:1fr;}
 .ssi-v111-benefits>div{border-right:0;border-bottom:1px solid var(--border);padding:15px 16px;}
 .ssi-v111-benefits>div:last-child{border-bottom:0;}
 .ssi-v111-info-grid{grid-template-columns:1fr 1fr;}
 .ssi-v111-info-grid>div{border-bottom:1px solid var(--border);}
 .ssi-v111-info-grid>div:nth-child(2n){border-right:0;}
 .ssi-v111-attributes{grid-template-columns:1fr 1fr;}
 .ssi-v111-attributes>div:nth-child(2n){border-right:0;}
 .ssi-v111-information,.ssi-v111-content{margin-top:38px;padding-top:24px;}
 .ssi-v111-section-heading h2{font-size:22px!important;}
}
@media(max-width:480px){
 .ssi-v111-summary form.cart{grid-template-columns:58px 1fr;}
 .ssi-v111-summary form.cart .ssi-single-buy-now{grid-column:1/-1;}
 .ssi-v111-info-grid,.ssi-v111-attributes{grid-template-columns:1fr;}
 .ssi-v111-info-grid>div,.ssi-v111-attributes>div{border-right:0;}
}


/* v112 — Dark-mode product summary text fix
   Keep the issue-introduction heading/content readable in dark mode.
   Light mode is intentionally unchanged.
*/
html[data-theme="dark"] .ssi-v111-summary .woocommerce-product-details__short-description,
html[data-theme="dark"] .ssi-v111-summary .woocommerce-product-details__short-description strong,
html[data-theme="dark"] .ssi-v111-summary .woocommerce-product-details__short-description b,
html[data-theme="dark"] .ssi-v111-summary .woocommerce-product-details__short-description em {
    color: #f5f5f5 !important;
}
html[data-theme="dark"] .ssi-v111-summary .woocommerce-product-details__short-description a {
    color: #ffffff !important;
}


/* v113 — Remove duplicated Inside This Issue wrapper heading; keep the content heading. */
.ssi-v111-content > .ssi-v111-description { margin-top: 0; }


/* v114 — Remove the remaining duplicate issue heading from product descriptions.
   The issue content remains intact; only the redundant heading is stripped in PHP. */