/* ===== Admin Panel Styles (extends main style.css) ===== */

body.admin-body{ background: var(--bg-soft); }

.admin-shell{ display:flex; min-height:100vh; }

.admin-sidebar{
  width: 260px;
  flex-shrink:0;
  background: linear-gradient(180deg, var(--teal-dark), #062f34);
  padding: 32px 22px;
  position: sticky;
  top:0;
  height:100vh;
  display:flex;
  flex-direction:column;
}
.admin-nav{ display:flex; flex-direction:column; gap:6px; }
.admin-nav a{
  display:flex; align-items:center; gap:12px;
  color: rgba(255,255,255,0.75);
  padding: 13px 16px;
  border-radius: 10px;
  font-weight:500;
  font-size:.92rem;
  transition: all .25s var(--ease);
}
.admin-nav a i{ width:18px; text-align:center; }
.admin-nav a:hover, .admin-nav a.active{ background: rgba(255,255,255,0.1); color: var(--gold-light); }
.admin-nav a.logout-link{ margin-top:auto; }

.admin-main{ flex:1; min-width:0; }
.admin-topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding: 26px 40px;
  background: var(--white);
  border-bottom: 1px solid var(--line);
  position: sticky; top:0; z-index:10;
}
.admin-topbar h1{ font-size:1.4rem; margin:0; }
.admin-user{ font-weight:600; color: var(--teal); display:flex; align-items:center; gap:10px; }
.admin-content{ padding: 40px; }

.admin-card{
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 30px;
  margin-bottom: 30px;
}

.admin-stat-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:22px; margin-bottom:30px; }
.admin-stat-card{
  background: var(--white);
  border:1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 26px;
  display:flex;
  align-items:center;
  gap:18px;
}
.admin-stat-card .icon{
  width:54px; height:54px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; color: var(--white);
  background: linear-gradient(135deg, var(--teal), var(--teal-dark));
  flex-shrink:0;
}
.admin-stat-card.gold .icon{ background: linear-gradient(135deg, var(--gold), var(--gold-light)); color: var(--teal-dark); }
.admin-stat-card h3{ font-size:1.6rem; margin-bottom:2px; }
.admin-stat-card span{ font-size:.82rem; color: var(--ink-soft); }

.admin-table{ width:100%; border-collapse: collapse; }
.admin-table th, .admin-table td{ padding: 14px 16px; text-align:left; border-bottom:1px solid var(--line); font-size:.9rem; }
.admin-table th{ color: var(--ink-soft); text-transform:uppercase; font-size:.75rem; letter-spacing:.5px; }
.admin-table img{ width:60px; height:46px; object-fit:cover; border-radius:8px; }
.admin-table tr:hover td{ background: var(--bg-soft); }

.badge{ display:inline-block; padding:4px 12px; border-radius:50px; font-size:.75rem; font-weight:600; }
.badge-sale{ background: rgba(217,165,38,0.15); color:#8a6413; }
.badge-rent{ background: rgba(10,94,103,0.12); color: var(--teal-dark); }
.badge-available{ background: rgba(37,150,90,0.12); color:#1e7a49; }
.badge-sold, .badge-rented{ background: rgba(150,37,37,0.1); color:#963333; }

.table-actions{ display:flex; gap:8px; }
.icon-btn{
  width:34px; height:34px; border-radius:8px; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; background: var(--white); color: var(--ink-soft); transition: all .2s;
}
.icon-btn:hover{ background: var(--teal); color: var(--white); border-color: var(--teal); }
.icon-btn.danger:hover{ background:#963333; border-color:#963333; }

.admin-form-card{ max-width: 900px; }
.upload-preview{
  width:100%; height:220px; border-radius:12px; border:2px dashed var(--line);
  display:flex; align-items:center; justify-content:center; overflow:hidden; background: var(--bg-soft); margin-bottom:18px; color: var(--ink-soft);
}
.upload-preview img{ width:100%; height:100%; object-fit:cover; }

/* Login / auth page */
.admin-auth-body{ background: linear-gradient(135deg, var(--teal-dark), var(--teal)); min-height:100vh; display:flex; align-items:center; justify-content:center; padding: 20px; }
.admin-auth-wrap{ width:100%; max-width: 420px; }
.admin-auth-card{ background: var(--white); border-radius: var(--radius-lg); padding: 44px 38px; box-shadow: var(--shadow-lg); }
.admin-auth-hint{ text-align:center; font-size:.8rem; color: var(--ink-soft); margin-top:18px; }
.admin-auth-back{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:14px; font-size:.85rem; color: var(--teal); font-weight:600; }

@media (max-width: 960px){
  .admin-sidebar{ display:none; }
  .admin-content{ padding: 24px; }
  .admin-topbar{ padding: 20px; }
  .admin-stat-grid{ grid-template-columns: repeat(2,1fr); }
}
