/* Design Tokens */
:root{--color-bg:#f8f9fa;--color-surface:#ffffff;--color-surface-alt:#f1f3f5;--color-text:#212529;--color-text-muted:#6c757d;--color-border:#dee2e6;--color-link:#0d6efd;--color-primary:#0d6efd;--color-primary-hover:#0b5ed7;--color-danger:#dc3545;--color-warning:#ffc107;--color-success:#198754;--color-info:#0dcaf0;--radius-sm:4px;--radius:6px;--shadow-sm:0 1px 2px rgba(0,0,0,.06);--transition:150ms ease;--table-stripe:#f2f4f6}
body.dark-mode{--color-bg:#121212;--color-surface:#1d1f21;--color-surface-alt:#1e1e1e;--color-text:#f5f5f5;--color-text-muted:#b0b0b0;--color-border:#333;--color-link:#4da3ff;--color-primary:#2563eb;--color-primary-hover:#1d4ed8;--table-stripe:#1a1a1a}

/* Base */
body{-webkit-font-smoothing:antialiased;background:var(--color-bg);color:var(--color-text)}
.navbar-brand{font-weight:600}

/* Generic surfaces */
.card:not(.gradient-card):not([style*="background:"]),.calendar-wrapper,.token-surface{background:var(--color-surface)!important;color:var(--color-text);border-color:var(--color-border)!important}
body.dark-mode .card,body.dark-mode .calendar-wrapper{box-shadow:none}

.table{background:var(--color-surface)!important}
.table thead th{background:var(--color-surface-alt)!important}
body.dark-mode .table thead th{background:var(--color-surface-alt)!important}
.table-striped>tbody>tr:nth-of-type(odd){--bs-table-accent-bg:var(--table-stripe)!important}

/* Forms */
.form-control,.form-select{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}
body.dark-mode .form-control:focus,body.dark-mode .form-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 .15rem rgba(77,163,255,.25)}

/* Buttons */
.btn-primary{background:var(--color-primary);border-color:var(--color-primary)}
.btn-primary:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}
.btn-outline-primary{color:var(--color-primary);border-color:var(--color-primary)}
body.dark-mode .btn-outline-primary{color:var(--color-link);border-color:var(--color-link)}
body.dark-mode .btn-primary{background:var(--color-primary);border-color:var(--color-primary)}

/* Links */
a{color:var(--color-link)}
body.dark-mode a{color:var(--color-link)}

/* Badges & misc surfaces in dark */
body.dark-mode .badge.bg-light{background:#333!important;color:var(--color-text)}

/* Calendar cells */
.calendar-cell{transition:background var(--transition),border-color var(--transition)}
.calendar-cell.bg-light-subtle{background:var(--color-surface-alt)!important}
body.dark-mode .calendar-cell.bg-light-subtle{background:#222!important}
body.dark-mode .calendar-cell.bg-warning-subtle{background:#4d3b00!important;color:#fff}

/* Utility */
.shadow-sm{box-shadow:var(--shadow-sm)!important}

/* Compact planning adjustments */
.planning-compact .calendar-wrapper .calendar-cell{min-height:70px!important;padding:2px!important;font-size:.75rem}
.planning-compact table.table td, .planning-compact table.table th{padding:.25rem .35rem!important;font-size:.7rem}
.planning-legend .badge{min-width:70px}

/* Planning interface enhancements */
#planningForm .card{transition:all 0.3s ease}
#planningForm .card:hover{box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.form-check-input:checked{background-color:var(--color-primary);border-color:var(--color-primary)}
.planning-mode-section{border-left:3px solid var(--color-border);transition:border-color 0.3s ease}
.planning-mode-section.active{border-left-color:var(--color-primary)}
body.dark-mode .planning-mode-section.active{border-left-color:var(--color-link)}

/* Session selection cards */
.session-card{transition:all 0.2s ease}
.session-card:hover{transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,0.1)}
.session-card .form-check-input:checked{transform:scale(1.1)}

/* Legacy dark-mode overrides kept minimal for Bootstrap structural classes */
body.dark-mode .navbar,body.dark-mode .bg-light,body.dark-mode .bg-white{background:var(--color-surface-alt)!important;color:var(--color-text)}
body.dark-mode .dropdown-menu{background:var(--color-surface-alt);border-color:var(--color-border)}
body.dark-mode .dropdown-item{color:var(--color-text)}
body.dark-mode .dropdown-item:hover{background:#2a2a2a;color:#fff}
.dark-mode a{color:#4da3ff}
.dark-mode .btn-primary{background:#2563eb;border-color:#1d4ed8}
.dark-mode .btn-outline-primary{color:#4da3ff;border-color:#4da3ff}
.dark-mode .table thead th{background:#2a2d31}
/* Modern dashboard enhancements */
.app-dashboard .gradient-card{background:linear-gradient(135deg,#0d6efd 0%,#6610f2 100%);color:#fff;position:relative;overflow:hidden}
.app-dashboard .gradient-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.25),transparent 60%);pointer-events:none}
.bg-primary-soft{background:rgba(13,110,253,.15)!important}
body.dark-mode .bg-primary-soft{background:rgba(37,99,235,.25)!important}
.app-dashboard h6{letter-spacing:.5px}
.app-dashboard canvas{width:100%!important}
.card{border-radius:12px}
.btn{border-radius:8px}
.form-control,.form-select{border-radius:8px}
@media (max-width: 991.98px){.app-dashboard .gradient-card{min-height:180px}}
/* Utility tiny buttons */
.btn-xs{--bs-btn-padding-y:.15rem;--bs-btn-padding-x:.35rem;--bs-btn-font-size:.65rem}
.timeline-notes{max-height:300px;overflow:auto}
.timeline-notes .timeline-item:last-child{border-bottom:0}
body.dark-mode .gradient-card{background:linear-gradient(135deg,#1d4ed8 0%,#7e22ce 100%)}

/* Meal type badges styles */
.meal-type-badge {
  display: inline-block;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  font-weight: 600;
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}

.meal-type-badge.petit-dejeuner {
  background: linear-gradient(135deg, #ff9a56 0%, #ffad56 100%);
  color: white;
}

.meal-type-badge.collation {
  background: linear-gradient(135deg, #4ecdc4 0%, #44a08d 100%);
  color: white;
}

.meal-type-badge.dejeuner {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.meal-type-badge.snack {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  color: white;
}

.meal-type-badge.diner {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  color: white;
}

.meal-type-badge.snack-soir {
  background: linear-gradient(135deg, #a18cd1 0%, #fbc2eb 100%);
  color: white;
}

/* 5 column grid for metric cards */
.col-md-2-4 {
  flex: 0 0 auto;
  width: 20%;
}

@media (max-width: 767.98px) {
  .col-md-2-4 {
    width: 50%;
  }
}

/* Metric cards styling */
.metric-card {
  border: none;
  padding: 1.25rem;
  text-align: center;
  position: relative;
  overflow: hidden;
  min-height: 120px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.metric-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: radial-gradient(circle at 70% 20%, rgba(255,255,255,0.2), transparent 60%);
  pointer-events: none;
}

.metric-value {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 0.25rem;
}

.metric-label {
  font-size: 0.875rem;
  font-weight: 500;
  opacity: 0.9;
}