/* ═══════════════════════════════════════════════════════════
   admin.css — Espace artiste. Outil mobile-first, autonome.
   Reprend les couleurs et polices de la marque, mais zéro effet
   de vitrine : lisible, tactile, fonctionnel.
   ═══════════════════════════════════════════════════════════ */
:root {
  --black:#0d0d0d; --surface:#161616; --surface2:#1f1f1f; --line:rgba(200,150,90,0.18);
  --warm-white:#F5EDE3; --cream:#E8DDD0; --muted:#9a928a;
  --gold:#C8965A; --green:#2ECC71; --orange:#FF6B1A; --magenta:#E91E8C; --red:#ff5470;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--black); color:var(--warm-white); font-family:'Syne',sans-serif; -webkit-font-smoothing:antialiased; padding-bottom:84px; }
a { color:var(--gold); }
.hidden { display:none !important; }

/* En-tête */
.adm-header { position:sticky; top:0; z-index:20; background:rgba(13,13,13,0.95); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); padding:1rem 1.2rem; display:flex; align-items:center; justify-content:space-between; }
.adm-brand { font-family:'Bodoni Moda',serif; font-size:1.1rem; letter-spacing:0.08em; }
.adm-brand span { color:var(--gold); }
.adm-logout { background:none; border:1px solid var(--line); color:var(--muted); font-family:'Syne',sans-serif; font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase; padding:0.5rem 0.8rem; border-radius:8px; cursor:pointer; }

/* Onglets */
.adm-tabs { display:flex; gap:0.5rem; padding:1rem 1.2rem 0; }
.adm-tab { flex:1; background:var(--surface); border:1px solid var(--line); color:var(--muted); font-family:'Syne',sans-serif; font-weight:600; font-size:0.85rem; padding:0.9rem; border-radius:12px; cursor:pointer; }
.adm-tab.active { background:var(--gold); color:var(--black); border-color:var(--gold); }

.adm-wrap { padding:1.2rem; max-width:720px; margin:0 auto; }
.adm-intro h2 { font-family:'Bodoni Moda',serif; font-weight:400; font-size:1.5rem; margin-bottom:0.3rem; }
.adm-intro p { color:var(--muted); font-size:0.9rem; line-height:1.5; margin-bottom:1.2rem; }

/* Connexion */
.login-screen { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:2rem; text-align:center; }
.login-card { width:100%; max-width:380px; background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:2.2rem 1.6rem; }
.login-card .lock { font-size:2rem; margin-bottom:1rem; }
.login-card h1 { font-family:'Bodoni Moda',serif; font-weight:400; font-size:1.6rem; margin-bottom:0.4rem; }
.login-card p { color:var(--muted); font-size:0.9rem; line-height:1.5; margin-bottom:1.5rem; }

/* Champs */
label.fld { display:block; text-align:left; margin-bottom:1.1rem; }
label.fld > span { display:block; font-size:0.75rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold); margin-bottom:0.5rem; }
input[type=text], input[type=email], input[type=number], input[type=date], select, textarea {
  width:100%; background:var(--surface2); border:1px solid var(--line); color:var(--warm-white);
  font-family:'Syne',sans-serif; font-size:1rem; padding:0.9rem 1rem; border-radius:12px; min-height:48px;
}
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--gold); }
textarea { resize:vertical; min-height:120px; line-height:1.6; }
textarea.tall { min-height:220px; font-family:'Cormorant Garamond',serif; font-size:1.1rem; }
.hint { font-size:0.75rem; color:var(--muted); margin-top:0.4rem; line-height:1.4; }

/* Boutons larges, tactiles */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:0.5rem; width:100%; min-height:52px; border:1px solid var(--gold); background:none; color:var(--warm-white); font-family:'Syne',sans-serif; font-weight:600; font-size:0.95rem; letter-spacing:0.04em; padding:0.9rem 1.2rem; border-radius:12px; cursor:pointer; }
.btn-primary { background:var(--gold); color:var(--black); }
.btn-ghost { border-color:var(--line); color:var(--cream); }
.btn-danger { border-color:rgba(255,84,112,0.4); color:var(--red); }
.btn:disabled { opacity:0.55; }
.btn-row { display:flex; gap:0.7rem; }

/* Liste en cartes */
.adm-card { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:0.9rem; margin-bottom:0.9rem; display:flex; gap:0.9rem; align-items:center; }
.adm-thumb { width:64px; height:64px; flex-shrink:0; border-radius:10px; background-size:cover; background-position:center; background-color:var(--surface2); }
.adm-card-body { flex:1; min-width:0; }
.adm-card-body h4 { font-family:'Cormorant Garamond',serif; font-size:1.25rem; font-weight:600; line-height:1.2; }
.adm-card-meta { font-size:0.78rem; color:var(--muted); margin-top:0.2rem; }
.chip { display:inline-block; font-size:0.65rem; letter-spacing:0.06em; text-transform:uppercase; padding:0.2rem 0.55rem; border-radius:20px; margin-right:0.3rem; margin-top:0.35rem; }
.chip.disponible { background:rgba(46,204,113,0.16); color:var(--green); }
.chip.reservee { background:rgba(255,107,26,0.16); color:var(--orange); }
.chip.vendue { background:rgba(233,30,140,0.16); color:var(--magenta); }
.chip.draft { background:rgba(154,146,138,0.18); color:var(--muted); }
.chip.featured { background:rgba(200,150,90,0.18); color:var(--gold); }
.adm-card-actions { display:flex; flex-direction:column; gap:0.4rem; }
.icon-btn { width:40px; height:40px; border:1px solid var(--line); background:var(--surface2); color:var(--cream); border-radius:10px; font-size:1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.icon-btn.on { color:var(--gold); border-color:var(--gold); }

/* Upload photo */
.uploader { border:1.5px dashed var(--line); border-radius:14px; padding:1.4rem; text-align:center; cursor:pointer; display:block; }
.uploader input { display:none; }
.uploader .big { font-size:1.6rem; margin-bottom:0.4rem; }
.img-prev { width:100%; aspect-ratio:4/5; background-size:cover; background-position:center; background-color:var(--surface2); border-radius:14px; margin-bottom:0.8rem; display:none; }
.img-prev.show { display:block; }
.img-prev.wide { aspect-ratio:16/9; }
.suggest { margin-top:0.8rem; }
.suggest-btn { background:none; border:1px solid var(--gold); color:var(--gold); font-family:'Syne',sans-serif; font-size:0.85rem; padding:0.7rem 1rem; border-radius:10px; width:100%; cursor:pointer; }
.chips-row { display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:0.7rem; }
.title-chip { background:var(--surface2); border:1px solid var(--line); color:var(--warm-white); padding:0.5rem 0.9rem; border-radius:20px; font-size:0.9rem; cursor:pointer; }

/* Sélecteur œuvres liées */
.linked-picker { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:0.6rem; max-height:240px; overflow-y:auto; padding:0.3rem; border:1px solid var(--line); border-radius:12px; }
.pick { border:1px solid var(--line); border-radius:10px; padding:0.5rem; cursor:pointer; display:flex; gap:0.5rem; align-items:center; }
.pick.sel { border-color:var(--gold); background:rgba(200,150,90,0.1); }
.pick .pthumb { width:34px; height:34px; border-radius:6px; background-size:cover; background-position:center; background-color:var(--surface2); flex-shrink:0; }
.pick span { font-size:0.8rem; line-height:1.15; }

/* Formulaire plein écran (modale mobile) */
.sheet { position:fixed; inset:0; background:var(--black); z-index:50; overflow-y:auto; display:none; }
.sheet.open { display:block; }
.sheet-head { position:sticky; top:0; background:rgba(13,13,13,0.96); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); padding:1rem 1.2rem; display:flex; align-items:center; justify-content:space-between; }
.sheet-head h3 { font-family:'Bodoni Moda',serif; font-weight:400; font-size:1.2rem; }
.sheet-close { background:none; border:none; color:var(--muted); font-size:1.6rem; cursor:pointer; }
.sheet-body { padding:1.2rem; max-width:720px; margin:0 auto; }

/* Barre d'action fixe en bas (le pouce y est) */
.action-bar { position:fixed; bottom:0; left:0; right:0; z-index:40; background:rgba(13,13,13,0.96); backdrop-filter:blur(10px); border-top:1px solid var(--line); padding:0.8rem 1.2rem; display:flex; gap:0.7rem; max-width:720px; margin:0 auto; }
.sheet .action-bar { position:sticky; }

/* Statut / toasts */
.status-line { text-align:center; font-size:0.9rem; min-height:1.3em; margin-top:0.8rem; }
.status-line.ok { color:var(--green); } .status-line.err { color:var(--red); }
.toast { position:fixed; bottom:96px; left:50%; transform:translateX(-50%) translateY(20px); background:var(--gold); color:var(--black); font-weight:600; font-size:0.9rem; padding:0.8rem 1.4rem; border-radius:30px; opacity:0; pointer-events:none; transition:all 0.3s ease; z-index:100; }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }
.empty { text-align:center; color:var(--muted); padding:3rem 1rem; line-height:1.6; }
.spinner { width:16px; height:16px; border:2px solid rgba(0,0,0,0.2); border-top-color:currentColor; border-radius:50%; display:inline-block; animation:spin 0.7s linear infinite; vertical-align:-3px; }
@keyframes spin { to { transform:rotate(360deg); } }

/* Plus de confort sur grand écran */
@media (min-width:720px) {
  .toggle-row { display:flex; gap:1rem; }
  .toggle-row > * { flex:1; }
}

/* Cartes de proposition IA (titre + description) */
.prop-card { display:block; width:100%; text-align:left; background:var(--surface2); border:1px solid var(--line); border-radius:12px; padding:0.8rem 0.9rem; margin-bottom:0.6rem; cursor:pointer; transition:border-color 0.2s ease; }
.prop-card:hover { border-color:var(--gold); }
.prop-title { font-family:'Cormorant Garamond',serif; font-size:1.25rem; color:var(--warm-white); margin-bottom:0.25rem; }
.prop-desc { font-size:0.85rem; line-height:1.4; color:var(--muted); }
