/* ALLIN1DEVELOPERS STORE - Cyber Blue Transparent Glass UI (v3, performance tuned)
   Note: heavy backdrop-filter is used ONLY on the sticky navbar / menus (desktop). Big card grids use
   translucent gradients instead - same look, far smoother scrolling. !important is intentional. */
:root{
  --g-bg:#020a1c; --g-text:#e8f6ff; --g-muted:#9ec1de; --g-cyan:#38bdf8;
  --g-fill:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.035) 55%,rgba(56,189,248,.05));
  --g-border:rgba(150,215,255,.22); --g-border-hi:rgba(160,225,255,.6);
  --g-edge:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(56,189,248,.10);
  --g-shadow:0 14px 34px -14px rgba(0,8,30,.75),0 0 0 1px rgba(56,189,248,.05)
}
html{background:var(--g-bg)}
/* one fixed, static background layer (cheap: never repainted while scrolling) */
body{background:transparent !important;color:var(--g-text) !important}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(620px 420px at 6% 4%,rgba(14,165,233,.30),transparent 70%),
    radial-gradient(560px 460px at 96% 12%,rgba(37,99,235,.32),transparent 70%),
    radial-gradient(640px 420px at 55% 104%,rgba(6,182,212,.22),transparent 70%),
    linear-gradient(rgba(56,189,248,.04) 1px,transparent 1px) 0 0/52px 52px,
    linear-gradient(90deg,rgba(56,189,248,.04) 1px,transparent 1px) 0 0/52px 52px,
    linear-gradient(180deg,#030d24,#020a1c 60%,#01060f)}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:#04122b !important}
::-webkit-scrollbar-thumb{background:#1d4f8a !important;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:#38bdf8 !important}
::selection{background:rgba(56,189,248,.45);color:#fff}

/* ---- text ---- */
.text-slate-900,.text-slate-800{color:var(--g-text) !important}
.text-slate-700{color:#cfe8ff !important}
.text-slate-600{color:#b3cde6 !important}
.text-slate-500{color:var(--g-muted) !important}
.text-slate-400{color:#86a9c8 !important}
.text-slate-300{color:#b9d4ec !important}
.text-brand-600,.text-brand-700,.text-brand-500,.text-indigo-600,.text-indigo-500,.text-indigo-700,.text-indigo-800,.text-blue-600,.text-blue-700{color:var(--g-cyan) !important}
.hover\:text-brand-600:hover,.hover\:text-brand-700:hover,.group:hover .group-hover\:text-brand-600,.group:hover .group-hover\:text-brand-500{color:#7dd3fc !important}
.hover\:text-slate-900:hover,.hover\:text-slate-700:hover,.hover\:text-slate-600:hover{color:#fff !important}
.text-violet-600,.text-violet-500{color:#7dd3fc !important}
.text-green-600,.text-emerald-600,.text-emerald-700,.text-green-700{color:#5eead4 !important}
.text-rose-600,.text-rose-700,.text-rose-500{color:#fda4af !important}
.text-amber-700,.text-amber-600{color:#fcd34d !important}

/* ---- glass surfaces (no blur on purpose = smooth) ---- */
.bg-white,.bg-slate-50,.bg-slate-100,.bg-slate-50\/50,.bg-brand-50,.bg-green-50,.bg-violet-50,.bg-blue-50,.bg-indigo-50,.bg-indigo-100,.bg-emerald-50,.bg-emerald-100,.bg-amber-50,.bg-amber-100{
  background:var(--g-fill) !important;
}
.bg-white{border-color:var(--g-border);box-shadow:var(--g-edge),var(--g-shadow)}
.bg-rose-50,.bg-rose-100{background:linear-gradient(145deg,rgba(244,63,94,.20),rgba(244,63,94,.07)) !important}
.bg-green-50,.bg-emerald-50,.bg-emerald-100{background:linear-gradient(145deg,rgba(16,185,129,.22),rgba(16,185,129,.07)) !important}
.bg-amber-50,.bg-amber-100{background:linear-gradient(145deg,rgba(245,158,11,.22),rgba(245,158,11,.07)) !important}
.bg-brand-50,.bg-violet-50,.bg-blue-50,.bg-indigo-50,.bg-indigo-100{background:linear-gradient(145deg,rgba(125,211,252,.22),rgba(37,99,235,.10)) !important}
.bg-slate-200{background-color:rgba(56,189,248,.15) !important}
.rounded-3xl.bg-white,.rounded-2xl.bg-white{border:1px solid var(--g-border) !important;position:relative}
.rounded-3xl.bg-white::before,.rounded-2xl.bg-white::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,0) 32%,rgba(255,255,255,0) 72%,rgba(56,189,248,.10));z-index:0}
.bg-white.tilt-3d:hover{border-color:var(--g-border-hi) !important}
.border-slate-100,.border-slate-200,.border-slate-300,.border-slate-200\/50{border-color:var(--g-border) !important}
.divide-slate-100>:not([hidden])~:not([hidden]),.divide-slate-200>:not([hidden])~:not([hidden]){border-color:var(--g-border) !important}
.border-slate-800{border-color:rgba(56,189,248,.14) !important}
.border-brand-500,.focus\:border-brand-500:focus{border-color:var(--g-cyan) !important}
.focus\:ring-brand-500:focus,.focus\:ring-brand-500\/20:focus,.focus\:ring-indigo-500:focus{--tw-ring-color:rgba(56,189,248,.45) !important}
.hover\:bg-brand-50:hover,.hover\:bg-slate-50:hover,.hover\:bg-slate-100:hover{background:rgba(56,189,248,.14) !important}
.hover\:bg-slate-200:hover,.hover\:bg-slate-800:hover{background:rgba(56,189,248,.22) !important}
.hover\:border-slate-300:hover,.hover\:border-slate-100:hover{border-color:var(--g-border-hi) !important}
.focus\:bg-white:focus{background:rgba(10,34,72,.7) !important}
table thead,thead.bg-slate-50{background:rgba(56,189,248,.10) !important}
tbody tr:hover{background:rgba(56,189,248,.06)}

/* ---- navbar / menus: the only blurred parts, and only on strong devices ---- */
.glass-nav{background:rgba(3,14,36,.72) !important;border-bottom:1px solid var(--g-border) !important;
  box-shadow:0 8px 28px rgba(2,10,30,.45),0 1px 0 rgba(125,211,252,.14) inset !important}
@media (hover:hover) and (min-width:1024px){
  .glass-nav{background:rgba(3,14,36,.60) !important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
}
#mobile-menu{background:rgba(3,14,36,.96) !important}
nav .group>div.absolute{background:rgba(5,22,52,.92) !important;border:1px solid var(--g-border) !important;box-shadow:var(--g-edge),var(--g-shadow) !important}
body>div.bg-slate-900{background:linear-gradient(90deg,rgba(6,28,64,.85),rgba(8,47,100,.7),rgba(6,28,64,.85)) !important;border-bottom:1px solid var(--g-border)}
footer{background:rgba(2,9,26,.55) !important;border-top:1px solid var(--g-border) !important}
footer .bg-slate-800{background:rgba(56,189,248,.10) !important;border:1px solid var(--g-border)}
footer .bg-slate-800:hover{background:rgba(56,189,248,.28) !important}
aside#sidebar{background:linear-gradient(180deg,rgba(6,24,56,.92),rgba(2,10,28,.95)) !important;border-right:1px solid var(--g-border)}
header.bg-white{background:rgba(5,20,48,.78) !important}

/* ---- buttons ---- */
a.bg-slate-900,button.bg-slate-900,button.bg-brand-600,a.bg-brand-600,button.bg-indigo-600,a.bg-indigo-600,.hover\:bg-brand-600:hover{
  background:linear-gradient(135deg,rgba(14,165,233,.60),rgba(37,99,235,.80)) !important;
  border:1px solid var(--g-border-hi) !important;color:#fff !important;box-shadow:var(--g-edge)}
a.bg-slate-900:hover,button.bg-slate-900:hover,button.hover\:bg-indigo-700:hover{background:linear-gradient(135deg,rgba(34,211,238,.8),rgba(37,99,235,.95)) !important;box-shadow:0 0 22px rgba(34,211,238,.45) !important}
.from-brand-600{--tw-gradient-from:#06b6d4 !important;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(6,182,212,0)) !important}
.to-violet-600,.to-violet-500,.hover\:to-violet-700:hover{--tw-gradient-to:#1d4ed8 !important}
.hover\:from-brand-700:hover{--tw-gradient-from:#22d3ee !important}
.from-slate-100{--tw-gradient-from:rgba(56,189,248,.22) !important;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(37,99,235,.10)) !important}
.to-slate-200{--tw-gradient-to:rgba(37,99,235,.14) !important}
.to-violet-600\/20{--tw-gradient-to:rgba(14,165,233,.22) !important}
.from-brand-600\/20{--tw-gradient-from:rgba(37,99,235,.28) !important}
.btn-3d{box-shadow:0 5px 0 #04264f,0 12px 16px -6px rgba(2,12,40,.7),0 0 16px rgba(34,211,238,.22) !important}
.btn-3d:hover{box-shadow:0 7px 0 #04264f,0 16px 20px -6px rgba(2,12,40,.75),0 0 24px rgba(34,211,238,.42) !important}
.btn-3d:active{box-shadow:0 1px 0 #04264f,0 3px 6px -2px rgba(2,12,40,.6) !important}
.bg-white.btn-3d,a.btn-3d.bg-white{background:rgba(255,255,255,.10) !important;color:#e8f6ff !important;border:1px solid var(--g-border-hi) !important}

/* ---- inputs ---- */
input,select,textarea{background:rgba(255,255,255,.06) !important;color:var(--g-text) !important;border:1px solid var(--g-border) !important}
input[type=checkbox],input[type=radio]{background:initial !important}
input::placeholder,textarea::placeholder{color:#7fa3c4 !important}
input:focus,select:focus,textarea:focus{border-color:var(--g-cyan) !important;box-shadow:0 0 0 3px rgba(56,189,248,.25) !important;outline:none}
select option{background:#06224a;color:#e8f6ff}
input[type=file]{color:#b3cde6 !important}

/* ---- cards / icons ---- */
.tilt-3d{box-shadow:var(--g-edge),var(--g-shadow) !important}
.tilt-3d:hover{box-shadow:var(--g-edge),0 26px 44px -16px rgba(14,165,233,.40),0 0 34px rgba(34,211,238,.18) !important;border-color:var(--g-border-hi) !important}
.icon-3d{box-shadow:0 6px 0 rgba(4,38,79,.6),0 14px 20px -8px rgba(14,165,233,.4) !important}
.tilt-3d .bg-slate-50{background:rgba(255,255,255,.03) !important}
.line-through{color:#6f93b3 !important}
.bg-slate-900:not(a):not(button):not(aside):not(body>div){background-color:rgba(3,14,36,.7) !important}
.bg-slate-950{background-color:rgba(2,8,23,.55) !important}
.a1-hero{border-bottom:1px solid var(--g-border)}
/* tap highlight off on mobile, we have our own effect */
a,button,input,select,textarea,label{-webkit-tap-highlight-color:transparent}