@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600;9..40,700&family=DM+Mono:wght@400;500&family=Poppins:wght@600;700&display=swap');

:root {
  --font-sans:    'DM Sans', system-ui, sans-serif;
  --font-mono:    'DM Mono', 'Fira Code', monospace;

  --text-xs:   0.70rem;
  --text-sm:   0.813rem;
  --text-base: 0.938rem;
  --text-md:   1.063rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  1.875rem;
  --text-3xl:  2.5rem;

  --weight-light:    300;
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  --radius-xs:   4px;  --radius-sm:   6px;
  --radius-md:   10px; --radius-lg:   14px;
  --radius-xl:   20px; --radius-2xl:  28px;
  --radius-full: 9999px;

  --space-1:4px;   --space-2:8px;   --space-3:12px;
  --space-4:16px;  --space-5:20px;  --space-6:24px;
  --space-8:32px;  --space-10:40px; --space-12:48px;

  --ease-out:   cubic-bezier(0.16,1,0.3,1);
  --ease-in:    cubic-bezier(0.4,0,1,1);
  --ease-inout: cubic-bezier(0.4,0,0.2,1);
  --duration-fast:   120ms;
  --duration-normal: 200ms;
  --duration-slow:   350ms;

  /* DARK — Nebula Azul */
  --page-bg:   #080d1a;
  --surface-0: #060a14;
  --surface-1: #0d1830;
  --surface-2: #142048;
  --surface-3: #1a2860;
  --surface-4: #203070;

  --ambient-bg:
    radial-gradient(ellipse 90% 60% at 50% -10%, rgba(30,80,220,0.55) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 10% 80%,  rgba(10,40,160,0.40) 0%, transparent 50%),
    radial-gradient(ellipse 50% 35% at 90% 70%,  rgba(0,180,255,0.12) 0%, transparent 50%),
    radial-gradient(ellipse 30% 20% at 80% 20%,  rgba(230,57,70,0.07) 0%, transparent 50%);

  --glass-bg:           rgba(20,50,140,0.22);
  --glass-bg-hover:     rgba(30,65,165,0.30);
  --glass-bg-active:    rgba(40,80,185,0.38);
  --glass-bg-strong:    rgba(15,40,120,0.35);
  --glass-border:       rgba(80,140,255,0.18);
  --glass-border-hover: rgba(100,160,255,0.28);
  --glass-border-strong:rgba(120,180,255,0.35);
  --glass-blur:    blur(18px);
  --glass-blur-sm: blur(9px);
  --glass-blur-lg: blur(30px);
  --glass-blur-xl: blur(44px);
  --glass-shadow:    0 4px 24px rgba(0,10,60,0.45), inset 0 1px 0 rgba(120,180,255,0.08);
  --glass-shadow-lg: 0 8px 48px rgba(0,10,60,0.60), inset 0 1px 0 rgba(120,180,255,0.10);
  --glass-shadow-xl: 0 20px 60px rgba(0,10,60,0.75), inset 0 1px 0 rgba(120,180,255,0.12);

  --accent:        #e63946;
  --accent-hover:  #ff4f5c;
  --accent-active: #c42d39;
  --accent-muted:  rgba(230,57,70,0.14);
  --accent-glow:   0 0 20px rgba(230,57,70,0.40), 0 0 40px rgba(230,57,70,0.15);
  --accent-border: rgba(230,57,70,0.35);

  --success:        #38d4b8;
  --success-bg:     rgba(30,210,170,0.12);
  --success-border: rgba(30,210,170,0.28);
  --warning:        #faaa1e;
  --warning-bg:     rgba(250,170,30,0.12);
  --warning-border: rgba(250,170,30,0.28);
  --danger:         #ff6b75;
  --danger-bg:      rgba(230,57,70,0.12);
  --danger-border:  rgba(230,57,70,0.30);
  --info:           #70b4ff;
  --info-bg:        rgba(80,160,255,0.12);
  --info-border:    rgba(80,160,255,0.28);

  --text-primary:   #e8f2ff;
  --text-secondary: rgba(180,215,255,0.65);
  --text-tertiary:  rgba(140,185,255,0.38);
  --text-disabled:  rgba(100,150,220,0.25);
  --text-accent:    #ff6b75;
  --text-on-accent: #ffffff;

  --border-subtle:  rgba(60,110,220,0.12);
  --border-default: rgba(80,140,255,0.18);
  --border-strong:  rgba(100,160,255,0.28);
  --border-accent:  rgba(230,57,70,0.38);

  --scrollbar-track:       rgba(10,30,100,0.15);
  --scrollbar-thumb:       rgba(80,140,255,0.18);
  --scrollbar-thumb-hover: rgba(100,160,255,0.30);
}

/* LIGHT — Botanical Garden */
body.light {
  --page-bg:   #f5f3ed;
  --surface-0: #ebe8e0;
  --surface-1: #eeeae2;
  --surface-2: #f9f7f3;
  --surface-3: #f0ece4;
  --surface-4: #e5e1d9;

  --ambient-bg:
    radial-gradient(ellipse 90% 55% at 50% -5%,  rgba(74,124,89,0.18) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 5%  85%,  rgba(74,124,89,0.10) 0%, transparent 50%),
    radial-gradient(ellipse 50% 35% at 92% 65%,  rgba(249,166,32,0.08) 0%, transparent 50%),
    radial-gradient(ellipse 30% 20% at 75% 15%,  rgba(230,57,70,0.04)  0%, transparent 50%);

  --glass-bg:           rgba(255,255,255,0.75);
  --glass-bg-hover:     rgba(255,255,255,0.85);
  --glass-bg-active:    rgba(255,255,255,0.92);
  --glass-bg-strong:    rgba(255,255,255,0.80);
  --glass-border:       rgba(74,124,89,0.15);
  --glass-border-hover: rgba(74,124,89,0.25);
  --glass-border-strong:rgba(74,124,89,0.35);
  --glass-blur:    blur(22px);
  --glass-blur-sm: blur(11px);
  --glass-blur-lg: blur(34px);
  --glass-blur-xl: blur(48px);
  --glass-shadow:    0 1px 4px rgba(0,0,0,0.07), inset 0 1px 0 rgba(255,255,255,0.80);
  --glass-shadow-lg: 0 4px 16px rgba(0,0,0,0.10), inset 0 1px 0 rgba(255,255,255,0.85);
  --glass-shadow-xl: 0 8px 32px rgba(0,0,0,0.12), inset 0 1px 0 rgba(255,255,255,0.90);

  --accent:        #e63946;
  --accent-hover:  #d02f3b;
  --accent-active: #b52530;
  --accent-muted:  rgba(230,57,70,0.09);
  --accent-glow:   0 0 20px rgba(230,57,70,0.18), 0 0 40px rgba(230,57,70,0.08);
  --accent-border: rgba(230,57,70,0.28);

  --success:        #3a7a52;
  --success-bg:     rgba(74,124,89,0.10);
  --success-border: rgba(74,124,89,0.25);
  --warning:        #c47f0a;
  --warning-bg:     rgba(249,166,32,0.10);
  --warning-border: rgba(249,166,32,0.25);
  --danger:         #b02030;
  --danger-bg:      rgba(200,40,55,0.07);
  --danger-border:  rgba(200,40,55,0.20);
  --info:           #2a6b96;
  --info-bg:        rgba(42,107,150,0.08);
  --info-border:    rgba(42,107,150,0.22);

  --text-primary:   #2a1f14;
  --text-secondary: rgba(42,31,20,0.55);
  --text-tertiary:  rgba(42,31,20,0.38);
  --text-disabled:  rgba(42,31,20,0.22);
  --text-accent:    #b02030;
  --text-on-accent: #ffffff;

  --border-subtle:  rgba(74,124,89,0.10);
  --border-default: rgba(74,124,89,0.18);
  --border-strong:  rgba(74,124,89,0.30);
  --border-accent:  rgba(230,57,70,0.30);

  --input-bg:     rgba(255,255,255,0.72);
  --input-border: rgba(74,124,89,0.25);

  --scrollbar-track:       rgba(74,124,89,0.06);
  --scrollbar-thumb:       rgba(74,124,89,0.18);
  --scrollbar-thumb-hover: rgba(74,124,89,0.30);
}

/* BASE GLOBAL */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  color: var(--text-primary);
  background-color: var(--page-bg);
  background-image: var(--ambient-bg);
  background-attachment: fixed;
  min-height: 100vh;
  transition: background-color var(--duration-slow) var(--ease-out),
              color var(--duration-slow) var(--ease-out);
}
* { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track); }
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--scrollbar-track); border-radius: var(--radius-full); }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: var(--radius-full); }
::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-thumb-hover); }
::selection { background: var(--accent-muted); color: var(--text-primary); }
.mono, .number, .price, .amount {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

/* GLASS CARD */
.glass-card {
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--glass-shadow);
  transition: background var(--duration-normal) var(--ease-out),
              border-color var(--duration-normal) var(--ease-out),
              box-shadow var(--duration-normal) var(--ease-out),
              transform var(--duration-normal) var(--ease-out);
}
.glass-card:hover {
  background: var(--glass-bg-hover);
  border-color: var(--glass-border-hover);
  box-shadow: var(--glass-shadow-lg);
}
.glass-card--elevated {
  background: var(--glass-bg-strong);
  backdrop-filter: var(--glass-blur-lg);
  -webkit-backdrop-filter: var(--glass-blur-lg);
  border-color: var(--glass-border-strong);
  box-shadow: var(--glass-shadow-xl);
}
.glass-card--active {
  background: var(--glass-bg-active);
  border-color: var(--accent-border);
  box-shadow: var(--glass-shadow), var(--accent-glow);
}

/* BOTONES */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--space-2); font-family: var(--font-sans);
  font-size: var(--text-sm); font-weight: var(--weight-medium);
  line-height: 1; border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-4);
  cursor: pointer; border: 1px solid transparent;
  transition: all 0.18s ease;
  white-space: nowrap; user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.btn:hover { filter: brightness(1.1); transform: translateY(-1px); }
.btn:active  { transform: scale(0.97); }
.btn:disabled { opacity: 0.40; cursor: not-allowed; pointer-events: none; }
.btn-primary  { background: var(--accent); color: var(--text-on-accent); border-color: var(--accent); box-shadow: 0 2px 12px rgba(230,57,70,0.40); }
.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); box-shadow: 0 4px 20px rgba(230,57,70,0.50); }
.btn-secondary { background: var(--glass-bg); color: var(--text-secondary); border-color: var(--glass-border); backdrop-filter: var(--glass-blur-sm); -webkit-backdrop-filter: var(--glass-blur-sm); }
.btn-secondary:hover { background: var(--glass-bg-hover); color: var(--text-primary); border-color: var(--glass-border-hover); }
.btn-ghost { background: transparent; color: var(--text-tertiary); border-color: transparent; }
.btn-ghost:hover { background: var(--glass-bg); color: var(--text-secondary); border-color: var(--glass-border); }
.btn-danger { background: var(--danger-bg); color: var(--danger); border-color: var(--danger-border); }
.btn-danger:hover { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn-success { background: var(--success-bg); color: var(--success); border-color: var(--success-border); }
.btn-success:hover { background: var(--success); color: var(--page-bg); border-color: var(--success); }
.btn-sm    { padding: var(--space-1) var(--space-3); font-size: var(--text-xs); border-radius: var(--radius-sm); }
.btn-lg    { padding: var(--space-3) var(--space-6); font-size: var(--text-base); border-radius: var(--radius-lg); }
.btn-xl    { padding: var(--space-4) var(--space-8); font-size: var(--text-md); border-radius: var(--radius-xl); font-weight: var(--weight-semibold); }
.btn-block { width: 100%; }
.btn-icon  { padding: var(--space-2); aspect-ratio: 1; }

/* INPUTS */
.form-label { font-size: var(--text-sm); font-weight: var(--weight-medium); color: var(--text-secondary); margin-bottom: var(--space-2); display: block; }
.form-input, .form-select, .form-textarea {
  font-family: var(--font-sans); font-size: var(--text-base);
  color: var(--text-primary); background: var(--glass-bg);
  backdrop-filter: var(--glass-blur-sm); -webkit-backdrop-filter: var(--glass-blur-sm);
  border: 1px solid var(--glass-border); border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4); width: 100%;
  outline: none; appearance: none; -webkit-appearance: none;
  transition: all var(--duration-fast) var(--ease-out);
}
body.light .form-input,
body.light .form-select,
body.light .form-textarea { background: var(--input-bg); border-color: var(--input-border); }
.form-input::placeholder { color: var(--text-tertiary); }
.form-input:hover,
.form-select:hover  { border-color: var(--glass-border-hover); }
.form-input:focus,
.form-select:focus,
.form-textarea:focus { background: var(--glass-bg-active); border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-muted); }

/* BADGES */
.badge {
  display: inline-flex; align-items: center; gap: var(--space-1);
  font-size: var(--text-xs); font-weight: var(--weight-semibold);
  line-height: 1; padding: 3px var(--space-2); border-radius: var(--radius-full);
  white-space: nowrap; letter-spacing: 0.03em; text-transform: uppercase;
}
.badge::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.badge-success { background: var(--success-bg); color: var(--success); border: 1px solid var(--success-border); }
.badge-danger  { background: var(--danger-bg);  color: var(--danger);  border: 1px solid var(--danger-border); }
.badge-warning { background: var(--warning-bg); color: var(--warning); border: 1px solid var(--warning-border); }
.badge-info    { background: var(--info-bg);    color: var(--info);    border: 1px solid var(--info-border); }
.badge-accent  { background: var(--accent-muted); color: var(--text-accent); border: 1px solid var(--accent-border); }
.badge-default { background: var(--glass-bg-strong); color: var(--text-secondary); border: 1px solid var(--glass-border); }

/* ANIMACIONES */
@keyframes fadeIn  { from{opacity:0} to{opacity:1} }
@keyframes slideUp { from{opacity:0;transform:translateY(20px) scale(0.98)} to{opacity:1;transform:translateY(0) scale(1)} }
@keyframes pulse   { 0%,100%{opacity:1} 50%{opacity:0.5} }
@keyframes shimmer { from{background-position:-200% 0} to{background-position:200% 0} }
.skeleton { background:linear-gradient(90deg,var(--glass-bg) 25%,var(--glass-bg-hover) 50%,var(--glass-bg) 75%); background-size:200% 100%; animation:shimmer 1.5s infinite; border-radius:var(--radius-sm); }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:0.01ms !important; transition-duration:0.01ms !important; } }

/* LAYOUT GLOBAL */
.app-layout  { display:flex; min-height:100vh; }
.app-sidebar { width:240px; flex-shrink:0; }
.app-main    { flex:1; min-width:0; display:flex; flex-direction:column; }
.app-content { flex:1; padding:var(--space-6); overflow-y:auto; }
.page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-6); gap:var(--space-4); }
.page-title    { font-size:var(--text-xl); font-weight:var(--weight-semibold); color:var(--text-primary); line-height:var(--leading-tight); }
.page-subtitle { font-size:var(--text-sm); color:var(--text-tertiary); margin-top:var(--space-1); }
.stats-grid    { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:var(--space-4); margin-bottom:var(--space-6); }
.content-grid   { display:grid; gap:var(--space-5); }
.content-grid-2 { grid-template-columns:repeat(2,1fr); }
.content-grid-3 { grid-template-columns:repeat(3,1fr); }
.content-grid-4 { grid-template-columns:repeat(4,1fr); }

/* SIDEBAR */
.sidebar { background:var(--glass-bg); backdrop-filter:var(--glass-blur-lg); -webkit-backdrop-filter:var(--glass-blur-lg); border-right:1px solid var(--glass-border); height:100vh; position:sticky; top:0; overflow-y:auto; overflow-x:hidden; display:flex; flex-direction:column; }
.nav-item { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-4); border-radius:var(--radius-md); font-size:var(--text-sm); font-weight:var(--weight-medium); color:var(--text-secondary); cursor:pointer; text-decoration:none; border:1px solid transparent; border-bottom:2px solid transparent; transition:all 0.2s ease; }
.nav-item:hover { background:rgba(255,255,255,0.08); color:#ffffff; transform:translateY(-1px); }
.nav-item.active { background:rgba(230,57,70,0.15); color:#e63946; border-bottom:2px solid #e63946; font-weight:var(--weight-semibold); }
.topbar { background:var(--glass-bg); backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur); border-bottom:1px solid var(--glass-border); height:60px; display:flex; align-items:center; padding:0 var(--space-6); gap:var(--space-4); position:sticky; top:0; z-index:100; }
.sidebar-brand { padding:var(--space-5); border-bottom:1px solid var(--border-subtle); display:flex; align-items:center; gap:var(--space-3); transition:opacity 0.2s; }
.sidebar-brand:hover { opacity:0.8; }

/* STAT CARDS */
.stat-card { background:var(--glass-bg); backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur); border:1px solid var(--glass-border); border-radius:var(--radius-lg); padding:var(--space-5) var(--space-6); box-shadow:var(--glass-shadow); transition:transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out); }
.stat-card:hover { transform:translateY(-2px); box-shadow:var(--glass-shadow-lg); }
.stat-label { font-size:var(--text-xs); font-weight:var(--weight-semibold); text-transform:uppercase; letter-spacing:0.08em; color:var(--text-tertiary); margin-bottom:var(--space-2); }
.stat-value { font-family:var(--font-mono); font-size:var(--text-2xl); font-weight:var(--weight-bold); color:var(--text-primary); line-height:1; margin-bottom:var(--space-2); font-variant-numeric:tabular-nums; }
.stat-change { font-size:var(--text-xs); font-weight:var(--weight-medium); display:inline-flex; align-items:center; gap:3px; }
.stat-change.up   { color:var(--success); }
.stat-change.down { color:var(--danger); }

/* MESAS */
.mesa-card { cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-2); padding:var(--space-4); transition:all var(--duration-fast) var(--ease-out); border:1px solid var(--glass-border); border-radius:var(--radius-lg); background:var(--glass-bg); }
.mesa-card:hover  { transform:translateY(-2px) scale(1.03); box-shadow:var(--glass-shadow-lg); }
.mesa-card:active { transform:scale(0.96); }
.mesa-card.disponible { background:var(--success-bg); border-color:var(--success-border); }
.mesa-card.ocupada    { background:var(--accent-muted); border-color:var(--accent-border); }
.mesa-card.reservada  { background:var(--warning-bg); border-color:var(--warning-border); }
.mesa-card.cuenta     { background:var(--info-bg); border-color:var(--info-border); }
.mesa-card.en_limpieza { background:rgba(100,116,139,0.10); border-color:rgba(100,116,139,0.25); }
.mesa-numero { font-family:var(--font-mono); font-size:var(--text-xl); font-weight:var(--weight-bold); color:var(--text-primary); }
.mesa-estado { font-size:var(--text-xs); font-weight:var(--weight-semibold); text-transform:uppercase; letter-spacing:0.06em; color:var(--text-secondary); }
.mesa-tiempo { font-family:var(--font-mono); font-size:var(--text-xs); color:var(--text-tertiary); }

/* TABLAS */
.data-table { width:100%; border-collapse:separate; border-spacing:0; font-size:var(--text-sm); }
.data-table thead th { padding:var(--space-3) var(--space-4); text-align:left; font-size:var(--text-xs); font-weight:var(--weight-semibold); text-transform:uppercase; letter-spacing:0.06em; color:var(--text-secondary); border-bottom:1px solid var(--glass-border-strong); white-space:nowrap; }
.data-table tbody td { padding:var(--space-3) var(--space-4); color:var(--text-primary); border-bottom:1px solid var(--glass-border); vertical-align:middle; }
.data-table tbody tr { transition:background var(--duration-fast) var(--ease-out); }
.data-table tbody tr:hover td { background:var(--glass-bg); }
.data-table tbody tr:last-child td { border-bottom:none; }

/* PRODUCTO CARD */
.producto-card { cursor:pointer; padding:var(--space-4); display:flex; flex-direction:column; gap:var(--space-2); transition:all var(--duration-fast) var(--ease-out); }
.producto-card:hover  { transform:translateY(-2px) scale(1.02); box-shadow:var(--glass-shadow-lg); }
.producto-card:active { transform:scale(0.97); }
.producto-card .producto-nombre { font-size:var(--text-sm); font-weight:var(--weight-semibold); color:var(--text-primary); line-height:1.3; }
.producto-card .producto-precio { font-family:var(--font-mono); font-size:var(--text-sm); font-weight:var(--weight-bold); color:var(--accent); }
.producto-card .producto-cat { font-size:var(--text-xs); color:var(--text-tertiary); text-transform:uppercase; letter-spacing:0.05em; }

/* TOTAL BAR */
.orden-total-bar { background:var(--glass-bg-strong); border-top:1px solid var(--glass-border-strong); padding:var(--space-4) var(--space-5); display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); }
.orden-total-amount { font-family:var(--font-mono); font-size:var(--text-2xl); font-weight:var(--weight-bold); color:var(--text-primary); font-variant-numeric:tabular-nums; }

/* DELIVERY */
.delivery-card { padding:var(--space-5); border-left:3px solid transparent; transition:all 0.2s ease; }
.delivery-card:hover { background:rgba(255,255,255,0.07); transform:translateX(3px); border-left-width:6px; }
.delivery-card.pendiente  { border-left-color:var(--warning); }
.delivery-card.en-camino  { border-left-color:var(--info); }
.delivery-card.entregado  { border-left-color:var(--success); opacity:0.7; }
.delivery-card.cancelado  { border-left-color:var(--danger); opacity:0.6; }

/* MOSTRADOR */
.cliente-info-bar { background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:var(--radius-md); padding:var(--space-3) var(--space-4); display:flex; align-items:center; gap:var(--space-3); font-size:var(--text-sm); color:var(--text-secondary); }

/* KDS */
.kds-card { border-radius:var(--radius-xl); border:1px solid var(--glass-border); background:var(--glass-bg); padding:var(--space-5); display:flex; flex-direction:column; gap:var(--space-3); transition:all var(--duration-fast) var(--ease-out); }
.kds-card.urgente { border-color:var(--danger); box-shadow:0 0 0 1px var(--danger), 0 0 24px rgba(234,33,67,0.25); animation:pulse 1.5s ease-in-out infinite; }
.kds-card.listo   { border-color:var(--success); background:rgba(7,202,107,0.06); }
.kds-mesa-numero  { font-family:var(--font-mono); font-size:var(--text-2xl); font-weight:var(--weight-bold); color:var(--text-primary); line-height:1; }
.kds-item { font-size:var(--text-sm); color:var(--text-primary); padding:var(--space-1) 0; display:flex; align-items:baseline; gap:var(--space-2); }
.kds-item.completado { text-decoration:line-through; color:var(--text-tertiary); }
.kds-timer { font-family:var(--font-mono); font-size:var(--text-lg); font-weight:var(--weight-semibold); color:var(--warning); }
.kds-timer.critico { color:var(--danger); }

/* MODALES */
.modal-overlay { position:fixed; inset:0; background:rgba(4,8,30,0.70); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; z-index:1000; padding:var(--space-4); }
.modal-content { background:var(--surface-1); border:1px solid var(--glass-border-strong); border-radius:var(--radius-2xl); box-shadow:var(--glass-shadow-lg); width:100%; max-width:560px; max-height:90vh; overflow-y:auto; display:flex; flex-direction:column; }
.modal-header { padding:var(--space-5) var(--space-6); border-bottom:1px solid var(--glass-border); display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; background:var(--surface-1); z-index:1; border-radius:var(--radius-2xl) var(--radius-2xl) 0 0; }
.modal-body   { padding:var(--space-6); }
.modal-footer { padding:var(--space-4) var(--space-6); border-top:1px solid var(--glass-border); display:flex; justify-content:flex-end; gap:var(--space-3); }

/* FORM SELECT */
.form-select { width:100%; padding:var(--space-2-5) var(--space-3); background:var(--input-bg); border:1px solid var(--input-border); border-radius:var(--radius-md); color:var(--text-primary); font-size:var(--text-sm); font-family:inherit; outline:none; cursor:pointer; transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out); }
.form-select:focus { border-color:var(--accent); box-shadow:0 0 0 3px rgba(24,86,255,0.15); }
.form-select option { background:var(--surface-2); color:var(--text-primary); }

/* ARQUEO */
.arqueo-row       { display:flex; justify-content:space-between; padding:var(--space-3) 0; border-bottom:1px solid var(--border-subtle); font-size:var(--text-sm); }
.arqueo-row.ok    { color:var(--success); }
.arqueo-row.diff  { color:var(--danger); }
.arqueo-row.warn  { color:var(--warning); }

/* CLIENTES */
.avatar-circle { width:48px; height:48px; border-radius:var(--radius-full); background:var(--accent-muted); border:1px solid var(--accent-border); display:flex; align-items:center; justify-content:center; font-size:var(--text-md); font-weight:var(--weight-bold); color:var(--accent); flex-shrink:0; }

/* TOGGLE */
body.light .icon-moon  { display:none; }
body.light .icon-sun   { display:inline; }
body:not(.light) .icon-sun  { display:none; }
body:not(.light) .icon-moon { display:inline; }

/* ===== BOTANICAL GARDEN — Light Mode Overrides ===== */

/* Typography — larger base */
body.light { font-size:15px; }
body.light .section-title,
body.light .stat-label,
body.light .form-label { font-size:13px; }

/* Navbar */
body.light .topbar,
body.light .topnav { background:rgba(245,243,237,0.95); }
body.light .nav-item:hover { background:rgba(74,124,89,0.08); color:#2a1f14; }
body.light .nav-item.active { background:rgba(74,124,89,0.12); color:#4a7c59; border-bottom-color:#4a7c59; }

/* Buttons */
body.light .btn-secondary { border-color:rgba(74,124,89,0.3); color:#4a7c59; }
body.light .btn-secondary:hover { border-color:#4a7c59; background:rgba(74,124,89,0.08); color:#3a6245; }

/* ========================================================
   Ocultar spinners (flechas arriba/abajo) en inputs number
   Evita incrementos accidentales en touchscreen / clicks.
   La garzona ingresa el valor manualmente con teclado.
   ======================================================== */
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;
  appearance: textfield;
}

/* ═══════════════════════════════════════════════════════════════════
   BRAND — GestoRest (Poppins + cuchara animada)
   ═══════════════════════════════════════════════════════════════════ */
.brand-name {
  font-family: 'Poppins', system-ui, -apple-system, sans-serif;
  font-weight: 700;
  letter-spacing: 0.2px;
}
.brand-spoon-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  color: var(--accent);
  vertical-align: middle;
  filter: drop-shadow(0 2px 4px rgba(230,57,70,0.35));
  animation: spoonFall 900ms cubic-bezier(.34,1.35,.4,1) both;
  transform-origin: 50% 50%;
}
body.light .brand-spoon-icon {
  filter: drop-shadow(0 2px 3px rgba(230,57,70,0.20));
}
.brand-spoon-icon.brand-spoon-icon--lg {
  width: 96px;
  height: 96px;
  animation: spoonFallLg 1100ms cubic-bezier(.34,1.35,.35,1) both;
  filter: drop-shadow(0 6px 14px rgba(230,57,70,0.35));
}
body.light .brand-spoon-icon.brand-spoon-icon--lg {
  filter: drop-shadow(0 4px 10px rgba(230,57,70,0.20));
}
@keyframes spoonFall {
  0%   { transform: translateY(-140px) rotate(-28deg); opacity: 0; }
  20%  { opacity: 1; }
  55%  { transform: translateY(8px) rotate(6deg); }
  70%  { transform: translateY(-5px) rotate(-3deg); }
  85%  { transform: translateY(2px) rotate(1deg); }
  100% { transform: translateY(0) rotate(0deg); }
}
@keyframes spoonFallLg {
  0%   { transform: translateY(-260px) rotate(-32deg) scale(0.9); opacity: 0; }
  18%  { opacity: 1; }
  55%  { transform: translateY(14px) rotate(8deg) scale(1); }
  72%  { transform: translateY(-8px) rotate(-4deg) scale(1); }
  88%  { transform: translateY(3px) rotate(1.5deg) scale(1); }
  100% { transform: translateY(0) rotate(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .brand-spoon-icon,
  .brand-spoon-icon.brand-spoon-icon--lg { animation: none; }
}
