:root{
  --black:#1a1310;
  --black-2:#241b16;
  --gold:#c9a961;
  --gold-dark:#a8873f;
  --cream:#f4ede2;
  --cream-2:#fbf8f3;
  --line:#e7ddce;
  --text:#2a221c;
  --muted:#8a7b6a;
  --danger:#b3453d;
  --success:#4c7a52;
  --radius:10px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Helvetica Neue',Arial,sans-serif;
  background:var(--cream-2);
  color:var(--text);
  font-size:14px;
  line-height:1.5;
}
h1,h2{font-family:'Georgia',serif; font-weight:600; margin:0 0 4px;}
h1{font-size:22px;}
h2{font-size:16px; margin-bottom:14px;}
a{color:var(--gold-dark); text-decoration:none;}
a:hover{text-decoration:underline;}
.muted{color:var(--muted); font-size:12.5px;}
code{background:var(--cream); padding:2px 6px; border-radius:4px; font-size:12.5px;}

/* ---- Shell layout ---- */
.shell{display:flex; min-height:100vh;}
.sidebar{
  width:230px; flex-shrink:0; background:var(--black);
  color:var(--cream); display:flex; flex-direction:column;
  padding:22px 16px; position:sticky; top:0; height:100vh;
}
.brand{display:flex; align-items:center; gap:10px; margin-bottom:26px; padding:0 4px;}
.brand-mark{
  width:34px; height:34px; border-radius:8px; background:var(--gold);
  color:var(--black); display:flex; align-items:center; justify-content:center;
  font-family:'Georgia',serif; font-weight:700; font-size:17px; flex-shrink:0;
}
.brand-name{font-family:'Georgia',serif; font-size:15px; color:var(--cream);}
.brand-sub{font-size:11px; color:var(--gold); letter-spacing:0.5px; text-transform:uppercase;}
.nav{display:flex; flex-direction:column; gap:2px; flex:1;}
.nav a{
  color:var(--cream); opacity:0.75; padding:9px 10px; border-radius:7px;
  font-size:13px; text-decoration:none; transition:background .15s, opacity .15s;
}
.nav a:hover{opacity:1; background:rgba(201,169,97,0.1);}
.nav a.active{opacity:1; background:rgba(201,169,97,0.18); color:var(--gold); font-weight:600;}
.logout-form{border-top:1px solid rgba(244,237,226,0.12); padding-top:14px; margin-top:14px;}
.user-chip{margin-bottom:10px;}
.user-name{font-size:13px; color:var(--cream); font-weight:600;}
.user-role{font-size:11px; color:var(--muted); text-transform:capitalize;}

.content{flex:1; padding:32px 40px; max-width:1180px;}

/* ---- Auth pages ---- */
.auth-body{
  display:flex; align-items:center; justify-content:center; min-height:100vh;
  background:linear-gradient(160deg,var(--black) 0%,#2c211a 100%);
}
.auth-card{
  background:var(--cream-2); border-radius:14px; padding:36px 34px;
  width:100%; max-width:380px; box-shadow:0 20px 50px rgba(0,0,0,0.35);
}
.auth-brand{text-align:center; margin-bottom:22px;}
.auth-brand .brand-mark{margin:0 auto 10px;}
.auth-brand-name{font-family:'Georgia',serif; font-size:17px;}
.auth-brand-sub{font-size:12px; color:var(--muted); margin-top:2px;}
.auth-form{display:flex; flex-direction:column; gap:14px;}
.auth-form label{font-size:12.5px; color:var(--muted); display:flex; flex-direction:column; gap:5px;}

/* ---- Forms ---- */
label{font-size:12.5px; color:var(--muted); display:flex; flex-direction:column; gap:5px; margin-bottom:14px;}
input[type=text],input[type=email],input[type=password],input[type=number],textarea,select{
  font-family:inherit; font-size:13.5px; padding:9px 11px; border:1px solid var(--line);
  border-radius:7px; background:#fff; color:var(--text); width:100%;
}
input:focus,textarea:focus,select:focus{outline:none; border-color:var(--gold);}
textarea{resize:vertical;}
fieldset{border:1px solid var(--line); border-radius:8px; padding:14px; margin:0 0 14px;}
legend{font-size:12px; color:var(--muted); padding:0 6px; text-transform:uppercase; letter-spacing:0.5px;}

.form-grid{display:flex; flex-direction:column; gap:0; max-width:520px;}
.form-grid-narrow{max-width:480px;}

/* ---- Buttons ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:9px 16px; border-radius:7px; border:none; font-size:13px; font-weight:600;
  cursor:pointer; text-decoration:none; transition:opacity .15s, background .15s;
}
.btn:hover{opacity:0.88; text-decoration:none;}
.btn-gold{background:var(--gold); color:var(--black);}
.btn-dark{background:var(--black); color:var(--cream);}
.btn-ghost{background:transparent; color:var(--text); border:1px solid var(--line);}
.btn-danger{background:transparent; color:var(--danger); border:1px solid var(--danger);}
.btn-block{width:100%;}
.btn-sm{padding:6px 11px; font-size:12px;}

/* ---- Alerts ---- */
.alert{padding:11px 14px; border-radius:8px; font-size:13px; margin-bottom:16px;}
.alert-error{background:#f7e4e2; color:var(--danger); border:1px solid #e6c1bd;}
.alert-success{background:#e6efe6; color:var(--success); border:1px solid #c3d9c4;}

/* ---- Page head ---- */
.page-head{margin-bottom:22px;}
.page-head-row{display:flex; align-items:flex-start; justify-content:space-between; gap:16px;}

/* ---- Stat grid / dashboard ---- */
.stat-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-bottom:28px;}
.stat-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:18px;}
.stat-card-alert{border-color:var(--danger); background:#fdf3f2;}
.stat-num{font-family:'Georgia',serif; font-size:26px; font-weight:700;}
.stat-label{font-size:12px; color:var(--muted); margin-top:2px;}

.two-col{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:20px;}

.simple-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
.simple-list li{display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:13px;}

.activity-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; max-height:340px; overflow-y:auto;}
.activity-list li{font-size:12.5px; display:flex; flex-wrap:wrap; gap:6px; border-bottom:1px solid var(--line); padding-bottom:9px;}
.activity-user{font-weight:600;}
.activity-action{color:var(--text);}
.activity-details{color:var(--muted);}
.activity-time{color:var(--muted); margin-left:auto; font-size:11.5px;}

/* ---- Tags ---- */
.tag{display:inline-block; font-size:11px; padding:2px 9px; border-radius:20px; text-transform:capitalize;}
.tag-publie{background:#e6efe6; color:var(--success);}
.tag-brouillon{background:#f0ece3; color:var(--muted);}

/* ---- Tables ---- */
.table{width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;}
.table th,.table td{padding:11px 14px; text-align:left; font-size:13px; border-bottom:1px solid var(--line);}
.table th{background:var(--cream); font-size:11.5px; text-transform:uppercase; letter-spacing:0.4px; color:var(--muted);}
.table tr:last-child td{border-bottom:none;}
.table-actions{display:flex; gap:8px; align-items:center;}

/* ---- Filter bar ---- */
.filter-bar{display:flex; gap:10px; align-items:center; margin-bottom:18px; flex-wrap:wrap;}
.filter-bar select,.filter-bar input[type=text]{width:auto; margin:0;}

/* ---- Content editor ---- */
.content-form .two-col{grid-template-columns:1.7fr 1fr; align-items:start;}
.side-panel{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:18px;}
#editor-toolbar{}
.ql-toolbar.ql-snow{border-radius:7px 7px 0 0; background:#fff;}
.ql-container.ql-snow{border-radius:0 0 7px 7px;}

/* ---- Media library ---- */
.upload-form{display:flex; gap:10px; align-items:center; margin-bottom:18px; background:#fff; border:1px dashed var(--line); border-radius:var(--radius); padding:16px;}
.media-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:16px;}
.media-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:12px; display:flex; flex-direction:column; gap:8px;}
.media-thumb{height:120px; border-radius:7px; background:var(--cream); display:flex; align-items:center; justify-content:center; overflow:hidden;}
.media-thumb img{width:100%; height:100%; object-fit:cover;}
.media-icon{font-size:36px;}
.media-name{font-size:12.5px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.media-meta{font-size:11px;}
.inline-form{display:flex; gap:6px; align-items:center;}
.inline-form input{margin:0;}

/* ---- Moderation ---- */
.simple-list-wide{display:flex; flex-direction:column; gap:14px;}
.message-card{padding:16px;}
.message-head{display:flex; align-items:center; gap:10px; margin-bottom:8px; flex-wrap:wrap;}
.message-time{margin-left:auto;}

@media (max-width: 900px){
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .two-col{grid-template-columns:1fr;}
  .content-form .two-col{grid-template-columns:1fr;}
  .shell{flex-direction:column;}
  .sidebar{width:100%; height:auto; position:relative;}
  .content{padding:20px;}
}
