/* Basic Theming */
:root {
    --kyk-primary: #1E3A8A;
    --kyk-secondary: #3B82F6;
    --kyk-accent: #F59E0B;
    --background: #F8FAFC;
    --card: #FFFFFF;
    --border: #E2E8F0;
    --text-primary: #1E293B;
    --text-secondary: #64748B;
    
    /* Meal-specific themes */
    --morning-primary: #FF8A65;
    --morning-secondary: #FFCC02;
    --evening-primary: #1E3A8A;
    --evening-secondary: #3B82F6;
}

[data-theme="dark"] {
    --kyk-primary: #3B82F6;
    --kyk-secondary: #1E3A8A;
    --kyk-accent: #F59E0B;
    --background: #0A0A0A;
    --card: #2A2A2A; /* Using darkCard color from theme for better visibility */
    --border: #3A3A3A;
    --text-primary: #F5F5F5;
    --text-secondary: #B0B0B0;

    --morning-primary: #FF8A65; /* Orange has enough contrast on dark */
    --evening-primary: #3B82F6; /* Use a brighter blue for dark mode */
}

body {
    background-color: var(--background);
    color: var(--text-primary);
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Component Styles */
.bg-card { background-color: var(--card); }
.border-border { border-color: var(--border); }
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.bg-secondary { background-color: var(--kyk-secondary); }
.hover\:bg-secondary:hover { background-color: var(--kyk-secondary); }
.focus\:border-accent:focus { border-color: var(--kyk-accent); }
.focus\:ring-accent:focus { --tw-ring-color: var(--kyk-accent); }

.btn {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    font-weight: 600;
    transition: all 0.2s ease;
    border: 2px solid var(--border);
}

.meal-type-btn {
    background-color: var(--card);
}

/* --- Meal Type Button Theming (Final Fix) --- */

/* Default State - Use !important to override theme-wide styles */
.meal-type-btn[data-meal-type="Breakfast"] { border-color: var(--morning-primary) !important; }
.meal-type-btn[data-meal-type="Breakfast"] .font-semibold { color: var(--morning-primary) !important; }
.meal-type-btn[data-meal-type="Breakfast"] .meal-subtitle { color: var(--text-secondary) !important; }

.meal-type-btn[data-meal-type="Dinner"] { border-color: var(--evening-primary) !important; }
.meal-type-btn[data-meal-type="Dinner"] .font-semibold { color: var(--evening-primary) !important; }
.meal-type-btn[data-meal-type="Dinner"] .meal-subtitle { color: var(--text-secondary) !important; }

/* Active State - This will override the default state for the active button */
[data-meal-theme='morning'] .meal-type-btn[data-meal-type="Breakfast"] {
    background-color: var(--morning-primary) !important;
    border-color: var(--morning-primary) !important;
}

[data-meal-theme='evening'] .meal-type-btn[data-meal-type="Dinner"] {
    background-color: var(--evening-primary) !important;
    border-color: var(--evening-primary) !important;
}

/* Ensure text is white on active buttons */
[data-meal-theme='morning'] .meal-type-btn[data-meal-type="Breakfast"] span,
[data-meal-theme='evening'] .meal-type-btn[data-meal-type="Dinner"] span {
    color: white !important;
}


.hide-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.hide-scrollbar::-webkit-scrollbar {
    display: none; /* Chrome, Safari, and Opera */
}

/* Date Strip Customization */
.date-strip-item {
    background-color: #FFFFFF; /* Explicitly white for light mode */
    border: 1px solid var(--border);
    color: var(--text-primary);
}

[data-theme="dark"] .date-strip-item {
    background-color: #2A2A2A; /* Explicitly dark gray for dark mode */
}

[data-meal-theme='morning'] .date-strip-item.selected {
    background-color: var(--morning-primary);
    border-color: var(--morning-primary);
    color: white;
}
[data-meal-theme='evening'] .date-strip-item.selected {
    background-color: var(--evening-primary);
    border-color: var(--evening-primary);
    color: white;
}

/* Meal Type Button Active States */
[data-meal-theme='morning'] .meal-type-btn[data-meal-type="Breakfast"] {
    background-color: var(--kyk-accent);
    color: white;
    border-color: var(--kyk-accent);
}

[data-meal-theme='evening'] .meal-type-btn[data-meal-type="Dinner"] {
    background-color: var(--evening-primary);
    color: white;
    border-color: var(--evening-primary);
}

/* Make sure the text inside the active dinner button is readable */
[data-meal-theme='evening'] .meal-type-btn[data-meal-type="Dinner"] span {
    color: white;
}


/* Icon Color Theming for Date Navigation */
[data-meal-theme='morning'] #prevDateBtn i,
[data-meal-theme='morning'] #nextDateBtn i {
    color: var(--morning-primary);
}

[data-meal-theme='evening'] #prevDateBtn i,
[data-meal-theme='evening'] #nextDateBtn i {
    color: var(--evening-primary);
}

/* Date Display Text Color Theming */
[data-meal-theme='morning'] #date-display-trigger .text-primary {
    color: var(--morning-primary);
}

[data-meal-theme='evening'] #date-display-trigger .text-primary {
    color: var(--evening-primary);
}

/* Custom focus styles for accessibility */
input:focus, select:focus, button:focus {
  outline: 2px solid #1e40af;
  outline-offset: 2px;
}

/* Animation for cards and alerts */
.animate-fade-in {
  animation: fadeIn 0.5s ease-in;
}

@keyframes fadeIn {
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Smooth transitions for interactive elements */
input, select, button {
  transition: all 0.2s ease-in-out;
}

/* Font stack for modern typography */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

/* Responsive adjustments */
@media (max-width: 640px) {
  .sm\:col-span-2 {
    grid-column: span 1 / span 1;
  }
  .sm\:grid-cols-2 {
    grid-template-columns: 1fr;
  }
}

/* Skeleton loader animation */
.animate-pulse {
  animation: pulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Karanlık temada flatpickr günleri okunur olsun */
.dark .flatpickr-day {
  color: #e5e7eb !important; /* Tailwind gray-200 */
}
.dark .flatpickr-day.selected,
.dark .flatpickr-day.today {
  color: #fff !important;
  background: #2563eb !important; /* Tailwind blue-600 */
}

/* Karanlık temada custom date strip için */
.dark .date-strip-item:not(.selected) {
  color: #e5e7eb !important;
}

/* Koyu temada gri yazılar beyaz olsun */
.dark .text-gray-500,
.dark .text-gray-600,
.dark .text-secondary {
  color: #fff !important;
}

/* Karanlık temada date picker ve custom date strip için unselected günler daha koyu arka plan ve beyaz yazı */
.dark .flatpickr-day,
.dark .date-strip-item:not(.selected) {
  background: #23272f !important;
  color: #fff !important;
}

/* Navbar link and action icon transitions to prevent layout shift */
.nav-link, .nav-action-icon {
    transition: all 0.3s ease-in-out;
}

.nav-link span, .nav-action-icon span {
    transition: all 0.3s ease-in-out;
}