/* CSS Custom Properties - Single source of truth for all design tokens */

:root {
  /* ── Brand / Primary — Black ── */
  --color-primary: #000000;
  --color-primary-hover: #1a1a1a;
  --color-primary-shadow: rgba(0, 0, 0, 0.25);
  --color-primary-shadow-lg: rgba(0, 0, 0, 0.35);
  --color-primary-bg-soft: rgba(0, 0, 0, 0.1);
  --color-primary-bg-filter: rgba(0, 0, 0, 0.05);
  --color-primary-bg-option: rgba(0, 0, 0, 0.8);
  --color-primary-rgb: 0, 0, 0;

  /* ── Brand / Secondary — Seafoam ── */
  --color-secondary: #52B0A2;
  --color-secondary-hover: #4A9E92;
  --color-secondary-shadow: rgba(82, 176, 162, 0.25);
  --color-secondary-shadow-lg: rgba(82, 176, 162, 0.35);
  --color-secondary-bg-soft: rgba(82, 176, 162, 0.1);
  --color-secondary-bg-filter: rgba(82, 176, 162, 0.05);
  --color-secondary-bg-option: rgba(82, 176, 162, 0.8);
  --color-secondary-rgb: 82, 176, 162;

  /* ── Semantic / Success — Warm teal-green ── */
  --color-success: #3E8A68;
  --color-success-hover: #317054;
  --color-success-shadow: rgba(62, 138, 104, 0.25);

  /* ── Semantic / Danger — Warm brick red ── */
  --color-danger: #B84545;
  --color-danger-hover: #9A3636;
  --color-danger-shadow: rgba(184, 69, 69, 0.25);

  /* ── Semantic / Warning — Golden amber ── */
  --color-warning: #C98B12;
  --color-warning-hover: #A8730E;
  --color-warning-shadow: rgba(201, 139, 18, 0.25);

  /* ── Semantic / Info — Slate blue ── */
  --color-info: #3D80B0;
  --color-info-hover: #306892;
  --color-info-shadow: rgba(61, 128, 176, 0.25);

  /* ── Component / Light button ── */
  --color-btn-light-bg: #F8F6F3;
  --color-btn-light-border: #E4DED7;
  --color-btn-light-bg-hover: #EDE9E3;
  --color-btn-light-border-hover: #D4CCC4;

  /* ── Neutral / UI ── */
  --color-white: #ffffff;
  --color-black: #000000;
  --color-gray-light: #f1f1f1;
  --color-gray-bg: #F5F7FA;
  --color-gray-border: #eef1f3;
  --color-input-border: #ededed;
  --color-input-border-hover: #d8d8d8;
  --bs-border-color: #ededed;
  --color-search-border: #b7b7b7;
  --color-hr: #bcbcbc;
  --color-sidebar-logo-bg: #1E3A5F;
  --color-table-header-bg: #f5f5f5;
  --color-table-header-border: #C7D8ED;
  --color-table-hover-bg: #f9f9f9;
  --color-tab-hover-bg: #f7fafc;
  --color-choices-scrollbar: #2563EB;
  --color-filter-active: #f34343;
  --color-sidebar-toggle-bg: rgba(0, 0, 0, 0.05);
  --color-spinner-overlay-bg: rgba(255, 255, 255, 0.8);
  --color-shadow-light: rgba(0, 0, 0, 0.1);
  --color-shadow-dropdown: rgba(0, 0, 0, 0.15);
  --color-tab-active-shadow: rgba(23, 162, 184, 0.2);

  /* ── Text ── */
  --color-text-body: #6c7786;
  --color-text-input: #495057;
  --color-text-muted: #6c757d;
  --color-text-dark: #212529;
  --color-breadcrumb-link: #666;
  --color-breadcrumb-hover: #000;

  /* ── Alert ── */
  --color-alert-primary-text: #212529;
  --color-alert-primary-bg: #f8f9fa;
  --color-alert-primary-border: #dee2e6;
  --color-alert-secondary-text: #41464b;
  --color-alert-secondary-bg: #f9f9f9;
  --color-alert-secondary-border: #d3d6d8;
  --color-alert-success-text: #166534;
  --color-alert-success-bg: #f0fdf4;
  --color-alert-success-border: #bbf7d9;
  --color-alert-danger-text: #991b1b;
  --color-alert-danger-bg: #fef2f2;
  --color-alert-danger-border: #fdd5d5;
  --color-alert-warning-text: #92400e;
  --color-alert-warning-bg: #fffbeb;
  --color-alert-warning-border: #feeea3;
  --color-alert-info-text: #1e40af;
  --color-alert-info-bg: #eff6ff;
  --color-alert-info-border: #d0e8fe;
  --color-alert-light-text: #636464;
  --color-alert-light-bg: #f8f8f8;
  --color-alert-light-border: #ebebeb;
  --color-alert-dark-text: #141619;
  --color-alert-dark-bg: #d3d3d4;
  --color-alert-dark-border: #bcbebf;

  /* ── Soft Badges ── */
  --color-badge-primary-bg: rgba(0, 0, 0, 0.15);
  --color-badge-primary-text: #000000;
  --color-badge-secondary-bg: rgba(82, 176, 162, 0.15);
  --color-badge-secondary-text: #52B0A2;
  --color-badge-info-bg: rgba(59, 130, 246, 0.15);
  --color-badge-info-text: #3b82f6;
  --color-badge-warning-bg: rgba(234, 179, 8, 0.15);
  --color-badge-warning-text: #ca8a04;
  --color-badge-success-bg: rgba(34, 197, 94, 0.15);
  --color-badge-success-text: #16a34a;
  --color-badge-danger-bg: rgba(239, 68, 68, 0.15);
  --color-badge-danger-text: #dc2626;
  --color-badge-light-bg: rgba(107, 114, 128, 0.15);
  --color-badge-light-text: #4b5563;

  /* ── Header Badges (solid) ── */
  --color-hbadge-success: #28a745;
  --color-hbadge-warning: #ffc107;
  --color-hbadge-info: #0dcaf0;
  --color-hbadge-danger: #dc3545;
  --color-hbadge-secondary: #6c757d;

  /* ── Validation ── */
  --color-invalid: #dc3545;
  --color-invalid-shadow: rgba(220, 53, 69, 0.25);
  --color-valid: #198754;

  /* ── SweetAlert Cancel ── */
  --color-swal-cancel-border: #f8f9fa;
  --color-swal-cancel-hover-bg: #d3d4d5;
  --color-swal-cancel-hover-border: #c6c7c8;

  /* ── Header / Sidebar ── */
  --color-header-bg: #ffffff;
  --color-sidebar-text: #555555;
  --color-scrollbar-thumb: #d1d5db;
  --color-scrollbar-thumb-hover: #9ca3af;
  --color-card-shadow: rgba(33, 33, 33, 0.15);
  --color-sidebar-shadow: rgba(0, 0, 0, 0.08);
  --color-sidebar-shadow-sm: rgba(0, 0, 0, 0.03);
  --color-tooltip-shadow: rgba(0, 0, 0, 0.2);
  --color-header-icon: rgba(255, 255, 255, 0.6);
  --color-notification-bg: rgba(255, 255, 255, 0.2);
  --color-dark-label: rgba(255, 255, 255, 0.75);
  --color-dark-label-hover: rgba(255, 255, 255, 0.9);
  --color-toggle-focus-shadow: rgba(13, 110, 253, 0.25);
  --color-page-header-from: #2563EB;
  --color-page-header-to: #1E3A5F;

  /* ── Permission Badges ── */
  --color-perm-create-bg: #d1f4e0;
  --color-perm-create-text: #0d6832;
  --color-perm-create-active-border: #1e7e34;
  --color-perm-read-active-bg: #0d6efd;
  --color-perm-read-active-border: #0a58ca;
  --color-perm-update-active-border: #ffca2c;
  --color-perm-delete-active-border: #b02a37;

  --color-body-bg: #f7f7f7;
}