/* Resilionics Support — customer-facing edge theme.
   Design tokens + component restyle modeled on apexweb2 / tourexweb. One polished
   Resilionics theme plus a high-contrast accessibility mode (body.hc). Mobile-app
   friendly: rem units, 44px touch targets, design tokens ready for native reuse. */

:root {
  --rs-primary: #2563eb;
  --rs-primary-hover: #1d4ed8;
  --rs-primary-soft: #eaf1ff;
  --rs-accent: #6e45e2;
  --rs-bg: #f5f7fb;
  --rs-surface: #ffffff;
  --rs-border: #e5e9f0;
  --rs-divider: #eef1f6;
  --rs-text: #1f2937;
  --rs-text-muted: #6b7280;
  --rs-radius: 12px;
  --rs-radius-sm: 8px;
  --rs-shadow-sm: 0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .08);
  --rs-shadow: 0 6px 18px rgba(16, 24, 40, .08);
  --rs-navbar-h: 60px;
}

body {
  background: var(--rs-bg);
  color: var(--rs-text);
  font-size: 1rem;
}

/* ---- Navbar ------------------------------------------------------------- */
.navbar.bg-dark {
  background: linear-gradient(90deg, #0b1f3a 0%, #112a4d 100%) !important;
  min-height: var(--rs-navbar-h);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .04), 0 2px 10px rgba(2, 12, 27, .25);
}
.navbar .nav-link { color: rgba(255, 255, 255, .8); font-weight: 500; border-radius: 6px; padding: .35rem .65rem; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color: #fff; background: rgba(255, 255, 255, .08); }

/* ---- Cards ------------------------------------------------------------- */
.card {
  border: 1px solid var(--rs-border);
  border-radius: var(--rs-radius);
  box-shadow: var(--rs-shadow-sm);
}
.card .card-header {
  background: var(--rs-surface);
  border-bottom: 1px solid var(--rs-divider);
  font-weight: 600;
  border-top-left-radius: var(--rs-radius) !important;
  border-top-right-radius: var(--rs-radius) !important;
}

/* ---- Stat cards (dashboard) ------------------------------------------- */
.stat-card .card {
  border-left: 4px solid var(--rs-primary);
  transition: transform .12s ease, box-shadow .12s ease;
  height: 100%;
}
.stat-card:hover .card { transform: translateY(-2px); box-shadow: var(--rs-shadow); }
.stat-value { font-size: 1.7rem; font-weight: 700; line-height: 1.1; color: var(--rs-text); }
.stat-label { font-size: .8rem; color: var(--rs-text-muted); text-transform: uppercase; letter-spacing: .03em; }

/* ---- Buttons ----------------------------------------------------------- */
.btn { border-radius: var(--rs-radius-sm); font-weight: 500; }
.btn-primary {
  --bs-btn-bg: var(--rs-primary); --bs-btn-border-color: var(--rs-primary);
  --bs-btn-hover-bg: var(--rs-primary-hover); --bs-btn-hover-border-color: var(--rs-primary-hover);
  --bs-btn-active-bg: var(--rs-primary-hover);
}
.btn-lg, .btn { min-height: 2.4rem; }

/* ---- Forms ------------------------------------------------------------- */
.form-label { font-weight: 500; color: #374151; margin-bottom: .3rem; }
.form-control, .form-select { border-radius: var(--rs-radius-sm); border-color: var(--rs-border); padding: .5rem .75rem; }
.form-control:focus, .form-select:focus { border-color: #93c0ff; box-shadow: 0 0 0 .2rem rgba(37, 99, 235, .18); }

/* ---- Tables ------------------------------------------------------------ */
.table { --bs-table-hover-bg: #f3f6fb; }
.table > thead th {
  text-transform: uppercase; font-size: .74rem; letter-spacing: .03em; font-weight: 700;
  color: var(--rs-text-muted); background: #f8fafc; border-bottom: 1px solid var(--rs-border);
}
.table > tbody td { vertical-align: middle; }

/* ---- Auth (login / reset / onboard) hero ------------------------------ */
.auth-page { background: linear-gradient(135deg, #0b1f3a 0%, #1d3a6b 55%, #2f4d86 100%); }
/* Center vertically without shrinking the row: column flow keeps children full-width. */
.auth-page main.container { min-height: calc(100vh - var(--rs-navbar-h)); display: flex; flex-direction: column; justify-content: center; }
.auth-page .card { box-shadow: var(--rs-shadow); border: 0; }

/* ---- High-contrast accessibility mode --------------------------------- */
body.hc {
  --rs-primary: #0040a0; --rs-primary-hover: #002e75; --rs-border: #000000;
  --rs-text: #000000; --rs-text-muted: #1a1a1a; --rs-bg: #ffffff; --rs-surface: #ffffff;
}
body.hc .card { border: 2px solid #000; box-shadow: none; }
body.hc a:not(.btn) { text-decoration: underline; }
body.hc .table > thead th { color: #000; background: #e8e8e8; }

/* ---- Responsive / touch ----------------------------------------------- */
@media (max-width: 575.98px) {
  .navbar .navbar-nav { gap: .25rem !important; }
  .btn, .form-control, .form-select { min-height: 44px; }   /* WCAG touch target */
  .stat-value { font-size: 1.4rem; }
}