/* ====================================================
   PAGINA DETTAGLIO LIBRO
==================================================== */

/* ---- LAYOUT PRINCIPALE ---- */

.DettLayout {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

/* ---- SEZIONE TOP: immagine + info ---- */

.DettTop {
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: #fff;
    border: 1px solid #e0e8f0;
    border-radius: 10px;
    padding: 24px;
}

.DettImmagine {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.DettImmagine img {
    max-width: 220px;
    max-height: 320px;
    width: auto;
    height: auto;
    border-radius: 4px;
    box-shadow: 3px 3px 12px rgba(0,0,0,0.18);
}

.DettInfo {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.DettSoggetto {
    font-size: 0.72rem;
    color: #5bb8d4;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.1em;
}

.DettTitolo {
    font-size: 1.5rem;
    font-weight: 900;
    color: #1a4a7a;
    line-height: 1.25;
}

.DettAutore {
    font-size: 1rem;
    color: #444;
    font-weight: 600;
}

/* ---- TABELLA METADATI ---- */

.DettMeta {
    border-top: 1px solid #e8f0f8;
    padding-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.DettMetaRiga {
    display: flex;
    gap: 8px;
    font-size: 0.85rem;
}

.DettMetaLabel {
    color: #888;
    min-width: 100px;
    flex-shrink: 0;
}

.DettMetaVal {
    color: #222;
    font-weight: 600;
}

.DettFuoriCatalogo {
    font-size: 0.75rem;
    color: #c0392b;
    font-weight: 700;
    padding: 3px 8px;
    border: 1px solid #c0392b;
    border-radius: 4px;
    display: inline-block;
    margin-top: 4px;
}

/* ---- BOX ACQUISTO ---- */

.DettAcquisto {
    background: #f5f9fc;
    border: 1px solid #d0e4f0;
    border-radius: 8px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 4px;
}

.DettPrezzoNuovo {
    font-size: 1.6rem;
    font-weight: 900;
    color: #1a4a7a;
}

.DettPrezzoNuovoLabel {
    font-size: 0.75rem;
    color: #888;
    margin-top: -8px;
}

.DettDispLabel {
    font-size: 0.85rem;
    color: #27ae60;
    font-weight: 700;
}

.DettNonDispLabel {
    font-size: 0.85rem;
    color: #c0392b;
    font-weight: 700;
}

.BotAcquista {
    padding: 12px 24px;
    background: #e8a020;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    width: 100%;
    transition: background 0.15s;
}

.BotAcquista:hover { background: #d4911a; }
.BotAcquista:disabled { background: #ccc; cursor: not-allowed; }

.DettNoteAcquisto {
    font-size: 0.75rem;
    color: #888;
    line-height: 1.6;
}

/* ---- FORM ORDINAZIONE (libro non disponibile) ---- */

.DettOrdineForm {
    border-top: 1px solid #e0e8f0;
    padding-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.DettOrdineLabel {
    font-size: 0.82rem;
    color: #555;
}

.DettOrdineCont {
    display: flex;
    gap: 8px;
}

.DettOrdineMail {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #1a4a7a;
    border-radius: 6px;
    font-size: 0.85rem;
}

.BotOrdine {
    padding: 8px 16px;
    background: #1a4a7a;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.BotOrdine:hover { background: #5bb8d4; }

/* ---- CONDIVIDI ---- */

.DettCondividi {
    font-size: 0.82rem;
    color: #5bb8d4;
    cursor: pointer;
    text-decoration: underline;
    background: none;
    border: none;
    padding: 0;
}

/* ---- SEZIONE DESCRIZIONE ---- */

.DettDescrizione {
    background: #fff;
    border: 1px solid #e0e8f0;
    border-radius: 10px;
    padding: 24px;
}

.DettDescTitolo {
    font-size: 1rem;
    font-weight: 900;
    color: #1a4a7a;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 3px solid #5bb8d4;
}

.DettDescTesto {
    font-size: 0.9rem;
    color: #333;
    line-height: 1.7;
}

/* ---- SEZIONE USATI ---- */

.DettUsati {
    background: #fff;
    border: 1px solid #e0e8f0;
    border-radius: 10px;
    padding: 24px;
}

.DettUsatiTitolo {
    font-size: 1rem;
    font-weight: 900;
    color: #1a4a7a;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 3px solid #5bb8d4;
}

.UsatoCont {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
    padding: 14px;
    border: 1px solid #e0e8f0;
    border-radius: 8px;
    background: #f8fafc;
}

.UsatoPrezzo {
    font-size: 1.2rem;
    font-weight: 900;
    color: #1a4a7a;
}

.UsatoCondizione {
    font-size: 0.85rem;
    color: #555;
}

.BotSeleziona {
    padding: 9px 16px;
    background: #1a4a7a;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s;
    align-self: flex-start;
}

.BotSeleziona:hover { background: #5bb8d4; }

/* ---- RECENSIONI ---- */

.DettRecensioni {
    background: #fff;
    border: 1px solid #e0e8f0;
    border-radius: 10px;
    padding: 24px;
}

.DettRecensioniTitolo {
    font-size: 1rem;
    font-weight: 900;
    color: #1a4a7a;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 3px solid #5bb8d4;
}

.RecensItem {
    padding: 14px 0;
    border-bottom: 1px solid #f0f0f0;
}

.RecensStelle { font-size: 1.1rem; color: #e8a020; margin-bottom: 4px; }
.RecensTitolo { font-weight: 700; color: #1a4a7a; font-size: 0.9rem; margin-bottom: 4px; }
.RecensNome { font-size: 0.78rem; color: #888; margin-bottom: 6px; }
.RecensTesto { font-size: 0.88rem; color: #333; line-height: 1.6; margin-bottom: 6px; }
.RecensData { font-size: 0.75rem; color: #aaa; }

.LinkRecensione {
    display: inline-block;
    margin-top: 16px;
    font-size: 0.85rem;
    color: #1a4a7a;
    font-weight: 700;
    text-decoration: underline;
}

/* ---- HIDDEN (per dati carrello) ---- */

.Hidden { display: none; }

/* ---- RESPONSIVE ---- */

@media only screen and (min-width: 600px) {
    .DettTop {
        flex-direction: row;
        align-items: flex-start;
    }

    .DettImmagine {
        flex-shrink: 0;
    }
}