/* livre.css, la fiche d'un ouvrage. */
.page-fiche { padding-block: var(--e4) var(--e6); }

.fiche-grille {
  display: grid; grid-template-columns: minmax(0, 430px) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 4.5rem); align-items: start;
}
@media (max-width: 880px) { .fiche-grille { grid-template-columns: 1fr; } }

.fiche-visuel {
  background: var(--papier-creux); border-radius: var(--r-grand);
  padding: clamp(1.75rem, 4vw, 3.5rem);
  display: grid; place-items: center;
  position: sticky; top: 118px;
}
@media (max-width: 880px) { .fiche-visuel { position: static; } }
.fiche-couverture {
  position: relative; width: min(320px, 100%); aspect-ratio: 3 / 4;
  border-radius: var(--r); overflow: hidden;
  box-shadow: var(--ombre-livre-levee);
}
.fiche-couverture img { width: 100%; height: 100%; object-fit: cover; }
.fiche-couverture::before {
  content: ""; position: absolute; inset: 0 auto 0 0; width: 11px; z-index: 2;
  background: var(--tranche, var(--bleu));
}

.fiche-surtitre {
  font-size: var(--t-micro); font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--tranche, var(--bleu)); margin-bottom: .8rem;
}
.fiche-texte h1 { font-size: var(--t-h1); margin-bottom: var(--e2); }
.fiche-collection { font-size: var(--t-petit); color: var(--encre-douce); }
.fiche-collection a { color: var(--bleu-fonce); }

.fiche-prix { display: flex; align-items: baseline; gap: .7rem; margin: var(--e3) 0; }
.fiche-prix strong {
  font-family: var(--font-titre); font-size: 2.6rem; font-weight: 800;
  letter-spacing: -.03em; line-height: 1;
}
.fiche-prix del { color: var(--encre-tenue); }
.fiche-remise {
  font-size: var(--t-micro); font-weight: 700;
  background: var(--bleu-nuit); color: #fff;
  padding: .3rem .7rem; border-radius: var(--r-rond);
}
.fiche-prix-vide { margin: var(--e3) 0; font-size: 1.05rem; color: var(--encre-douce); }

.fiche-resume { border-left: 3px solid var(--jaune); padding-left: var(--e3); margin-bottom: var(--e4); }
.fiche-resume p { color: var(--encre-douce); }
.fiche-resume.vide p { font-style: italic; }

.fiche-actions { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
@media (max-width: 480px) {
  .fiche-actions .btn { flex: 1 1 100%; justify-content: center; }
  .compteur-qte { width: 100%; justify-content: space-between; }
}
.fiche-note { font-size: var(--t-mini); color: var(--encre-tenue); margin-top: .9rem; }

.compteur-qte {
  display: inline-flex; align-items: center;
  border: 1px solid var(--ligne); border-radius: var(--r-rond);
  background: var(--blanc); overflow: hidden;
}
.compteur-qte button {
  width: 40px; height: 46px; border: 0; background: none;
  font: inherit; font-size: 1.15rem; color: var(--encre-douce); cursor: pointer;
}
.compteur-qte button:hover { background: var(--bleu-voile); color: var(--bleu-fonce); }
.compteur-qte input {
  width: 48px; height: 46px; border: 0; border-inline: 1px solid var(--ligne);
  text-align: center; font: inherit; font-weight: 700; background: none;
  -moz-appearance: textfield;
}
.compteur-qte input::-webkit-outer-spin-button,
.compteur-qte input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.fiche-details { margin: var(--e4) 0 0; border-top: 1px solid var(--ligne); }
.fiche-details > div {
  display: grid; grid-template-columns: 190px 1fr; gap: var(--e2);
  padding: .85rem 0; border-bottom: 1px solid var(--ligne);
}
@media (max-width: 520px) { .fiche-details > div { grid-template-columns: 1fr; gap: .1rem; } }
.fiche-details dt {
  font-size: var(--t-micro); font-weight: 700;
  letter-spacing: .11em; text-transform: uppercase; color: var(--encre-tenue);
}
.fiche-details dd { margin: 0; font-size: var(--t-petit); font-weight: 600; }

.catalogue-vide {
  text-align: center; padding: var(--e6) var(--e3);
  border: 1px dashed var(--ligne); border-radius: var(--r-grand);
}
.catalogue-vide p { margin-inline: auto; color: var(--encre-douce); }
.catalogue-vide .btn { margin-top: var(--e2); }