/* =====================================================================
   VELOX — UNIFIED DESIGN SYSTEM v2  (velox-theme.css)
   TEK marka dili: sade · modern · minimal · soft · sans · oval · gölgesiz
   Marka rengi: #0e432d
   ---------------------------------------------------------------------
   Tüm sayfalarda (anasayfa · admin · manager · qr · content · legal)
   Tailwind CDN'inden SONRA yüklenir. Her sayfanin kendi renk/golge/gradient
   dilini !important ile EZER ve tamamini ayni gorunume getirir.
   Kod mantigina, forma, linke, JS'e DOKUNMAZ — yalnizca gorunum.
   ===================================================================== */

:root {
  --v-brand:        #0e432d;
  --v-brand-hover:  #0b3624;
  --v-brand-50:     #eef5f1;
  --v-brand-100:    #dcece3;
  --v-brand-200:    #c2ddce;

  --v-bg:      #f6f8f7;
  --v-panel:   #f1f4f2;
  --v-card:    #ffffff;
  --v-border:  #e6ebe8;

  --v-ink:     #12211b;
  --v-muted:   #5b6b64;
  --v-faint:   #8a978f;

  --v-shadow-xs: 0 1px 2px rgba(6,26,18,.05);
  --v-shadow-sm: 0 2px 10px -6px rgba(6,26,18,.12);
  --v-shadow:    0 10px 30px -16px rgba(6,26,18,.18);

  --v-radius-sm: .625rem;
  --v-radius:    .875rem;
  --v-radius-lg: 1.25rem;

  --v-container: 80rem;
}

/* 1) TIPOGRAFI — tek sans font, kucuk & rafine puntolar */
html { font-size: 14.5px; -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
@media (min-width: 1536px){ html { font-size: 15px; } }

body, input, select, textarea, button, .ql-container {
  font-family: 'General Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body { color: var(--v-ink); }

.font-display { font-family: 'General Sans', sans-serif !important; font-weight: 600 !important; letter-spacing: -0.015em !important; }
h1, h2, h3 { letter-spacing: -0.015em; }
.font-extrabold, .font-black { font-weight: 700 !important; }

.text-6xl { font-size: 2.75rem !important; line-height: 1.05 !important; }
.text-5xl { font-size: 2.25rem !important; line-height: 1.08 !important; }
.text-4xl { font-size: 1.9rem  !important; line-height: 1.1  !important; }
@media (max-width: 640px){
  .text-6xl { font-size: 2.1rem !important; }
  .text-5xl { font-size: 1.8rem !important; }
  .text-4xl { font-size: 1.6rem !important; }
}

/* 2) ZEMIN — dekoratif mesh/orb/gradient/krem body -> tek notr */
body {
  background-color: var(--v-bg) !important;
  background-image: none !important;
  background-attachment: initial !important;
}
.bg-cream-50, .bg-\[\#FAFAFA\], .bg-\[\#faf8f3\], .bg-\[\#f7f8f7\], .bg-\[\#f5f7f6\] { background-color: var(--v-bg) !important; }
.bg-cream-100 { background-color: var(--v-panel) !important; }
.glow-orb, .grid-pattern { opacity: .3 !important; }
.blur-3xl, .blur-2xl, .blur-\[100px\], .blur-\[80px\], .blur-\[60px\] { opacity: .2 !important; }
[class*="bg-mesh"], .bg-mesh { background-image: none !important; }

/* 3) MARKA RENGI — her yerde TEK yesil (#0e432d) */
.bg-brand-50,.bg-emerald-50   { background-color: var(--v-brand-50)  !important; }
.bg-brand-100,.bg-emerald-100 { background-color: var(--v-brand-100) !important; }
.border-brand-100,.border-emerald-100 { border-color: var(--v-brand-100) !important; }
.border-brand-200,.border-emerald-200 { border-color: var(--v-brand-200) !important; }

.bg-brand-400,.bg-brand-500,.bg-brand-600,.bg-brand-700,.bg-brand-800,.bg-brand-900,.bg-brand-950,
.bg-emerald-500,.bg-emerald-600,.bg-emerald-700,.bg-emerald-800,.bg-emerald-900
{ background-color: var(--v-brand) !important; }

.hover\:bg-brand-500:hover,.hover\:bg-brand-600:hover,.hover\:bg-brand-700:hover,.hover\:bg-brand-800:hover,.hover\:bg-brand-900:hover,.hover\:bg-brand-950:hover,
.hover\:bg-emerald-600:hover,.hover\:bg-emerald-700:hover
{ background-color: var(--v-brand-hover) !important; }

.text-brand-500,.text-brand-600,.text-brand-700,.text-brand-800,.text-brand-900,
.text-emerald-500,.text-emerald-600,.text-emerald-700,.text-emerald-800,.text-emerald-900
{ color: var(--v-brand) !important; }
/* brand-400: koyu zeminlerde de gorunen ACIK yesil aksan ( or. ~2m, roller, ikonlar) */
.text-brand-400,.text-emerald-400 { color: #4a9e73 !important; }
.text-brand-300,.text-emerald-300 { color: #7cbf9c !important; }
.hover\:text-brand-500:hover,.hover\:text-brand-600:hover,.hover\:text-brand-700:hover,
.hover\:text-emerald-600:hover,.group:hover .group-hover\:text-brand-600
{ color: var(--v-brand) !important; }
.text-brand-100,.text-emerald-100 { color: var(--v-brand-100) !important; }
.text-brand-200,.text-emerald-200 { color: var(--v-brand-200) !important; }

.border-brand-500,.border-brand-600,.border-emerald-500,.border-emerald-600 { border-color: var(--v-brand) !important; }
.hover\:border-brand-500:hover,.focus\:border-brand-500:focus,.focus\:border-emerald-500:focus { border-color: var(--v-brand) !important; }
.ring-brand-500,.focus\:ring-brand-500:focus,.focus\:ring-emerald-500:focus { --tw-ring-color: var(--v-brand) !important; }
.accent-brand-600,.accent-emerald-600 { accent-color: var(--v-brand) !important; }

.from-brand-400,.from-brand-500,.from-brand-600,.from-emerald-500,.from-emerald-600 { --tw-gradient-from: var(--v-brand) var(--tw-gradient-from-position) !important; }
.to-brand-400,.to-brand-500,.to-brand-600,.to-emerald-600,.to-emerald-700 { --tw-gradient-to: var(--v-brand-hover) var(--tw-gradient-to-position) !important; }
.via-brand-400,.via-brand-500,.via-brand-600 { --tw-gradient-via: var(--v-brand) !important; }

.text-gold-300,.text-gold-400,.text-gold-500,.text-gold-600 { color: var(--v-brand) !important; }
.bg-gold-50,.bg-gold-100 { background-color: var(--v-brand-50) !important; }
.bg-gold-400,.bg-gold-500,.bg-gold-600 { background-color: var(--v-brand) !important; }
.border-gold-200,.border-gold-300 { border-color: var(--v-border) !important; }

::selection { background: var(--v-brand) !important; color: #fff !important; }

/* 4) GOLGE — agir golge & renkli glow -> minimal/soft */
.shadow-sm { box-shadow: var(--v-shadow-xs) !important; }
.shadow, .shadow-md { box-shadow: var(--v-shadow-sm) !important; }
.shadow-card { box-shadow: none !important; }
.shadow-lg, .shadow-xl, .shadow-2xl, .shadow-card-hover { box-shadow: var(--v-shadow) !important; }
.shadow-glow, .shadow-premium, .shadow-inner,
[class*="shadow-brand"], [class*="shadow-emerald"], [class*="shadow-green"], [class*="shadow-gold"]
{ box-shadow: none !important; }

/* 5) KOSELER — tek, oval & tutarli */
.rounded-\[3rem\], .rounded-\[2\.5rem\], .rounded-\[2rem\], .rounded-3xl { border-radius: var(--v-radius-lg) !important; }
@media (max-width: 640px){
  .rounded-\[3rem\], .rounded-\[2\.5rem\], .rounded-\[2rem\], .rounded-3xl, .rounded-2xl { border-radius: 1rem !important; }
  .sm\:rounded-\[2\.5rem\] { border-radius: 0 !important; }
}

/* 6) KART / PANEL — golge yerine INCE HAT */
.bento-card, .soft-card, .stat-card,
.bg-white.rounded-2xl, .bg-white.rounded-xl, .bg-white.rounded-3xl,
.bg-white.rounded-\[2rem\], .bg-white.rounded-\[2\.5rem\], .bg-white.rounded-\[1\.5rem\] {
  background: var(--v-card) !important;
  border: 1px solid var(--v-border) !important;
  box-shadow: var(--v-shadow-xs) !important;
}
.bento-card:hover, .stat-card:hover {
  border-color: var(--v-brand) !important;
  transform: none !important;
  box-shadow: var(--v-shadow-sm) !important;
}
button.bg-white.rounded-full, a.bg-white.rounded-full { border: 1px solid var(--v-border) !important; box-shadow: none !important; }

/* 7) STICKY NAV / TOPBAR — tek cam & ince alt hat */
.glass-sticky,
nav.bg-white\/95, .bg-white\/95.backdrop-blur-xl, .bg-white\/85.backdrop-blur-xl, .bg-white\/80.backdrop-blur-md {
  background: rgba(246,248,247,.85) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-color: var(--v-border) !important;
  box-shadow: none !important;
}

/* 8) ADMIN — koyu yesil markali sidebar, premium'u duzle */
aside.bg-emerald-500, header.bg-emerald-500 { background: var(--v-brand) !important; box-shadow: none !important; }
.emerald-accent { background: var(--v-brand) !important; color: #fff !important; }
.sidebar-link.active { background: rgba(255,255,255,.12) !important; color: #fff !important; box-shadow: none !important; }
.sidebar-link.active .icon-wrap { background: rgba(255,255,255,.18) !important; color: #fff !important; }
.sidebar-link:not(.active):hover .icon-wrap { background: rgba(255,255,255,.12) !important; color: #fff !important; }
.stat-card { background: var(--v-card) !important; }
.ql-toolbar { background: var(--v-bg) !important; border: 1px solid var(--v-border) !important; border-bottom: none !important; border-radius: var(--v-radius) var(--v-radius) 0 0 !important; }
.ql-container { border: 1px solid var(--v-border) !important; border-radius: 0 0 var(--v-radius) var(--v-radius) !important; }

/* 9) FORM — tutarli, yumusak, mobil dostu (iOS zoom onleme) */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select, textarea, .field {
  border-radius: var(--v-radius) !important;
  border-color: var(--v-border) !important;
}
input:focus, select:focus, textarea:focus, .field:focus {
  border-color: var(--v-brand) !important;
  box-shadow: 0 0 0 3px rgba(14,67,45,.10) !important;
  outline: none !important;
}
@media (max-width: 640px){
  input:not([type="checkbox"]):not([type="radio"]), select, textarea, .field { font-size: 16px !important; }
}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--v-brand) !important; outline-offset: 2px !important;
}

/* 10) YARDIMCI + YAPISAL */
.velox-container { max-width: var(--v-container); margin-inline: auto; padding-inline: 1.5rem; }
@media (max-width: 640px){ .velox-container { padding-inline: 1rem; } }

html, body { max-width: 100%; overflow-x: hidden; }
img, svg, video, canvas { max-width: 100%; height: auto; }

[x-cloak] { display: none !important; }
.glass-sticky { border-bottom: 1px solid var(--v-border); }

.skip-link {
  position: absolute; top: -48px; left: 8px; background: var(--v-brand); color: #fff;
  padding: 10px 18px; border-radius: 0 0 12px 12px; z-index: 9999;
  text-decoration: none; font-weight: 600; font-size: 14px; transition: top .2s;
}
.skip-link:focus { top: 0; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #d9e0dc; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #c2ccc6; }