@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root { --admin-ink:#10231f; --admin-green:#03a66a; --admin-soft:#effcf4; --admin-slate:#23313f; }
html,body { min-height:100%; } body { font-family:Manrope,sans-serif; } .admin-shell { background:#f3f7f5; display:flex; flex-direction:column; min-height:100vh; } .admin-main { flex:1 0 auto; width:100%; } .admin-header { background:var(--admin-ink); border-bottom:1px solid rgba(186,244,214,.18); color:#fff; } .admin-topbar { align-items:center; display:flex; gap:1.5rem; min-height:5.5rem; } .brand { color:var(--admin-ink); font-size:1.5rem; font-weight:800; letter-spacing:-.08em; white-space:nowrap; } .brand span,.admin-kicker { color:var(--admin-green); } .admin-header .brand { color:#fff; } .brand small { color:#a8c8b8; font-family:'DM Mono',monospace; font-size:.58rem; letter-spacing:.08em; margin-left:.45rem; } .admin-navigation { align-items:center; display:flex; flex:1; gap:.15rem; justify-content:center; } .admin-navigation a { border-radius:.6rem; color:#bdd4c8; font-size:.75rem; font-weight:700; padding:.6rem .7rem; white-space:nowrap; } .admin-navigation a:hover,.admin-navigation a.active { background:rgba(186,244,214,.13); color:#aef6d0; } .admin-account { align-items:center; color:#b8d2c5; display:flex; font-size:.75rem; gap:.7rem; white-space:nowrap; } .admin-logout { background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.17); color:#fff; } .admin-logout:hover { background:#fff; color:var(--admin-ink); } .admin-footer { background:var(--admin-slate); color:#b9c9c2; flex:0 0 auto; } .admin-kicker { font-family:'DM Mono',monospace; font-size:.68rem; font-weight:700; letter-spacing:.12em; margin:0 0 .75rem; } h1,h2 { color:var(--admin-ink); letter-spacing:-.055em; } h1 { font-size:clamp(2.2rem,4vw,3.7rem); font-weight:800; line-height:1; margin:0; } h2 { font-size:1.3rem; font-weight:800; margin:0; } .admin-hero { align-items:end; background:linear-gradient(120deg,#e8faef,#fff); border:1px solid #d7ebe0; border-radius:1.5rem; display:flex; gap:2rem; justify-content:space-between; padding:2.5rem; } .admin-hero p:not(.admin-kicker),.admin-page-heading > p:not(.admin-kicker) { color:#536961; font-size:.95rem; line-height:1.7; margin:.9rem 0 0; } .admin-hero-note { background:var(--admin-ink); border-radius:1rem; color:#baf4d6; font-size:1.05rem; font-weight:800; line-height:1.5; min-width:17rem; padding:1.2rem; } .admin-hero-note span { color:#c9ddd3; display:block; font-size:.72rem; font-weight:500; margin-top:.4rem; } .metric-grid { display:grid; gap:1rem; grid-template-columns:repeat(4,1fr); margin:1.5rem 0; } .metric-card { background:#fff; border:1px solid #dcece3; border-radius:1.1rem; display:grid; gap:.35rem; min-height:10rem; padding:1.3rem; } .metric-card span { font-size:1.75rem; } .metric-card small { color:#667a71; font-size:.76rem; font-weight:700; } .metric-card strong { color:var(--admin-ink); font-family:'DM Mono',monospace; font-size:2rem; } .admin-panel { background:#fff; border:1px solid #dcece3; border-radius:1.25rem; margin-top:1.5rem; padding:1.5rem; } .panel-heading { align-items:center; display:flex; justify-content:space-between; margin-bottom:1.25rem; } .admin-table th { background:#f3faf6; color:#60736b; font-size:.7rem; font-weight:700; white-space:nowrap; } .admin-table td { color:#30493f; font-family:'DM Mono',monospace; font-size:.72rem; white-space:nowrap; } .admin-page-heading { margin-bottom:2rem; max-width:44rem; } .read-only-badge { background:#effcf4; border:1px solid #cfe6d8; border-radius:999px; color:#268356; font-size:.72rem; font-weight:700; padding:.45rem .65rem; } .settings-grid { display:grid; gap:1rem; grid-template-columns:repeat(2,1fr); } .config-card { margin:0; min-height:13rem; } .config-card > span { font-size:1.8rem; } .config-card h2 { font-size:1rem; margin:1.4rem 0 .45rem; } .config-card strong { color:var(--admin-ink); font-size:1.25rem; } .config-card p { color:#61736c; font-size:.82rem; line-height:1.65; margin:1rem 0 0; } .config-address { font-family:'DM Mono',monospace; } .info-strip { background:#effcf4; color:#315a46; font-size:.88rem; line-height:1.7; } .admin-login { align-items:center; background:radial-gradient(circle at top right,#c8f8dc,transparent 33%),#effcf4; display:flex; justify-content:center; min-height:100vh; padding:1.25rem; } .admin-login-card { background:#fff; border:1px solid #dcece3; border-radius:1.5rem; box-shadow:0 1.5rem 4rem rgba(16,35,31,.12); display:grid; gap:1rem; max-width:27rem; padding:2rem; width:100%; } .admin-login-card h1 { font-size:2rem; } .admin-login-card > p:not(.admin-kicker):not(.form-message) { color:#60736b; font-size:.85rem; line-height:1.6; margin:0 0 .5rem; } .admin-login-card .form-control { display:grid; gap:.45rem; margin:0; } .admin-login-card .form-control span { color:#385247; font-size:.8rem; font-weight:700; } .admin-primary { background:var(--admin-ink); border-color:var(--admin-ink); color:#fff; } .admin-primary:hover { background:var(--admin-green); border-color:var(--admin-green); } .admin-secondary { border:1px solid #b7d6c4; color:#24573f; } .form-message { color:#e04f5f; font-size:.8rem; min-height:1rem; margin:0; }
@media (max-width:1100px) { .admin-topbar { align-items:flex-start; flex-wrap:wrap; padding-bottom:1rem; padding-top:1rem; } .admin-navigation { justify-content:flex-start; order:3; overflow-x:auto; padding-bottom:.25rem; width:100%; } .admin-account { margin-left:auto; } }
.admin-settings-layout { align-items:stretch; display:grid; gap:1rem; grid-template-columns:minmax(0,2fr) minmax(16rem,1fr); } .admin-settings-layout .admin-panel { margin:0; } .admin-password-panel { padding:1.75rem; } .panel-description { color:#61736c; font-size:.86rem; line-height:1.7; margin:0 0 1.25rem; } .admin-form { display:grid; gap:1rem; max-width:48rem; } .admin-form .form-control { display:grid; gap:.45rem; } .admin-form .form-control span { color:#385247; font-size:.8rem; font-weight:700; } .admin-form-row { display:grid; gap:1rem; grid-template-columns:1fr 1fr; } .admin-form .btn { justify-self:start; min-width:12rem; } .form-message.success { color:#168054; } .admin-account-summary { background:linear-gradient(145deg,#e8faef,#fff); display:flex; flex-direction:column; justify-content:center; min-height:17rem; } .admin-account-summary > span { font-size:2rem; } .admin-account-summary h2 { font-size:1rem; margin:1.2rem 0 .45rem; } .admin-account-summary strong { color:var(--admin-ink); font-size:1.35rem; } .admin-account-summary p { color:#61736c; font-size:.82rem; line-height:1.7; margin:1rem 0 0; }
@media (max-width:700px) { .admin-main { padding:2rem 1rem; } .admin-topbar { gap:.8rem; min-height:auto; } .admin-account span { display:none; } .admin-navigation a { font-size:.72rem; padding:.55rem .6rem; } .admin-hero { align-items:flex-start; flex-direction:column; padding:1.5rem; } .admin-hero-note { min-width:0; width:100%; } .metric-grid,.settings-grid,.admin-settings-layout,.admin-form-row { grid-template-columns:1fr; } .metric-card { min-height:8rem; padding:1rem; } .metric-card strong { font-size:1.5rem; } .admin-panel { border-radius:1rem; padding:1rem; } .panel-heading { align-items:flex-start; gap:.8rem; } .admin-form .btn { justify-self:stretch; width:100%; } }