/* Bitakvim Diyet — Renk paleti & global stiller
   Brand: Teal (sage-mint, fresh herbs)  Neutral: Stone (warm)
   Accent: amber (carb), rose (fat/error), sky (water/info), purple (pro tier) */

* { -webkit-tap-highlight-color: transparent; }

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type="number"] { -moz-appearance: textfield; }

[x-cloak] { display: none !important; }

.pb-safe { padding-bottom: env(safe-area-inset-bottom); }
canvas { max-width: 100%; }
table a { text-decoration: none; }

/* Form focus — sports green */
input:focus, textarea:focus, select:focus {
    outline: none;
    border-color: rgb(5 150 105);
    box-shadow: 0 0 0 3px rgb(16 185 129 / 0.20);
}

@media (max-width: 640px) {
    input[type="text"], input[type="email"], input[type="password"],
    input[type="number"], input[type="date"], textarea, select {
        font-size: 16px !important;
    }
}

@media all and (display-mode: standalone) {
    body { overscroll-behavior-y: contain; }
}

nav.md\:hidden { padding-bottom: env(safe-area-inset-bottom); }

@supports (-webkit-touch-callout: none) {
    .pb-safe-bottom { padding-bottom: env(safe-area-inset-bottom); }
}

html { overscroll-behavior-y: contain; scroll-behavior: smooth; }
button:disabled { opacity: 0.7; cursor: not-allowed; }
button, a {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

/* Selection — teal */
::selection { background: #ccfbf1; color: #134e4a; }
.dark ::selection { background: #134e4a; color: #ccfbf1; }

/* Toast */
@keyframes toastSlide {
    from { transform: translateY(-20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
.toast { animation: toastSlide 0.3s cubic-bezier(0.16, 1, 0.3, 1); }
.dark .toast { box-shadow: 0 10px 25px rgba(0,0,0,0.5); }

/* ============================================
   Auth bg — light: mint cream, dark: deep teal stone
   ============================================ */
.auth-bg {
    background: linear-gradient(135deg, #ecfdf5 0%, #fafaf9 50%, #f0fdf4 100%);
}
.dark .auth-bg {
    background: linear-gradient(135deg, #022c22 0%, #18181b 60%, #09090b 100%);
}

/* Onboarding & landing hero gradient — dark */
.dark [class*="bg-gradient-to-br"][class*="from-brand-50"],
.dark [class*="bg-gradient-to-br"][class*="via-white"],
.dark section[class*="from-brand-50"] {
    background: linear-gradient(135deg, #042f2e 0%, #1c1917 50%, #0c0a09 100%) !important;
}

/* ============================================
   Dark mode global — stone neutral palette
   ============================================ */
html.dark { color-scheme: dark; }

/* Hem :not() hem açık type listesi — defensive override */
html.dark input,
html.dark textarea,
html.dark select,
html.dark input[type="text"],
html.dark input[type="email"],
html.dark input[type="password"],
html.dark input[type="number"],
html.dark input[type="date"],
html.dark input[type="time"],
html.dark input[type="search"],
html.dark input[type="tel"],
html.dark input[type="url"] {
    background-color: rgb(28 25 23) !important;  /* stone-900 */
    color: rgb(245 245 244) !important;           /* stone-100 */
    border-color: rgb(87 83 78) !important;       /* stone-600 */
    color-scheme: dark;
}
/* Checkbox/radio/submit/button hariç — onlar Tailwind/native */
html.dark input[type="checkbox"],
html.dark input[type="radio"],
html.dark input[type="submit"],
html.dark input[type="button"],
html.dark input[type="reset"] {
    background-color: initial !important;
    color: initial !important;
    border-color: initial !important;
}
html.dark input[type="date"]::-webkit-datetime-edit,
html.dark input[type="time"]::-webkit-datetime-edit { color: rgb(245 245 244); }
html.dark input::placeholder, html.dark textarea::placeholder { color: rgb(120 113 108); }

html.dark code {
    background-color: rgb(41 37 36) !important;
    color: rgb(231 229 228) !important;
}
html.dark hr { border-color: rgb(68 64 60); }
html.dark thead {
    background-color: rgb(41 37 36 / 0.5) !important;
    color: rgb(168 162 158);
}
html.dark table tbody tr { border-color: rgb(68 64 60) !important; }

html.dark input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1) brightness(0.85);
}

html.dark input:focus, html.dark textarea:focus, html.dark select:focus {
    border-color: rgb(52 211 153) !important;
    box-shadow: 0 0 0 3px rgb(16 185 129 / 0.30);
}

/* Modern dashboard utilities — Apple Fitness inspired */
.ring-progress {
    background: conic-gradient(currentColor var(--p, 0%), rgb(228 228 231 / 0.4) 0%);
    transition: --p 1.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@property --p {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%;
}
html.dark .ring-progress {
    background: conic-gradient(currentColor var(--p, 0%), rgb(63 63 70 / 0.5) 0%);
}

/* Spring overshoot button feedback */
.btn-spring {
    transition: transform 0.15s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s;
}
.btn-spring:active { transform: scale(0.96); }
.btn-spring:hover { transform: translateY(-1px); }

/* Counter animation helper class */
@keyframes count-up {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.count-in { animation: count-up 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both; }

.dark .fixed.bg-white\/95 {
    background-color: rgb(28 25 23 / 0.95) !important;
}
.dark header.sticky.bg-white\/85 {
    background-color: rgb(28 25 23 / 0.85);
    border-color: rgb(68 64 60);
}

/* Prose — light + dark */
.prose h2 { color: #1c1917; }
.prose strong { color: #1c1917; font-weight: 600; }
.prose ul { padding-left: 1.5rem; }
.prose code { background: #f5f5f4; padding: 0.125rem 0.375rem; border-radius: 0.25rem; font-size: 0.875em; }

.dark .prose {
    --tw-prose-body: rgb(231 229 228);
    --tw-prose-headings: rgb(255 255 255);
    --tw-prose-bold: rgb(255 255 255);
    --tw-prose-bullets: rgb(120 113 108);
    --tw-prose-code: rgb(231 229 228);
    --tw-prose-borders: rgb(68 64 60);
}
