/* ========================================
   ANIS - WooCommerce
   Caricato solo sulle pagine del negozio (inc/woocommerce.php), dopo i fogli
   del plugin. Riusa i token di :root di style.css: nessun nuovo colore oltre
   al rosso degli errori gia' usato per i moduli.

   Due contesti:
   - .shop          fondo scuro: catalogo e scheda prodotto
   - .shop-panel    pannello bianco: carrello, pagamento, il mio account
   ======================================== */

/* ----------------------------------------
   Loghi di header e footer
   woocommerce-layout.css applica "height: auto" a ogni <img> della pagina
   (.woocommerce-page img), piu' specifico delle altezze del tema: il logo
   tornava alla misura reale (1724x920) e sfondava l'header.
   ---------------------------------------- */
.woocommerce-page .header__logo-img {
    height: 36px;
    width: auto;
    max-width: none;
}

@media (min-width: 768px) {
    .woocommerce-page .header__logo-img {
        height: 44px;
    }
}

.woocommerce-page .custom-logo {
    height: auto;
    max-height: 60px;
    width: auto;
}

.woocommerce-page .footer__logo {
    height: 40px;
    width: auto;
}

/* ----------------------------------------
   Contenitori
   ---------------------------------------- */
.shop {
    padding: var(--space-4xl) 0;
    background: var(--color-dark);
}

.shop-panel {
    background: var(--color-white);
    color: var(--color-dark);
    border-radius: var(--radius-2xl);
    padding: var(--space-xl) var(--space-lg);
}

@media (min-width: 768px) {
    .shop-panel {
        padding: var(--space-3xl);
    }
}

/* Il reset di style.css azzera i margini di tutto: il testo libero che
   WooCommerce stampa (bacheca dell'account, note, indirizzi) finirebbe
   incollato. Qui si rimette un ritmo minimo. */
.shop-panel p,
.shop-panel address,
.shop-panel table,
.shop-panel form {
    margin-bottom: var(--space-lg);
}

.shop-panel h2,
.shop-panel h3 {
    color: var(--color-dark);
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: var(--space-lg);
}

.shop-panel h2 { font-size: var(--text-2xl); }
.shop-panel h3 { font-size: var(--text-xl); }

.shop-panel a:not(.button):not(.wc-block-components-button):not(.btn) {
    color: var(--color-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.shop-panel a:not(.button):not(.wc-block-components-button):not(.btn):hover {
    color: var(--color-gray-500);
}

/* ----------------------------------------
   Bottoni
   Tutti i bottoni del plugin prendono l'aspetto di .btn--primary.
   ---------------------------------------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.shop-panel .wc-block-components-button:not(.is-link) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-sm);
    font-family: var(--font-primary);
    font-size: var(--text-sm);
    font-weight: 600;
    line-height: 1.2;
    padding: 1rem 1.75rem;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-accent);
    color: var(--color-dark);
    text-decoration: none;
    transition: all var(--transition-base);
    cursor: pointer;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
.shop-panel .wc-block-components-button:not(.is-link):hover {
    background: var(--color-accent-dark);
    color: var(--color-dark);
    box-shadow: var(--shadow-glow);
}

.woocommerce a.button.disabled,
.woocommerce a.button:disabled,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled],
.woocommerce button.button.alt.disabled,
.woocommerce button.button.alt:disabled[disabled],
.shop-panel .wc-block-components-button:not(.is-link):disabled {
    background: var(--color-accent);
    color: var(--color-dark);
    opacity: 0.5;
    box-shadow: none;
    cursor: not-allowed;
}

/* Il pulsante principale del pagamento: piu' grande, come .btn--lg. */
.shop-panel .wc-block-components-checkout-place-order-button,
.shop-panel .wc-block-cart__submit-button,
.woocommerce #payment #place_order,
.woocommerce .wc-proceed-to-checkout a.checkout-button {
    font-size: var(--text-base);
    padding: 1.125rem 2rem;
}

/* ----------------------------------------
   Avvisi (aggiunto al carrello, errori, informazioni)
   ---------------------------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border-top: 3px solid var(--color-accent);
    border-radius: var(--radius-md);
    background: var(--color-dark-card);
    color: var(--color-gray-100);
}

.woocommerce-message::before,
.woocommerce-info::before {
    color: var(--color-accent);
}

.woocommerce-error {
    border-top-color: #FF8B8B;
}

.woocommerce-error::before {
    color: #FF8B8B;
}

.woocommerce-message a:not(.button),
.woocommerce-info a:not(.button),
.woocommerce-error a:not(.button) {
    color: var(--color-accent);
}

/* Il bottone dentro l'avviso ("Visualizza carrello") non deve gonfiare la riga. */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
    padding: 0.625rem 1.25rem !important;
    font-size: var(--text-xs) !important;
}

/* Sul pannello bianco: fondo chiaro, testo scuro. */
.shop-panel .woocommerce-message,
.shop-panel .woocommerce-info,
.shop-panel .woocommerce-error {
    background: var(--color-gray-100);
    color: var(--color-dark);
    border-top-color: var(--color-accent-dark);
}

.shop-panel .woocommerce-message::before,
.shop-panel .woocommerce-info::before {
    color: var(--color-accent-dark);
}

.shop-panel .woocommerce-error {
    border-top-color: #C0392B;
}

.shop-panel .woocommerce-error::before {
    color: #C0392B;
}

.shop-panel .woocommerce-message a:not(.button),
.shop-panel .woocommerce-info a:not(.button),
.shop-panel .woocommerce-error a:not(.button) {
    color: var(--color-dark);
}

.shop-panel .wc-block-components-notice-banner {
    border-radius: var(--radius-md);
}

/* Avviso "negozio dimostrativo" del plugin. */
.woocommerce-store-notice,
p.demo_store {
    background: var(--color-accent);
    color: var(--color-dark);
    font-weight: 600;
}

.woocommerce-store-notice a,
p.demo_store a {
    color: var(--color-dark);
}

/* ----------------------------------------
   Campi dei moduli — pannello bianco
   Account (accesso, registrazione, indirizzi, dati) e pagamento classico.
   Bordati come i campi dei blocchi carrello/pagamento, cosi' le due famiglie
   di moduli del negozio si somigliano.
   ---------------------------------------- */
.shop-panel .woocommerce form .form-row label,
.shop-panel .woocommerce-form-row label {
    display: block;
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    line-height: 1.6;
    color: var(--color-dark);
    margin-bottom: var(--space-sm);
}

/* La casella "Ricordami" e le altre checkbox: etichetta normale, in riga. */
.shop-panel .woocommerce form .form-row label.woocommerce-form__label-for-checkbox,
.shop-panel .woocommerce form .form-row label.checkbox {
    display: inline-flex;
    align-items: center;
    gap: var(--space-sm);
    font-size: var(--text-sm);
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    margin-bottom: 0;
}

.shop-panel .woocommerce form .form-row .required {
    color: #C0392B;
}

.shop-panel .woocommerce form .form-row .input-text,
.shop-panel .woocommerce form .form-row select,
.shop-panel .woocommerce form .form-row textarea,
.shop-panel .woocommerce-cart-form .input-text,
.shop-panel .select2-container--default .select2-selection--single {
    width: 100%;
    min-height: 3.25rem;
    padding: 0.875rem 1rem;
    border: 1px solid rgba(11, 26, 39, 0.25);
    border-radius: var(--radius-sm);
    background: var(--color-white);
    color: var(--color-dark);
    font-family: var(--font-primary);
    font-size: var(--text-base);
    line-height: 1.4;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.shop-panel .woocommerce form .form-row .input-text:focus,
.shop-panel .woocommerce form .form-row select:focus,
.shop-panel .woocommerce form .form-row textarea:focus,
.shop-panel .woocommerce-cart-form .input-text:focus,
.shop-panel .select2-container--default.select2-container--focus .select2-selection--single {
    outline: none;
    border-color: var(--color-dark);
    box-shadow: 0 0 0 3px var(--color-accent-glow);
}

.shop-panel .woocommerce form .form-row.woocommerce-invalid .input-text,
.shop-panel .woocommerce form .form-row.woocommerce-invalid select {
    border-color: #C0392B;
}

.shop-panel .woocommerce form .form-row input[type="checkbox"],
.shop-panel .woocommerce form .form-row input[type="radio"] {
    accent-color: var(--color-dark);
}

/* Menu a tendina dei paesi/province (selectWoo). */
.shop-panel .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0;
    color: var(--color-dark);
    line-height: 1.4;
}

.shop-panel .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 50%;
    right: 0.75rem;
    transform: translateY(-50%);
}

/* Accesso e registrazione: il plugin li chiude in un riquadro bordato, che
   dentro al pannello bianco farebbe una card nella card. */
.shop-panel .woocommerce form.login,
.shop-panel .woocommerce form.register,
.shop-panel .woocommerce form.lost_reset_password {
    border: none;
    border-radius: 0;
    padding: 0;
    margin: 0 0 var(--space-xl);
}

.shop-panel .woocommerce form .form-row {
    padding: 0;
    margin-bottom: var(--space-lg);
}

/* Login senza colonna di registrazione: non serve a tutta larghezza. */
.shop-panel .woocommerce > form.login,
.shop-panel .woocommerce > form.lost_reset_password {
    max-width: 32rem;
}

.shop-panel .woocommerce form .form-row .button {
    margin-top: var(--space-sm);
}

/* ----------------------------------------
   Accesso e password dimenticata (chi non ha ancora fatto il login)
   Il pannello a tutta larghezza lasciava il modulo in un angolo e mezzo
   schermo bianco a destra: qui diventa una card stretta e centrata, come
   le schermate di accesso. Se e' attiva anche la registrazione (due colonne,
   .u-columns) il pannello resta largo.
   ---------------------------------------- */
body.woocommerce-account:not(.logged-in) .shop-panel:not(:has(.u-columns)) {
    max-width: 30rem;
    margin-inline: auto;
}

/* Il titolo grande (il nome del negozio) sta sopra la card, nella foto:
   "Accedi" dentro la card resta un titolo di modulo. */
body.woocommerce-account:not(.logged-in) .shop-panel .woocommerce > h2 {
    margin-bottom: var(--space-xl);
    font-size: var(--text-2xl);
    text-align: center;
}

body.woocommerce-account:not(.logged-in) .shop-panel .woocommerce > form.login,
body.woocommerce-account:not(.logged-in) .shop-panel .woocommerce > form.lost_reset_password {
    max-width: none;
    margin-bottom: 0;
}

/* ----------------------------------------
   Porta del negozio (woocommerce-pagina.php, Il mio account senza accesso)
   Foto del mare a tutto schermo, titolo del negozio, card di accesso al
   centro e, sotto il modulo, l'ingresso come ospite.
   ---------------------------------------- */
.shop-accesso {
    position: relative;
    isolation: isolate;
    display: flex;
    justify-content: center;
    min-height: 100vh;
    padding: calc(var(--header-height) + var(--space-4xl)) var(--container-padding) var(--space-4xl);
    overflow: hidden;
    background: var(--color-dark);
}

.shop-accesso__bg {
    position: absolute;
    inset: 0;
    z-index: -1;
}

.shop-accesso__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Velo scuro, piu' fitto in basso: la card bianca resta il punto di
   attenzione e il footer attacca senza stacchi. */
.shop-accesso__bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(11, 26, 39, 0.45) 0%,
        rgba(11, 26, 39, 0.7) 60%,
        rgba(11, 26, 39, 1) 100%
    );
}

.shop-accesso__contenuto {
    width: 100%;
    max-width: 30rem;
}

.shop-accesso__intro {
    margin-bottom: var(--space-xl);
    text-align: center;
}

.shop-accesso__titolo {
    margin-bottom: var(--space-sm);
    font-family: var(--font-display);
    font-size: clamp(2rem, 8vw, var(--text-5xl));
    font-weight: 800;
    font-style: italic;
    line-height: 1.1;
    color: var(--color-white);
}

.shop-accesso__sottotitolo {
    font-size: var(--text-lg);
    color: var(--color-gray-300);
}

.shop-accesso .shop-panel {
    box-shadow: var(--shadow-xl);
}

/* Ingresso come ospite (anis_wc_accesso_ospite). */
.shop-accesso__ospite {
    margin-top: var(--space-xl);
    text-align: center;
}

.shop-panel .shop-accesso__oppure {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    margin-bottom: var(--space-lg);
    font-size: var(--text-xs);
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: var(--color-gray-500);
}

.shop-accesso__oppure::before,
.shop-accesso__oppure::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--color-gray-300);
}

.shop-panel .shop-accesso__bottone-ospite {
    width: 100%;
    border: 2px solid var(--color-dark);
    background: transparent;
    color: var(--color-dark);
}

.shop-panel .shop-accesso__bottone-ospite:hover {
    background: var(--color-dark);
    color: var(--color-white);
}

.shop-panel .shop-accesso__nota {
    margin: var(--space-sm) 0 0;
    font-size: var(--text-sm);
    color: var(--color-gray-500);
}

/* Etichetta e campo attaccati, campi distanziati in modo regolare: prima
   tra etichetta e campo c'era piu' spazio che tra un campo e l'altro. */
.shop-panel .woocommerce form.login .form-row,
.shop-panel .woocommerce form.register .form-row,
.shop-panel .woocommerce form.lost_reset_password .form-row {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    width: 100%;
    float: none;
    margin: 0 0 var(--space-md);
}

.shop-panel .woocommerce form.login .form-row > *,
.shop-panel .woocommerce form.register .form-row > *,
.shop-panel .woocommerce form.lost_reset_password .form-row > * {
    margin: 0;
}

.shop-panel .woocommerce form.login .form-row label,
.shop-panel .woocommerce form.register .form-row label,
.shop-panel .woocommerce form.lost_reset_password .form-row label {
    margin: 0;
}

/* "Ricordami" e bottone: la casella sopra, il bottone a tutta larghezza. */
.shop-panel .woocommerce form.login .form-row:has(.woocommerce-form-login__submit) {
    gap: var(--space-lg);
    margin-top: var(--space-lg);
}

.shop-panel .woocommerce form.login .woocommerce-form-login__submit,
.shop-panel .woocommerce form.lost_reset_password .button {
    width: 100%;
    margin: 0;
    float: none;
}

.shop-panel .woocommerce form.login .lost_password {
    margin: var(--space-lg) 0 0;
    padding-top: var(--space-lg);
    border-top: 1px solid var(--color-gray-100);
    font-size: var(--text-sm);
    text-align: center;
}

/* Avviso d'errore (password sbagliata) nella card stretta: testo piu' piccolo. */
body.woocommerce-account:not(.logged-in) .shop-panel .woocommerce-error,
body.woocommerce-account:not(.logged-in) .shop-panel .woocommerce-message,
body.woocommerce-account:not(.logged-in) .shop-panel .woocommerce-info {
    margin-bottom: var(--space-xl);
    font-size: var(--text-sm);
}

/* ----------------------------------------
   Blocchi Carrello e Pagamento
   I blocchi hanno gia' un'impaginazione propria pensata per fondo chiaro:
   si allineano solo font, raggi e colore di focus al tema.
   ---------------------------------------- */
.shop-panel .wp-block-woocommerce-cart,
.shop-panel .wp-block-woocommerce-checkout {
    font-family: var(--font-primary);
    color: var(--color-dark);
}

.shop-panel .wc-block-components-text-input input,
.shop-panel .wc-blocks-components-select .wc-blocks-components-select__select,
.shop-panel .wc-block-components-textarea,
.shop-panel .wc-block-components-combobox .wc-block-components-combobox-control input {
    border-color: rgba(11, 26, 39, 0.25);
    border-radius: var(--radius-sm);
    font-family: var(--font-primary);
}

.shop-panel .wc-block-components-text-input input:focus,
.shop-panel .wc-blocks-components-select .wc-blocks-components-select__select:focus,
.shop-panel .wc-block-components-textarea:focus,
.shop-panel .wc-block-components-combobox .wc-block-components-combobox-control input:focus {
    border-color: var(--color-dark);
    box-shadow: 0 0 0 3px var(--color-accent-glow);
    outline: none;
}

.shop-panel .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
    background: var(--color-dark);
    border-color: var(--color-dark);
}

.shop-panel .wc-block-components-checkbox .wc-block-components-checkbox__mark {
    fill: var(--color-white);
}

.shop-panel .wc-block-components-radio-control__input:checked::before {
    background: var(--color-dark);
}

.shop-panel .wc-block-components-checkout-step__title,
.shop-panel .wc-block-components-title.wc-block-components-title {
    font-weight: 800;
    color: var(--color-dark);
}

.shop-panel .wc-block-components-product-price,
.shop-panel .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-weight: 700;
}

.shop-panel .wc-block-components-product-badge {
    border-color: var(--color-accent-dark);
    border-radius: var(--radius-sm);
}

/* Riepilogo ordine a destra: stesso fondo dei campi in evidenza del tema. */
.shop-panel .wp-block-woocommerce-checkout-order-summary-block,
.shop-panel .wc-block-cart__sidebar .wc-block-components-sidebar-layout__inner {
    border-radius: var(--radius-lg);
}

/* ----------------------------------------
   Tabelle: carrello e pagamento classici, ordini dell'account
   ---------------------------------------- */
.shop-panel .woocommerce table.shop_table {
    border: 1px solid rgba(11, 26, 39, 0.12);
    border-radius: var(--radius-md);
    border-collapse: separate;
    width: 100%;
}

.shop-panel .woocommerce table.shop_table th {
    font-size: var(--text-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-gray-500);
}

.shop-panel .woocommerce table.shop_table td,
.shop-panel .woocommerce table.shop_table th {
    padding: var(--space-md);
    border-top-color: rgba(11, 26, 39, 0.08);
}

.shop-panel .woocommerce table.shop_table tbody th,
.shop-panel .woocommerce table.shop_table tfoot th,
.shop-panel .woocommerce table.shop_table tfoot td {
    color: var(--color-dark);
}

.shop-panel .woocommerce table.cart img {
    width: 64px;
    border-radius: var(--radius-sm);
}

.shop-panel .woocommerce a.remove {
    color: #C0392B !important;
}

.shop-panel .woocommerce a.remove:hover {
    background: #C0392B;
    color: var(--color-white) !important;
}

/* Metodi di pagamento del pagamento classico. */
.shop-panel .woocommerce-checkout #payment {
    background: var(--color-gray-100);
    border-radius: var(--radius-lg);
}

.shop-panel .woocommerce-checkout #payment div.payment_box {
    background: var(--color-white);
    color: var(--color-dark);
}

.shop-panel .woocommerce-checkout #payment div.payment_box::before {
    border-bottom-color: var(--color-white);
}

/* Riepilogo dell'ordine ricevuto. */
.shop-panel .woocommerce ul.order_details {
    padding: 0;
    margin-bottom: var(--space-2xl);
}

.shop-panel .woocommerce ul.order_details li {
    border-right-color: rgba(11, 26, 39, 0.15);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-gray-500);
}

.shop-panel .woocommerce ul.order_details li strong {
    margin-top: var(--space-xs);
    font-size: var(--text-base);
    text-transform: none;
    letter-spacing: 0;
    color: var(--color-dark);
}

/* ----------------------------------------
   Il mio account
   ---------------------------------------- */
.shop-panel .woocommerce-MyAccount-navigation ul {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--space-xl);
    border-top: 1px solid rgba(11, 26, 39, 0.1);
}

.shop-panel .woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid rgba(11, 26, 39, 0.1);
}

.shop-panel .woocommerce-MyAccount-navigation li a {
    display: block;
    padding: var(--space-md) var(--space-md);
    border-left: 3px solid transparent;
    color: var(--color-gray-500) !important;
    font-weight: 600;
    text-decoration: none !important;
    transition: all var(--transition-fast);
}

.shop-panel .woocommerce-MyAccount-navigation li a:hover {
    color: var(--color-dark) !important;
    background: var(--color-gray-100);
}

.shop-panel .woocommerce-MyAccount-navigation li.is-active a {
    color: var(--color-dark) !important;
    border-left-color: var(--color-accent);
    background: var(--color-gray-100);
}

.shop-panel .woocommerce-MyAccount-content > p:first-child {
    font-size: var(--text-lg);
}

.shop-panel .woocommerce-Addresses .woocommerce-Address-title h2,
.shop-panel .woocommerce-Addresses .woocommerce-Address-title h3 {
    font-size: var(--text-xl);
}

.shop-panel .woocommerce-Address address {
    padding: var(--space-lg);
    background: var(--color-gray-100);
    border-radius: var(--radius-md);
    line-height: 1.7;
}

/* ----------------------------------------
   Campi — fondo scuro
   Ordinamento del catalogo, quantita', varianti, recensioni.
   ---------------------------------------- */
.shop select,
.shop .quantity .qty,
.shop #review_form input[type="text"],
.shop #review_form input[type="email"],
.shop #review_form textarea {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius-sm);
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--color-white);
    font-family: var(--font-primary);
    font-size: var(--text-sm);
}

.shop select option {
    background: var(--color-dark);
    color: var(--color-white);
}

.shop select:focus,
.shop .quantity .qty:focus,
.shop #review_form input:focus,
.shop #review_form textarea:focus {
    outline: none;
    border-color: var(--color-accent);
}

.shop .quantity .qty {
    width: 4.5rem;
    min-height: 3.25rem;
    text-align: center;
}

/* ----------------------------------------
   Catalogo
   ---------------------------------------- */
/* Saluto sopra il catalogo (anis_wc_saluto_negozio): con quale account si
   sta guardando il negozio, e i link a profilo, ordini, uscita. */
.shop-saluto {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    max-width: 44rem;
    margin: 0 auto var(--space-md);
    padding: var(--space-sm) var(--space-sm) var(--space-sm) var(--space-md);
    border: 1px solid rgba(92, 225, 230, 0.25);
    border-radius: var(--radius-full);
    background: var(--color-dark-card);
}

.shop-saluto__avatar {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-full);
    background: var(--color-accent);
    color: var(--color-dark);
    font-weight: 800;
}

.shop-saluto__testo {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    margin: 0;
    font-size: var(--text-sm);
    line-height: 1.35;
    color: var(--color-gray-300);
}

.shop-saluto__testo strong {
    color: var(--color-white);
}

.shop-saluto__ruolo {
    font-size: var(--text-xs);
    color: var(--color-gray-400);
}

.shop-saluto__ruolo strong {
    color: var(--color-accent);
}

.shop-saluto__profilo {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: var(--space-sm);
    padding: 0.5rem 1rem;
    border: 1px solid var(--color-accent);
    border-radius: var(--radius-full);
    color: var(--color-accent);
    font-size: var(--text-sm);
    font-weight: 600;
    transition: all var(--transition-fast);
}

.shop-saluto__profilo:hover {
    background: var(--color-accent);
    color: var(--color-dark);
}

@media (max-width: 479px) {
    .shop-saluto {
        border-radius: var(--radius-lg);
        flex-wrap: wrap;
    }

    .shop-saluto__profilo {
        width: 100%;
        justify-content: center;
    }
}

/* Barra di ricerca prodotti (anis_wc_ricerca_prodotti): centrata sopra la
   griglia, come nel vecchio shop. Campo e bottone in una riga sola. */
.shop-search {
    position: relative;
    display: flex;
    gap: var(--space-sm);
    max-width: 44rem;
    margin: 0 auto var(--space-2xl);
}

.shop-search__icona {
    position: absolute;
    top: 50%;
    left: var(--space-md);
    transform: translateY(-50%);
    color: var(--color-gray-400);
    pointer-events: none;
}

.shop-search__campo {
    flex: 1;
    min-width: 0;
    padding: 0.875rem var(--space-md) 0.875rem 3rem;
    border: 2px solid var(--color-accent);
    border-radius: var(--radius-md);
    background: var(--color-dark-card);
    color: var(--color-white);
    font-size: var(--text-base);
}

.shop-search__campo::placeholder {
    color: var(--color-gray-400);
}

.shop-search__campo:focus {
    outline: none;
    border-color: var(--color-white);
}

.shop-search__bottone {
    flex-shrink: 0;
}

.woocommerce .woocommerce-result-count {
    margin: 0 0 var(--space-xl);
    font-size: var(--text-sm);
    color: var(--color-gray-400);
}

.woocommerce .woocommerce-ordering {
    margin: 0 0 var(--space-xl);
}

.shop .term-description,
.shop .page-description {
    max-width: 76ch;
    margin-bottom: var(--space-2xl);
    font-size: var(--text-lg);
    color: var(--color-gray-300);
}

/* Griglia: il plugin usa float e larghezze in percentuale; qui una griglia
   vera, con le card della stessa altezza. */
.woocommerce ul.products {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-xl);
    margin: 0 0 var(--space-2xl);
    padding: 0;
    clear: both;
}

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

@media (min-width: 640px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, 1fr); }
    .woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
}

.woocommerce ul.products[class*="columns-"] li.product,
.woocommerce-page ul.products[class*="columns-"] li.product {
    display: flex;
    flex-direction: column;
    width: auto;
    margin: 0;
    float: none;
    padding-bottom: var(--space-lg);
    /* Due parti: in alto la foto su bianco (il fondo delle foto del vecchio
       shop), in basso nome, prezzo e bottone sul blu delle card del sito.
       Una riga turchese le separa, lo stesso turchese del bordo. */
    background: var(--color-dark-card);
    border: 2px solid var(--color-accent);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all var(--transition-base);
}

.woocommerce ul.products li.product:hover {
    border-color: var(--color-accent-dark);
    box-shadow: 0 12px 32px var(--color-accent-glow);
    transform: translateY(-4px);
}

.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
    display: block;
    flex: 1;
    color: inherit;
    text-decoration: none;
}

/* Le foto arrivano dal vecchio shop, in formati diversi e spesso con scritte
   fino al bordo (attestati, tessere, copertine): vanno viste intere. Il
   riquadro resta quadrato per allineare la griglia, la foto ci sta dentro
   senza tagli e il fondo bianco riempie il resto, come lo sfondo delle foto. */
.woocommerce ul.products li.product a img {
    margin: 0 0 var(--space-lg);
    aspect-ratio: 1;
    object-fit: contain;
    padding: var(--space-md);
    background: var(--color-white);
    border-bottom: 2px solid var(--color-accent);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
    padding: 0 var(--space-lg);
    margin-bottom: var(--space-sm);
    font-size: var(--text-lg);
    font-weight: 700;
    line-height: 1.3;
    color: var(--color-white);
}

.woocommerce ul.products li.product .price {
    display: block;
    padding: 0 var(--space-lg);
    margin-bottom: var(--space-md);
    font-size: var(--text-base);
    font-weight: 700;
    color: var(--color-accent);
}

.woocommerce ul.products li.product .star-rating {
    margin: 0 var(--space-lg) var(--space-sm);
}

.woocommerce ul.products li.product .button {
    align-self: flex-start;
    margin: var(--space-sm) var(--space-lg) 0;
}

/* Link "Visualizza carrello" che compare dopo l'aggiunta. */
.woocommerce ul.products li.product .added_to_cart {
    margin: var(--space-sm) var(--space-lg) 0;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-accent);
}

/* Prezzi barrati e in offerta. */
.woocommerce .price del,
.woocommerce div.product p.price del {
    color: var(--color-gray-500);
    opacity: 1;
    font-weight: 500;
}

.woocommerce .price ins {
    text-decoration: none;
}

/* Badge "In offerta!". */
.woocommerce span.onsale {
    min-width: 0;
    min-height: 0;
    padding: 0.375rem 0.875rem;
    border-radius: var(--radius-full);
    background: var(--color-accent);
    color: var(--color-dark);
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.woocommerce ul.products li.product .onsale {
    top: var(--space-md);
    right: var(--space-md);
    left: auto;
    margin: 0;
}

/* Badge "Esaurito" sulle card del catalogo (anis_wc_badge_esaurito).
   Stessa forma di "In offerta", ma in alto a sinistra e scuro: sta sopra
   la foto su fondo bianco e deve leggersi come un avviso, non come una
   promozione. La foto resta a colori: in bianco e nero sembrava rotta. */
.woocommerce ul.products li.product {
    position: relative;
}

.woocommerce ul.products li.product .anis-esaurito {
    position: absolute;
    top: var(--space-md);
    left: var(--space-md);
    z-index: 2;
    padding: 0.375rem 0.875rem;
    border-radius: var(--radius-full);
    background: var(--color-dark);
    color: var(--color-white);
    font-size: var(--text-xs);
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.woocommerce .star-rating,
.woocommerce p.stars a {
    color: var(--color-accent);
}

/* Paginazione del catalogo, come quella degli archivi del tema. */
.woocommerce nav.woocommerce-pagination ul {
    display: inline-flex;
    gap: var(--space-sm);
    border: none;
}

.woocommerce nav.woocommerce-pagination ul li {
    border: none;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 var(--space-sm);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius-sm);
    color: var(--color-gray-300);
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li a:focus {
    background: rgba(255, 255, 255, 0.05);
    color: var(--color-white);
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--color-accent);
    border-color: var(--color-accent);
    color: var(--color-dark);
    font-weight: 700;
}

.woocommerce .woocommerce-info.woocommerce-no-products-found {
    margin-bottom: 0;
}

/* ----------------------------------------
   Scheda prodotto
   Il titolo e' nell'hero: la colonna di destra parte dal prezzo.
   ---------------------------------------- */
.woocommerce div.product {
    color: var(--color-gray-300);
}

/* Foto e dati affiancati su una griglia invece dei float al 48% del plugin:
   la colonna dei dati e' una card come quelle del catalogo (blu, bordo
   turchese), cosi' la scheda non resta una foto enorme accanto al vuoto.
   Schede e correlati vanno a tutta larghezza sotto. */
@media (min-width: 900px) {
    .woocommerce div.product {
        display: grid;
        grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
        gap: var(--space-2xl);
        align-items: start;
    }

    .woocommerce div.product > * {
        grid-column: 1 / -1;
    }

    .woocommerce div.product > div.images {
        grid-column: 1;
    }

    .woocommerce div.product > div.summary {
        grid-column: 2;
    }
}

.woocommerce div.product div.images,
.woocommerce div.product div.summary {
    float: none;
    width: auto;
    margin-bottom: 0;
}

/* Stessa logica delle card: la foto intera su fondo bianco, dentro un
   riquadro quadrato con il bordo turchese. */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    overflow: hidden;
    background: var(--color-white);
    border: 2px solid var(--color-accent);
    border-radius: var(--radius-lg);
}

.woocommerce div.product div.images .woocommerce-product-gallery__image img {
    aspect-ratio: 1;
    object-fit: contain;
    padding: var(--space-lg);
    background: var(--color-white);
}

.woocommerce div.product div.summary {
    padding: var(--space-xl);
    background: var(--color-dark-card);
    border-radius: var(--radius-lg);
}

@media (max-width: 899px) {
    .woocommerce div.product div.summary {
        margin-top: var(--space-xl);
    }
}

/* Avviso "Prezzo riservato" (anis_wc_avviso_prezzo_riservato). */
.anis-prezzo-riservato {
    margin-bottom: var(--space-xl);
    padding: var(--space-lg);
    border-left: 3px solid var(--color-accent);
    border-radius: var(--radius-sm);
    background: rgba(92, 225, 230, 0.08);
    font-size: var(--text-base);
    line-height: 1.6;
}

.anis-prezzo-riservato > * + * {
    margin-top: var(--space-sm);
}

.anis-prezzo-riservato__titolo {
    font-size: var(--text-xl);
    font-weight: 800;
    color: var(--color-white);
}

.anis-prezzo-riservato a:not(.button) {
    color: var(--color-accent);
}

.anis-prezzo-riservato .button {
    margin-top: var(--space-sm);
}

.woocommerce div.product div.images .flex-control-thumbs {
    display: flex;
    gap: var(--space-sm);
    margin-top: var(--space-sm);
}

.woocommerce div.product div.images .flex-control-thumbs li {
    width: auto;
    flex: 1;
    max-width: 25%;
}

.woocommerce div.product div.images .flex-control-thumbs li img {
    border-radius: var(--radius-sm);
}

.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
    background: var(--color-white);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    margin-bottom: var(--space-lg);
    font-size: var(--text-3xl);
    font-weight: 800;
    color: var(--color-accent);
}

.woocommerce div.product .woocommerce-product-details__short-description {
    margin-bottom: var(--space-xl);
    font-size: var(--text-lg);
    line-height: 1.7;
}

.woocommerce div.product .woocommerce-product-details__short-description > * + * {
    margin-top: var(--space-md);
}

.woocommerce div.product .stock {
    color: var(--color-accent);
    font-weight: 600;
}

.woocommerce div.product .stock.out-of-stock {
    color: #FF8B8B;
}

.woocommerce div.product form.cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-md);
    margin-bottom: var(--space-2xl);
}

.woocommerce div.product form.cart::before,
.woocommerce div.product form.cart::after {
    display: none;
}

.woocommerce div.product form.cart div.quantity,
.woocommerce div.product form.cart .button {
    float: none;
    margin: 0;
}

.woocommerce div.product form.cart .variations {
    width: 100%;
    margin-bottom: 0;
}

.woocommerce div.product form.cart .variations label {
    color: var(--color-white);
    font-weight: 600;
}

.woocommerce div.product form.cart .variations select {
    min-width: 12rem;
}

.woocommerce div.product form.cart .reset_variations {
    color: var(--color-accent);
    font-size: var(--text-sm);
}

.woocommerce div.product form.cart .single_variation_wrap {
    width: 100%;
}

.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-md);
}

.woocommerce div.product .product_meta {
    padding-top: var(--space-lg);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    font-size: var(--text-sm);
    color: var(--color-gray-400);
}

.woocommerce div.product .product_meta > span {
    display: block;
    margin-bottom: var(--space-xs);
}

.woocommerce div.product .product_meta a {
    color: var(--color-accent);
}

/* Schede (Descrizione, Informazioni aggiuntive, Recensioni): via le
   linguette grigie del plugin, una riga sottolineata come la nav del tema. */
.woocommerce div.product .woocommerce-tabs {
    clear: both;
    padding-top: var(--space-3xl);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xl);
    padding: 0;
    margin: 0 0 var(--space-2xl);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
    display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    display: block;
    padding: var(--space-md) 0;
    margin-bottom: -1px;
    border-bottom: 2px solid transparent;
    color: var(--color-gray-400);
    font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    color: var(--color-white);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--color-white);
    border-bottom-color: var(--color-accent);
}

.woocommerce div.product .woocommerce-tabs .panel {
    max-width: 76ch;
    margin: 0 0 var(--space-2xl);
    font-size: var(--text-lg);
    line-height: 1.75;
}

.woocommerce div.product .woocommerce-tabs .panel > * + * {
    margin-top: var(--space-lg);
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
    font-size: var(--text-2xl);
    font-weight: 800;
    color: var(--color-white);
}

.woocommerce div.product .woocommerce-tabs .panel ul,
.woocommerce div.product .woocommerce-tabs .panel ol {
    padding-left: var(--space-xl);
}

.woocommerce div.product .woocommerce-tabs .panel a {
    color: var(--color-accent);
}

.woocommerce table.shop_attributes {
    border-top-color: rgba(255, 255, 255, 0.1);
}

.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td {
    padding: var(--space-md);
    border-bottom-color: rgba(255, 255, 255, 0.1);
    background: transparent !important;
}

.woocommerce table.shop_attributes th {
    color: var(--color-white);
}

.woocommerce table.shop_attributes td {
    font-style: normal;
}

/* Recensioni. */
.woocommerce #reviews #comments ol.commentlist {
    padding: 0;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
    border-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--radius-md);
}

.woocommerce #reviews #comments ol.commentlist li img.avatar {
    background: var(--color-dark-card);
    border-color: rgba(255, 255, 255, 0.1);
}

.woocommerce #review_form #respond .comment-form > p {
    margin-bottom: var(--space-md);
}

.woocommerce #review_form #respond label {
    display: block;
    margin-bottom: var(--space-xs);
    color: var(--color-white);
    font-weight: 600;
}

.woocommerce #review_form #respond textarea {
    width: 100%;
}

/* Prodotti correlati e "potrebbe interessarti". */
.woocommerce .related > h2,
.woocommerce .upsells > h2,
.woocommerce .cross-sells > h2 {
    margin-bottom: var(--space-xl);
    font-size: var(--text-3xl);
    font-weight: 800;
    font-style: italic;
    color: var(--color-white);
}

.woocommerce .related,
.woocommerce .upsells {
    padding-top: var(--space-2xl);
}
