@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=DM+Sans:wght@400;600;700&display=swap');

/* ── RESET ──────────────────────────────────────────────────── */
.corof-wrap *, .corof-wrap *::before, .corof-wrap *::after {
    box-sizing: border-box; margin: 0; padding: 0;
}

/* ══════════════════════════════════════════════════════════════
   WRAPPER PRINCIPALE
   width:100% → si adatta al contenitore padre (full-width,
   boxed, colonna Elementor, blocco Gutenberg, ecc.)
   Nessun max-width fisso.
══════════════════════════════════════════════════════════════ */
.corof-wrap {
    --cog: #1B3A5C;
    font-family: 'Inter', system-ui, sans-serif;
    width: 100%;
    display: flex;
    flex-direction: column;   /* stack verticale di righe */
    border-radius: 14px;
    overflow: hidden;
    container-type: inline-size; /* abilita container queries */
}

/* ── TEMI ───────────────────────────────────────────────────── */
.corof-wrap.tema-light {
    background: #fff;
    color: #1a1a1a;
    border: 1px solid #e8e2d6;
    box-shadow: 0 2px 28px rgba(0,0,0,.08);
}
.corof-wrap.tema-dark {
    background: #111214;
    color: #e8e0d0;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 4px 32px rgba(0,0,0,.5);
}

/* ════════════════════════════════════════════════════════════
   HEADER — [prezzi_metalli_grafici]
════════════════════════════════════════════════════════════ */
.corof-widget-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 32px 18px;
}
.corof-wrap.tema-light .corof-widget-header {
    border-bottom: 1px solid #f0ece4;
    background: #faf8f5;
}
.corof-wrap.tema-dark .corof-widget-header {
    border-bottom: 1px solid rgba(255,255,255,.07);
    background: rgba(255,255,255,.03);
}
.corof-widget-header-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.corof-widget-title {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(1rem, 2vw, 1.25rem);
    font-weight: 700;
    letter-spacing: -.01em;
    line-height: 1.2;
}
.corof-wrap.tema-light .corof-widget-title { color: #1a1a1a; }
.corof-wrap.tema-dark  .corof-widget-title { color: #f0e8d8; }
.corof-widget-subtitle {
    font-size: .72rem;
    font-weight: 400;
    letter-spacing: .02em;
}
.corof-wrap.tema-light .corof-widget-subtitle { color: #8c7b6b; }
.corof-wrap.tema-dark  .corof-widget-subtitle { color: rgba(255,255,255,.35); }

/* ════════════════════════════════════════════════════════════
   RIGA METALLO  (.corof-row-metal)
   Ogni riga = blocco quotazione (sinistra) + grafico (destra)
   affiancati, a larghezza intera del contenitore.
════════════════════════════════════════════════════════════ */
.corof-row-metal {
    display: grid;
    grid-template-columns: minmax(200px, 38%) 1fr;
    width: 100%;
    overflow: hidden;   /* impedisce al canvas di uscire dalla riga */
    min-width: 0;
}

/* ── Blocco quotazione (colonna sinistra) ─────────────────── */
#corof-oro,
#corof-argento {
    padding: clamp(20px, 4%, 44px) clamp(16px, 5%, 44px);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.corof-wrap.tema-light #corof-oro,
.corof-wrap.tema-light #corof-argento {
    border-right: 1px solid #f0ece4;
}
.corof-wrap.tema-dark #corof-oro,
.corof-wrap.tema-dark #corof-argento {
    border-right: 1px solid rgba(255,255,255,.07);
}

/* ════════════════════════════════════════════════════════════
   SEPARATORE + TITOLO TRA ORO E ARGENTO
════════════════════════════════════════════════════════════ */
.corof-metal-divider {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 32px;
    /* Spaziatura generosa sopra e sotto */
    margin-top: 8px;
}
.corof-wrap.tema-light .corof-metal-divider {
    border-top: 2px solid #f0ece4;
    padding-top: 24px;
    padding-bottom: 4px;
}
.corof-wrap.tema-dark .corof-metal-divider {
    border-top: 2px solid rgba(255,255,255,.07);
    padding-top: 24px;
    padding-bottom: 4px;
}
.corof-metal-divider-label {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(.85rem, 1.5vw, 1rem);
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.corof-wrap.tema-light .corof-metal-divider-label { color: #5a4e44; }
.corof-wrap.tema-dark  .corof-metal-divider-label { color: rgba(201,168,76,.8); }

/* ── shortcode senza layout a righe ([prezzi_metalli]) ─────── */
.corof-wrap:not(.corof-grafici):not(.corof-single) {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.corof-wrap:not(.corof-grafici):not(.corof-single) .corof-footer-note {
    grid-column: 1 / -1;
}
.corof-wrap:not(.corof-grafici):not(.corof-single).tema-light #corof-argento {
    border-left: 1px solid #f0ece4;
    border-right: none;
}
.corof-wrap:not(.corof-grafici):not(.corof-single).tema-dark #corof-argento {
    border-left: 1px solid rgba(255,255,255,.07);
    border-right: none;
}

/* ── LABEL ──────────────────────────────────────────────────── */
.corof-label {
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.corof-wrap.tema-light .corof-label { color: #8c7b6b; }
.corof-wrap.tema-dark  .corof-label { color: rgba(201,168,76,.7); }

/* ── PREZZO ─────────────────────────────────────────────────── */
.corof-price-row {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 6px;
    flex-wrap: wrap;
    justify-content: center;
}
.corof-bigprice {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(1.5rem, 3vw, 2.4rem);
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1;
}
.corof-wrap.tema-dark .corof-bigprice { color: #f0e8d8; }

/* ── TREND PILL ─────────────────────────────────────────────── */
.corof-trend { display: flex; align-items: center; min-width: 72px; }
.corof-trend-inner {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 5px 10px;
    border-radius: 8px;
    min-width: 66px;
}
.corof-trend.up   .corof-trend-inner { background: rgba(39,168,90,.1);  color: #1d9150; }
.corof-trend.down .corof-trend-inner { background: rgba(217,64,64,.1);  color: #c0392b; }
.corof-trend.flat .corof-trend-inner { background: rgba(120,120,120,.07); color: #888; }
.corof-wrap.tema-dark .corof-trend.up   .corof-trend-inner { background: rgba(39,168,90,.15);  color: #27a85a; }
.corof-wrap.tema-dark .corof-trend.down .corof-trend-inner { background: rgba(217,64,64,.15);  color: #d94040; }
.corof-wrap.tema-dark .corof-trend.flat .corof-trend-inner { background: rgba(255,255,255,.06); color: #888; }
.corof-trend-arrow { font-size: 1rem; line-height: 1; font-weight: 700; }
.corof-trend-val   { font-size: .63rem; font-weight: 600; letter-spacing: .02em; }

/* ── TIMESTAMP ──────────────────────────────────────────────── */
.corof-updated { font-size: .75rem; font-weight: 500; margin-bottom: 20px; }
.corof-wrap.tema-light .corof-updated { color: #666; }
.corof-wrap.tema-dark  .corof-updated { color: rgba(255,255,255,.5); }

/* ── LABEL OFFERTA ──────────────────────────────────────────── */
.corof-offerta-label {
    font-size: .68rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.corof-wrap.tema-light .corof-offerta-label { color: #8c7b6b; }
.corof-wrap.tema-dark  .corof-offerta-label { color: rgba(255,255,255,.35); }

/* ── TABELLA CARATURE ───────────────────────────────────────── */
.corof-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.corof-table thead { display: none; }
.corof-table td { padding: 10px 14px; vertical-align: middle; }
.corof-table td:first-child  { font-weight: 500; text-align: left; width: 42%; }
.corof-table td:last-child   {
    text-align: right;
    font-family: 'DM Sans', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    color: var(--cog);
    letter-spacing: -.01em;
}
.corof-wrap.tema-light .corof-table tbody tr        { border-bottom: 1px solid #f0ece4; }
.corof-wrap.tema-light .corof-table tbody tr:last-child { border-bottom: none; }
.corof-wrap.tema-light .corof-table td:first-child  { background: #faf8f4; border-right: 1px solid #f0ece4; }
.corof-wrap.tema-dark  .corof-table tbody tr        { border-bottom: 1px solid rgba(255,255,255,.05); }
.corof-wrap.tema-dark  .corof-table tbody tr:last-child { border-bottom: none; }
.corof-wrap.tema-dark  .corof-table td:first-child  { background: rgba(255,255,255,.03); border-right: 1px solid rgba(255,255,255,.06); }

/* ════════════════════════════════════════════════════════════
   GRAFICO (colonna destra della .corof-row-metal)
════════════════════════════════════════════════════════════ */
.corof-chart-wrap {
    padding: 16px 24px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;       /* necessario per canvas in grid */
    max-width: 100%;
    overflow: hidden;   /* blocca il canvas dal debordare */
}
.corof-wrap.tema-light .corof-chart-wrap { background: #fdfcfa; }
.corof-wrap.tema-dark  .corof-chart-wrap { background: rgba(255,255,255,.02); }

/* Controlli */
.corof-chart-controls { display: flex; flex-direction: column; gap: 7px; }
.corof-ctrl-group     { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.corof-meta-row       { justify-content: flex-end; gap: 12px; }
.corof-ctrl-item      { display: flex; align-items: center; gap: 5px; }
.corof-ctrl-label {
    font-size: .67rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.corof-wrap.tema-light .corof-ctrl-label { color: #8c7b6b; }
.corof-wrap.tema-dark  .corof-ctrl-label { color: rgba(201,168,76,.7); }
.corof-ctrl-value { font-size: .75rem; font-weight: 600; }

/* Bottoni */
.corof-cbtn {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .68rem;
    font-weight: 500;
    padding: 4px 10px;
    border-radius: 20px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    line-height: 1.5;
    background: transparent;
    white-space: nowrap;
}
.corof-wrap.tema-light .corof-cbtn          { color: #555 !important; background: transparent !important; border-color: #ddd !important; }
.corof-wrap.tema-light .corof-cbtn:hover    { background: #f5f0ea !important; border-color: #c8bfb0 !important; color: #333 !important; }
.corof-wrap.tema-light .corof-cbtn.active   { background: #3a3a3a !important; color: #fff !important; border-color: #3a3a3a !important; }
.corof-wrap.tema-dark  .corof-cbtn          { color: rgba(255,255,255,.55) !important; background: transparent !important; border-color: rgba(255,255,255,.12) !important; }
.corof-wrap.tema-dark  .corof-cbtn:hover    { background: rgba(255,255,255,.07) !important; border-color: rgba(255,255,255,.2) !important; }
.corof-wrap.tema-dark  .corof-cbtn.active   { background: #4a4a4a !important; color: #fff !important; border-color: #4a4a4a !important; }


/* Reset anti-conflitti Elementor/temi per i bottoni del plugin */
.corof-wrap button.corof-cbtn,
.corof-wrap .corof-cbtn {
    font-family: 'Inter', system-ui, sans-serif !important;
    font-size: .68rem !important;
    font-weight: 500 !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
    cursor: pointer !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    display: inline-block !important;
    box-shadow: none !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
}

/* Canvas */
.corof-canvas-wrap {
    position: relative;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;   /* impedisce al canvas di sballare il layout */
}
.corof-canvas {
    width: 100% !important;
    max-width: 100%;
    display: block;
    cursor: crosshair;
}

/* Tooltip */
.corof-chart-tooltip {
    position: absolute;
    pointer-events: none;
    background: rgba(30,30,30,.88);
    color: #fff;
    font-size: .68rem;
    font-weight: 500;
    padding: 4px 9px;
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity .1s;
    z-index: 10;
}

/* ── FOOTER ─────────────────────────────────────────────────── */
.corof-footer-note {
    font-size: .66rem;
    text-align: center;
    padding: 12px 28px;
    letter-spacing: .03em;
}
.corof-wrap.tema-light .corof-footer-note { color: #bbb; border-top: 1px solid #f0ece4; }
.corof-wrap.tema-dark  .corof-footer-note { color: rgba(255,255,255,.2); border-top: 1px solid rgba(255,255,255,.06); }

/* ── PULSANTE "IN TEMPO REALE" ──────────────────────────────── */

/* Punto verde lampeggiante */
.corof-live-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #22c55e;
    margin-right: 6px;
    vertical-align: middle;
    position: relative;
    top: -1px;
    flex-shrink: 0;
}

/* Alone che pulsa */
@keyframes corof-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(34,197,94,.7); }
    60%  { box-shadow: 0 0 0 5px rgba(34,197,94,.0); }
    100% { box-shadow: 0 0 0 0 rgba(34,197,94,.0); }
}
.corof-live-dot {
    animation: corof-pulse 1.6s ease-out infinite;
}

/* Quando il pulsante è attivo il punto rimane sempre verde e visibile */
.corof-cbtn-live { display: inline-flex; align-items: center; }

/* Quando NON è attivo il punto diventa grigio e smette di lampeggiare */
.corof-cbtn-live:not(.active) .corof-live-dot {
    background: #aaa;
    animation: none;
    box-shadow: none;
}

/* Dot nel timestamp (leggermente più piccolo) */
.corof-ts-dot {
    width: 6px;
    height: 6px;
    margin-right: 5px;
    top: 0;
}

/* ── FLASH ──────────────────────────────────────────────────── */
@keyframes corof-flash { 0% { opacity: .3; } 100% { opacity: 1; } }
.corof-flashing { animation: corof-flash .5s ease; }

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — Container queries (browser moderni)
   + Media query fallback (tutti i browser)

   Soglia: quando la .corof-row-metal diventa < 520px
   la quota e il grafico si impilano verticalmente.
════════════════════════════════════════════════════════════ */

/* Fallback media query */
@media (max-width: 600px) {

    /* row-metal: colonna unica */
    .corof-row-metal {
        grid-template-columns: 1fr;
    }
    #corof-oro,
    #corof-argento {
        border-right: none !important;
    }
    .corof-wrap.tema-light #corof-oro,
    .corof-wrap.tema-light #corof-argento {
        border-bottom: 1px solid #f0ece4;
    }
    .corof-wrap.tema-dark #corof-oro,
    .corof-wrap.tema-dark #corof-argento {
        border-bottom: 1px solid rgba(255,255,255,.06);
    }

    /* [prezzi_metalli] senza grafici */
    .corof-wrap:not(.corof-grafici):not(.corof-single) {
        grid-template-columns: 1fr;
    }

    .corof-meta-row { justify-content: flex-start; }
    .corof-bigprice { font-size: clamp(1.5rem, 6vw, 2rem); }
    .corof-widget-header { padding: 16px 20px; }
    .corof-metal-divider { padding: 0 20px; }
    /* Grafico mobile: padding ridotto, niente overflow */
    .corof-chart-wrap { padding: 12px 14px 16px; overflow: hidden; }
    .corof-canvas-wrap { overflow: hidden; max-width: 100%; }
}

/* Container query: si attiva per larghezza contenitore < 520px
   (es. colonna stretta su desktop, tablet in portrait) */
@container (max-width: 520px) {
    .corof-row-metal {
        grid-template-columns: 1fr;
    }
    #corof-oro,
    #corof-argento {
        border-right: none !important;
    }
    .corof-wrap:not(.corof-grafici):not(.corof-single) {
        grid-template-columns: 1fr;
    }
    .corof-meta-row { justify-content: flex-start; }
    .corof-bigprice { font-size: clamp(1.4rem, 5cqi, 2rem); }
}

/* ════════════════════════════════════════════════════════════════
   TICKER SCORREVOLE  [ticker_metalli]
════════════════════════════════════════════════════════════════ */
.corof-ticker-wrap {
    display: flex;
    align-items: center;
    width: 100%;
    overflow: hidden;
    height: 42px;
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .82rem;
    font-weight: 500;
    letter-spacing: .01em;
    position: relative;
    color: inherit; /* eredita dal contesto se nessun colore testo è specificato */
    /* border-radius opzionale — commentalo se vuoi full-bleed */
    border-radius: 8px;
}

/* Etichetta "LIVE" fissa a sinistra */
.corof-ticker-label {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 14px 0 16px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
    flex-shrink: 0;
    height: 100%;
    /* separatore verticale destro */
    border-right: 1px solid rgba(255,255,255,.2);
}

/* Il punto lampeggiante verde nel ticker */
.corof-ticker-label .corof-live-dot {
    width: 7px;
    height: 7px;
    background: #4ade80;
    flex-shrink: 0;
}

/* Viewport scorrevole */
.corof-ticker-viewport {
    flex: 1;
    overflow: hidden;
    height: 100%;
    display: flex;
    align-items: center;
    mask-image: linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 3%, black 97%, transparent 100%);
}

/* Track — la striscia che scorre */
.corof-ticker-track {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    animation: corof-scroll linear infinite;
    will-change: transform;
}

/* Pausa al hover se data-pause="1" */
.corof-ticker-wrap[data-pause="true"] .corof-ticker-track:hover,
.corof-ticker-wrap[data-pause="true"]:hover .corof-ticker-track {
    animation-play-state: paused;
}

@keyframes corof-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); } /* -50% perché il track è duplicato */
}

/* Singolo item nel ticker */
.corof-ticker-item {
    padding: 0 20px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.corof-ticker-item strong {
    font-family: 'DM Sans', sans-serif;
    font-size: .9rem;
    font-weight: 700;
    letter-spacing: -.01em;
}

/* Separatore tra item */
.corof-ticker-sep {
    opacity: .35;
    padding: 0 6px;
    font-size: .9rem;
}

/* Timestamp nel ticker */
.corof-ticker-ts {
    font-size: .72rem;
    opacity: .7;
    font-style: italic;
}

/* Flash aggiornamento prezzo */
@keyframes corof-ticker-flash {
    0%   { opacity: .4; }
    100% { opacity: 1; }
}
.corof-ticker-flashing {
    animation: corof-ticker-flash .4s ease;
}

/* ── Responsive: ticker più compatto su mobile ──────────────── */
@media (max-width: 600px) {
    .corof-ticker-wrap { height: 38px; font-size: .76rem; }
    .corof-ticker-label { padding: 0 10px 0 12px; }
    .corof-ticker-item { padding: 0 14px; }
}

/* ════════════════════════════════════════════════════════════════
   CALCOLATORE  [calcola_oro]
════════════════════════════════════════════════════════════════ */
.corof-calc-wrap {
    --cog: #1B3A5C;
    font-family: 'Inter', system-ui, sans-serif;
    width: 100%;
    border-radius: 14px;
    overflow: hidden;
    container-type: inline-size;
}
.corof-calc-wrap.tema-light {
    background: #fff;
    color: #1a1a1a;
    border: 1px solid #e8e2d6;
    box-shadow: 0 2px 28px rgba(0,0,0,.08);
}
.corof-calc-wrap.tema-dark {
    background: #111214;
    color: #e8e0d0;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 4px 32px rgba(0,0,0,.5);
}

/* Header */
.corof-calc-header {
    padding: clamp(16px,3%,28px) clamp(16px,4%,36px) 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.corof-calc-title {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(.95rem, 2vw, 1.2rem);
    font-weight: 700;
    letter-spacing: -.01em;
}
.corof-calc-subtitle {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .72rem;
    font-weight: 500;
}
.corof-calc-wrap.tema-light .corof-calc-subtitle { color: #8c7b6b; }
.corof-calc-wrap.tema-dark  .corof-calc-subtitle { color: rgba(201,168,76,.7); }

/* Body 2 colonne */
.corof-calc-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    padding: clamp(16px,3%,28px) clamp(16px,4%,36px);
    align-items: start;
}
.corof-calc-wrap.tema-light .corof-calc-body { border-bottom: 1px solid #f0ece4; }
.corof-calc-wrap.tema-dark  .corof-calc-body { border-bottom: 1px solid rgba(255,255,255,.06); }

/* Colonna input */
.corof-calc-inputs {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-right: clamp(12px,3%,32px);
}
.corof-calc-wrap.tema-light .corof-calc-inputs { border-right: 1px solid #f0ece4; }
.corof-calc-wrap.tema-dark  .corof-calc-inputs { border-right: 1px solid rgba(255,255,255,.06); }

.corof-calc-field { display: flex; flex-direction: column; gap: 8px; }
.corof-calc-label {
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.corof-calc-wrap.tema-light .corof-calc-label { color: #8c7b6b; }
.corof-calc-wrap.tema-dark  .corof-calc-label { color: rgba(201,168,76,.7); }

/* Bottoni metallo */
.corof-calc-metal-btns,
.corof-calc-carats,
.corof-calc-unit-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.corof-calc-mbtn,
.corof-calc-cbtn,
.corof-calc-ubtn {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .78rem;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 8px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all .15s;
    background: transparent;
    white-space: nowrap;
}
.corof-calc-wrap.tema-light .corof-calc-mbtn,
.corof-calc-wrap.tema-light .corof-calc-cbtn,
.corof-calc-wrap.tema-light .corof-calc-ubtn {
    border-color: #e0d8cc;
    color: #555;
    background: #faf8f4;
}
.corof-calc-wrap.tema-light .corof-calc-mbtn.active,
.corof-calc-wrap.tema-light .corof-calc-cbtn.active,
.corof-calc-wrap.tema-light .corof-calc-ubtn.active {
    background: var(--cog);
    border-color: var(--cog);
    color: #fff;
}
.corof-calc-wrap.tema-dark .corof-calc-mbtn,
.corof-calc-wrap.tema-dark .corof-calc-cbtn,
.corof-calc-wrap.tema-dark .corof-calc-ubtn {
    border-color: rgba(255,255,255,.12);
    color: rgba(255,255,255,.6);
    background: rgba(255,255,255,.04);
}
.corof-calc-wrap.tema-dark .corof-calc-mbtn.active,
.corof-calc-wrap.tema-dark .corof-calc-cbtn.active,
.corof-calc-wrap.tema-dark .corof-calc-ubtn.active {
    background: var(--cog);
    border-color: var(--cog);
    color: #fff;
}

/* Input peso */
.corof-calc-weight-row {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.corof-calc-weight-input-wrap {
    display: flex;
    align-items: center;
    border-radius: 10px;
    overflow: hidden;
    border: 2px solid #e0d8cc;
    transition: border-color .15s;
}
.corof-calc-wrap.tema-dark .corof-calc-weight-input-wrap { border-color: rgba(255,255,255,.12); }
.corof-calc-weight-input-wrap:focus-within { border-color: var(--cog); }
.corof-calc-weight-input {
    flex: 1;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 10px 14px;
    font-family: 'DM Sans', sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    background: transparent;
    color: inherit;
    min-width: 0;
}
.corof-calc-weight-input::-webkit-inner-spin-button { opacity: .4; }
.corof-calc-weight-unit {
    padding: 10px 12px;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .05em;
    opacity: .5;
    white-space: nowrap;
}

/* Bottone calcola */
.corof-calc-submit {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .9rem;
    font-weight: 700;
    padding: 12px 20px;
    border-radius: 10px;
    border: none;
    cursor: pointer;
    background: var(--cog);
    color: #fff;
    transition: opacity .15s, transform .1s;
    letter-spacing: .02em;
    width: 100%;
}
.corof-calc-submit:hover { opacity: .88; }
.corof-calc-submit:active { transform: scale(.98); }

/* Colonna risultato */
.corof-calc-result {
    padding-left: clamp(12px,3%,32px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 200px;
}

/* Idle state */
.corof-calc-result-idle {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    padding: 20px 0;
    opacity: .4;
}
.corof-calc-result-icon { font-size: 2.5rem; line-height: 1; }
.corof-calc-result-idle p { font-size: .85rem; line-height: 1.6; margin: 0; }

/* Risultato attivo */
.corof-calc-result-active {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
}
.corof-calc-res-label {
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 4px;
}
.corof-calc-wrap.tema-light .corof-calc-res-label { color: #8c7b6b; }
.corof-calc-wrap.tema-dark  .corof-calc-res-label { color: rgba(201,168,76,.7); }

.corof-calc-res-mercato {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(1.3rem,4cqi,2rem);
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1;
    margin-bottom: 4px;
}
.corof-calc-res-mercato small {
    font-size: .55em;
    font-weight: 400;
    opacity: .6;
    margin-left: 4px;
}

.corof-calc-divider {
    height: 1px;
    margin: 14px 0;
}
.corof-calc-wrap.tema-light .corof-calc-divider { background: #f0ece4; }
.corof-calc-wrap.tema-dark  .corof-calc-divider { background: rgba(255,255,255,.07); }

.corof-calc-res-acquisto-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: clamp(10px,2%,16px);
    border-radius: 10px;
}
.corof-calc-wrap.tema-light .corof-calc-res-acquisto-row { background: #f8f5f0; }
.corof-calc-wrap.tema-dark  .corof-calc-res-acquisto-row { background: rgba(255,255,255,.04); }
.corof-calc-res-acquisto {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(1.5rem,5cqi,2.4rem);
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1;
    color: var(--cog);
}
.corof-calc-res-acquisto small {
    font-size: .45em;
    font-weight: 400;
    opacity: .7;
    margin-left: 4px;
}
.corof-calc-res-detail {
    font-size: .72rem;
    opacity: .6;
    line-height: 1.5;
}

/* Disclaimer */
.corof-calc-disclaimer {
    font-size: .65rem;
    text-align: center;
    padding: 10px 24px;
    letter-spacing: .02em;
    line-height: 1.5;
}
.corof-calc-wrap.tema-light .corof-calc-disclaimer { color: #bbb; border-top: 1px solid #f0ece4; }
.corof-calc-wrap.tema-dark  .corof-calc-disclaimer { color: rgba(255,255,255,.2); border-top: 1px solid rgba(255,255,255,.06); }

/* Flash risultato */
@keyframes corof-calc-pop {
    0%   { transform: scale(.95); opacity: .5; }
    60%  { transform: scale(1.02); }
    100% { transform: scale(1);   opacity: 1; }
}
.corof-calc-pop { animation: corof-calc-pop .35s ease; }

/* Responsive calcolatore */
@media (max-width: 600px) {
    .corof-calc-body { grid-template-columns: 1fr; }
    .corof-calc-inputs {
        border-right: none !important;
        padding-right: 0;
    }
    .corof-calc-wrap.tema-light .corof-calc-inputs { border-bottom: 1px solid #f0ece4; padding-bottom: 20px; }
    .corof-calc-wrap.tema-dark  .corof-calc-inputs { border-bottom: 1px solid rgba(255,255,255,.06); padding-bottom: 20px; }
    .corof-calc-result { padding-left: 0; padding-top: 20px; min-height: unset; }
}
@container (max-width: 480px) {
    .corof-calc-body { grid-template-columns: 1fr; }
    .corof-calc-inputs { border-right: none !important; padding-right: 0; padding-bottom: 20px; }
    .corof-calc-result { padding-left: 0; padding-top: 16px; min-height: unset; }
}

/* ════════════════════════════════════════════════════════════════
   FORM APPUNTAMENTO  [form_appuntamento]
════════════════════════════════════════════════════════════════ */
.corof-appt-wrap {
    font-family: 'Inter', system-ui, sans-serif;
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    border: 2px solid #c9a84c;
    border-radius: 4px;
    padding: clamp(28px, 6%, 48px) clamp(24px, 6%, 44px);
    background: #fff;
    container-type: inline-size;
}

/* Header */
.corof-appt-header {
    text-align: center;
    margin-bottom: 28px;
}
.corof-appt-title {
    font-size: clamp(1.1rem, 4cqi, 1.4rem);
    font-weight: 400;
    color: #8a6a00;
    line-height: 1.35;
    margin: 0 0 6px;
}
.corof-appt-sub {
    font-size: clamp(1rem, 3cqi, 1.2rem);
    font-weight: 700;
    color: #1a1a1a;
    margin: 0;
}

/* Form layout */
.corof-appt-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.corof-appt-row2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
@container (max-width: 400px) {
    .corof-appt-row2 { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
    .corof-appt-row2 { grid-template-columns: 1fr; }
}

.corof-appt-field { display: flex; flex-direction: column; }

/* Input e textarea */
.corof-appt-field input[type="text"],
.corof-appt-field input[type="email"],
.corof-appt-field input[type="tel"],
.corof-appt-field textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d4c9a8;
    border-radius: 4px;
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .9rem;
    color: #333;
    background: #fff;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
    resize: vertical;
    box-sizing: border-box;
}
.corof-appt-field input::placeholder,
.corof-appt-field textarea::placeholder {
    color: #b0a080;
    font-size: .88rem;
}
.corof-appt-field input:focus,
.corof-appt-field textarea:focus {
    border-color: #c9a84c;
    box-shadow: 0 0 0 3px rgba(201,168,76,.12);
}
.corof-appt-field input.corof-appt-error,
.corof-appt-field textarea.corof-appt-error {
    border-color: #d94040;
}

/* Privacy checkbox */
.corof-appt-privacy {
    margin-top: 4px;
}
.corof-appt-privacy label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    font-size: .78rem;
    color: #666;
    line-height: 1.5;
}
.corof-appt-privacy input[type="checkbox"] {
    margin-top: 2px;
    flex-shrink: 0;
    accent-color: #c9a84c;
    width: 15px;
    height: 15px;
    cursor: pointer;
}
.corof-appt-privacy a {
    color: #c9a84c;
    text-decoration: underline;
}

/* Messaggio stato */
.corof-appt-msg {
    padding: 10px 14px;
    border-radius: 6px;
    font-size: .85rem;
    font-weight: 500;
    text-align: center;
}
.corof-appt-msg.success {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
}
.corof-appt-msg.error {
    background: #fce4ec;
    color: #c62828;
    border: 1px solid #ef9a9a;
}

/* Bottone */
.corof-appt-btn {
    width: 100%;
    padding: 14px 24px;
    background: #8a6a00;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-family: 'Inter', system-ui, sans-serif;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .03em;
    cursor: pointer;
    transition: background .2s, opacity .2s;
    margin-top: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.corof-appt-btn:hover { background: #7a5c00; }
.corof-appt-btn:disabled { opacity: .65; cursor: not-allowed; }

/* ════════════════════════════════════════════════════════════════
   SCHEDA NEGOZIO  [scheda_negozio]
════════════════════════════════════════════════════════════════ */
.corof-scheda-wrap {
    font-family: 'Inter', system-ui, sans-serif;
    width: 100%;
    container-type: inline-size;
}

/* ── Riga superiore: form + info ─────────────────────────────── */
.corof-scheda-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border: 2px solid #c9a84c;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
}

/* Form col */
.corof-scheda-form-col {
    padding: clamp(20px, 5%, 40px);
    background: #fff;
    border-right: 1px solid #e8dfc0;
}
.corof-wrap.tema-dark .corof-scheda-form-col {
    background: #111214;
    border-right-color: rgba(201,168,76,.2);
}

/* Info col */
.corof-scheda-info-col {
    padding: clamp(20px, 5%, 40px);
    background: #faf8f2;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.corof-wrap.tema-dark .corof-scheda-info-col {
    background: #18191c;
}

/* Titolo sezione */
.corof-scheda-section-title {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(1rem, 2.5cqi, 1.25rem);
    font-weight: 700;
    color: #5a3e00;
    margin-bottom: 18px;
    letter-spacing: -.01em;
}
.corof-wrap.tema-dark .corof-scheda-section-title { color: #f0e8d8; }

/* Override form dentro scheda */
.corof-scheda-form .corof-appt-btn { background: #8a6a00; }
.corof-scheda-form .corof-appt-btn:hover { background: #7a5c00; }

/* ── Info blocks ─────────────────────────────────────────────── */
.corof-scheda-info-block {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: .9rem;
}
.corof-scheda-info-ico {
    font-size: 1.1rem;
    flex-shrink: 0;
    width: 22px;
    text-align: center;
}

/* Telefono */
.corof-scheda-phone-block { background: #fff8e6; border-radius: 8px; padding: 10px 14px; }
.corof-wrap.tema-dark .corof-scheda-phone-block { background: rgba(201,168,76,.1); }
.corof-scheda-phone-link {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    width: 100%;
}
.corof-scheda-phone-ico { font-size: 1.3rem; }
.corof-scheda-phone-num {
    font-family: 'DM Sans', sans-serif;
    font-size: clamp(.95rem, 2.5cqi, 1.2rem);
    font-weight: 700;
    color: #5a3e00;
    flex: 1;
}
.corof-wrap.tema-dark .corof-scheda-phone-num { color: #f0e8d8; }
.corof-scheda-phone-cta {
    font-size: .72rem;
    font-weight: 700;
    background: #8a6a00;
    color: #fff;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
    transition: background .15s;
}
.corof-scheda-phone-link:hover .corof-scheda-phone-cta { background: #7a5c00; }

/* Email */
.corof-scheda-email-link {
    color: #8a6a00;
    text-decoration: none;
    font-size: .88rem;
    font-weight: 500;
}
.corof-scheda-email-link:hover { text-decoration: underline; }

/* Indirizzo */
.corof-scheda-addr {
    font-size: .85rem;
    color: #555;
    align-items: flex-start;
}
.corof-wrap.tema-dark .corof-scheda-addr { color: rgba(255,255,255,.6); }

/* ── Orari ───────────────────────────────────────────────────── */
.corof-scheda-orari {
    background: #fff;
    border: 1px solid #e8dfc0;
    border-radius: 8px;
    padding: 14px 16px;
    margin-top: 4px;
}
.corof-wrap.tema-dark .corof-scheda-orari {
    background: rgba(255,255,255,.04);
    border-color: rgba(201,168,76,.15);
}
.corof-scheda-orari-title {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #8a6a00;
    margin-bottom: 10px;
}
.corof-wrap.tema-dark .corof-scheda-orari-title { color: rgba(201,168,76,.8); }
.corof-scheda-orari-grid {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4px 16px;
    font-size: .82rem;
}
.corof-scheda-orari-giorno {
    font-weight: 500;
    color: #333;
    white-space: nowrap;
}
.corof-wrap.tema-dark .corof-scheda-orari-giorno { color: #e0d8c8; }
.corof-scheda-orari-ore { color: #555; }
.corof-wrap.tema-dark .corof-scheda-orari-ore { color: rgba(255,255,255,.55); }
.corof-scheda-orari-giorno.chiuso,
.corof-scheda-orari-ore.chiuso { color: #c0392b; font-weight: 600; }

/* ── Mappa ───────────────────────────────────────────────────── */
.corof-scheda-map-wrap {
    border: 2px solid #c9a84c;
    border-top: none;
    border-radius: 0 0 8px 8px;
    overflow: hidden;
}
.corof-scheda-map {
    width: 100%;
    display: block;
    background: #e8f0e0;
}
.corof-scheda-map-placeholder {
    border: 2px solid #c9a84c;
    border-top: none;
    border-radius: 0 0 8px 8px;
    padding: 16px 20px;
    font-size: .82rem;
    color: #888;
    background: #faf8f2;
    text-align: center;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 640px) {
    .corof-scheda-top { grid-template-columns: 1fr; }
    .corof-scheda-form-col { border-right: none; border-bottom: 1px solid #e8dfc0; }
}
@container (max-width: 560px) {
    .corof-scheda-top { grid-template-columns: 1fr; }
    .corof-scheda-form-col { border-right: none; border-bottom: 1px solid #e8dfc0; }
}

/* ════════════════════════════════════════════════════════════════
   OVERRIDE MASSIMO ANTI-ELEMENTOR — bottoni filtro grafico
   Selettori ultra-specifici per battere qualsiasi regola del tema
════════════════════════════════════════════════════════════════ */
html body .corof-wrap button.corof-cbtn,
html body .corof-wrap .corof-cbtn,
html body div.corof-wrap button,
.corof-chart-wrap .corof-cbtn,
.corof-ctrl-group .corof-cbtn {
    color: #444 !important;
    background-color: transparent !important;
    background: transparent !important;
    border: 1px solid #ccc !important;
    border-radius: 20px !important;
    font-size: .68rem !important;
    font-weight: 500 !important;
    padding: 4px 10px !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    box-shadow: none !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    text-indent: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
}
html body .corof-wrap button.corof-cbtn.active,
html body .corof-wrap .corof-cbtn.active,
.corof-chart-wrap .corof-cbtn.active,
.corof-ctrl-group .corof-cbtn.active {
    background-color: #3a3a3a !important;
    background: #3a3a3a !important;
    color: #ffffff !important;
    border-color: #3a3a3a !important;
}
html body .corof-wrap button.corof-cbtn:hover,
html body .corof-wrap .corof-cbtn:hover {
    background-color: #f0ece6 !important;
    background: #f0ece6 !important;
    color: #222 !important;
    border-color: #bbb !important;
}

/* Dark theme override */
html body .corof-wrap.tema-dark button.corof-cbtn,
html body .corof-wrap.tema-dark .corof-cbtn {
    color: rgba(255,255,255,.7) !important;
    border-color: rgba(255,255,255,.2) !important;
}
html body .corof-wrap.tema-dark .corof-cbtn.active {
    background: #555 !important;
    color: #fff !important;
    border-color: #666 !important;
}