/* TGS site-wide visual polish
   UI only: no Firebase, auth, paths, commands, or authorization logic is changed. */
:root{
  --tgs-bg:#070b12;
  --tgs-surface:rgba(13,18,32,.76);
  --tgs-surface-2:rgba(17,25,43,.84);
  --tgs-border:rgba(148,163,184,.18);
  --tgs-border-strong:rgba(56,189,248,.30);
  --tgs-text:#f8fafc;
  --tgs-muted:#a7b2c5;
  --tgs-brand:#19d3f3;
  --tgs-brand-2:#3b82f6;
  --tgs-ok:#22c55e;
  --tgs-warn:#f59e0b;
  --tgs-danger:#ef4444;
  --tgs-radius:20px;
  --tgs-shadow:0 24px 80px rgba(0,0,0,.38);
}

html{scroll-behavior:smooth;}
body{
  color:var(--tgs-text);
  background:
    radial-gradient(1100px 600px at 18% -8%, rgba(25,211,243,.18), transparent 58%),
    radial-gradient(900px 540px at 92% 8%, rgba(59,130,246,.16), transparent 56%),
    radial-gradient(720px 520px at 50% 110%, rgba(34,197,94,.08), transparent 65%),
    var(--tgs-bg) !important;
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
  text-rendering:geometricPrecision;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.5), transparent 78%);
}

header,
.tgs-header,
.mobile-overlay,
.tgs-modal,
.sheet,
.card,
.tgs-card,
.panel,
.tgs-panel,
.login-card,
.login-box,
main section,
.service-card,
.contact-card{
  border-color:var(--tgs-border) !important;
  box-shadow:var(--tgs-shadow);
}

header{
  background:linear-gradient(180deg, rgba(6,10,18,.88), rgba(10,15,27,.74)) !important;
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
}

.card,
.tgs-card,
.panel,
.tgs-panel,
.login-card,
.login-box,
.service-card,
.contact-card,
main section{
  background:linear-gradient(180deg, rgba(17,24,39,.82), rgba(9,14,24,.72)) !important;
  backdrop-filter:blur(16px) saturate(135%);
  -webkit-backdrop-filter:blur(16px) saturate(135%);
  border:1px solid var(--tgs-border) !important;
  border-radius:var(--tgs-radius) !important;
}

.card:hover,
.tgs-card:hover,
.panel:hover,
.tgs-panel:hover,
.service-card:hover,
.contact-card:hover{
  border-color:rgba(56,189,248,.26) !important;
}

h1,h2,h3,.brand,#brand,.tgs-brand{
  letter-spacing:.2px;
}

h1::selection,h2::selection,h3::selection,p::selection,span::selection,div::selection,button::selection,input::selection{
  background:rgba(25,211,243,.22);
}

.btn,
button,
a.btn,
.navlink,
.tgs-btn{
  transition:transform .16s ease, filter .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

.btn:hover,
button:hover,
a.btn:hover,
.tgs-btn:hover{
  transform:translateY(-1px);
}

.btn:active,
button:active,
.tgs-btn:active{
  transform:translateY(0);
}

.btn-primary,
.btn.primary,
.btn-brand,
.tgs-btn-primary{
  background:linear-gradient(135deg, var(--tgs-brand), var(--tgs-brand-2)) !important;
  color:#03111a !important;
  border-color:rgba(125,211,252,.45) !important;
  box-shadow:0 16px 36px rgba(14,165,233,.22) !important;
}

.btn-secondary,
.btn.secondary,
.btn-ghost,
.tgs-btn-secondary{
  background:rgba(15,23,42,.56) !important;
  border-color:var(--tgs-border) !important;
}

.btn-danger,
.btn.danger,
.tgs-btn-danger{
  background:linear-gradient(135deg, rgba(239,68,68,.20), rgba(127,29,29,.42)) !important;
  color:#fecaca !important;
  border-color:rgba(239,68,68,.38) !important;
}

a{
  color:var(--tgs-brand);
}

a.navlink{
  border:1px solid transparent;
  text-decoration:none !important;
}
a.navlink:hover{
  background:rgba(25,211,243,.10) !important;
  border-color:rgba(25,211,243,.20);
}

input,select,textarea,.tgs-input,.tgs-select{
  background:rgba(2,6,23,.62) !important;
  border:1px solid rgba(148,163,184,.20) !important;
  color:var(--tgs-text) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
input:focus,select:focus,textarea:focus,.tgs-input:focus,.tgs-select:focus{
  outline:none !important;
  border-color:rgba(25,211,243,.56) !important;
  box-shadow:0 0 0 4px rgba(25,211,243,.13) !important;
}

.pill,.tgs-tag,#usernameLabel{
  background:rgba(15,23,42,.58) !important;
  border-color:rgba(148,163,184,.18) !important;
  box-shadow:0 10px 28px rgba(0,0,0,.20);
}

::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:rgba(15,23,42,.45);}
::-webkit-scrollbar-thumb{background:rgba(148,163,184,.28);border-radius:999px;border:2px solid rgba(15,23,42,.45);}
::-webkit-scrollbar-thumb:hover{background:rgba(25,211,243,.42);}

@media (max-width: 700px){
  body{background-attachment:scroll;}
  .card,.tgs-card,.panel,.tgs-panel,main section{border-radius:16px !important;}
  .btn,button,.tgs-btn{min-height:42px;}
}