:root {
  --admin-blue: #232f73;
  --admin-pink: #d84b8a;
  --admin-soft: #f5f6fa;
  --admin-text: #2f2f2f;
}

body { color: var(--admin-text); font-family: Arial, sans-serif; }
.admin-body { min-height: 100vh; background: var(--admin-soft); }
.admin-header { position: sticky; top: 0; z-index: 100; display: flex; align-items: center; gap: 28px; min-height: 78px; padding: 10px 28px; color: #fff; background: var(--admin-blue); box-shadow: 0 4px 20px rgba(0,0,0,.12); }
.admin-brand img { width: auto; height: 55px; }
.admin-nav { align-items: center; gap: 8px; flex: 1; }
.admin-nav a { padding: 10px 14px; border-radius: 8px; color: rgba(255,255,255,.8); text-decoration: none; }
.admin-nav a:hover, .admin-nav a.active { color: #fff; background: rgba(255,255,255,.12); }
.admin-user { display: flex; align-items: center; gap: 15px; font-size: 14px; }
.admin-user form { margin: 0; }
.admin-user button { padding: 0; border: 0; color: #fff; background: transparent; text-decoration: underline; }
.admin-menu-toggle { display: none; margin-left: auto; border: 0; color: #fff; background: transparent; font-size: 28px; }
.admin-main { max-width: 1500px; margin: 0 auto; padding: 38px 28px; }
.admin-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 28px; }
.admin-page-heading span { color: var(--admin-pink); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 12px; }
.admin-page-heading h1 { margin: 5px 0 0; color: var(--admin-blue); font-size: 32px; font-weight: 800; }
.admin-panel, .admin-stat { padding: 24px; border: 1px solid #e3e5ed; border-radius: 16px; background: #fff; box-shadow: 0 6px 20px rgba(35,47,115,.06); }
.admin-panel h2 { margin-bottom: 20px; color: var(--admin-blue); font-size: 22px; }
.admin-stat { display: grid; grid-template-columns: auto 1fr; column-gap: 16px; }
.admin-stat i { grid-row: 1 / 3; align-self: center; color: var(--admin-pink); font-size: 32px; }
.admin-stat strong { color: var(--admin-blue); font-size: 30px; }
.admin-stat span { color: #687080; }
.admin-primary { color: #fff; border-color: var(--admin-pink); background: var(--admin-pink); }
.admin-primary:hover { color: #fff; border-color: #bb3e77; background: #bb3e77; }
.admin-table { min-width: 900px; }
.admin-table th { color: var(--admin-blue); background: #f1f2f7; white-space: nowrap; }
.admin-badge { display: inline-block; padding: 5px 9px; border-radius: 20px; background: #eef0f8; color: var(--admin-blue); font-size: 12px; font-weight: 700; }
.admin-login-body { display: grid; place-items: center; min-height: 100vh; padding: 24px; background: linear-gradient(135deg, var(--admin-blue), #4c346f); }
.admin-login-card { width: 100%; max-width: 440px; padding: 36px; border-radius: 20px; background: #fff; box-shadow: 0 22px 60px rgba(0,0,0,.25); }
.admin-login-logo { display: block; height: 75px; margin: 0 auto 20px; }
.admin-login-card h1 { color: var(--admin-blue); text-align: center; font-weight: 800; }
.admin-login-card > p { text-align: center; color: #6f7481; }
.admin-back-link { display: block; margin-top: 22px; color: var(--admin-blue); text-align: center; text-decoration: none; }
@media (max-width: 991px) {
  .admin-header { flex-wrap: wrap; gap: 12px; padding: 10px 18px; }
  .admin-menu-toggle { display: block; }
  .admin-nav { flex-basis: 100%; flex-direction: column; align-items: stretch; padding-bottom: 10px; }
  .admin-user { margin-left: auto; }
  .admin-main { padding: 28px 18px; }
  .admin-page-heading { align-items: flex-start; flex-direction: column; }
}