/* Correcciones compartidas que deben aplicarse después del bundle de cada tema. */

/* Publication mode: existing admin controls, no second editor. */
.catalog-main .catalog-product-mode {
    display: flex; align-items: center; gap: 8px; min-height: 44px;
    padding: 6px 10px; margin: 0; box-sizing: border-box;
    font: inherit; font-size: .8rem; color: inherit; cursor: pointer;
}
.catalog-main .catalog-product-mode input { width: 18px; height: 18px; flex: 0 0 18px; accent-color: var(--accent-color, #4caf50); }
.catalog-main .product-management-bar { flex-wrap: wrap; }
/* Two balanced slots in the open image; grid controls keep their own layout. */
body .catalog-main .category-carousel .product-management-bar.product-management-wrapper {
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr));
    flex: 1 1 0; min-width: 0; width: 100%; gap: 8px;
    align-items: center; justify-items: center;
}
body .catalog-main .category-carousel .product-management-bar > .add-product-btn {
    grid-column: 1; grid-row: 1; max-width: 100%;
    white-space: normal; justify-content: center;
}
body .catalog-main .category-carousel .product-management-bar > .catalog-product-mode {
    grid-column: 2; grid-row: 1; min-width: 0; max-width: 100%;
    padding-inline: 0; justify-content: center;
}
body .catalog-main .category-carousel .product-management-bar > .add-product-ia-btn {
    grid-column: 1 / -1; max-width: 100%;
}
.catalog-main :is(.add-product-btn,.add-product-ia-btn,.grid-quick-product)[hidden] { display: none !important; }
#grid-view .grid-quick-product[hidden] { display: none !important; }
body #grid-view .grid-item .product-management-wrapper :is(.add-product-btn,.add-product-ia-btn)[hidden] { display: none !important; }
.catalog-main .add-product-btn:disabled {
    background: var(--color-surface-soft-2, #e8e8ed) !important;
    color: var(--color-text-muted, #6b7280) !important;
    border-color: var(--color-border-subtle, #d1d1d6) !important;
    box-shadow: none !important; opacity: 1 !important;
    cursor: not-allowed; transform: none !important;
}
body:is(.theme-negro, .theme-matrix) .catalog-main .add-product-btn:disabled {
    background: #252a30 !important; color: #aeb7c4 !important; border-color: #444c58 !important;
}
#grid-view .grid-image-stage { position: relative; }
#grid-view .grid-quick-product {
    position: absolute; right: 6px; bottom: 6px; z-index: 8;
    width: 44px; height: 44px; min-width: 44px; min-height: 44px;
    padding: 0; margin: 0; border: 0; border-radius: 50%;
    background: transparent; font-size: 0; cursor: pointer;
    color: var(--accent-contrast-color, #fff);
}
#grid-view .grid-quick-product::before {
    content: '+'; position: absolute; inset: 6px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--accent-color, #4caf50); color: inherit;
    font-family: inherit; font-size: 24px; font-weight: 500; line-height: 1;
    box-shadow: 0 1px 4px #0003;
}
#grid-view .grid-quick-product:hover::before { filter: brightness(.92); }
#grid-view .grid-quick-product.is-in-cart::before { content: ''; }
#grid-view .grid-quick-product.is-in-cart::after {
    content: ''; position: absolute; inset: 13px; pointer-events: none;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
body.theme-negro #grid-view .grid-quick-product { color: var(--accent-contrast-color, #fff); }
body.theme-matrix #grid-view .grid-quick-product { color: var(--accent-contrast-color, #021208); }
#grid-view .grid-quick-product:focus-visible,
.catalog-main .catalog-product-mode input:focus-visible { outline: 2px solid var(--accent-color, #4caf50); outline-offset: 2px; }

/* Animate the real surface, not a clipped copy: its theme shadow stays outside it. */
.catalog-main .product-zone.mc-marker-reveal .product-text-info {
    box-sizing: border-box !important;
    width: var(--mc-marker-rest-size) !important;
    height: var(--mc-marker-rest-size) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: var(--mc-marker-surface-limit) !important;
    padding: 0 !important;
    overflow: visible !important;
    translate: var(--mc-marker-rest-shift, 0px) 0;
    transform-origin: var(--mc-marker-scale-origin, 50% 0px);
    scale: 1;
    opacity: 1;
    --mc-marker-deploy-time: 320ms;
    transition: width var(--mc-marker-deploy-time) cubic-bezier(.16, 1, .3, 1),
        height var(--mc-marker-deploy-time) cubic-bezier(.16, 1, .3, 1),
        padding var(--mc-marker-deploy-time) cubic-bezier(.16, 1, .3, 1),
        translate var(--mc-marker-deploy-time) cubic-bezier(.16, 1, .3, 1),
        scale 260ms cubic-bezier(.16, 1, .3, 1), opacity 260ms cubic-bezier(.16, 1, .3, 1) !important;
    pointer-events: none !important;
}
.catalog-main .product-zone.mc-marker-reveal .product-text-info > * {
    max-width: min(var(--mc-marker-child-limit, 100%), var(--mc-marker-content-limit)) !important;
    /* Clip only text to its available line, never the shadow-bearing surface. */
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    opacity: 0 !important;
    transition: opacity 120ms ease !important;
}
.catalog-main .product-zone.mc-marker-reveal .product-text-info > [data-mc-marker-empty] { display: none !important; }
.catalog-main .product-zone.mc-marker-reveal .product-cart-icon {
    pointer-events: auto !important;
    /* Existing translateY(-50%) puts the visual centre at the local top. */
    transform-origin: 50% 0;
    scale: 1;
    opacity: 1;
    transition: scale 260ms cubic-bezier(.16, 1, .3, 1), opacity 260ms cubic-bezier(.16, 1, .3, 1) !important;
}
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="emerging"] .product-cart-icon,
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="emerging"] .product-text-info {
    scale: .65; opacity: 0; transition: none !important;
}
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="deploying"] .product-text-info,
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="closing"] .product-text-info,
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="open"] .product-text-info {
    width: var(--mc-marker-surface-limit) !important;
    height: var(--mc-marker-surface-height) !important;
    padding: var(--mc-marker-padding) !important;
    translate: 0 0;
}
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="retracting"] .product-text-info { --mc-marker-deploy-time: 280ms; }
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="open"] .product-text-info { pointer-events: auto !important; }
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="open"] .product-text-info > * { opacity: var(--mc-marker-child-opacity, 1) !important; transition-duration: 160ms !important; transition-timing-function: ease-out !important; }
.catalog-main .product-zone.mc-marker-reveal[data-marker-state="collapsed"] .product-text-info { visibility: hidden !important; }
.catalog-main .product-zone.mc-marker-reveal[data-marker-has-text="false"] .product-text-info { visibility: hidden !important; }
.catalog-main .product-zone.mc-marker-reveal:not(.is-marker-current) .product-cart-icon,
.catalog-main .product-zone.mc-marker-reveal:not(.is-marker-current) .product-text-info { visibility: hidden !important; transition: none !important; }
.catalog-main .product-zone.mc-marker-reveal:not(.is-marker-current) .product-text-info,
.catalog-main .product-zone.mc-marker-reveal:not(.is-marker-current) .product-text-info > * { transition: none !important; }
.catalog-main .product-zone.mc-marker-reveal .product-cart-icon:focus-visible { outline: 2px solid currentColor !important; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
    .catalog-main .product-zone.mc-marker-reveal .product-cart-icon,
    .catalog-main .product-zone.mc-marker-reveal .product-text-info,
    .catalog-main .product-zone.mc-marker-reveal .product-text-info > * { transition: none !important; scale: 1; }
}

/* Sold-out markers keep their existing icon and only the canonical status text. */
.catalog-main .product-zone:is(.unavailable, [data-product-available="0"]) .product-text-info > :not(.product-agotado) {
    display: none !important;
}
/* Legacy icon-only surfaces use their existing responsive half-circle anchor. */
.catalog-main .product-zone.product-zone--icon-only:not(.mc-marker-reveal):is(.unavailable, [data-product-available="0"]) .product-text-info--icon-only {
    width: max-content !important;
    min-width: 0 !important;
    padding: 0 12px 0 calc(var(--mc-marker-compact-half) + 8px) !important;
}
.catalog-main .product-zone.product-zone--icon-only.is-flipped:not(.mc-marker-reveal):is(.unavailable, [data-product-available="0"]) .product-text-info--icon-only {
    padding: 0 calc(var(--mc-marker-compact-half) + 8px) 0 12px !important;
}
.catalog-main .product-zone.product-zone--icon-only .product-cart-icon { transform-origin: 0 0; }

/* Ordenar es una acción secundaria: Matrix no hereda la superficie blanca legacy. */
body.theme-matrix.is-catalog-owner .grid-category-order-btn {
    background: var(--matrix-panel, #030b07) !important;
    border-color: var(--matrix-border-strong, rgba(98, 255, 138, .72)) !important;
    color: var(--matrix-accent-soft, #b8ffc9) !important;
}

body.theme-matrix.is-catalog-owner .grid-category-order-btn:is(:hover, :focus-visible) {
    background: var(--matrix-panel-raised, #07130c) !important;
    border-color: var(--matrix-accent, #62ff8a) !important;
    color: var(--matrix-accent-soft, #b8ffc9) !important;
}

/* El picker informa sobre el logo persistido, no sólo el archivo local del input. */
#business-config-modal .business-logo-control {
    position: relative;
    min-width: 0;
}

#business-config-modal .business-logo-control #business-logo {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    min-height: 100%;
    max-height: none;
    margin: 0;
    padding: 0 !important;
    opacity: 0;
    cursor: pointer;
}

#business-config-modal .business-logo-picker {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 44px;
    margin: 0;
    padding: 5px;
    border: 1px dashed var(--color-border-muted, #d1d5db);
    border-radius: 8px;
    background: var(--color-surface-base, #fff);
    font-size: .75rem;
    font-weight: 400;
    cursor: pointer;
    box-sizing: border-box;
}

#business-config-modal .business-logo-action {
    flex: 0 0 auto;
    padding: 8px 10px;
    border-radius: 6px;
    background: var(--accent-color, #10b981);
    color: var(--accent-contrast-color, #fff);
    font-weight: 700;
}

#business-config-modal #business-logo-status {
    flex: 1 1 100px;
    min-width: 0;
    color: inherit;
    overflow-wrap: anywhere;
}

#business-config-modal .business-logo-control:focus-within .business-logo-picker {
    outline: 2px solid var(--accent-color, #10b981);
    outline-offset: 2px;
}

/* Negro + Carbón usa acento efectivo claro: el preview necesita el mismo contraste. */
body.theme-negro #business-config-modal #icon-style-selector .cart-preview :is(svg, path) {
    fill: var(--accent-contrast-color, #1f2937) !important;
    color: var(--accent-contrast-color, #1f2937) !important;
}

/* Guardar debe seguir siendo legible si el acento del tema Negro es claro. */
body.theme-negro .crop-modal-content .crop-btn-primary {
    color: var(--accent-contrast-color, #fff) !important;
}

body.theme-negro .crop-modal-content .crop-btn-primary:disabled {
    border: 1px solid var(--color-border-subtle, #454b55) !important;
    background: var(--color-surface-soft-2, #292d34) !important;
    color: var(--color-text-muted, #aeb7c4) !important;
    opacity: 1 !important;
}

/* Información del negocio: contiene nombres y descripciones sin espacios. */
#business-info-modal .business-info-header,
#business-info-modal .business-name-section {
    min-width: 0;
}

#business-info-modal .business-name-section {
    flex: 1 1 auto;
    max-width: 100%;
}

#business-info-modal :is(.business-name-section h3, .business-description) {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

#business-info-modal .how-to-buy-section h4 {
    display: flex;
    align-items: center;
    gap: 9px;
}

#business-info-modal .how-to-buy-icon {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
}

/* El color de texto acompaña al contraste calculado para el acento elegido. */
.active-category-tooltip,
.active-category-tooltip.show,
.active-category-tooltip .category-name {
    color: var(--accent-contrast-color, #fff) !important;
}

.active-category-tooltip .category-name {
    text-shadow: none !important;
}

/* El acceso para agregar productos conserva contraste aun con acentos muy claros. */
.empty-product-cta-icon-wrap {
    border: 1px solid color-mix(in srgb, var(--accent-contrast-color, #fff) 24%, transparent);
    background: var(--accent-color, #10b981) !important;
}

.empty-product-cta-icon {
    stroke: var(--accent-contrast-color, #fff) !important;
}

/* Formularios de opciones: superficies y campos legibles en los temas oscuros. */
body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator {
    border-color: var(--color-border-subtle, #454b55) !important;
    background: var(--color-surface-soft, #202329) !important;
    color: var(--color-text-primary, #f8fafc) !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .28) !important;
}

body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator-heading strong {
    color: var(--color-text-primary, #f8fafc) !important;
}

body:is(.theme-negro, .theme-matrix) #bottomSheet :is(
    .bs-choice-creator-heading span,
    .bs-choice-creator-grid label > span
) {
    color: var(--color-text-muted, #aeb7c4) !important;
}

body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator-grid :is(input, select) {
    border-color: var(--color-border-subtle, #454b55) !important;
    background: var(--color-surface-muted, #111318) !important;
    color: var(--color-text-primary, #f8fafc) !important;
    color-scheme: dark;
}

body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator-grid :is(input, select)::placeholder {
    color: var(--color-text-muted, #aeb7c4) !important;
    opacity: 1;
}

body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator-grid select option {
    background: var(--color-surface-muted, #111318);
    color: var(--color-text-primary, #f8fafc);
}

body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator-actions .bs-choice-creator-cancel {
    border-color: var(--color-border-subtle, #454b55) !important;
    color: var(--color-text-secondary, #d1d5db) !important;
}

/* Botones principales del creador: también respetan acentos claros. */
#bottomSheet .bs-choice-manual-value > button,
#bottomSheet .bs-choice-creator-actions button:not(.bs-choice-creator-cancel) {
    border-color: var(--accent-color, #22c55e) !important;
    background: var(--accent-color, #22c55e) !important;
    color: var(--accent-contrast-color, #fff) !important;
    opacity: 1;
}

#bottomSheet .bs-choice-manual-value > button:disabled,
#bottomSheet .bs-choice-creator-actions button:not(.bs-choice-creator-cancel):disabled {
    border-color: #cbd5e1 !important;
    background: #e2e8f0 !important;
    color: #475569 !important;
    opacity: 1 !important;
    cursor: not-allowed;
}

body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-manual-value > button:disabled,
body:is(.theme-negro, .theme-matrix) #bottomSheet .bs-choice-creator-actions button:not(.bs-choice-creator-cancel):disabled {
    border-color: var(--color-border-subtle, #454b55) !important;
    background: var(--color-surface-soft-2, #292d34) !important;
    color: var(--color-text-muted, #aeb7c4) !important;
}

/* La cabecera "Talle/Color/..." pertenece visualmente a su mismo constructor. */
body:is(.theme-negro, .theme-matrix) #product-modal .pm-choice-builder {
    border-color: var(--pm-border, #454b55) !important;
    background: var(--pm-surface, #202329) !important;
    color: var(--pm-text, #f8fafc) !important;
}

body:is(.theme-negro, .theme-matrix) #product-modal .pm-choice-builder-heading {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

body:is(.theme-negro, .theme-matrix) #product-modal .pm-choice-builder-heading strong {
    color: var(--pm-text, #f8fafc) !important;
}

body:is(.theme-negro, .theme-matrix) #product-modal .pm-choice-builder-heading span {
    color: var(--pm-muted, #aeb7c4) !important;
}

/* El pie del carrito reparte el ancho y permite envolver cualquier texto. */
body[class*="theme-"] .cart-footer {
    display: grid !important;
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
    align-items: stretch !important;
    gap: 10px !important;
    min-width: 0;
}

body[class*="theme-"] .cart-footer.cart-has-items {
    grid-template-columns: minmax(0, 1fr);
}

.cart-footer.cart-has-items > .whatsapp-btn {
    grid-column: 1 / -1;
}

.cart-footer > .whatsapp-btn,
.cart-footer > .discount-banner-compact {
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;
    max-width: 100%;
}

.cart-footer > .whatsapp-btn {
    white-space: normal !important;
    overflow-wrap: anywhere;
}

.discount-banner-compact,
.discount-banner-compact .discount-badge,
.discount-banner-compact .discount-badge > * {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: normal;
}

.discount-banner-compact {
    overflow: hidden;
}

.discount-banner-compact .discount-badge {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    padding-inline: clamp(6px, 2.5vw, 10px) !important;
    line-height: 1.2 !important;
    white-space: normal !important;
}

.discount-banner-compact .discount-badge__label {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    font-size: clamp(.78rem, 3.4vw, .875rem);
    line-height: 1.2;
    letter-spacing: -.01em;
    text-align: center;
    text-wrap: balance;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (max-width: 380px) {
    body[class*="theme-"] .cart-footer {
        gap: 8px !important;
    }

    .cart-footer > .whatsapp-btn,
    .discount-banner-compact .discount-badge {
        padding-inline: 8px !important;
        font-size: .9rem !important;
    }
}

/* Enlaces de producto: neutralizan el estilo nativo y conservan foco en todos los temas. */
.product-zone[href][data-product-url],
.classic-product-button[href][data-product-url] {
    text-decoration: none !important;
}

.classic-product-client-entry .classic-product-button[href][data-product-url] {
    cursor: pointer;
}

.product-zone[href][data-product-url]:focus-visible {
    outline: 3px solid var(--accent-color, #10b981) !important;
    outline-offset: 2px !important;
}

.classic-product-client-entry .classic-product-button[href][data-product-url]:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent-color, #10b981) 58%, #fff);
    outline-offset: -3px;
    border-radius: 8px;
}

/* A boundary arrow must stay hidden even when a theme explicitly sets display. */
body .catalog-main .category-carousel .nav-arrow[hidden] {
    display: none !important;
}

/* Public carousel: bounded dots over the existing navigation controls.
   Lightweight arrows shared with owner view; navigation/visibility unchanged. */
body:not(.is-catalog-owner) .category-carousel .carousel-dots {
    position: relative;
    width: calc(var(--mc-dot-count, 7) * 20px);
    max-width: 100%;
    height: 28px;
    min-height: 28px;
    padding: 0;
    gap: 0;
    margin-inline: auto;
    overflow: hidden;
    overflow: clip;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot {
    display: grid;
    place-items: center;
    width: 20px;
    height: 28px;
    flex: 0 0 20px;
    border-radius: 0;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1;
    color: var(--color-text-muted, #64748b);
    transform: none;
    transition: transform 220ms ease, opacity 180ms ease;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot::before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    margin: auto;
    border-radius: 50%;
    background: currentColor;
    opacity: .65;
    transition: transform 220ms ease, opacity 180ms ease;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot.active {
    color: var(--accent-color, #2563eb);
    transform: none;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot.active::before {
    transform: scale(1.35);
    opacity: 1;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot.is-window-edge:not(.active)::before {
    transform: scale(.65);
    opacity: .5;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dots.is-public-pager .carousel-dot {
    position: absolute;
    left: 0;
    top: 0;
    transform: translateX(calc(var(--mc-dot-slot) * 20px));
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot.is-outside-window {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Before the first controller projection, never flash an unbounded dot row. */
body:not(.is-catalog-owner) .category-carousel .carousel-dots:not(.is-public-pager) .carousel-dot:nth-child(n+8) {
    display: none;
}

body:not(.is-catalog-owner) .category-carousel .carousel-dot:focus-visible::before {
    outline: 2px solid currentColor;
    outline-offset: 3px;
    opacity: 1;
}

body .catalog-main .category-carousel .nav-arrow {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    color: var(--color-text-primary, #1e293b) !important;
    transform: translateY(-50%) !important;
    transition: opacity 180ms ease !important;
}

body .catalog-main .category-carousel .nav-arrow::before {
    content: '';
    position: absolute;
    inset: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(15, 23, 42, .18);
    backdrop-filter: blur(6px);
    transition: background 180ms ease, border-color 180ms ease;
    pointer-events: none;
}

body.theme-negro .catalog-main .category-carousel .nav-arrow::before {
    background: rgba(10, 16, 13, .72);
    border-color: color-mix(in srgb, currentColor 30%, transparent);
}

body .catalog-main .category-carousel .nav-arrow svg {
    position: relative;
    width: 18px !important;
    height: 18px !important;
}

body .catalog-main .category-carousel .nav-arrow:hover::before {
    background: color-mix(in srgb, var(--color-surface-base, #ffffff) 88%, transparent);
    border-color: currentColor;
}

body .catalog-main .category-carousel .nav-arrow:focus-visible::before {
    outline: 2px solid var(--accent-color, #2563eb);
    outline-offset: 3px;
}

/* Matrix keeps its original angular green identity, not the neutral circle. */
body.theme-matrix .catalog-main .category-carousel .nav-arrow {
    color: var(--matrix-accent-soft) !important;
}

body.theme-matrix .catalog-main .category-carousel .nav-arrow::before {
    border-radius: 5px;
    background: rgba(1, 13, 6, .9);
    border-color: var(--matrix-border-strong);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .3), inset 0 0 8px rgba(54, 255, 111, .08);
}

body.theme-matrix .catalog-main .category-carousel .nav-arrow:hover {
    color: #ffffff !important;
}

body.theme-matrix .catalog-main .category-carousel .nav-arrow:hover::before {
    background: #0a2112;
    border-color: var(--matrix-accent);
    box-shadow: 0 0 10px var(--matrix-glow);
}

@media (prefers-reduced-motion: reduce) {
    body:not(.is-catalog-owner) .category-carousel .carousel-dot,
    body:not(.is-catalog-owner) .category-carousel .carousel-dot::before,
    body .catalog-main .category-carousel .nav-arrow,
    body .catalog-main .category-carousel .nav-arrow::before {
        transition: none !important;
    }
}