/* Ticksy Design System 2 · tokens generados desde tokens.json (Ticksy Design System). No editar a mano: regenerar. */
:root {
  --font-sans: Rubik, system-ui, -apple-system, Segoe UI, sans-serif;
  --color-navy-700: #094163;
  --color-navy-800: #073551;
  --color-navy-900: #062a40;
  --color-navy-950: #041e2e;
  --color-cyan-100: #a0f2ff;
  --color-cyan-200: #70dff9;
  --color-cyan-400: #1ed8f6;
  --color-cyan-700: #107595;
  --color-gray-50: #f6fafa;
  --color-gray-100: #f2f7f8;
  --color-gray-200: #dde6e9;
  --color-gray-300: #b0c2c8;
  --color-gray-400: #829ea6;
  --color-gray-500: #658189;
  --color-gray-600: #526d75;
  --color-green-500: #2db682;
  --color-green-700: #147f57;
  --color-yellow-500: #f3c51a;
  --color-orange-500: #fa9e00;
  --color-orange-700: #ad720c;
  --color-red-500: #cd4040;
  --color-red-700: #9e2020;
  --color-white: #ffffff;
  --channel-uber-eats: #a64ab8;
  --channel-just-eat: #cd4040;
  --channel-table: #fa9e00;
  --channel-web: #2db682;
  --group-purple: #c98cc9;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --size-touch-min: 64px;
  --size-touch-reserve: 96px;
  --shadow-card: 0 8px 24px rgba(4, 30, 46, 0.08);
  --shadow-modal: 0 12px 32px rgba(4, 30, 46, 0.32);
}

/* TPV Dark */
:root, :root[data-theme="tpv-dark"] {
  --bg-canvas: #041e2e;
  --bg-surface: #062a40;
  --bg-surface-raised: #073551;
  --bg-surface-highlight: #094163;
  --bg-inverse: #ffffff;
  --text-primary: #ffffff;
  --text-secondary: #829ea6;
  --text-muted: #829ea6;
  --text-accent: #1ed8f6;
  --text-on-accent: #041e2e;
  --text-inverse: #041e2e;
  --text-heading: #094163;
  --text-subtle: #829ea6;
  --text-brand-accent: #1ed8f6;
  --border-default: #094163;
  --border-subtle: #073551;
  --border-strong: #1ed8f6;
  --action-primary: #1ed8f6;
  --action-primary-hover: #70dff9;
  --action-secondary: #094163;
  --status-success: #2db682;
  --status-success-strong: #147f57;
  --status-warning: #fa9e00;
  --status-warning-strong: #ad720c;
  --status-attention: #f3c51a;
  --status-danger: #cd4040;
  --status-danger-strong: #9e2020;
  --status-info: #1ed8f6;
  --brand-logo-wordmark: #ffffff;
  --brand-logo-accent: #1ed8f6;
  --brand-logo-tagline: #107595;
  --action-danger: #cd4040;
  --action-warning: #fa9e00;
  --action-ghost: #073551;
  --action-selected: #b0c2c8;
  --text-on-secondary: #1ed8f6;
  --text-on-selected: #ffffff;
  --text-on-status: #ffffff;
  --text-on-app-bar: #ffffff;
  --text-key: #b0c2c8;
  --bg-app-bar: #1ed8f6;
  --bg-app-bar-tab: #062a40;
  --bg-bottom-bar: #062a40;
  --bg-panel-header: #107595;
  --bg-key: #073551;
  --text-body: #526d75;
}

/* Light */
:root[data-theme="light"] {
  --bg-canvas: #f6fafa;
  --bg-surface: #ffffff;
  --bg-surface-raised: #f2f7f8;
  --bg-surface-highlight: #a0f2ff;
  --bg-inverse: #041e2e;
  --text-primary: #062a40;
  --text-secondary: #829ea6;
  --text-muted: #829ea6;
  --text-accent: #107595;
  --text-on-accent: #041e2e;
  --text-inverse: #ffffff;
  --text-heading: #094163;
  --text-subtle: #b0c2c8;
  --text-brand-accent: #1ed8f6;
  --border-default: #dde6e9;
  --border-subtle: #f2f7f8;
  --border-strong: #b0c2c8;
  --action-primary: #1ed8f6;
  --action-primary-hover: #107595;
  --action-secondary: #dde6e9;
  --status-success: #2db682;
  --status-success-strong: #147f57;
  --status-warning: #fa9e00;
  --status-warning-strong: #ad720c;
  --status-attention: #f3c51a;
  --status-danger: #cd4040;
  --status-danger-strong: #9e2020;
  --status-info: #107595;
  --brand-logo-wordmark: #073551;
  --brand-logo-accent: #1ed8f6;
  --brand-logo-tagline: #829ea6;
  --action-danger: #cd4040;
  --action-warning: #fa9e00;
  --action-ghost: #f6fafa;
  --action-selected: #b0c2c8;
  --text-on-secondary: #073551;
  --text-on-selected: #ffffff;
  --text-on-status: #ffffff;
  --text-on-app-bar: #ffffff;
  --text-key: #b0c2c8;
  --bg-app-bar: #1ed8f6;
  --bg-app-bar-tab: #062a40;
  --bg-bottom-bar: #062a40;
  --bg-panel-header: #107595;
  --bg-key: #073551;
  --text-body: #526d75;
}

/* Brand */
:root[data-theme="brand"] {
  --bg-canvas: #ffffff;
  --bg-surface: #f6fafa;
  --bg-surface-raised: #f2f7f8;
  --bg-surface-highlight: #a0f2ff;
  --bg-inverse: #041e2e;
  --text-primary: #062a40;
  --text-secondary: #829ea6;
  --text-muted: #829ea6;
  --text-accent: #107595;
  --text-on-accent: #041e2e;
  --text-inverse: #ffffff;
  --text-heading: #094163;
  --text-subtle: #b0c2c8;
  --text-brand-accent: #1ed8f6;
  --border-default: #dde6e9;
  --border-subtle: #f2f7f8;
  --border-strong: #b0c2c8;
  --action-primary: #1ed8f6;
  --action-primary-hover: #107595;
  --action-secondary: #dde6e9;
  --status-success: #2db682;
  --status-success-strong: #147f57;
  --status-warning: #fa9e00;
  --status-warning-strong: #ad720c;
  --status-attention: #f3c51a;
  --status-danger: #cd4040;
  --status-danger-strong: #9e2020;
  --status-info: #107595;
  --brand-logo-wordmark: #073551;
  --brand-logo-accent: #1ed8f6;
  --brand-logo-tagline: #829ea6;
  --action-danger: #cd4040;
  --action-warning: #fa9e00;
  --action-ghost: #f6fafa;
  --action-selected: #b0c2c8;
  --text-on-secondary: #073551;
  --text-on-selected: #ffffff;
  --text-on-status: #ffffff;
  --text-on-app-bar: #ffffff;
  --text-key: #b0c2c8;
  --bg-app-bar: #1ed8f6;
  --bg-app-bar-tab: #062a40;
  --bg-bottom-bar: #062a40;
  --bg-panel-header: #107595;
  --bg-key: #073551;
  --text-body: #526d75;
}