/* vlastnihosting.cz – design system overrides on top of Tailwind CDN */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Manrope:wght@300;400;500;600;700;800&display=swap');

:root{
  --bg: #F8FAFC;
  --surface: #FFFFFF;
  --fg: #0F172A;
  --muted: #475569;
  --border: #E2E8F0;
  --secondary: #F1F5F9;
}
:root.dark{
  --bg: #020617;
  --surface: #0F172A;
  --fg: #F8FAFC;
  --muted: #94A3B8;
  --border: #1E293B;
  --secondary: #0B1220;
}
html, body { background: var(--bg); color: var(--fg); }
body{
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,sans-serif;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
h1,h2,h3,h4,h5,h6,.font-display{font-family:'Outfit',sans-serif;letter-spacing:-0.02em;}

::selection{background:rgba(0,229,255,.3);color:var(--fg);}

/* helpers */
.bg-background{background:var(--bg);}
.text-foreground{color:var(--fg);}
.text-muted-foreground{color:var(--muted);}
.bg-card{background:var(--surface);}
.bg-secondary{background:var(--secondary);}
.bg-secondary\/60{background:color-mix(in srgb, var(--secondary) 60%, transparent);}
.bg-secondary\/30{background:color-mix(in srgb, var(--secondary) 30%, transparent);}
.bg-secondary\/20{background:color-mix(in srgb, var(--secondary) 20%, transparent);}
.bg-secondary\/80{background:color-mix(in srgb, var(--secondary) 80%, transparent);}
.border-border{border-color:var(--border);}
.bg-foreground{background:var(--fg);}
.text-background{color:var(--bg);}
.bg-foreground\/90:hover, .hover\:bg-foreground\/90:hover{background:color-mix(in srgb, var(--fg) 90%, transparent);}
.bg-foreground\/10{background:color-mix(in srgb, var(--fg) 10%, transparent);}

/* glass */
.glass-light{
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid rgba(226,232,240,.8);
}
:root.dark .glass-light{background:rgba(15,23,42,.6);border:1px solid rgba(30,41,59,.8);}
.glass-strong{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border:1px solid rgba(226,232,240,.9);
}
:root.dark .glass-strong{background:rgba(2,6,23,.85);border:1px solid rgba(30,41,59,.9);}

/* gradients */
.text-gradient-brand{
  background:linear-gradient(135deg,#00E5FF 0%,#3B82F6 50%,#8B5CF6 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

.bg-grid-light{
  background-image:linear-gradient(to right,rgba(15,23,42,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(15,23,42,.05) 1px,transparent 1px);
  background-size:48px 48px;
}
:root.dark .bg-grid-light{
  background-image:linear-gradient(to right,rgba(148,163,184,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(148,163,184,.07) 1px,transparent 1px);
}
.glow-cyan{box-shadow:0 0 0 1px rgba(0,229,255,.2),0 8px 32px -8px rgba(0,229,255,.45);}
.noise-overlay{position:relative;}
.noise-overlay::after{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.scrollbar-hide::-webkit-scrollbar{display:none;}
.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none;}

@keyframes fadeUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 rgba(0,229,255,.4);}50%{box-shadow:0 0 0 12px rgba(0,229,255,0);}}
.animate-fade-up{animation:fadeUp .6s ease-out both;}
.animate-pulse-glow{animation:pulseGlow 2.4s ease-out infinite;}

/* prose for article */
.prose{color:var(--fg);}
.prose p{line-height:1.75;margin:0 0 1rem;}
.prose h2{font-family:'Outfit';font-weight:900;font-size:1.5rem;margin:2rem 0 1rem;letter-spacing:-.02em;}
.prose h3{font-family:'Outfit';font-weight:800;font-size:1.25rem;margin:1.5rem 0 .75rem;}
.prose ul{padding-left:1.25rem;list-style:disc;margin:0 0 1rem;}
.prose ul li::marker{color:#06B6D4;}
.prose img{border-radius:1rem;margin:1rem 0;}
.prose a{color:#0891B2;text-decoration:underline;text-underline-offset:3px;}
:root.dark .prose a{color:#22D3EE;}
.prose blockquote{border-left:3px solid #06B6D4;padding-left:1rem;color:var(--muted);margin:1rem 0;}

/* admin sidebar */
.admin-link{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:.6rem;color:var(--muted);font-weight:600;font-size:.9rem;}
.admin-link:hover{background:var(--secondary);color:var(--fg);}
.admin-link.active{background:var(--fg);color:var(--bg);}

/* form */
.input, .textarea, .select{
  width:100%;background:var(--surface);border:1px solid var(--border);border-radius:.6rem;
  padding:.55rem .75rem;font-size:.9rem;color:var(--fg);transition:border-color .15s;
}
.input:focus, .textarea:focus, .select:focus{outline:none;border-color:#06B6D4;box-shadow:0 0 0 3px rgba(6,182,212,.15);}
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem .9rem;border-radius:.6rem;font-weight:700;font-size:.85rem;cursor:pointer;border:1px solid transparent;}
.btn-primary{background:var(--fg);color:var(--bg);}
.btn-primary:hover{opacity:.9;}
.btn-outline{background:transparent;border-color:var(--border);color:var(--fg);}
.btn-outline:hover{background:var(--secondary);}
.btn-danger{background:#dc2626;color:#fff;}
.btn-danger:hover{background:#b91c1c;}
.btn-ai{background:linear-gradient(135deg,#00E5FF 0%,#8B5CF6 100%);color:#fff;}

.flash{padding:.75rem 1rem;border-radius:.6rem;margin-bottom:1rem;font-weight:600;font-size:.9rem;}
.flash-success{background:rgba(16,185,129,.12);color:#059669;border:1px solid rgba(16,185,129,.3);}
.flash-error{background:rgba(239,68,68,.12);color:#dc2626;border:1px solid rgba(239,68,68,.3);}
.flash-info{background:rgba(6,182,212,.12);color:#0891b2;border:1px solid rgba(6,182,212,.3);}
