/* Admin Panel Styles — extends public styles */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  --color-bg: #06101e;
  --color-bg-card: #0d1e33;
  --color-bg-surface: #0a1628;
  --color-border: rgba(201,168,76,0.18);
  --color-border-strong: rgba(201,168,76,0.4);
  --color-gold: #C9A84C;
  --color-gold-light: #e8c96a;
  --color-gold-dim: rgba(201,168,76,0.12);
  --color-text-primary: #f0ede6;
  --color-text-secondary: #9aabb8;
  --color-text-muted: #5a7085;
  --color-active: #2ed87a;
  --color-active-bg: rgba(46,216,122,0.1);
  --color-danger: #e05656;
  --color-danger-bg: rgba(224,86,86,0.1);
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --radius-sm: 6px; --radius-md: 12px; --radius-lg: 18px;
  --shadow-card: 0 4px 24px rgba(0,0,0,0.4);
  --transition: 0.22s cubic-bezier(0.4,0,0.2,1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; }
body { font-family: var(--font-body); background: var(--color-bg); color: var(--color-text-primary); min-height: 100vh; -webkit-font-smoothing: antialiased; }
a { color: var(--color-gold); text-decoration: none; }

/* ADMIN LAYOUT */
.admin-layout { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
@media (max-width: 768px) { .admin-layout { grid-template-columns: 1fr; } }

/* SIDEBAR */
.admin-sidebar {
  background: var(--color-bg-surface);
  border-right: 1px solid var(--color-border);
  padding: 24px 16px;
  display: flex; flex-direction: column; gap: 8px;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.sidebar-brand { padding: 8px 12px 24px; border-bottom: 1px solid var(--color-border); margin-bottom: 8px; }
.sidebar-brand__emblem { width: 36px; height: 36px; background: linear-gradient(135deg,var(--color-gold),#8a6a1c); border-radius: 8px; display:flex;align-items:center;justify-content:center; font-family:var(--font-display);font-weight:700;color:#fff;font-size:1rem;margin-bottom:8px; }
.sidebar-brand__name { font-size:0.82rem;font-weight:600;color:var(--color-text-primary); }
.sidebar-brand__role { font-size:0.72rem;color:var(--color-text-muted); }

.sidebar-label { font-size:0.7rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--color-text-muted);padding:8px 12px 4px;font-weight:600; }
.sidebar-link { display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);font-size:0.88rem;font-weight:500;color:var(--color-text-secondary);transition:all var(--transition);cursor:pointer; }
.sidebar-link:hover { background:var(--color-gold-dim);color:var(--color-gold); }
.sidebar-link.active { background:var(--color-gold-dim);color:var(--color-gold);border:1px solid var(--color-border-strong); }
.sidebar-link svg { flex-shrink:0; }

.sidebar-bottom { margin-top:auto;padding-top:16px;border-top:1px solid var(--color-border); }
.sidebar-user { display:flex;align-items:center;gap:10px;padding:8px 12px; }
.sidebar-user__avatar { width:32px;height:32px;background:var(--color-gold-dim);border:1px solid var(--color-border-strong);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:700;color:var(--color-gold); }
.sidebar-user__name { font-size:0.84rem;font-weight:500; }
.sidebar-user__role { font-size:0.72rem;color:var(--color-text-muted); }

/* MAIN CONTENT */
.admin-main { padding: 32px 40px; overflow-y: auto; }
@media (max-width: 768px) { .admin-main { padding: 20px; } }

.admin-topbar { display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;flex-wrap:wrap;gap:12px; }
.admin-topbar h1 { font-family:var(--font-display);font-size:1.7rem; }

/* FORMS */
.form-group { margin-bottom: 20px; }
.form-label { display:block;font-size:0.8rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted);margin-bottom:6px;font-weight:600; }
.form-control {
  width:100%;padding:11px 16px;
  background:var(--color-bg-card);
  border:1px solid var(--color-border);
  border-radius:var(--radius-sm);
  color:var(--color-text-primary);
  font-family:var(--font-body);font-size:0.92rem;
  transition:border-color var(--transition);
  outline:none;
}
.form-control:focus { border-color:var(--color-gold); }
.form-control::placeholder { color:var(--color-text-muted); }
select.form-control { cursor:pointer; }
textarea.form-control { resize:vertical;min-height:90px; }

.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
@media (max-width:600px) { .form-grid { grid-template-columns:1fr; } }

/* CARDS */
.admin-card { background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:24px;margin-bottom:24px; }
.admin-card__title { font-family:var(--font-display);font-size:1.1rem;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid var(--color-border); }

/* TABLE */
.admin-table { width:100%;border-collapse:collapse;font-size:0.88rem; }
.admin-table th { text-align:left;padding:10px 14px;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted);border-bottom:1px solid var(--color-border);font-weight:600; }
.admin-table td { padding:12px 14px;border-bottom:1px solid rgba(201,168,76,0.06);color:var(--color-text-secondary);vertical-align:middle; }
.admin-table tr:hover td { background:rgba(201,168,76,0.03); }
.admin-table td:first-child { color:var(--color-text-primary);font-weight:500; }

/* BUTTONS */
.btn { display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:var(--radius-sm);font-size:0.88rem;font-weight:600;cursor:pointer;border:none;transition:all var(--transition);font-family:var(--font-body); }
.btn--primary { background:linear-gradient(135deg,var(--color-gold),#a07a1e);color:#06101e;box-shadow:0 4px 16px rgba(201,168,76,0.25); }
.btn--primary:hover { transform:translateY(-1px);box-shadow:0 6px 24px rgba(201,168,76,0.4); }
.btn--outline { background:transparent;color:var(--color-text-primary);border:1px solid var(--color-border); }
.btn--outline:hover { border-color:var(--color-gold);color:var(--color-gold); }
.btn--danger { background:var(--color-danger-bg);color:var(--color-danger);border:1px solid rgba(224,86,86,0.3); }
.btn--sm { padding:6px 14px;font-size:0.8rem; }

/* BADGE */
.badge { display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:100px;font-size:0.72rem;font-weight:600;text-transform:uppercase; }
.badge--activo { background:var(--color-active-bg);color:var(--color-active); }
.badge--terminado { background:rgba(90,112,133,0.1);color:#5a7085; }
.badge-dot { width:5px;height:5px;border-radius:50%;background:currentColor; }

/* DROPZONE */
.dropzone {
  border:2px dashed var(--color-border);border-radius:var(--radius-md);
  padding:48px;text-align:center;cursor:pointer;transition:all var(--transition);
  background:var(--color-bg-surface);
}
.dropzone:hover, .dropzone.drag-over { border-color:var(--color-gold);background:var(--color-gold-dim); }
.dropzone__icon { font-size:2.5rem;margin-bottom:12px;opacity:0.6; }
.dropzone__text { color:var(--color-text-muted);font-size:0.9rem; }
.dropzone__text strong { color:var(--color-gold); }

/* FILE LIST */
.file-list { display:flex;flex-direction:column;gap:8px;margin-top:16px; }
.file-item { display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:0.84rem; }
.file-item__name { flex:1;color:var(--color-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.file-item__size { color:var(--color-text-muted);white-space:nowrap; }
.file-item__remove { cursor:pointer;color:var(--color-danger);padding:2px;transition:opacity var(--transition); }
.file-item__remove:hover { opacity:0.7; }

/* ALERT */
.alert { padding:12px 16px;border-radius:var(--radius-sm);font-size:0.88rem;margin-bottom:16px; }
.alert--success { background:var(--color-active-bg);border:1px solid rgba(46,216,122,0.3);color:#2ed87a; }
.alert--error { background:var(--color-danger-bg);border:1px solid rgba(224,86,86,0.3);color:var(--color-danger); }

/* LOADER */
.loader { display:flex;align-items:center;justify-content:center;padding:40px; }
.loader__spinner { width:32px;height:32px;border:3px solid var(--color-border);border-top-color:var(--color-gold);border-radius:50%;animation:spin 0.8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }