/*
 * WooCommerce Archives — Layout
 *
 * Split from legacy /woo/archive/archive.css to support the “block schema”
 * for archives + categories, without changing the frontend output.
 */

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~                     PAGE TOKENS (ARCHIVE CONTEXT)            ~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body.archive,
body.tax-product_cat {
    /* Softer “Apple-like” neutrals for Woo pages only */
    --bspc-text-secondary: #86868b;

    /* Page canvas */
    --bspc-bg-page: #f5f5f7;

    /* Subtle borders/shadows used by the Apple card system */
    --bspc-border-light: #d2d2d7;
    --bspc-border-subtle: #e5e5e5;

    /* Animation + elevation tokens */
    --bspc-ease-apple: cubic-bezier(0.25, 0.8, 0.25, 1);
    --bspc-shadow-sm: 0 2px 4px rgba(0,0,0,0.02);
    --bspc-shadow-md: 0 8px 25px rgba(0, 0, 0, 0.08);
    --bspc-radius-card: 18px;

    /* Dedicated stack used by the old archive.css (kept for parity) */
    --bspc-font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~                     CANVAS + CONTAINERS                       ~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body.tax-product_cat,
body.archive {
    background-color: var(--bspc-bg-page) !important;
    font-family: var(--bspc-font-stack);
    color: var(--bspc-text-primary);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

/* Categories: make the theme wrappers transparent to show the page canvas. */
body.tax-product_cat #primary,
body.tax-product_cat #main,
body.tax-product_cat .entry-content {
    background-color: transparent !important;
}

/* Override the generic section utility ONLY in archive contexts (legacy parity). */
body.archive .bpc-section,
body.tax-product_cat .bpc-section {
    max-width: 1200px;
    margin: 0 auto 60px;
    padding: 0 20px;
}

body.archive .section-title,
body.tax-product_cat .section-title {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 30px;
    color: var(--bspc-text-primary);
    letter-spacing: -0.01em;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~                     MOBILE PADDING FIX                         ~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

@media (max-width: 980px) {
    body.tax-product_cat #primary,
    body.archive #primary {
        padding-top: 0 !important;
    }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~                     RICH TEXT HELPER                          ~
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

body.archive .bpc-rich-text,
body.tax-product_cat .bpc-rich-text {
    font-size: 16px;
    line-height: 1.7;
    color: var(--bspc-text-primary);
}

body.archive .bpc-rich-text p,
body.tax-product_cat .bpc-rich-text p {
    margin: 0 0 12px;
}

body.archive .bpc-rich-text p:last-child,
body.tax-product_cat .bpc-rich-text p:last-child {
    margin-bottom: 0;
}

body.archive .bpc-rich-text ul,
body.archive .bpc-rich-text ol,
body.tax-product_cat .bpc-rich-text ul,
body.tax-product_cat .bpc-rich-text ol {
    margin: 0 0 12px;
    padding-left: 18px;
}

/* ------------------------------------------------------------------
 * Migliora la leggibilità e l'usabilità delle pagine categoria
 *
 * - .category-bottom-content: delimita la larghezza del testo SEO e ne
 *   aumenta la spaziatura per una lettura confortevole su desktop.
 * - .bspc-empty-category-cta: definisce lo stato “vuoto” con un layout
 *   coerente e centrato, mostrando un'icona e una call to action.
 */
.category-bottom-content {
    max-width: 800px;
    margin: 0 auto 40px;
    font-size: 1.05rem;
    line-height: 1.75;
    color: var(--bspc-text-secondary);
}

.bspc-empty-category-cta {
    text-align: center;
    padding: 60px 20px;
    color: var(--bspc-text-secondary);
}
.bspc-empty-category-cta::before {
    content: '';
    display: block;
    width: 48px;
    height: 48px;
    margin: 0 auto 16px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="%2386868b" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.bspc-empty-category-cta p {
    margin-bottom: 16px;
    font-size: 1rem;
    line-height: 1.6;
}
.bspc-empty-category-cta .btn,
.bspc-empty-category-cta .btn--primary {
    display: inline-block;
    margin-top: 10px;
    padding: 12px 20px;
    border-radius: var(--bspc-radius-medium);
    background-color: var(--bspc-blue-primary);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    transition: background-color 0.2s ease;
}
.bspc-empty-category-cta .btn:hover,
.bspc-empty-category-cta .btn:focus,
.bspc-empty-category-cta .btn--primary:hover,
.bspc-empty-category-cta .btn--primary:focus {
    background-color: var(--bspc-blue-hover);
    color: #fff;
}