/*
 * Lona Commerce — documents PDF (widget Elementor « Documents PDF »).
 *
 * Les couleurs viennent des variables --lc-* de la boutique (voir shop.css) :
 * les documents s'accordent donc d'eux-mêmes à l'identité du site, et chaque
 * réglage d'Elementor reste prioritaire sur ce qui est écrit ici.
 */

.lc-docs{--lc-doc-columns:3;--lc-doc-gap:24px;--lc-doc-min:220px;display:grid;gap:var(--lc-doc-gap);}

/*
 * Le nombre de colonnes suit la place RÉELLEMENT disponible, pas la largeur de
 * l'écran : un widget posé dans une colonne étroite d'Elementor doit passer à
 * une carte par ligne tout seul. Le réglage « Colonnes » est donc un maximum :
 * la piste ne descend jamais sous --lc-doc-min, et auto-fill en met alors moins.
 */
.lc-docs--grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,max(var(--lc-doc-min),calc((100% - (var(--lc-doc-columns) - 1) * var(--lc-doc-gap)) / var(--lc-doc-columns)))),1fr));}
.lc-docs--list{grid-template-columns:1fr;}

.lc-doc{display:flex;flex-direction:column;overflow:hidden;background:var(--lc-paper,#fff);border:1px solid var(--lc-line,#e8e2d9);border-radius:var(--lc-radius,12px);}
.lc-docs--list .lc-doc{flex-direction:row;align-items:stretch;}

.lc-doc-cover{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;aspect-ratio:3 / 4;background:var(--lc-sand,#f5f1ea);}
/* Sans image de couverture, inutile de réserver la hauteur d'une affiche. */
.lc-doc-cover--empty{aspect-ratio:auto;min-height:96px;padding:18px;}
.lc-docs--list .lc-doc-cover{flex:0 0 clamp(110px,22%,190px);aspect-ratio:auto;}
.lc-doc-cover img{display:block;width:100%;height:100%;object-fit:cover;}
.lc-doc-icon{padding:10px 15px;border-radius:999px;background:var(--lc-accent,#a96f43);color:#fff;font-size:15px;font-weight:600;letter-spacing:.08em;line-height:1;}
.lc-doc-badge{position:absolute;top:10px;left:10px;padding:4px 10px;border-radius:999px;background:var(--lc-ink,#241713);color:#fff;font-size:12px;font-weight:600;letter-spacing:.03em;}

.lc-doc-body{display:flex;flex:1;flex-direction:column;gap:8px;padding:18px 20px 20px;}
.lc-doc-title{margin:0;color:var(--lc-ink,#241713);font-size:18px;line-height:1.3;overflow-wrap:break-word;}
.lc-doc-desc{margin:0;color:var(--lc-muted,#6b625a);font-size:14px;line-height:1.55;}
.lc-doc-meta{margin:0;color:var(--lc-muted,#6b625a);font-size:13px;font-variant-numeric:tabular-nums;}
.lc-doc-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:6px;}
.lc-doc-actions .lc-btn{flex:1 1 130px;min-width:0;justify-content:center;text-decoration:none;}

/* Fenêtre d'aperçu : créée par le script, jamais présente sans JavaScript. */
.lc-doc-modal{position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;padding:clamp(8px,3vw,32px);background:rgba(20,14,10,.82);}
.lc-doc-modal[hidden]{display:none;}
.lc-doc-modal-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 14px;border-radius:10px 10px 0 0;background:#fff;}
.lc-doc-modal-title{margin-right:auto;color:var(--lc-ink,#241713);font-weight:600;}
.lc-doc-modal .lc-btn{padding:8px 14px;font-size:14px;}
.lc-doc-modal-close{padding:0 6px;border:0;background:transparent;color:var(--lc-ink,#241713);font-size:26px;line-height:1;cursor:pointer;}
.lc-doc-frame{flex:1;width:100%;border:0;border-radius:0 0 10px 10px;background:#fff;}
body.lc-doc-open{overflow:hidden;}

/* Documents réservés : le formulaire prend la place des boutons. */
.lc-doc-form{display:flex;flex-direction:column;gap:10px;margin-top:auto;}
.lc-doc-form-intro{margin:0;color:var(--lc-muted,#6b625a);font-size:14px;line-height:1.5;}
.lc-doc-field{display:flex;flex-direction:column;gap:4px;margin:0;}
/* `display:flex` l'emporterait sur l'attribut « hidden » du bloc mot de passe :
   sans cette règle, le champ s'affiche alors que la case n'est pas cochée. */
.lc-doc-form [hidden]{display:none;}
/* Sans JavaScript, c'est la case elle-même qui découvre le mot de passe. */
.lc-doc-check:has(input[name="account"]:checked) + .lc-doc-password[hidden]{display:flex;}
.lc-doc-field label{color:var(--lc-ink,#241713);font-size:13px;font-weight:600;}
.lc-doc-field input{width:100%;padding:10px 12px;border:1px solid var(--lc-line,#e8e2d9);border-radius:var(--lc-radius-sm,8px);background:#fff;color:var(--lc-ink,#241713);font:inherit;font-size:15px;}
.lc-doc-field input:focus-visible{outline:2px solid var(--lc-accent,#a96f43);outline-offset:1px;}
.lc-doc-check{margin:0;color:var(--lc-muted,#6b625a);font-size:13px;line-height:1.45;}
.lc-doc-check label{display:flex;gap:8px;align-items:flex-start;font-weight:400;}
.lc-doc-hint,.lc-doc-legal{color:var(--lc-muted,#6b625a);font-size:12px;line-height:1.45;}
.lc-doc-legal{margin:0;}
.lc-doc-error{margin:0;padding:8px 10px;border-radius:8px;background:#fdf2f2;color:#9b2c1a;font-size:13px;}
.lc-doc-granted{margin:0 0 6px;padding:8px 10px;border-radius:8px;background:#f2f8e9;color:#3b6d11;font-size:13px;}
.lc-doc-submit{width:100%;}
.lc-doc-form.is-busy{opacity:.6;pointer-events:none;}
/* Pot de miel : hors écran, jamais affiché, jamais atteint au clavier. */
.lc-doc-honey{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}

/* Message affiché si le navigateur refuse d'afficher le PDF dans le cadre. */
.lc-doc-fallback{margin:0;padding:14px;background:#fff;color:var(--lc-muted,#6b625a);font-size:14px;text-align:center;}

/* Quand les colonnes sont réglées dans Elementor, ses points de rupture font
   foi : nos règles d'adaptation par défaut s'effacent (classe lc-cols-managed). */
@media (max-width:880px){
	.lc-docs--grid:not(.lc-cols-managed){--lc-doc-columns:2;}
}

@media (max-width:600px){
	.lc-docs--grid:not(.lc-cols-managed){--lc-doc-columns:1;}
	.lc-docs--list .lc-doc{flex-direction:column;}
	.lc-docs--list .lc-doc-cover{flex-basis:auto;aspect-ratio:16 / 9;}
	.lc-doc-actions .lc-btn{flex:1 1 100%;}
}