/* Light Marketing Theme */
:root{
  --bg:#ffffff;--bg-soft:#f7f9fc;--fg:#0b1020;--muted:#54607a;
  --card:#ffffff;--card-soft:#ffffff;--border:#e6eaf2;
  --accent:#2b6df8;--accent-2:#00b289;--accent-3:#ffb200;
  --danger:#e5484d;--success:#0ea67f;--warning:#f5a524;
  --shadow:0 6px 24px rgba(16,24,40,.08), 0 2px 6px rgba(16,24,40,.06);

  /* Header palette to mirror linkvaultseo.co.za */
  --topbar-bg:#0b1020;
  --topbar-link:#e5e7eb;
  --topbar-link-muted:#cbd5e1;
  --topbar-hover:#111826;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;height:100%}
body{min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto}
img{max-width:100%;height:auto}
.container{max-width:1160px;margin:0 auto;padding:1.25rem}
.topbar{background:var(--topbar-bg);border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:20;box-shadow:0 2px 12px rgba(0,0,0,.18)}
.logo a{font-weight:800;color:#fff;text-decoration:none}
.topbar nav a{color:var(--topbar-link);text-decoration:none;margin-left:.3rem;padding:.65rem .8rem;border-radius:10px;font-weight:600}
.topbar nav a:hover{background:var(--topbar-hover)}
.topbar nav a.muted{color:var(--topbar-link-muted)}
.topbar .btn{background:var(--accent);border:none;color:#fff;padding:.55rem .9rem;border-radius:10px}
.topbar .btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.18);color:#fff}
.footer{border-top:1px solid var(--border);margin-top:3rem;padding:1.25rem;color:#6b7487;background:#fff}

/* Site Footer (dark, to mirror linkvaultseo.co.za) */
.site-footer{background:#0b1020;color:#cbd5e1;margin-top:0}
.site-footer a{color:#e5e7eb;text-decoration:none}
.site-footer a:hover{opacity:.9}
.site-footer .footer-grid{display:grid;gap:1.6rem;padding:2.2rem 1.25rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.site-footer .brand-row{display:flex;align-items:center;gap:.7rem;margin-bottom:.4rem}
.site-footer .footer-logo{height:28px;width:auto;display:block}
.site-footer .brand-name{font-weight:800;color:#fff}
.site-footer .brand-desc{margin:.2rem 0 0 0;color:#94a3b8;font-size:.95rem}
.site-footer .section-title{color:#fff;font-weight:700;margin:0 0 .6rem 0}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin:.35rem 0;color:#cbd5e1}
.site-footer .footer-bottom{border-top:1px solid rgba(255,255,255,.08);background:#0a0f1e}
.site-footer .bottom-row{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;flex-wrap:wrap;gap:.8rem}
.site-footer .copy{color:#94a3b8}
.site-footer .policies{display:flex;align-items:center;gap:.6rem}
.site-footer .sep{color:#475569}

.card{background:var(--card);padding:1.25rem;border-radius:14px;border:1px solid var(--border);box-shadow:var(--shadow)}
.card .card-title{font-size:1.2rem;margin:0 0 .75rem 0;color:#111826}
/* Toolbar above tables (filters, page-size selector) */
.table-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:.8rem}
/* Specific layout for login card */
.login-card{width:min(92vw, 720px);margin:2rem auto}
@media (max-width: 768px){
  .login-card{width:min(94vw, 640px);margin:1.75rem auto}
}
@media (max-width: 640px){
  .login-card{width:min(96vw, 560px);margin:1.5rem auto}
}

.form label{display:block;margin:.3rem 0 .2rem .1rem;color:#49536a;font-size:.95rem}
.form input, .form select, .form textarea{width:100%;padding:.7rem .8rem;border-radius:10px;border:1px solid #d5dceb;background:#fff;color:#0b1020;outline:none;transition:border .15s, box-shadow .15s}
.form input:focus, .form select:focus, .form textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(43,109,248,.15)}
.grid{display:grid;gap:1.2rem;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.grid.two{grid-template-columns:repeat(2,1fr)}
.grid.three{grid-template-columns:repeat(3,1fr)}
@media (max-width: 992px){
  .grid.three{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 640px){
  .grid.three{grid-template-columns:1fr}
}

.btn{background:var(--accent);border:1px solid transparent;color:#fff;padding:.7rem 1.1rem;border-radius:10px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:.45rem;transition:transform .03s ease, filter .15s;
  font: inherit; /* ensure buttons match links */
  font-size: 1rem; /* unify font size */
  line-height: 1.2; /* consistent height */
  font-weight: 600; /* match nav/button weight */
  -webkit-appearance: none; appearance: none; /* remove native button styles */
  vertical-align: middle;
}
.btn:hover{filter:brightness(1.06)}
.btn:active{transform:translateY(1px)}
.btn.secondary{background:#111826;color:#fff}
.btn.ghost{background:transparent;border:1px solid var(--border);color:#111826}
.btn.warn{background:var(--warning);color:#2b1b00}
.btn.danger{background:var(--danger);color:#fff}
.btn.small{padding:.5rem .8rem;border-radius:999px}

.table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.table thead th{position:sticky;top:0;background:#f7f9fc;border-bottom:1px solid var(--border);text-align:left;padding:.85rem;color:#111826;font-weight:700}
.table tbody td{padding:.8rem;border-bottom:1px solid #f0f3fa}
.table tbody tr:hover{background:#fbfdff}
.table tbody tr:last-child td{border-bottom:none}
.truncate{max-width:600px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.flex{display:flex;align-items:center}
.between{justify-content:space-between}
.wrap{flex-wrap:wrap}
.gap-s{gap:.4rem}
.gap{gap:.9rem}
.gap-l{gap:1.3rem}
.muted{color:#6b7487}
.center{display:flex;justify-content:center;align-items:center}
.hero{padding:4rem 0}
.hero h1{margin:0 0 .75rem 0;font-size:2.2rem;line-height:1.2}
.hero p{margin:0;color:#49536a;font-size:1.05rem}
.hero .cta{margin-top:1.2rem;display:flex;gap:.7rem;flex-wrap:wrap}
.section-title{font-size:1.6rem;margin:2rem 0 1rem 0}
.alert{background:#fff7ed;border:1px solid #ffedd5;padding:.9rem 1rem;border-radius:12px;margin:1rem 0;color:#7c2d12}
.alert.success{background:#ecfdf5;border-color:#d1fae5;color:#065f46}
.alert.error{background:#fef2f2;border-color:#fee2e2;color:#7f1d1d}
.badge{display:inline-block;padding:.2rem .5rem;border-radius:999px;background:#f1f5ff;color:#1e3a8a;font-size:.82em;border:1px solid #e0e7ff}
.badge.success{background:#ecfdf5;color:#065f46;border-color:#d1fae5}
.badge.warn{background:#fef3c7;color:#92400e;border-color:#fde68a}
.badge.error{background:#fee2e2;color:#7f1d1d;border-color:#fecaca}
