/* ══════════════════════════════════════════════
   Auto361 Veicoli — CSS
   ══════════════════════════════════════════════ */

:root {
    --a361v-primary: #1e3a5f;
    --a361v-accent: #3b82f6;
    --a361v-success: #10b981;
    --a361v-warning: #f59e0b;
    --a361v-danger: #ef4444;
    --a361v-bg: #fff;
    --a361v-bg-alt: #f8fafc;
    --a361v-text: #1e293b;
    --a361v-muted: #64748b;
    --a361v-border: #e2e8f0;
    --a361v-radius: 8px;
}

/* ── SECTION TITLE ── */
.a361v-section-title {
    font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif);
    font-size: 22px;
    font-weight: 800;
    color: var(--a361v-primary);
    margin: 32px 0 16px;
    padding-bottom: 8px;
    border-bottom: 3px solid var(--a361v-primary);
}

/* ── BADGES ── */
.a361v-badge {
    display: inline-block;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    border-radius: 4px;
    background: var(--a361v-accent);
    color: #fff;
}
.a361v-badge--outline {
    background: transparent;
    border: 1px solid var(--a361v-muted);
    color: var(--a361v-muted);
}

/* ══ HERO SINGOLA SCHEDA ══ */
.a361v-single { max-width: 1100px; margin: 0 auto; padding: 20px; }
.a361v-hero { display: grid; grid-template-columns: 1.2fr 1fr; gap: 28px; margin-bottom: 24px; }
.a361v-hero__media { border-radius: var(--a361v-radius); overflow: hidden; }
.a361v-hero__img { width: 100%; height: auto; display: block; }
.a361v-hero__marca { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--a361v-accent); }
.a361v-hero__title {
    font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif);
    font-size: 36px;
    font-weight: 800;
    line-height: 1.1;
    margin: 4px 0 12px;
    color: var(--a361v-text);
}
.a361v-hero__badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.a361v-hero__price { margin-bottom: 20px; }
.a361v-hero__price-current {
    font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif);
    font-size: 32px;
    font-weight: 800;
    color: var(--a361v-success);
}
.a361v-hero__price-old { font-size: 18px; color: var(--a361v-muted); text-decoration: line-through; margin-right: 8px; }
.a361v-hero__price small { display: block; font-size: 12px; color: var(--a361v-muted); margin-top: 2px; }

/* Quick specs */
.a361v-quick { display: flex; gap: 12px; flex-wrap: wrap; }
.a361v-quick__item {
    display: flex; flex-direction: column; align-items: center;
    background: var(--a361v-bg-alt); border: 1px solid var(--a361v-border);
    border-radius: var(--a361v-radius); padding: 12px 16px; min-width: 80px; text-align: center;
}
.a361v-quick__icon { font-size: 20px; margin-bottom: 4px; }
.a361v-quick__val { font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif); font-size: 22px; font-weight: 800; color: var(--a361v-primary); line-height: 1; }
.a361v-quick__label { font-size: 10px; color: var(--a361v-muted); text-transform: uppercase; letter-spacing: .3px; margin-top: 2px; }

/* ── GALLERIA ── */
.a361v-gallery__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.a361v-gallery__item { border-radius: var(--a361v-radius); overflow: hidden; }
.a361v-gallery__item img { width: 100%; height: 140px; object-fit: cover; display: block; transition: transform .3s; }
.a361v-gallery__item:hover img { transform: scale(1.05); }

/* ── CONTENUTO EDITORIALE ── */
.a361v-content__text { font-size: 16px; line-height: 1.7; color: var(--a361v-text); max-width: 800px; }
.a361v-content__text p { margin-bottom: 14px; }

/* ── SCHEDA TECNICA ── */
.a361v-specs__section { margin-bottom: 20px; }
.a361v-specs__heading {
    font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif);
    font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px;
    color: var(--a361v-primary); margin: 0 0 8px; padding: 8px 12px;
    background: var(--a361v-bg-alt); border-radius: 4px;
}
.a361v-specs__table { width: 100%; border-collapse: collapse; }
.a361v-specs__table tr { border-bottom: 1px solid var(--a361v-border); }
.a361v-specs__table tr:last-child { border-bottom: none; }
.a361v-specs__label { padding: 8px 12px; font-size: 13px; color: var(--a361v-muted); width: 45%; }
.a361v-specs__value { padding: 8px 12px; font-size: 13px; font-weight: 600; color: var(--a361v-text); }

/* ── INLINE CALCULATOR ── */
.a361v-inline-calc__form { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.a361v-inline-calc__form label { font-size: 13px; font-weight: 600; display: flex; flex-direction: column; gap: 4px; }
.a361v-inline-calc__form input { width: 120px; padding: 6px 10px; border: 1px solid var(--a361v-border); border-radius: 4px; font-size: 14px; }

/* ── CALCOLATORE COSTO ── */
.a361v-calc { max-width: 800px; margin: 0 auto; }
.a361v-calc-title {
    font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif);
    font-size: 24px; font-weight: 800; color: var(--a361v-primary); margin: 0 0 16px;
}
.a361v-calc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; margin-bottom: 16px; }
.a361v-calc-field { display: flex; flex-direction: column; gap: 4px; }
.a361v-calc-field label { font-size: 12px; font-weight: 700; color: var(--a361v-muted); text-transform: uppercase; letter-spacing: .3px; }
.a361v-calc-field input, .a361v-calc-field select {
    padding: 8px 12px; border: 1px solid var(--a361v-border); border-radius: 4px; font-size: 14px; background: #fff;
}
.a361v-calc-field small { font-size: 10px; color: var(--a361v-muted); }
.a361v-calc-field .a361v-calc-results { position: relative; }
.a361v-calc-btn {
    display: inline-block; padding: 10px 28px; background: var(--a361v-primary); color: #fff;
    border: none; border-radius: 6px; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .2s;
}
.a361v-calc-btn:hover { background: var(--a361v-accent); }

/* Risultati calcolatore */
.a361v-cost-result { background: var(--a361v-bg-alt); border: 1px solid var(--a361v-border); border-radius: var(--a361v-radius); padding: 20px; margin-top: 16px; }
.a361v-cost-result h4 { font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif); font-size: 18px; margin: 0 0 14px; color: var(--a361v-primary); }
.a361v-cost-bars { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.a361v-cost-bar { display: flex; align-items: center; gap: 10px; }
.a361v-cost-bar__label { width: 130px; font-size: 13px; font-weight: 600; color: var(--a361v-muted); flex-shrink: 0; }
.a361v-cost-bar__track { flex: 1; height: 24px; background: #e2e8f0; border-radius: 4px; overflow: hidden; position: relative; }
.a361v-cost-bar__fill { height: 100%; border-radius: 4px; transition: width .5s ease; display: flex; align-items: center; padding: 0 8px; }
.a361v-cost-bar__val { font-size: 11px; font-weight: 700; color: #fff; white-space: nowrap; }
.a361v-cost-totals { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; text-align: center; }
.a361v-cost-total { background: #fff; border: 1px solid var(--a361v-border); border-radius: 6px; padding: 12px; }
.a361v-cost-total__val { font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif); font-size: 28px; font-weight: 800; color: var(--a361v-primary); }
.a361v-cost-total__label { font-size: 11px; color: var(--a361v-muted); text-transform: uppercase; }

/* ── CARD VEICOLO ── */
.a361v-results-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.a361v-card { background: var(--a361v-bg); border: 1px solid var(--a361v-border); border-radius: var(--a361v-radius); overflow: hidden; transition: box-shadow .2s, transform .15s; }
.a361v-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.1); transform: translateY(-2px); }
.a361v-card__link { display: block; color: var(--a361v-text); text-decoration: none; }
.a361v-card__img { height: 170px; overflow: hidden; }
.a361v-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.a361v-card:hover .a361v-card__img img { transform: scale(1.05); }
.a361v-card__body { padding: 14px; }
.a361v-card__marca { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--a361v-accent); }
.a361v-card__title { font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif); font-size: 18px; font-weight: 700; line-height: 1.2; margin: 2px 0 8px; }
.a361v-card__specs { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--a361v-muted); }
.a361v-card__price { font-weight: 800; color: var(--a361v-success); font-size: 15px; }
.a361v-card__badge { font-size: 10px; padding: 2px 6px; background: var(--a361v-bg-alt); border-radius: 3px; font-weight: 600; }

/* ── COMPARATORE ── */
.a361v-comparator { max-width: 1100px; margin: 0 auto; }
.a361v-comp-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; margin-bottom: 20px; }
.a361v-comp-slot { background: var(--a361v-bg-alt); border: 2px dashed var(--a361v-border); border-radius: var(--a361v-radius); padding: 16px; min-height: 120px; position: relative; transition: border-color .2s; }
.a361v-comp-slot--active { border-style: solid; border-color: var(--a361v-accent); background: #fff; }
.a361v-comp-input { width: 100%; padding: 8px 12px; border: 1px solid var(--a361v-border); border-radius: 4px; font-size: 14px; }
.a361v-comp-results { position: absolute; left: 16px; right: 16px; top: 58px; background: #fff; border: 1px solid var(--a361v-border); border-radius: 4px; max-height: 220px; overflow-y: auto; z-index: 50; display: none; box-shadow: 0 4px 12px rgba(0,0,0,.1); }
.a361v-comp-result { display: flex; align-items: center; gap: 8px; padding: 8px 10px; cursor: pointer; font-size: 13px; transition: background .1s; }
.a361v-comp-result:hover { background: var(--a361v-bg-alt); }
.a361v-comp-result img { width: 48px; height: 32px; object-fit: cover; border-radius: 3px; }
.a361v-comp-result__price { margin-left: auto; font-size: 11px; color: var(--a361v-success); font-weight: 700; }

/* Card comparatore */
.a361v-comp-card { text-align: center; }
.a361v-comp-card img { width: 100%; height: 130px; object-fit: cover; border-radius: 6px; margin-bottom: 8px; }
.a361v-comp-card__name { font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif); font-size: 16px; font-weight: 700; }
.a361v-comp-card__remove { display: inline-block; margin-top: 6px; font-size: 11px; color: var(--a361v-danger); cursor: pointer; border: none; background: none; text-decoration: underline; }

/* Tabella confronto */
.a361v-comp-table-wrap { overflow-x: auto; margin-top: 8px; }
.a361v-comp-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.a361v-comp-table th { background: var(--a361v-primary); color: #fff; padding: 8px 12px; text-align: center; font-weight: 700; }
.a361v-comp-table th:first-child { text-align: left; background: var(--a361v-bg-alt); color: var(--a361v-text); }
.a361v-comp-table td { padding: 7px 12px; border-bottom: 1px solid var(--a361v-border); text-align: center; }
.a361v-comp-table td:first-child { text-align: left; font-weight: 600; color: var(--a361v-muted); background: var(--a361v-bg-alt); }
.a361v-comp-table tr:hover td { background: #f1f5f9; }
.a361v-comp-table tr:hover td:first-child { background: #eaeff5; }
.a361v-comp-winner { font-weight: 800; color: var(--a361v-success); }

/* ── FILTRI ── */
.a361v-filters { margin-bottom: 20px; }
.a361v-filter-row { display: flex; gap: 10px; flex-wrap: wrap; }
.a361v-filter { padding: 7px 12px; border: 1px solid var(--a361v-border); border-radius: 4px; font-size: 13px; background: #fff; cursor: pointer; }

/* ── ARCHIVIO ── */
.a361v-archive { max-width: 1100px; margin: 0 auto; padding: 20px; }
.a361v-archive__header { margin-bottom: 24px; }
.a361v-archive__title { font-family: var(--mx-font-heading, 'Barlow Condensed', sans-serif); font-size: 32px; font-weight: 800; color: var(--a361v-primary); }
.a361v-archive__desc { font-size: 15px; color: var(--a361v-muted); margin-top: 6px; max-width: 700px; }
.a361v-no-results { text-align: center; padding: 40px; color: var(--a361v-muted); font-size: 15px; }
.a361v-pagination { margin-top: 30px; text-align: center; }
.a361v-pagination .page-numbers { padding: 6px 12px; border: 1px solid var(--a361v-border); border-radius: 4px; margin: 0 3px; font-size: 13px; color: var(--a361v-text); text-decoration: none; }
.a361v-pagination .current { background: var(--a361v-primary); color: #fff; border-color: var(--a361v-primary); }

/* ── SEARCH AUTOCOMPLETE (shared) ── */
.a361v-calc-results {
    position: absolute; left: 0; right: 0; top: 100%; background: #fff;
    border: 1px solid var(--a361v-border); border-radius: 4px; max-height: 200px;
    overflow-y: auto; z-index: 50; display: none; box-shadow: 0 4px 12px rgba(0,0,0,.1);
}
.a361v-calc-field { position: relative; }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
    .a361v-hero { grid-template-columns: 1fr; gap: 16px; }
    .a361v-hero__title { font-size: 26px; }
    .a361v-hero__price-current { font-size: 24px; }
    .a361v-quick__item { min-width: 65px; padding: 8px 10px; }
    .a361v-quick__val { font-size: 18px; }
    .a361v-comp-slots { grid-template-columns: 1fr; }
    .a361v-cost-totals { grid-template-columns: 1fr; }
    .a361v-results-grid { grid-template-columns: 1fr 1fr; }
    .a361v-calc-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .a361v-results-grid { grid-template-columns: 1fr; }
    .a361v-specs__label { width: 40%; }
}

/* ── DARK MODE ── */
.mx-dark .a361v-single, .mx-dark .a361v-archive { color: #e2e8f0; }
.mx-dark .a361v-hero__title, .mx-dark .a361v-section-title { color: #fff; }
.mx-dark .a361v-section-title { border-bottom-color: var(--a361v-accent); }
.mx-dark .a361v-card, .mx-dark .a361v-comp-slot { background: #15202b; border-color: #2f3943; }
.mx-dark .a361v-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.4); }
.mx-dark .a361v-card__title, .mx-dark .a361v-comp-card__name { color: #fff; }
.mx-dark .a361v-specs__heading { background: #1a2736; color: #94a3b8; }
.mx-dark .a361v-specs__table tr { border-color: #2f3943; }
.mx-dark .a361v-specs__value { color: #e2e8f0; }
.mx-dark .a361v-quick__item { background: #1a2736; border-color: #2f3943; }
.mx-dark .a361v-quick__val { color: var(--a361v-accent); }
.mx-dark .a361v-cost-result { background: #1a2736; border-color: #2f3943; }
.mx-dark .a361v-cost-total { background: #15202b; border-color: #2f3943; }
.mx-dark .a361v-cost-total__val { color: var(--a361v-accent); }
.mx-dark .a361v-comp-results, .mx-dark .a361v-calc-results { background: #1a2736; border-color: #2f3943; }
.mx-dark .a361v-comp-result:hover { background: #253141; }
.mx-dark .a361v-comp-table th:first-child { background: #1a2736; color: #94a3b8; }
.mx-dark .a361v-comp-table td { border-color: #2f3943; }
.mx-dark .a361v-comp-table td:first-child { background: #1a2736; }
.mx-dark .a361v-comp-table tr:hover td { background: #1f2d3d; }
.mx-dark .a361v-comp-table tr:hover td:first-child { background: #1a2736; }
.mx-dark .a361v-filter, .mx-dark .a361v-comp-input,
.mx-dark .a361v-calc-field input, .mx-dark .a361v-calc-field select { background: #15202b; color: #e2e8f0; border-color: #2f3943; }
.mx-dark .a361v-cost-bar__track { background: #2f3943; }