/* Backoffice DIXROSES */
:root{
  --bg:#f5f3f0; --panel:#fff; --ink:#2a1a1d; --muted:#7b6e70;
  --accent:#5A101B; --accent-soft:rgba(90,16,27,.08);
  --stroke:#e7e1dc; --ok:#1f7a4d; --danger:#b3261e;
}
*{ box-sizing:border-box; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  line-height:1.5;
}
a{ color:var(--accent); }
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 24px; background:var(--accent); color:#fff;
}
.topbar a{ color:#fff; text-decoration:none; }
.topbar .brand{ font-family:"Playfair Display",Georgia,serif; font-size:20px; font-weight:700; }
.topbar .right{ display:flex; gap:16px; align-items:center; font-size:14px; }
.topbar-logout{ display:inline-flex; align-items:center; gap:6px; }
.container{ max-width:980px; margin:28px auto; padding:0 20px; }
.panel{
  background:var(--panel); border:1px solid var(--stroke);
  border-radius:14px; padding:22px; box-shadow:0 6px 24px rgba(0,0,0,.04);
}
.page-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.page-head h1{ font-family:"Playfair Display",Georgia,serif; margin:0; font-size:26px; }
table{ width:100%; border-collapse:collapse; }
th,td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--stroke); font-size:14px; }
th{ color:var(--muted); font-weight:600; }
tr:last-child td{ border-bottom:0; }
.badge{ display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:600; }
.badge--ok{ background:rgba(31,122,77,.12); color:var(--ok); }
.badge--off{ background:rgba(0,0,0,.06); color:var(--muted); }
.badge--lock{ background:var(--accent-soft); color:var(--accent); }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  padding:9px 16px; border-radius:10px; border:1px solid transparent;
  font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; line-height:1;
}
.ico{ flex:0 0 auto; vertical-align:middle; }
.btn--icon{ padding:8px; }                 /* bouton icône seule (carré) */
.btn--icon .ico{ width:17px; height:17px; }

/* Infobulle au survol (desktop) */
[data-tip]{ position:relative; }
[data-tip]::after{
  content:attr(data-tip);
  position:absolute; bottom:calc(100% + 8px); left:50%;
  transform:translateX(-50%) translateY(4px);
  background:#2a1a1d; color:#fff; font-size:12px; font-weight:600; white-space:nowrap;
  padding:5px 9px; border-radius:7px; box-shadow:0 6px 18px rgba(0,0,0,.18);
  opacity:0; pointer-events:none; transition:opacity .14s ease, transform .14s ease; z-index:30;
}
[data-tip]::before{
  content:""; position:absolute; bottom:calc(100% + 3px); left:50%;
  transform:translateX(-50%) translateY(4px);
  border:5px solid transparent; border-top-color:#2a1a1d;
  opacity:0; pointer-events:none; transition:opacity .14s ease, transform .14s ease; z-index:30;
}
[data-tip]:hover::after,
[data-tip]:focus-visible::after,
[data-tip]:hover::before,
[data-tip]:focus-visible::before{ opacity:1; transform:translateX(-50%) translateY(0); }
.btn--primary{ background:var(--accent); color:#fff; }
.btn--ghost{ background:#fff; border-color:var(--stroke); color:var(--ink); }
.btn--danger{ background:#fff; border-color:var(--danger); color:var(--danger); }
.btn--sm{ padding:6px 11px; font-size:13px; }
.actions{ display:flex; gap:8px; flex-wrap:wrap; }
.form-row{ margin-bottom:16px; display:flex; flex-direction:column; gap:6px; }
.form-row label{ font-size:13px; font-weight:600; color:var(--muted); }
.form-row input[type=text],
.form-row input[type=email],
.form-row input[type=password],
.form-row input[type=number],
.form-row textarea,
.form-row select{
  width:100%; padding:11px 13px; border:1px solid var(--stroke); border-radius:10px;
  font-size:15px; font-family:inherit; background:#fff; color:var(--ink); -webkit-appearance:none; appearance:none;
}
.form-row input:focus,
.form-row textarea:focus,
.form-row select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.form-row textarea{ min-height:260px; resize:vertical; line-height:1.6; }
/* Éditeur WYSIWYG (Quill) */
#editor-toolbar{ border:1px solid var(--stroke); border-bottom:0; border-radius:10px 10px 0 0; background:#fff; }
#editor{ background:#fff; border:1px solid var(--stroke); border-radius:0 0 10px 10px; }
#editor .ql-editor{ min-height:240px; font-size:15px; line-height:1.6; font-family:inherit; }
#editor .ql-editor.ql-blank::before{ font-style:normal; color:var(--muted); }
.form-row .help{ font-size:12px; color:var(--muted); }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.checkbox-row{ display:flex; align-items:center; gap:9px; }
.checkbox-row input{ width:18px; height:18px; }
.flash{ padding:12px 16px; border-radius:10px; margin-bottom:18px; font-size:14px; }
.flash--success{ background:rgba(31,122,77,.1); color:var(--ok); }
.flash--error{ background:rgba(179,38,30,.1); color:var(--danger); }
.empty{ text-align:center; color:var(--muted); padding:40px 0; }

/* Dashboard admin */
.stat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:22px; }
.stat{ background:var(--panel); border:1px solid var(--stroke); border-radius:14px; padding:18px 20px;
  box-shadow:0 6px 24px rgba(0,0,0,.04); }
.stat__num{ font-family:"Playfair Display",Georgia,serif; font-size:34px; font-weight:700; line-height:1; color:var(--accent); }
.stat__label{ margin-top:6px; color:var(--muted); font-size:14px; }
.stat--accent{ background:var(--accent); }
.stat--accent .stat__num{ color:#fff; }
.stat--accent .stat__label{ color:rgba(255,255,255,.82); }
.admin-cols{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.panel-title{ font-family:"Playfair Display",Georgia,serif; margin:0 0 14px; font-size:19px; }
@media (max-width:860px){
  .stat-grid{ grid-template-columns:repeat(2,1fr); }
  .admin-cols{ grid-template-columns:1fr; }
}
@media (max-width:480px){ .stat-grid{ grid-template-columns:1fr 1fr; } }
.muted{ color:var(--muted); }
.field-error{ color:var(--danger); font-size:13px; }
.unlock-block{ margin-top:4px; }
.combo-pickers{ display:flex; gap:10px; }
.combo-pick{ width:auto !important; font-size:26px !important; padding:8px 10px !important; text-align:center; }
.slug-cell code{ background:var(--accent-soft); padding:2px 6px; border-radius:6px; }

/* Login */
.login-wrap{ min-height:100vh; display:grid; place-items:center; padding:18px; background:var(--bg); }
.login-card{ width:min(380px,100%); }
.login-card h1{ font-family:"Playfair Display",Georgia,serif; text-align:center; margin:0 0 4px; }
.login-card p.sub{ text-align:center; color:var(--muted); margin:0 0 20px; }
.login-rose{ width:96px; height:auto; display:block; margin:0 auto 8px;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.16)); opacity:.95; }

/* Partage : QR + lien */
.share-grid{ display:grid; grid-template-columns:auto 1fr; gap:28px; align-items:start; margin-top:20px; }
.share-qr{ display:flex; flex-direction:column; align-items:center; gap:12px; }
.share-qr img{ width:280px; max-width:60vw; height:auto; border:1px solid var(--stroke); border-radius:12px; background:#fff; padding:8px; }
.share-label{ display:block; font-size:13px; font-weight:600; color:var(--muted); margin-bottom:6px; }
.share-copy{ display:flex; gap:8px; }
.share-copy input{ flex:1; min-width:0; padding:11px 13px; border:1px solid var(--stroke); border-radius:10px; font-size:14px; background:#fff; }

/* Rendu responsive du tableau : passe en "cartes" empilées sur mobile */
@media (max-width:760px){
  .topbar{ padding:12px 16px; }
  .container{ margin:18px auto; padding:0 14px; }
  .page-head{ flex-direction:column; align-items:flex-start; gap:12px; }
  .panel{ padding:16px; }

  table, thead, tbody, th, td, tr{ display:block; }
  thead{ display:none; }
  tr{ border:1px solid var(--stroke); border-radius:12px; padding:12px; margin-bottom:12px; }
  td{ border:0; padding:6px 0; display:flex; justify-content:space-between; gap:14px; text-align:right; }
  td::before{ content:attr(data-label); font-weight:600; color:var(--muted); text-align:left; flex:0 0 auto; }
  /* La cellule d'actions passe en colonne pleine largeur */
  td[data-label="Actions"]{ flex-direction:column; align-items:stretch; text-align:left; padding-top:12px; margin-top:6px; border-top:1px solid var(--stroke); }
  td[data-label="Actions"]::before{ margin-bottom:8px; }
  td[data-label="Actions"] .actions{ width:100%; }
  td[data-label="Actions"] .actions .btn{ flex:1 1 calc(50% - 4px); text-align:center; }
  td[data-label="Actions"] .actions form{ flex:1 1 calc(50% - 4px); display:flex; }
  td[data-label="Actions"] .actions form .btn{ width:100%; }

  .share-grid{ grid-template-columns:1fr; gap:18px; }
  .share-qr{ order:-1; }
}

@media (max-width:640px){ .form-grid{ grid-template-columns:1fr; } }