/* ==========================================================================
   Clever Platform — VerifyMC brand layer (loaded after the glassx bundle)
   Unofficial employee community Minecraft server · personal infra.
   Palette from the official Clever kit: Slate #364256 · Teal #48C1BC.
   Base accent colours are remapped in the compiled CSS/JS; this layer sets the
   Outfit typeface, swaps the nav wordmark for the real CLEV3R logo, calms the
   inputs, and adds the unofficial-community framing.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

:root{
  --clv-teal:#48C1BC; --clv-teal-2:#5fd1cc; --clv-teal-d:#369a96;
  --clv-slate:#364256; --clv-slate-d:#1e2530; --clv-ink:#151a22;
  --clv-text:#eef2f6; --clv-muted:#aab4c0;
}

/* ---- Page background: replace the theme's blue/pink/magenta mesh with a
        cohesive Clever slate+teal mesh (the stock one is hsla hue-based, so the
        colour remap can't reach it) ---- */
body{
  background-color:#12161d !important;
  background-image:
    radial-gradient(at 0% 0%,    hsla(215,28%,9%,1)  0px, transparent 55%),
    radial-gradient(at 52% -5%,  hsla(177,42%,15%,1) 0px, transparent 50%),
    radial-gradient(at 100% 0%,  hsla(196,32%,13%,1) 0px, transparent 50%),
    radial-gradient(at 82% 100%, hsla(211,30%,11%,1) 0px, transparent 50%),
    radial-gradient(at 0% 100%,  hsla(184,40%,12%,1) 0px, transparent 50%)
    !important;
  background-attachment:fixed !important;
}

/* ---- Typography: kill the Pacifico script font, standardise on Outfit ---- */
.font-pacifico, [class*="pacifico"]{
  font-family:'Outfit', sans-serif !important;
  font-weight:800 !important; letter-spacing:-.015em !important;
}
html, body, #app, button, input, textarea, select,
h1, h2, h3, h4, h5, h6, p, a, span, div, label{
  font-family:'Outfit','Montserrat', system-ui, -apple-system, sans-serif !important;
}

/* ---- Nav brand → the real CLEV3R logo (hide the text, show the mark) ---- */
.logo-text{
  display:inline-block !important;
  width:170px !important; height:38px !important;
  font-size:0 !important; line-height:0 !important; color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  background:url('/clever-logo-dark.svg') left center / contain no-repeat !important;
}
@media (max-width:560px){ .logo-text{ width:132px !important; height:30px !important; } }

/* ---- Inputs: calm dark glass with a teal focus ring (was purple bleed) ---- */
.glass-input{
  background:rgba(30,37,48,.55) !important;
  border:1px solid rgba(72,193,188,.16) !important;
  color:var(--clv-text) !important;
  border-radius:12px !important;
}
.glass-input:hover{ border-color:rgba(72,193,188,.30) !important; }
.glass-input:focus{
  border-color:var(--clv-teal) !important;
  background:rgba(30,37,48,.78) !important;
  box-shadow:0 0 0 3px rgba(72,193,188,.16) !important;
}
.glass-input::placeholder{ color:#8a97a6 !important; }

/* ---- Buttons: make the primary CTA unmistakably teal ---- */
.glass-button-primary,
button.bg-gradient-to-r, a.bg-gradient-to-r,
button[class*="from-blue"], button[class*="from-indigo"]{
  background:linear-gradient(135deg, var(--clv-teal-2) 0%, var(--clv-teal) 45%, var(--clv-teal-d) 100%) !important;
  color:#06231f !important; font-weight:700 !important;
  border:1px solid rgba(72,193,188,.5) !important;
  box-shadow:0 10px 26px -10px rgba(72,193,188,.6) !important;
}
.glass-button-primary:hover{ filter:brightness(1.06) !important; }
.glass-button-primary:disabled{ opacity:.5 !important; box-shadow:none !important; }

/* ---- Links / accents ---- */
a:not(.logo-text):hover{ color:var(--clv-teal-2) !important; }
::selection{ background:rgba(72,193,188,.30); color:#fff; }
*:focus-visible{ outline:2px solid var(--clv-teal) !important; outline-offset:2px; }

/* ---- Unofficial-community footer, present on every page ---- */
#app::after{
  content:'Unofficial community server · by Clever folks, for Clever folks · not affiliated with Clever Platform · runs on personal infrastructure';
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  text-align:center; font-size:11px; line-height:1.4; letter-spacing:.015em;
  color:rgba(200,210,222,.5);
  padding:9px 18px 10px; pointer-events:none;
  font-family:'Outfit',sans-serif;
  background:linear-gradient(to top, rgba(16,20,27,.92), rgba(16,20,27,0));
}
@media (max-width:560px){ #app::after{ font-size:10px; padding:7px 12px 8px; } }