/* ========================================
   VARIABLES CSS DEL SISTEMA DE DISEÑO
   Variables globales compartidas por todas las páginas
   ======================================== */

/* ==================== TEMA CLARO (POR DEFECTO) ==================== */
:root {
  /* Colores base */
  --background: rgba(227, 230, 232, 1);
  --foreground: rgba(11, 11, 11, 1);
  --border: rgba(209, 209, 209, 1);
  --input-background: rgba(255, 255, 255, 1);
  --muted: rgba(145, 155, 161, 1);
  --muted-foreground: rgba(89, 93, 98, 1);
  --primary: rgba(11, 11, 11, 1);
  --primary-foreground: rgba(255, 255, 255, 1);
  --radius: 0px;

  /* Font weights */
  --font-weight-medium: 500;
  --font-weight-normal: 400;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* Font sizes */
  --text-base: 1rem;
  --text-sm: 0.875rem;
  --mobile-input-font-size: 16px;

  /* Card styles */
  --card-background: #fcfcfc;
  --card-border: #919ba1;
  --card-radius: 2px;
  --page-background: #e3e6e8;
  --omega-form-grid-gap: 5px 18px;

  /* Success colors */
  --success: rgba(7, 126, 56, 1);
  --success-foreground: rgba(255, 255, 255, 1);

  /* Header styles */
  --header-padding-x: 20px;
  --header-padding-y: 10px;
  --header-gap: 10px;

  /* Button styles */
  --btn-height: 30px;
  --btn-min-width: 100px;
  --btn-max-width: 115px;
  --btn-padding-x: 8px;
  --btn-padding-y: 4px;
  --btn-radius: 2px;
  --btn-gap: 4px;
  --btn-border-color: #595d62;
  --btn-success-bg: #077e38;

  /* Sistema de colores adaptativo */
  --bg-primary: #e3e6e8;
  --bg-secondary: #ffffff;
  --bg-tertiary: #f9f9f9;
  --bg-hover: #f4f4f4;
  --text-primary: #0b0b0b;
  --text-secondary: #595d62;
  --text-muted: #919ba1;
  --border-primary: #e3e6e8;
  --border-secondary: #d0d0d0;
  --omega-neutral-5: #f1f2f3;
  --omega-neutral-30: #acb4b9;
  --omega-primary-40: #3e66f4;
  --input-bg: #ffffff;
  --input-text: #0b0b0b;
  --input-border: #d0d0d0;
  --table-header-bg: #f4f4f4;
  --table-row-hover: #f9f9f9;
  --shadow-sm: 0px 4px 12px rgba(0, 0, 0, 0.15);
  --shadow-md: 0px 10px 18px 10px rgba(51, 51, 51, 0.08);

  /* Colores fijos (NO cambian con el tema) */
  --green-primary: #077e38;
  --green-light: #f0f7f4;
  --red-primary: #d32d22;
  --red-light: #fdecea;
  --header-bg: #0b0b0b;
  --header-text: #ffffff;
  --sidebar-bg: #0b0b0b;
  --sidebar-text: #ffffff;
  
  /* Colores de estado verde/rojo para LIGHT MODE */
  --green-status: #077e38;
  --red-status: #a40f16;

  /* Tamaños canónicos para acciones dentro de tablas */
  --table-action-cell-size: 36px;
  --table-action-button-size: 21px;
  --table-action-icon-stroke-width: 0.6;

  /* Acciones de tabla canónicas (Lista de pedidos) */
  --table-action-edit-bg: #e99a1b;
  --table-action-edit-fg: #ffffff;
  --table-action-edit-hover-bg: #fbe6bf;
  --table-action-edit-hover-fg: var(--table-action-edit-bg);
  --table-action-edit-active-bg: #b45309;
  --table-action-edit-active-fg: #ffffff;

  --table-action-money-bg: #6f42c1;
  --table-action-money-fg: #ffffff;
  --table-action-money-hover-bg: #e8ddff;
  --table-action-money-hover-fg: var(--table-action-money-bg);
  --table-action-money-active-bg: #5b21b6;
  --table-action-money-active-fg: #ffffff;

  --table-action-duplicate-bg: #3b5bff;
  --table-action-duplicate-fg: #ffffff;
  --table-action-duplicate-hover-bg: #dfe5ff;
  --table-action-duplicate-hover-fg: var(--table-action-duplicate-bg);
  --table-action-duplicate-active-bg: #1d4ed8;
  --table-action-duplicate-active-fg: #ffffff;

  --table-action-serial-bg: #118447;
  --table-action-serial-fg: #ffffff;
  --table-action-serial-hover-bg: #d4eadc;
  --table-action-serial-hover-fg: var(--table-action-serial-bg);
  --table-action-serial-active-bg: #166534;
  --table-action-serial-active-fg: #ffffff;

  --table-action-check-bg: #077e38;
  --table-action-check-fg: #ffffff;
  --table-action-check-hover-bg: #d4eadc;
  --table-action-check-hover-fg: var(--table-action-check-bg);
  --table-action-check-active-bg: #15803d;
  --table-action-check-active-fg: #ffffff;

  --table-action-user-bg: #595d62;
  --table-action-user-fg: #ffffff;
  --table-action-user-hover-bg: #e2e4e7;
  --table-action-user-hover-fg: var(--table-action-user-bg);
  --table-action-user-active-bg: #4b5563;
  --table-action-user-active-fg: #ffffff;

  --table-action-delete-bg: #a40f16;
  --table-action-delete-fg: #ffffff;
  --table-action-delete-hover-bg: #f7d4d6;
  --table-action-delete-hover-fg: var(--table-action-delete-bg);
  --table-action-delete-active-bg: #7f0b11;
  --table-action-delete-active-fg: #ffffff;
}

/* ==================== TEMA OSCURO ==================== */
.dark {
  /* Colores base */
  --background: rgba(26, 26, 26, 1);
  --foreground: rgba(244, 244, 244, 1);
  --border: rgba(61, 61, 61, 1);
  --input-background: rgba(36, 36, 36, 1);
  --muted: rgba(141, 141, 141, 1);
  --muted-foreground: rgba(198, 198, 198, 1);
  --primary: rgba(244, 244, 244, 1);
  --primary-foreground: rgba(26, 26, 26, 1);

  /* Card styles */
  --card-background: #242424;
  --card-border: #3d3d3d;
  --page-background: #1a1a1a;

  /* Sistema de colores adaptativo */
  --bg-primary: #1a1a1a;
  --bg-secondary: #242424;
  --bg-tertiary: #2a2a2a;
  --bg-hover: #333333;
  --text-primary: #f4f4f4;
  --text-secondary: #c6c6c6;
  --text-muted: #8d8d8d;
  --border-primary: #3d3d3d;
  --border-secondary: #4a4a4a;
  --omega-neutral-5: #2a2a2a;
  --omega-neutral-30: #4a4a4a;
  --omega-primary-40: #91a7ff;
  --input-bg: #242424;
  --input-text: #f4f4f4;
  --input-border: #4a4a4a;
  --table-header-bg: #2c2c2c;
  --table-row-hover: #2a2a2a;
  --table-zebra-even: #1e1e1e;
  --table-zebra-odd: #242424;
  --table-border: #3a3a3a;
  --shadow-sm: 0px 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-md: 0px 10px 18px 10px rgba(0, 0, 0, 0.3);

  /* Colores de estado verde/rojo para DARK MODE (más claros según Figma) */
  --green-status: #0ABF5B;
  --red-status: #FF6B6B;
  --btn-success-bg: #0ABF5B;
  --btn-danger-bg: #FF6B6B;

  /* Acciones de tabla canónicas (dark mode) */
  --table-action-edit-bg: #e99a1b;
  --table-action-edit-fg: #ffffff;
  --table-action-edit-hover-bg: #fbe6bf;
  --table-action-edit-hover-fg: var(--table-action-edit-bg);
  --table-action-edit-active-bg: #c6631c;
  --table-action-edit-active-fg: #ffffff;

  --table-action-money-bg: #6f42c1;
  --table-action-money-fg: #ffffff;
  --table-action-money-hover-bg: #e8ddff;
  --table-action-money-hover-fg: var(--table-action-money-bg);
  --table-action-money-active-bg: #7c3aed;
  --table-action-money-active-fg: #ffffff;

  --table-action-duplicate-bg: #3b5bff;
  --table-action-duplicate-fg: #ffffff;
  --table-action-duplicate-hover-bg: #dfe5ff;
  --table-action-duplicate-hover-fg: var(--table-action-duplicate-bg);
  --table-action-duplicate-active-bg: #3b82f6;
  --table-action-duplicate-active-fg: #ffffff;

  --table-action-serial-bg: var(--green-status);
  --table-action-serial-fg: #ffffff;
  --table-action-serial-hover-bg: #38d47d;
  --table-action-serial-hover-fg: #ffffff;
  --table-action-serial-active-bg: #089b4a;
  --table-action-serial-active-fg: #ffffff;

  --table-action-check-bg: var(--green-status);
  --table-action-check-fg: #ffffff;
  --table-action-check-hover-bg: #38d47d;
  --table-action-check-hover-fg: #ffffff;
  --table-action-check-active-bg: #089b4a;
  --table-action-check-active-fg: #ffffff;

  --table-action-user-bg: #595d62;
  --table-action-user-fg: #ffffff;
  --table-action-user-hover-bg: #e2e4e7;
  --table-action-user-hover-fg: var(--table-action-user-bg);
  --table-action-user-active-bg: #6b7280;
  --table-action-user-active-fg: #ffffff;

  --table-action-delete-bg: var(--red-status);
  --table-action-delete-fg: #ffffff;
  --table-action-delete-hover-bg: #ff8a8a;
  --table-action-delete-hover-fg: #ffffff;
  --table-action-delete-active-bg: #e85b5b;
  --table-action-delete-active-fg: #ffffff;

  /* Colores fijos NO se redefinen - se heredan de :root */
}