/*
  SN GROUP - CORPORATE COLOR SYSTEM

  Primary : Blue
  Success : Green
  Warning : Yellow
  Neutral : White / Slate

  Color refinement only.
  Keep typography, layout, JS and print intact.
*/

:root {
  --sn-primary:#2563A6;
  --sn-primary-hover:#1C4E84;
  --sn-primary-active:#153F6B;
  --sn-primary-light:#EAF2FA;
  --sn-primary-border:#BDD4E8;

  --sn-success:#2E8B57;
  --sn-success-hover:#247348;
  --sn-success-light:#E7F5EC;
  --sn-success-text:#17653C;

  --sn-warning:#F4C542;
  --sn-warning-hover:#E3B32D;
  --sn-warning-light:#FFF6D9;
  --sn-warning-text:#795200;

  --sn-danger:#B42332;
  --sn-danger-hover:#931C29;
  --sn-danger-light:#FDECEE;

  --sn-bg:#F5F7FA;
  --sn-surface:#FFFFFF;
  --sn-surface-alt:#F8FAFC;

  --sn-text:#253247;
  --sn-text-muted:#64748B;
  --sn-border:#DEE5ED;

  --sn-focus:rgba(37,99,166,.20);

  /* Compatibility with Enterprise UI */
  --sn-primary-soft:var(--sn-primary-light);
  --sn-surface-secondary:var(--sn-surface-alt);
  --sn-radius-sm:7px;
  --sn-radius-md:10px;
  --sn-radius-lg:12px;
}

/* ========================================
   SCREEN ONLY - NO PDF PRINT OVERRIDES
   ======================================== */

@media screen {

  /* 1. MAIN BACKGROUND */

  html,
  body {
    color:var(--sn-text);
  }

  body {
    background-color:var(--sn-bg);
  }

  /* 2. GENERAL SURFACES */

  .card,
  .stat-card,
  .dashboard-card,
  .hoCard,
  #snSiteApp .snsite-card {
    background-color:var(--sn-surface);
    border-color:var(--sn-border);
  }

  /* 3. SIDEBAR */

  .sidebar,
  .app-sidebar,
  #sidebar,
  #snMobileSidebar {
    background-color:var(--sn-surface);
    border-color:var(--sn-border);
  }

  .sidebar a:hover,
  .app-sidebar a:hover,
  #sidebar a:hover,
  #snMobileSidebar a:hover {
    background-color:var(--sn-primary-light);
    color:var(--sn-primary);
  }

  .sidebar .active,
  .app-sidebar .active,
  #sidebar .active,
  #snMobileSidebar .active,
  .sidebar [aria-current="page"],
  .app-sidebar [aria-current="page"] {
    background-color:var(--sn-primary-light);
    color:var(--sn-primary);
  }

  /* 4. BUTTON STATES */

  button:focus-visible,
  a:focus-visible,
  select:focus-visible,
  input:focus-visible {
    outline-color:var(--sn-primary);
  }

  .btn-primary,
  button.primary,
  #snSiteApp .snsite-primary {
    background-color:var(--sn-primary);
    border-color:var(--sn-primary);
    color:#FFFFFF;
  }

  .btn-primary:hover:not(:disabled),
  button.primary:hover:not(:disabled),
  #snSiteApp .snsite-primary:hover:not(:disabled) {
    background-color:var(--sn-primary-hover);
    border-color:var(--sn-primary-hover);
    color:#FFFFFF;
  }

  .btn-primary:active:not(:disabled),
  #snSiteApp .snsite-primary:active:not(:disabled) {
    background-color:var(--sn-primary-active);
  }

  .btn-success,
  button.success,
  #snSiteApp .snsite-success {
    background-color:var(--sn-success);
    border-color:var(--sn-success);
    color:#FFFFFF;
  }

  .btn-success:hover:not(:disabled),
  button.success:hover:not(:disabled),
  #snSiteApp .snsite-success:hover:not(:disabled) {
    background-color:var(--sn-success-hover);
    border-color:var(--sn-success-hover);
    color:#FFFFFF;
  }

  .btn-danger,
  button.danger {
    background-color:var(--sn-danger);
    border-color:var(--sn-danger);
    color:#FFFFFF;
  }

  .btn-danger:hover:not(:disabled),
  button.danger:hover:not(:disabled) {
    background-color:var(--sn-danger-hover);
  }

  .btn-secondary,
  button.secondary {
    background-color:var(--sn-surface);
    border-color:var(--sn-border);
    color:var(--sn-text);
  }

  .btn-secondary:hover:not(:disabled),
  button.secondary:hover:not(:disabled) {
    background-color:var(--sn-surface-alt);
  }

  /* 5. FORM COLOR */

  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    accent-color:var(--sn-primary);
  }

  input:focus,
  select:focus,
  textarea:focus {
    border-color:var(--sn-primary);
  }

  input[type="checkbox"],
  input[type="radio"] {
    accent-color:var(--sn-primary);
  }

  /* 6. GENERAL TABLE */

  table th {
    color:var(--sn-text);
  }

  table tbody tr:hover {
    background-color:var(--sn-surface-alt);
  }

  /* 7. PAGINATION */

  .pagination .active,
  .pagination button.active,
  .page-item.active .page-link {
    background-color:var(--sn-primary);
    border-color:var(--sn-primary);
    color:#FFFFFF;
  }

  /* 8. STATUS BADGES */

  .status-approved,
  .status-disetujui,
  .badge-success {
    background-color:var(--sn-success-light);
    color:var(--sn-success-text);
  }

  .status-pending,
  .status-menunggu,
  .badge-warning {
    background-color:var(--sn-warning-light);
    color:var(--sn-warning-text);
  }

  .status-rejected,
  .status-ditolak,
  .badge-danger {
    background-color:var(--sn-danger-light);
    color:var(--sn-danger);
  }

  /* =====================================
     PENGAJUAN SITE
     ===================================== */

  #snSiteApp {
    background-color:var(--sn-bg);
    color:var(--sn-text);
  }

  #snSiteApp .snsite-muted {
    color:var(--sn-text-muted);
  }

  #snSiteApp .snsite-tab.active {
    background-color:var(--sn-primary-light);
    color:var(--sn-primary);
    border-color:var(--sn-primary-border);
  }

  #snSiteApp .snsite-tab:not(.active):hover {
    background-color:var(--sn-surface-alt);
  }

  #snSiteApp input:focus,
  #snSiteApp select:focus,
  #snSiteApp textarea:focus {
    border-color:var(--sn-primary);
    box-shadow:0 0 0 2px var(--sn-focus);
  }

  #snSiteApp .snsite-table th {
    background-color:#EDF3F8;
    color:var(--sn-text);
    border-bottom-color:var(--sn-border);
  }

  #snSiteApp .snsite-group td,
  #snSiteApp .snxl-group td {
    background-color:var(--sn-primary-light);
    color:var(--sn-primary-active);
  }

  #snSiteApp .snsite-open {
    background-color:var(--sn-warning-light);
    color:var(--sn-warning-text);
  }

  #snSiteApp .snsite-close {
    background-color:var(--sn-success-light);
    color:var(--sn-success-text);
  }

  #snSiteApp .snsite-history-row {
    background-color:var(--sn-primary-light);
    color:var(--sn-primary);
  }

  #snSiteApp .snxl-rowselected td {
    background-color:var(--sn-primary-light);
  }

  #snSiteApp .snxl-filter:hover,
  #snSiteApp .snxl-filter.active {
    background-color:var(--sn-primary-light);
    color:var(--sn-primary);
    border-color:var(--sn-primary-border);
  }

  #snSiteApp .snxl-check,
  #snSiteApp .sn-site-check-item,
  #snSiteApp .sn-site-check-ro {
    accent-color:var(--sn-primary);
  }

  /* Sidebar Pengajuan Site */
  #snSiteLauncher:hover {
    color:var(--sn-primary);
  }

  /* 9. ALERTS */

  .alert-success {
    background-color:var(--sn-success-light);
    color:var(--sn-success-text);
    border-color:#B6DFC5;
  }

  .alert-warning {
    background-color:var(--sn-warning-light);
    color:var(--sn-warning-text);
    border-color:#F0D994;
  }

  .alert-danger {
    background-color:var(--sn-danger-light);
    color:var(--sn-danger);
    border-color:#F2B6BD;
  }

  /* 10. MOBILE NAVIGATION */

  #snMobileMenuBtn {
    background-color:var(--sn-surface);
    border-color:var(--sn-border);
    color:var(--sn-primary);
  }

  #snMobileMenuBtn:hover {
    background-color:var(--sn-primary-light);
  }

  /* Only color adjustments.
     No geometry or mobile layout rules. */
}