/* =============================================================================
   LiciBot — Trustworthy Gov-Tech Design System
   -----------------------------------------------------------------------------
   Loaded AFTER app.min.css (vendored Hyper theme) so these overrides win.
   The Hyper kit is driven entirely by --ct-* custom properties defined at
   :root; remapping them here re-skins sidebar/topbar/cards/buttons/tables for
   free. Component overrides below handle what the vars can't reach.

   Palette: deep navy + white, ONE restrained amber accent. No gradients.
   Sharp corners, hairline borders, data-dense. Do NOT edit app.min.css.
   ============================================================================= */

:root {
  /* ---- Brand / surface tokens ---------------------------------------- */
  --li-navy:        #0a1444;   /* primary brand */
  --li-navy-700:    #16215e;   /* hover / pressed */
  --li-navy-300:    #5566a3;   /* muted brand, focus rings */
  --li-ink:         #1b2230;   /* body text */
  --li-muted:       #667085;   /* secondary text */
  --li-line:        #e5e7ed;   /* hairline borders */
  --li-surface:     #f7f8fa;   /* page background */
  --li-surface-2:   #eef0f5;   /* subtle fills, table caps */
  --li-white:       #ffffff;

  /* ---- Single accent (de-saturated amber, premium not toy) ----------- */
  --li-accent:      #d99425;
  --li-accent-700:  #b97c14;
  --li-accent-weak: #fbf3e3;

  /* ---- Functional status (flat, no gradients) ------------------------ */
  --li-success:     #1d9d6c;
  --li-warn:        #c98a17;
  --li-danger:      #d14545;

  /* ---- Geometry ------------------------------------------------------ */
  --li-radius:      6px;
  --li-radius-sm:   4px;
  --li-shadow:      0 1px 2px rgba(16,24,40,.06), 0 1px 3px rgba(16,24,40,.04);
  --li-shadow-none: none;

  /* ---- Type ---------------------------------------------------------- */
  --li-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* ==================================================================== */
  /* Remap Hyper (--ct-*) vars onto the gov-tech tokens                    */
  /* ==================================================================== */
  --ct-primary:               var(--li-navy);
  --ct-primary-rgb:           10, 20, 68;
  --ct-component-active-bg:    var(--li-navy);
  --ct-component-active-color: #fff;

  --ct-body-bg:        var(--li-surface);
  --ct-body-color:     var(--li-ink);
  --ct-body-font-family: var(--li-font);

  --ct-link-color:       var(--li-navy);
  --ct-link-hover-color: var(--li-accent-700);

  --ct-border-color:   var(--li-line);
  --ct-box-shadow:     var(--li-shadow);
  --ct-box-shadow-sm:  var(--li-shadow);
  --ct-box-shadow-lg:  0 4px 12px rgba(16,24,40,.08);

  --ct-card-bg:           var(--li-white);
  --ct-card-border-color: var(--li-line);
  --ct-card-cap-bg:       var(--li-white);

  /* sidebar + topbar stay light; navy is the brand/active color */
  --ct-bg-leftbar:        var(--li-white);
  --ct-bg-topbar-light:   var(--li-white);
  --ct-menu-item-active:    var(--li-navy);
  --ct-menu-item-hover:     var(--li-navy);
  --ct-menu-sub-item-active: var(--li-navy);

  --ct-progress-bar-bg:   var(--li-navy);

  /* inputs: navy focus instead of bootstrap blue */
  --ct-input-focus-border-color: var(--li-navy-300);
  --ct-input-btn-focus-color:    rgba(10, 20, 68, .18);
  --ct-input-border-color:       #d3d7e0;
}

/* =============================================================================
   Typography — vendor hardcodes Roboto/Karla in component rules, override here
   ============================================================================= */
body,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
#sidebar-menu > ul > li > a,
.navbar-custom,
.btn,
.card-title,
.page-title-box .page-title {
  font-family: var(--li-font);
}

body { color: var(--li-ink); -webkit-font-smoothing: antialiased; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--li-ink);
  font-weight: 650;
  letter-spacing: -0.01em;
}

/* =============================================================================
   Cards — sharp corners, hairline border, no floaty shadow
   ============================================================================= */
.card {
  border: 1px solid var(--li-line);
  border-radius: var(--li-radius);
  box-shadow: var(--li-shadow);
}
.card .card-header {
  background: var(--li-white);
  border-bottom: 1px solid var(--li-line);
  font-weight: 600;
}

/* =============================================================================
   Buttons — flat, navy primary; amber reserved for one key CTA per view
   ============================================================================= */
.btn { border-radius: var(--li-radius-sm); font-weight: 600; }

.btn-primary {
  background-color: var(--li-navy);
  border-color: var(--li-navy);
  color: #fff;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--li-navy-700) !important;
  border-color: var(--li-navy-700) !important;
}

.btn-outline-primary {
  color: var(--li-navy);
  border-color: var(--li-navy);
}
.btn-outline-primary:hover,
.btn-outline-primary:active {
  background-color: var(--li-navy);
  border-color: var(--li-navy);
  color: #fff;
}

/* The single emphasis CTA */
.btn-accent {
  background-color: var(--li-accent);
  border-color: var(--li-accent);
  color: #1b2230;
  border-radius: var(--li-radius-sm);
  font-weight: 700;
}
.btn-accent:hover,
.btn-accent:focus {
  background-color: var(--li-accent-700);
  border-color: var(--li-accent-700);
  color: #fff;
}

/* =============================================================================
   Tables — denser, micro uppercase headers, bottom-border-only rows
   ============================================================================= */
.table > thead th {
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .72rem;
  font-weight: 600;
  color: var(--li-muted);
  border-bottom: 1px solid var(--li-line);
  background: var(--li-surface-2);
  white-space: nowrap;
}
.table > tbody > tr > td {
  border-top: 0;
  border-bottom: 1px solid var(--li-line);
  vertical-align: middle;
}
.table-hover > tbody > tr:hover > * {
  background-color: rgba(10, 20, 68, .03);
}

/* =============================================================================
   Badges — flat fills (kills any vendor gradient)
   ============================================================================= */
.badge { font-weight: 600; border-radius: var(--li-radius-sm); }
.bg-primary { background-color: var(--li-navy) !important; }
.text-primary { color: var(--li-navy) !important; }
.bg-success { background-color: var(--li-success) !important; }
.bg-warning { background-color: var(--li-warn) !important; }
.bg-danger  { background-color: var(--li-danger) !important; }

/* =============================================================================
   Sidebar — navy active item with left accent rule (the ▌ indicator)
   ============================================================================= */
#sidebar-menu > ul > li > a { font-weight: 500; }
#sidebar-menu > ul > li > a.active,
#sidebar-menu > ul > li.mm-active > a {
  color: var(--li-navy);
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--li-navy);
  background-color: rgba(10, 20, 68, .04);
}
#sidebar-menu .menu-title {
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .68rem;
}

/* =============================================================================
   Focus rings — navy, consistent
   ============================================================================= */
.form-control:focus,
.form-select:focus {
  border-color: var(--li-navy-300);
  box-shadow: 0 0 0 .15rem rgba(10, 20, 68, .15);
}

/* =============================================================================
   Reusable surface helpers for template-level styling
   ============================================================================= */
.li-section-navy { background: var(--li-navy); color: #fff; }
.li-stat-rule { height: 2px; width: 2.25rem; background: var(--li-accent); border: 0; margin: .4rem 0 0; }
.li-accent-text { color: var(--li-accent-700); }
.li-card-flat { background: #fff; border: 1px solid var(--li-line); border-radius: var(--li-radius); box-shadow: var(--li-shadow); }