/* ══════════════════════════════════════════════════
   Khushi Housing — Admin Panel CSS
   ══════════════════════════════════════════════════ */
:root {
  --gold:      #C9A96E;
  --gold-lt:   #E8D5A9;
  --gold-dk:   #9E7A3F;
  --ink:       #1A1410;
  --ink-60:    rgba(26,20,16,.6);
  --ink-40:    rgba(26,20,16,.4);
  --cream:     #FAF7F2;
  --white:     #FFFFFF;
  --sidebar-bg:#1A1410;
  --sidebar-w: 238px;
  --danger:    #D95F5F;
  --radius:    12px;
  --ease:      cubic-bezier(.4,0,.2,1);
}
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:15px; }
body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--ink); min-height:100vh; }

/* ── Layout ──────────────────────────────────── */
.admin-wrap { display:flex; min-height:100vh; }

/* ── Sidebar ─────────────────────────────────── */
.sidebar {
  width:var(--sidebar-w); background:var(--sidebar-bg);
  position:fixed; top:0; left:0; height:100vh;
  display:flex; flex-direction:column;
  z-index:100; overflow-y:auto;
}
.sb-logo { padding:26px 20px 18px; border-bottom:1px solid rgba(255,255,255,.06); }
.sb-logo img { height:34px; filter:brightness(0) invert(1); opacity:.9; }

.sb-user { padding:16px 20px; border-bottom:1px solid rgba(255,255,255,.06); margin-bottom:6px; }
.sb-avatar {
  width:34px; height:34px; border-radius:50%;
  background:linear-gradient(135deg,var(--gold-dk),var(--gold));
  color:var(--white); font-family:'Cormorant Garamond',serif;
  font-size:1rem; font-weight:600;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:9px;
}
.sb-user p  { font-size:.72rem; color:rgba(255,255,255,.35); text-transform:uppercase; letter-spacing:.06em; margin-bottom:2px; }
.sb-user strong { font-size:.88rem; color:rgba(255,255,255,.82); font-weight:500; }

.sb-nav { list-style:none; padding:6px 10px; flex:1; }
.sb-nav li a {
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; color:rgba(255,255,255,.5);
  text-decoration:none; border-radius:8px;
  font-size:.86rem; font-weight:400;
  transition:.25s var(--ease); margin-bottom:2px;
}
.sb-nav li a:hover { background:rgba(255,255,255,.07); color:rgba(255,255,255,.88); }
.sb-nav li a.active { background:rgba(201,169,110,.18); color:var(--gold-lt); border-left:3px solid var(--gold); }
.sb-nav .nav-ico { font-size:.95rem; width:20px; text-align:center; }

.sb-foot { padding:14px 20px; border-top:1px solid rgba(255,255,255,.06); font-size:.72rem; color:rgba(255,255,255,.22); text-align:center; }

/* ── Main ────────────────────────────────────── */
.main { margin-left:var(--sidebar-w); flex:1; min-height:100vh; }

.topbar {
  background:var(--white); border-bottom:1px solid rgba(201,169,110,.14);
  padding:17px 30px; display:flex; align-items:center; justify-content:space-between;
  position:sticky; top:0; z-index:50;
}
.topbar h1 { font-family:'Cormorant Garamond',serif; font-size:1.55rem; font-weight:600; color:var(--ink); }

.main-body { padding:28px 30px; }

/* ── Stat Cards ──────────────────────────────── */
.stats-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:24px; }
.stat-card {
  background:var(--white); border:1px solid rgba(201,169,110,.14);
  border-radius:var(--radius); padding:22px;
  display:flex; align-items:center; gap:16px;
  box-shadow:0 2px 10px rgba(26,20,16,.04);
}
.stat-ico {
  width:50px; height:50px; flex-shrink:0; border-radius:11px;
  background:linear-gradient(135deg,var(--gold-dk),var(--gold));
  display:flex; align-items:center; justify-content:center; color:var(--white);
}
.stat-ico svg { width:24px; height:24px; stroke:white; stroke-width:2; fill:none; }
.stat-card h3 { font-size:1.9rem; font-weight:600; color:var(--ink); line-height:1; }
.stat-card p  { font-size:.78rem; color:var(--ink-40); margin-top:4px; }

/* ── Quick Actions ───────────────────────────── */
.actions-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px; margin-top:20px; }
.action-link {
  background:var(--white); border:1px solid rgba(201,169,110,.16);
  border-radius:var(--radius); padding:22px 16px;
  text-align:center; text-decoration:none;
  transition:.28s var(--ease); display:block;
}
.action-link:hover { transform:translateY(-4px); box-shadow:0 10px 28px rgba(201,169,110,.14); border-color:rgba(201,169,110,.38); }
.action-link .a-ico { font-size:1.8rem; margin-bottom:10px; }
.action-link h4 { font-size:.9rem; font-weight:500; color:var(--ink); margin-bottom:4px; }
.action-link p  { font-size:.76rem; color:var(--ink-40); }

/* ── Card ────────────────────────────────────── */
.card { background:var(--white); border:1px solid rgba(201,169,110,.14); border-radius:var(--radius); box-shadow:0 2px 10px rgba(26,20,16,.04); overflow:hidden; }
.card-head { display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid rgba(201,169,110,.1); }
.card-head h2 { font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:600; color:var(--ink); }
.card-body { padding:22px; }

/* ── Forms ───────────────────────────────────── */
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-grid.one { grid-template-columns:1fr; }
@media(max-width:680px) { .form-grid { grid-template-columns:1fr; } }

.form-group { margin-bottom:16px; }
.form-group label { display:block; margin-bottom:6px; font-size:.76rem; font-weight:500; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-60); }
.form-control {
  width:100%; padding:10px 14px;
  border:1.5px solid rgba(201,169,110,.24); border-radius:8px;
  font-family:'DM Sans',sans-serif; font-size:.93rem; color:var(--ink);
  background:var(--cream); transition:.24s var(--ease);
}
.form-control:focus { outline:none; border-color:var(--gold); background:var(--white); box-shadow:0 0 0 3px rgba(201,169,110,.12); }
.file-hint { display:block; margin-top:5px; font-size:.76rem; color:var(--gold-dk); }

.form-actions { display:flex; align-items:center; gap:12px; margin-top:26px; padding-top:18px; border-top:1px solid rgba(201,169,110,.1); }

/* ── Buttons ─────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:7px;
  padding:9px 20px; border:none; border-radius:8px;
  font-family:'DM Sans',sans-serif; font-size:.88rem; font-weight:500;
  cursor:pointer; transition:.25s var(--ease); text-decoration:none;
}
.btn-gold { background:linear-gradient(135deg,var(--gold-dk),var(--gold)); color:var(--white); box-shadow:0 4px 14px rgba(158,122,63,.28); }
.btn-gold:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(158,122,63,.38); }
.btn-outline { background:transparent; border:1.5px solid rgba(201,169,110,.28); color:var(--ink-60); }
.btn-outline:hover { border-color:var(--gold); color:var(--gold-dk); }
.btn-danger { background:var(--danger); color:var(--white); font-size:.8rem; padding:6px 13px; }
.btn-danger:hover { background:#c44949; }
.btn-edit { background:rgba(201,169,110,.12); color:var(--gold-dk); border:1px solid rgba(201,169,110,.24); font-size:.8rem; padding:6px 13px; }
.btn-edit:hover { background:rgba(201,169,110,.22); }

/* ── Table ───────────────────────────────────── */
.data-table { width:100%; border-collapse:collapse; }
.data-table thead tr { background:var(--cream); }
.data-table th { padding:11px 15px; text-align:left; font-size:.72rem; font-weight:500; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-40); border-bottom:1px solid rgba(201,169,110,.14); }
.data-table td { padding:13px 15px; font-size:.88rem; border-bottom:1px solid rgba(201,169,110,.07); color:var(--ink-60); }
.data-table tbody tr:hover { background:rgba(201,169,110,.03); }
.td-actions { display:flex; align-items:center; gap:7px; }

/* ── Alerts ──────────────────────────────────── */
.alert { padding:13px 17px; border-radius:8px; margin-bottom:18px; font-size:.88rem; display:flex; align-items:center; gap:9px; }
.alert-success { background:#F0FAF4; color:#1B6B38; border-left:3px solid #3BAD68; }
.alert-error   { background:#FEF0F0; color:#9B2222; border-left:3px solid var(--danger); }

/* ── Admin Image Grid ────────────────────────── */
.admin-img-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:10px; margin-top:14px; }
.admin-img-item { position:relative; border-radius:8px; overflow:hidden; border:1px solid rgba(201,169,110,.18); }
.admin-img-item img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.admin-img-del {
  position:absolute; top:4px; right:4px;
  background:rgba(26,20,16,.72); color:white; border:none;
  width:22px; height:22px; border-radius:50%; font-size:.76rem;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:.22s ease;
}
.admin-img-del:hover { background:var(--danger); }

/* ── Section divider ─────────────────────────── */
.sec-div {
  font-family:'Cormorant Garamond',serif; font-size:1.05rem; font-weight:600; color:var(--ink);
  display:flex; align-items:center; gap:12px; margin:24px 0 16px;
}
.sec-div::after { content:''; flex:1; height:1px; background:rgba(201,169,110,.18); }

/* ── Responsive ──────────────────────────────── */
@media(max-width:860px) {
  .sidebar { transform:translateX(-100%); }
  .main { margin-left:0; }
  .topbar { padding:13px 16px; }
  .main-body { padding:16px; }
}