/* MC-Manager — modulo pre-order — v4.18.0
 *
 * Linguaggio visivo "timing board" (tabellone box motorsport):
 * monocromia asfalto + un solo accento rosso F1, dati in monospace come su
 * uno schermo di cronometraggio. Token scoped al componente così l'aspetto è
 * prevedibile a prescindere dal tema ospitante.
 */

.mc-preorder-calendar,
.mc-preorder-board {
    --mcpo-ink: #14161a;
    --mcpo-muted: #6b7280;
    --mcpo-line: #e4e7eb;
    --mcpo-paper: #ffffff;
    --mcpo-surface: #f6f7f9;
    --mcpo-accent: #e10600;
    --mcpo-radius: 12px;
    --mcpo-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;

    color: var(--mcpo-ink);
}

/* ── Toolbar / selettore raggruppamento ─────────────────────────────── */
.mc-preorder-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
    margin: 0 0 1.75rem;
}

.mc-preorder-toolbar-label {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mcpo-muted);
}

.mc-preorder-seg {
    display: inline-flex;
    padding: 3px;
    background: var(--mcpo-surface);
    border: 1px solid var(--mcpo-line);
    border-radius: 999px;
}

.mc-preorder-seg-item {
    appearance: none;
    text-decoration: none;
    padding: .4rem .95rem;
    border-radius: 999px;
    font-size: .9rem;
    font-weight: 600;
    line-height: 1;
    color: var(--mcpo-ink);
    transition: background-color .15s ease, color .15s ease;
}

.mc-preorder-seg-item:hover {
    background: rgba(20, 22, 26, .06);
    color: var(--mcpo-ink);
}

.mc-preorder-seg-item.is-active {
    background: var(--mcpo-ink);
    color: #fff;
}

.mc-preorder-seg-item:focus-visible {
    outline: 2px solid var(--mcpo-accent);
    outline-offset: 2px;
}

/* ── Gruppo (team / pilota / marca) ─────────────────────────────────── */
.mc-preorder-group {
    margin: 0 0 1.75rem;
}

.mc-preorder-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .6rem .85rem .6rem 1rem;
    background: var(--mcpo-surface);
    border-left: 4px solid var(--mcpo-accent);
    border-radius: 0;
    margin-bottom: 1rem;
}

.mc-preorder-group-name {
    margin: 0;
    font-size: 1.2rem; /* desktop */
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    line-height: 1.2;
}

.mc-preorder-count {
    flex-shrink: 0;
    min-width: 1.9rem;
    padding: .15rem .5rem;
    background: var(--mcpo-ink);
    color: #fff;
    font-family: var(--mcpo-mono);
    font-size: .85rem;
    font-weight: 600;
    text-align: center;
    border-radius: 999px;
}

/* ── Griglia card uniformi (mobile 2 colonne → desktop 4) ───────────── */
.mc-preorder-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

@media (min-width: 900px) {
    .mc-preorder-grid { grid-template-columns: repeat(4, 1fr); }
}

/* Mobile: card più compatte (gap ridotto, testo 0.8rem, niente etichetta data) */
@media (max-width: 600px) {
    .mc-preorder-grid { gap: 1rem; }
    .mc-preorder-card * { font-size: .8rem; }
    .mc-preorder-date-label { display: none; }
    .mc-preorder-group-name { font-size: 1rem; }
}

.mc-preorder-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    background: var(--mcpo-paper);
    border: 1px solid var(--mcpo-line);
    border-radius: var(--mcpo-radius);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.mc-preorder-card:hover {
    border-color: #d2d6dc;
    box-shadow: 0 6px 18px rgba(20, 22, 26, .08);
}

/* Immagine prodotto a tutta larghezza in cima alla card */
.mc-preorder-card-media {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    background: var(--mcpo-surface);
    overflow: hidden;
}

.mc-preorder-card-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mc-preorder-card-body {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    min-width: 0; /* consente l'ellissi del nome dentro la griglia */
    flex: 1;
    padding: .9rem;
}

.mc-preorder-card-name {
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mcpo-ink);
    text-decoration: none;
}

.mc-preorder-card-name:hover {
    color: var(--mcpo-accent);
}

/* Prezzo (HTML da WC: regolare e/o scontato) */
.mc-preorder-card-price {
    font-size: 1rem;
    font-weight: 700;
    color: var(--mcpo-ink);
}
.mc-preorder-card-price del {
    font-weight: 500;
    color: var(--mcpo-muted);
    margin-right: .35rem;
}
.mc-preorder-card-price ins {
    text-decoration: none;
    color: var(--mcpo-accent);
}

/* Footer card: data + CTA ancorati in basso → allineamento uniforme */
.mc-preorder-card-foot {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1.3rem;
    margin-top: auto;
    padding-top: .25rem;
}

/* Signature: chip "uscita" — readout cronometraggio, tono chiaro */
.mc-preorder-date {
    display: inline-flex;
    align-items: baseline;
    gap: .45rem;
    align-self: flex-start;
    padding: .25rem .55rem;
    background: var(--mcpo-surface);
    border-left: 3px solid var(--mcpo-accent);
    border-radius: 0;
}

.mc-preorder-date-label {
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--mcpo-muted);
}

.mc-preorder-date-value {
    font-family: var(--mcpo-mono);
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--mcpo-ink);
}

/* CTA "Pre-ordina ora" */
.mc-preorder-cta {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: .6rem 1rem;
    background: var(--mcpo-accent);
    color: #fff;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    border-radius: 8px;
    transition: background-color .15s ease, transform .05s ease;
}
.mc-preorder-cta:hover {
    background: #b80500;
    color: #fff;
}
.mc-preorder-cta:active {
    transform: translateY(1px);
}
.mc-preorder-cta:focus-visible {
    outline: 2px solid var(--mcpo-ink);
    outline-offset: 2px;
}

/* ── Stato vuoto ────────────────────────────────────────────────────── */
.mc-preorder-empty {
    padding: 1.25rem;
    background: var(--mcpo-surface);
    border: 1px dashed var(--mcpo-line);
    border-radius: var(--mcpo-radius);
    color: var(--mcpo-muted);
}

/* ── Responsive ─────────────────────────────────────────────────────── */
@media (max-width: 480px) {
    .mc-preorder-toolbar {
        align-items: flex-start;
        flex-direction: column;
        gap: .5rem;
    }
    .mc-preorder-seg {
        width: 100%;
        justify-content: space-between;
    }
    .mc-preorder-seg-item {
        flex: 1;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mc-preorder-card,
    .mc-preorder-seg-item,
    .mc-preorder-cta {
        transition: none;
    }
    .mc-preorder-cta:active {
        transform: none;
    }
}

/* ========================================================================
 * Pagina admin del modulo — guida shortcode
 * ===================================================================== */
.mc-preorder-admin-guide {
    margin: 1rem 0 1.5rem;
    padding: 1rem 1.25rem;
    background: #fff;
    border: 1px solid #e4e7eb;
    border-left: 4px solid #2271b1;
    border-radius: 4px;
}
.mc-preorder-admin-guide h2 { margin-top: 0; }
.mc-preorder-admin-guide code { background: #f6f7f9; padding: .1rem .4rem; border-radius: 3px; }
.mc-preorder-admin-count { margin-top: 1.5rem; }

/* ========================================================================
 * Email / pagina ordine — riga "Spedizione prevista"
 * (il CSS non si applica nelle email: lì resta testo semplice col <br>)
 * ===================================================================== */
.mc-preorder-arrival-line {
    display: inline-block;
    margin-top: .25rem;
    font-size: .9em;
    font-weight: 600;
    color: #664d03;
}

/* ========================================================================
 * Pagina "Ordine ricevuto" — riquadro pre-order
 * ===================================================================== */
.mc-preorder-order-box {
    margin: 1.5rem 0;
    padding: 1rem 1.25rem;
    border: 1px solid #ffe69c;
    background: #fff9e6;
    border-radius: 6px;
}
.mc-preorder-order-box-title { margin: 0 0 .5rem; font-size: 1.1rem; }
.mc-preorder-order-box-intro { margin: 0 0 .75rem; }
.mc-preorder-order-box-list { list-style: none; margin: 0; padding: 0; }
.mc-preorder-order-box-list li {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem 0;
    border-bottom: 1px solid #ffe69c;
}
.mc-preorder-order-box-list li:last-child { border-bottom: none; }

/* Badge data riusato dal riquadro ordine ricevuto */
.mc-preorder-arrival {
    display: inline-block;
    font-weight: 600;
    background: #fff3cd;
    color: #664d03;
    padding: .15rem .5rem;
    border-radius: 4px;
}