/*
 * GhostWire Neon VPN - custom overrides for WHMCS Twenty-One
 * Loaded automatically by templates/ghostwire/includes/head.tpl (assetExists custom.css)
 */

:root{
  --gw-bg0:#050814;
  --gw-bg1:#070b1d;
  --gw-card: rgba(255,255,255,.04);
  --gw-border: rgba(255,255,255,.10);
  --gw-text: rgba(255,255,255,.92);
  --gw-muted: rgba(255,255,255,.72);
  --gw-cyan:#22d3ee;
  --gw-purple:#a78bfa;
  --gw-green:#10b981;
  --gw-shadow: 0 18px 45px rgba(0,0,0,.40);
}

/* Global */
html, body{background: var(--gw-bg0) !important;}
body{
  color: var(--gw-text) !important;
  background:
    radial-gradient(900px 500px at 15% 0%, rgba(34,211,238,.12), transparent 55%),
    radial-gradient(900px 520px at 85% 30%, rgba(167,139,250,.12), transparent 55%),
    radial-gradient(900px 520px at 35% 100%, rgba(16,185,129,.10), transparent 55%),
    linear-gradient(180deg, var(--gw-bg1), var(--gw-bg0)) !important;
}

a{color: rgba(34,211,238,.95);}
a:hover{color: rgba(167,139,250,.95);}

/* Header / Nav */
.header .topbar{background: rgba(255,255,255,.03) !important; border-bottom: 1px solid rgba(255,255,255,.06) !important;}
.header .navbar.navbar-light{background: rgba(0,0,0,.18) !important; border-bottom: 1px solid rgba(255,255,255,.06) !important;}
.header .main-navbar-wrapper{background: rgba(0,0,0,.16) !important; border-bottom: 1px solid rgba(255,255,255,.06) !important;}

.header .navbar-brand, .header .nav-link{color: var(--gw-text) !important;}
.header .nav-link:hover{color: rgba(34,211,238,.95) !important;}

.master-breadcrumb{background: transparent !important; border-bottom: 1px solid rgba(255,255,255,.06) !important;}
.master-breadcrumb .breadcrumb{background: transparent !important;}

/* Cards / containers */
.card, .panel, .list-group-item, .domain-checker-container,
.domain-checker-bg, .announcements-home, .sidebar .card,
.client-home-panels .card, .dataTables_wrapper table.table-list{
  background: var(--gw-card) !important;
  border-color: rgba(255,255,255,.10) !important;
  color: var(--gw-text) !important;
  box-shadow: none;
}

.table, .table-list td, .table-list th{color: var(--gw-text) !important;}

/* Forms */
.form-control, .custom-select, .form-control:focus{
  background: rgba(0,0,0,.25) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: var(--gw-text) !important;
  box-shadow: 0 0 0 0.15rem rgba(34,211,238,.10) !important;
}
.form-control::placeholder{color: rgba(255,255,255,.55) !important;}

/* Buttons */
.btn{
  border-radius: 12px !important;
}

.btn-primary,
.btn-success,
.btn-info{
  border: 0 !important;
  background: linear-gradient(90deg, rgba(34,211,238,.95), rgba(167,139,250,.95)) !important;
  color: #081019 !important;
  font-weight: 800 !important;
  box-shadow: 0 12px 28px rgba(34,211,238,.18) !important;
}
.btn-primary:hover, .btn-success:hover, .btn-info:hover{filter: brightness(1.05);}

.btn-default,
.btn-secondary,
.btn-outline-secondary,
.btn-outline-light{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: var(--gw-text) !important;
}

.btn-default:hover,
.btn-secondary:hover,
.btn-outline-secondary:hover,
.btn-outline-light:hover{
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(34,211,238,.25) !important;
}

.badge-info{
  background: rgba(34,211,238,.18) !important;
  border: 1px solid rgba(34,211,238,.24) !important;
  color: rgba(255,255,255,.92) !important;
}

/* Alerts */
.alert{
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.10) !important;
  color: var(--gw-text) !important;
}

/* Footer */
.footer{
  background: rgba(0,0,0,.20) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}
.footer .nav-link{color: rgba(255,255,255,.80) !important;}
.footer .nav-link:hover{color: rgba(34,211,238,.95) !important;}
.footer .copyright{color: rgba(255,255,255,.70) !important;}

/* === GhostWire homepage (homepage.tpl) === */
.gw-home{padding:24px 0}
.gw-wrap{max-width:1140px;margin:0 auto;padding:0 16px}
.gw-hero{
  position:relative; overflow:hidden; border-radius:18px;
  background: radial-gradient(1200px 500px at 20% 10%, rgba(99,102,241,.28), rgba(0,0,0,0) 60%),
              radial-gradient(900px 420px at 85% 40%, rgba(16,185,129,.20), rgba(0,0,0,0) 55%),
              linear-gradient(180deg, rgba(17,24,39,.92), rgba(2,6,23,.98));
  border:1px solid rgba(255,255,255,.08);
  box-shadow: var(--gw-shadow);
}
.gw-hero::before{
  content:""; position:absolute; inset:-2px;
  background:
    radial-gradient(circle at 30% 20%, rgba(34,211,238,.18), transparent 40%),
    radial-gradient(circle at 80% 60%, rgba(167,139,250,.16), transparent 45%);
  pointer-events:none;
}
.gw-hero-inner{position:relative; padding:38px 20px}
@media (min-width: 992px){.gw-hero-inner{padding:58px 56px}}

.gw-kicker{
  display:inline-flex; align-items:center; gap:10px;
  padding:7px 12px; border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  font-weight:700; font-size:12px; letter-spacing:.3px;
}
.gw-dot{width:8px;height:8px;border-radius:50%;background:rgba(16,185,129,.95);box-shadow:0 0 20px rgba(16,185,129,.55)}
.gw-sep{opacity:.75}
.gw-kicker-sub{opacity:.90}

.gw-title{margin:14px 0 10px;font-size:34px;line-height:1.1;font-weight:900}
@media (min-width: 992px){.gw-title{font-size:46px}}
.gw-title span{
  background: linear-gradient(90deg, rgba(34,211,238,1), rgba(167,139,250,1));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.gw-sub{max-width:680px;font-size:16px;line-height:1.6;opacity:.92}

.gw-actions{margin-top:18px;display:flex;flex-wrap:wrap;gap:10px}
.gw-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:12px 16px;border-radius:12px;font-weight:900;
  border:1px solid rgba(255,255,255,.10);
  text-decoration:none !important;
}
.gw-btn-primary{
  background: linear-gradient(90deg, rgba(34,211,238,.95), rgba(167,139,250,.95));
  color:#081019 !important;
  box-shadow:0 12px 28px rgba(34,211,238,.20);
}
.gw-btn-ghost{background:rgba(255,255,255,.06); color:rgba(255,255,255,.92) !important}

.gw-badges{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px}
.gw-badge{
  padding:7px 10px;border-radius:999px;font-size:12px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  opacity:.95;
}

.gw-grid{margin-top:18px;display:grid;gap:12px}
@media (min-width: 992px){.gw-grid{grid-template-columns:repeat(3,1fr);gap:14px}}
.gw-card{
  border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  padding:16px;
}
.gw-card h3{margin:0 0 6px;font-size:14px;font-weight:900}
.gw-card p{margin:0;font-size:13px;opacity:.92;line-height:1.5}

.gw-section{margin-top:18px}
.gw-section h2{font-size:18px;font-weight:900;margin:0 0 10px}
.gw-plans{display:grid;gap:12px}
@media (min-width: 992px){.gw-plans{grid-template-columns:repeat(3,1fr)}}
.gw-plan{
  border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  padding:16px;
  display:flex;flex-direction:column;gap:10px;
}
.gw-plan.featured{
  border-color: rgba(34,211,238,.35);
  box-shadow:0 16px 38px rgba(34,211,238,.12);
  background: linear-gradient(180deg, rgba(34,211,238,.08), rgba(255,255,255,.03));
}
.gw-plan .top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.gw-plan .name{font-weight:900;font-size:15px}
.gw-plan .pill{font-size:11px;padding:6px 10px;border-radius:999px;background:rgba(34,211,238,.14);border:1px solid rgba(34,211,238,.25)}
.gw-plan ul{margin:0;padding-left:18px;opacity:.92;font-size:13px;line-height:1.55}
.gw-plan .cta{margin-top:auto}
.gw-note{margin-top:10px;font-size:12px;opacity:.8}
