/* =========================================================
   ParcoSicuro theme for Bootstrap 5.3.x (LIGHT)
   Include AFTER bootstrap.min.css
   Works with your current layout:
   - navbar-dark bg-primary
   - cards, tables, forms, alerts, badges
   ========================================================= */

/* ---------------------------
   Brand palette (from logo)
---------------------------- */
:root {
  --ps-blue: #03377D;
  --ps-blue-700: #022E69;
  --ps-blue-800: #022455;

  --ps-green: #417A18;
  --ps-green-700: #356514;
  --ps-green-800: #2A5010;

  --ps-sky: #1DAEE9;
  --ps-sky-700: #1696C9;

  --ps-yellow: #F8BE1E;
  --ps-yellow-700: #D9A316;

  --ps-success: #8CC04D;

  /* neutrals (light UI) */
  --ps-bg: #F7FAFC;
  --ps-surface: #FFFFFF;
  --ps-surface-2: #F1F5F9;
  --ps-border: #E2E8F0;
  --ps-text: #0F172A;
  --ps-muted: #475569;
}

/* ---------------------------
   Bootstrap variable mapping
---------------------------- */
:root,
[data-bs-theme="light"] {
  --bs-primary: var(--ps-blue);
  --bs-secondary: var(--ps-green);
  --bs-success: var(--ps-success);
  --bs-info: var(--ps-sky);
  --bs-warning: var(--ps-yellow);

  --bs-body-bg: var(--ps-bg);
  --bs-body-color: var(--ps-text);

  --bs-border-color: var(--ps-border);

  --bs-link-color: var(--ps-blue);
  --bs-link-hover-color: var(--ps-blue-700);

  --bs-focus-ring-color: rgba(3, 55, 125, 0.25);

  --bs-card-bg: var(--ps-surface);
  --bs-card-border-color: var(--ps-border);

  --bs-form-control-bg: var(--ps-surface);
  --bs-form-control-border-color: var(--ps-border);
}

/* ---------------------------
   Page feel (gestionale)
---------------------------- */
body {
  background: var(--bs-body-bg);
}

.text-muted { color: var(--ps-muted) !important; }

.card,
.dropdown-menu,
.modal-content,
.offcanvas,
.toast {
  border-color: var(--bs-border-color);
  border-radius: 14px;
  box-shadow: 0 8px 30px rgba(2, 8, 23, 0.06);
}

.card-header {
  background: var(--ps-surface);
  border-bottom-color: var(--bs-border-color);
}

/* Keep your card headers (bg-primary text-white) nice and crisp */
.card-header.bg-primary {
  background: linear-gradient(180deg, var(--ps-blue) 0%, var(--ps-blue-700) 100%) !important;
  border-bottom-color: rgba(255,255,255,0.12) !important;
}

/* Footer uses bg-light in your view */
.bg-light { background-color: var(--ps-surface-2) !important; }

/* ---------------------------
   Navbar (your current: navbar-dark bg-primary)
---------------------------- */
.navbar.bg-primary {
  background: linear-gradient(180deg, var(--ps-blue) 0%, var(--ps-blue-700) 100%) !important;
  box-shadow: 0 10px 25px rgba(2, 8, 23, 0.10);
}

.navbar-dark .navbar-brand,
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255,255,255,0.92);
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: #ffffff;
}

.navbar-dark .navbar-nav .nav-link.active {
  color: #ffffff;
  text-decoration: none;
  position: relative;
}

.navbar-dark .navbar-nav .nav-link.active::after {
  content: "";
  position: absolute;
  left: 0.6rem;
  right: 0.6rem;
  bottom: -0.35rem;
  height: 2px;
  background: rgba(248, 190, 30, 0.95); /* brand yellow underline */
  border-radius: 2px;
}

/* Dropdowns in navbar: make them “clean” */
.navbar .dropdown-menu {
  border-color: var(--bs-border-color);
}
.navbar .dropdown-item:active {
  background-color: rgba(3, 55, 125, 0.10);
  color: var(--ps-text);
}

/* ---------------------------
   Buttons
---------------------------- */
.btn { border-radius: 12px; font-weight: 600; }

.btn-primary {
  --bs-btn-bg: var(--ps-blue);
  --bs-btn-border-color: var(--ps-blue);
  --bs-btn-hover-bg: var(--ps-blue-700);
  --bs-btn-hover-border-color: var(--ps-blue-700);
  --bs-btn-active-bg: var(--ps-blue-800);
  --bs-btn-active-border-color: var(--ps-blue-800);
  --bs-btn-focus-shadow-rgb: 3, 55, 125;
}

.btn-secondary {
  --bs-btn-bg: var(--ps-green);
  --bs-btn-border-color: var(--ps-green);
  --bs-btn-hover-bg: var(--ps-green-700);
  --bs-btn-hover-border-color: var(--ps-green-700);
  --bs-btn-active-bg: var(--ps-green-800);
  --bs-btn-active-border-color: var(--ps-green-800);
  --bs-btn-focus-shadow-rgb: 65, 122, 24;
}

/* Outline buttons used in tables/actions */
.btn-outline-primary {
  --bs-btn-color: var(--ps-blue);
  --bs-btn-border-color: rgba(3, 55, 125, 0.35);
  --bs-btn-hover-bg: var(--ps-blue);
  --bs-btn-hover-border-color: var(--ps-blue);
}

.btn-outline-secondary {
  --bs-btn-color: var(--ps-green);
  --bs-btn-border-color: rgba(65, 122, 24, 0.35);
  --bs-btn-hover-bg: var(--ps-green);
  --bs-btn-hover-border-color: var(--ps-green);
}

/* Warning: better contrast in UI */
.btn-warning {
  --bs-btn-color: #1f2937;
  --bs-btn-bg: var(--ps-yellow);
  --bs-btn-border-color: var(--ps-yellow);
  --bs-btn-hover-bg: var(--ps-yellow-700);
  --bs-btn-hover-border-color: var(--ps-yellow-700);
}

/* ---------------------------
   Forms (login/mfa/create views)
---------------------------- */
.form-control,
.form-select,
.input-group-text {
  border-radius: 12px;
  border-color: var(--bs-border-color);
}

.input-group-text {
  background: var(--ps-surface-2);
  color: var(--ps-muted);
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(3, 55, 125, 0.45);
  box-shadow: 0 0 0 0.25rem rgba(3, 55, 125, 0.15);
}

.form-check-input:checked {
  background-color: var(--ps-blue);
  border-color: var(--ps-blue);
}

.form-switch .form-check-input:checked {
  background-color: var(--ps-green);
  border-color: var(--ps-green);
}

/* ---------------------------
   Tables (index + liste)
---------------------------- */
.table thead th {
  background: var(--ps-surface-2);
  color: var(--ps-muted);
  border-bottom: 1px solid var(--bs-border-color);
}

.table-hover tbody tr:hover {
  background: rgba(29, 174, 233, 0.06); /* info tint */
}

/* If you use .table-light anywhere */
.table-light {
  --bs-table-bg: var(--ps-surface-2);
}

/* ---------------------------
   Alerts / Badges
---------------------------- */
.alert-primary {
  --bs-alert-bg: rgba(3, 55, 125, 0.08);
  --bs-alert-border-color: rgba(3, 55, 125, 0.20);
  --bs-alert-color: var(--ps-blue-800);
}

.alert-info {
  --bs-alert-bg: rgba(29, 174, 233, 0.10);
  --bs-alert-border-color: rgba(29, 174, 233, 0.20);
  --bs-alert-color: #073042;
}

.badge.bg-primary { background-color: var(--ps-blue) !important; }
.badge.bg-secondary { background-color: var(--ps-green) !important; }
.badge.bg-info { background-color: var(--ps-sky) !important; color: #073042 !important; }
.badge.bg-warning { background-color: var(--ps-yellow) !important; color: #1f2937 !important; }

/* ---------------------------
   Optional: small utility helpers
---------------------------- */
.ps-surface { background: var(--ps-surface) !important; }
.ps-surface-2 { background: var(--ps-surface-2) !important; }
.ps-border { border-color: var(--ps-border) !important; }