/* ==========================================================================
   MyABR THEME — design tokens + RISE component skin
   --------------------------------------------------------------------------
   Loaded from app/Views/includes/custom_head.php AFTER app.all.css and
   custom-style.css, with its own cache-busting version (Config\Myabr).

   RULES FOR FUTURE EDITS
   - Colours live ONLY in the :root tokens below. Components reference
     tokens, never raw hex. A later "Platform branding" setting can print a
     small <style>:root{--myabr-primary:...}</style> after this file and the
     whole portal follows.
   - Status colours (success / warning / danger / info) are separate from
     the brand colour on purpose, so a brand change never recolours
     "Overdue" or "Paid".
   - RISE injects a sidebar colour file (assets/css/color/<theme>.css) with
     JavaScript AFTER this file loads, so sidebar rules below are scoped
     under `body` and use !important where that file would otherwise win.
   ========================================================================== */

/* ---------- Font: Inter, self-hosted (SIL OFL, see assets/fonts/inter) ---------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../../fonts/inter/inter-latin-ext-wght-normal.woff2") format("woff2-variations"),
       url("../../fonts/inter/inter-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("../../fonts/inter/inter-latin-wght-normal.woff2") format("woff2-variations"),
       url("../../fonts/inter/inter-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Tokens ---------- */
:root {
  /* brand */
  --myabr-primary: #2A1E66;
  --myabr-primary-hover: #140A3C;
  --myabr-primary-active: #0D0630;
  --myabr-primary-soft: #E9E8FD;
  --myabr-primary-soft-2: #C9C6F7;
  --myabr-focus-ring: 0 0 0 3px rgba(116, 113, 232, 0.35);

  /* ink */
  --myabr-navy: #140A3C;
  --myabr-text: #140A3C;
  --myabr-text-2: #2D2950;   /* secondary text — 7.1:1 on white */
  --myabr-muted: #5E5B7B;    /* helper text — 5.3:1 on white */

  /* surfaces */
  --myabr-bg: #F3F3F5;
  --myabr-surface: #ffffff;
  --myabr-surface-2: #f8fafc;
  --myabr-border: #E5E4ED;
  --myabr-border-strong: #cbd3df;

  /* status (not brand) */
  --myabr-success: #117a55;
  --myabr-success-soft: #e5f4ee;
  --myabr-warning: #8a5300;
  --myabr-warning-dot: #d98a00;
  --myabr-warning-soft: #fdf1dc;
  --myabr-danger: #c42b3c;
  --myabr-danger-soft: #fdecee;
  --myabr-info: #4C47C7;
  --myabr-info-soft: #E9E8FD;
  --myabr-neutral: #55647a;
  --myabr-neutral-soft: #eef1f5;

  /* shape + depth */
  --myabr-radius-sm: 6px;
  --myabr-radius: 8px;
  --myabr-radius-lg: 12px;
  --myabr-shadow-sm: 0 1px 2px rgba(20, 10, 60, 0.05);
  --myabr-shadow: 0 1px 3px rgba(20, 10, 60, 0.06), 0 1px 2px rgba(20, 10, 60, 0.04);
  --myabr-shadow-lg: 0 12px 32px rgba(20, 10, 60, 0.14);

  /* type */
  --myabr-font: "Inter", "Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;

  /* layout */
  --myabr-sidebar-w: 248px;
  --myabr-topbar-h: 64px;

  /* legacy aliases — older screens still read the Fairway variable names */
  --fj-sidebar: var(--myabr-surface);
  --fj-accent: var(--myabr-primary);
  --fj-accent-hover: var(--myabr-primary-hover);
  --fj-accent-soft: var(--myabr-primary-soft);
  --fj-gold: var(--myabr-warning-dot);
  --fj-gold-soft: var(--myabr-warning-soft);
  --fj-ink: var(--myabr-text);
  --fj-gray: var(--myabr-muted);
  --fj-gray-light: var(--myabr-border-strong);

  /* Bootstrap 5 variables used by utility classes */
  --bs-primary: #2A1E66;
  --bs-primary-rgb: 42, 30, 102;
  --bs-link-color: #4C47C7;
  --bs-link-hover-color: #140A3C;
  --bs-body-color: #2D2950;
  --bs-body-font-family: var(--myabr-font);
  --bs-border-color: #E5E4ED;
}

/* ---------- Base ---------- */
html,
body {
  font-family: var(--myabr-font) !important;
  color: var(--myabr-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
body,
.page-container,
.scrollable-page,
#page-content,
.page-wrapper {
  background-color: var(--myabr-bg);
}
body { font-size: 14px; line-height: 1.5; }
h1, h2, h3, h4, h5, h6 { color: var(--myabr-navy); letter-spacing: -0.01em; font-weight: 650; }
a { color: var(--myabr-primary); }
a:hover { color: var(--myabr-primary-hover); }
.text-primary { color: var(--myabr-primary) !important; }
.text-muted, .text-off { color: var(--myabr-muted) !important; }
.bg-primary { background-color: var(--myabr-primary) !important; }
::selection { background: var(--myabr-primary-soft-2); color: var(--myabr-navy); }

/* one consistent keyboard focus ring everywhere */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
[tabindex]:focus-visible,
.nav-link:focus-visible,
.page-link:focus-visible {
  outline: none !important;
  box-shadow: var(--myabr-focus-ring) !important;
  border-radius: var(--myabr-radius-sm);
}

/* ---------- Sidebar ---------- */
body .sidebar,
body .sidebar .sidebar-scroll,
body .sidebar-scroll {
  background: var(--myabr-surface) !important;
}
body .sidebar {
  border-right: 1px solid var(--myabr-border);
  box-shadow: none;
}
body .sidebar .sidebar-brand {
  background: var(--myabr-surface) !important;
  border-bottom: 1px solid var(--myabr-border);
}
/* note: never set `display` here - RISE toggles .brand-logo / .brand-logo-mini */
body .sidebar .brand-logo img.dashboard-image {
  max-height: 38px;
  width: auto;
  max-width: 190px;
  margin-top: 13px;
}
body .sidebar .brand-logo-mini img.dashboard-image { max-height: 32px; width: auto; border-radius: 7px; }
body #default-navbar .brand-logo img { max-height: 30px; width: auto; }
body .sidebar-menu { padding: 12px 10px 72px; }
body .sidebar-menu li a {
  color: var(--myabr-text-2) !important;
  background: transparent !important;
  border-radius: var(--myabr-radius);
  margin: 1px 0;
  font-weight: 500;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 2px;
  transition: background-color .15s ease, color .15s ease;
}
body .sidebar-menu li a .icon { color: var(--myabr-muted); stroke-width: 1.8; }
body .sidebar-menu li a:hover,
body .sidebar-menu li a:focus {
  background: var(--myabr-surface-2) !important;
  color: var(--myabr-navy) !important;
}
body .sidebar-menu li.active > a,
body .sidebar-menu li.active > a:hover {
  background: var(--myabr-primary-soft) !important;
  color: var(--myabr-primary) !important;
  font-weight: 600;
}
body .sidebar-menu li.active > a .icon { color: var(--myabr-primary); }
body .sidebar-menu li ul { background: transparent !important; }
body .sidebar-menu li ul li a { font-weight: 400; font-size: 13.5px; }
body .sidebar-menu .menu-text { flex: 1 1 auto; min-width: 0; white-space: normal; line-height: 1.3; }

/* "Soon" chip on planned modules */
body .sidebar-menu .badge.myabr-soon-badge {
  background: var(--myabr-neutral-soft) !important;
  color: var(--myabr-neutral) !important;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .01em;
  padding: 3px 7px;
  border-radius: 999px;
  margin-left: auto;
  flex: none;
}
body .sidebar-menu li.active > a .badge.myabr-soon-badge {
  background: var(--myabr-surface) !important;
}
/* section separators added by the menu hook */
body .sidebar-menu li.myabr-menu-divider-before { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--myabr-border); }

/* bottom-of-sidebar platform note */
.myabr-sidebar-footer {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 12px 20px;
  font-size: 11.5px;
  color: var(--myabr-muted);
  background: var(--myabr-surface);
  border-top: 1px solid var(--myabr-border);
  z-index: 2;
}
.sidebar-toggled .myabr-sidebar-footer { display: none; }
.fj-sidebar-footer { display: none !important; } /* retired Fairway footer, if cached JS injects it */

/* ---------- Top bar ---------- */
body .navbar-custom,
body #default-navbar {
  background: var(--myabr-surface) !important;
  border-bottom: 1px solid var(--myabr-border);
  box-shadow: none !important;
}
body .navbar-custom .nav-link,
body .navbar-custom .nav-link .icon { color: var(--myabr-text-2); }
body .navbar-custom .nav-link:hover .icon,
body .navbar-custom .nav-link:hover { color: var(--myabr-primary); }
body .navbar-custom .dropdown-menu { border-radius: var(--myabr-radius-lg); }

/* ---------- Page header ---------- */
.page-title {
  background: transparent;
  border-bottom: 1px solid var(--myabr-border);
}
.card > .page-title { background: var(--myabr-surface); }
.page-title h1,
.page-title h4 {
  font-size: 18px !important;
  font-weight: 650;
  color: var(--myabr-navy);
}
.myabr-page-head { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: flex-end; justify-content: space-between; margin: 4px 0 20px; }
.myabr-page-head h1 { font-size: 26px; line-height: 1.2; margin: 0 0 4px; font-weight: 700; }
.myabr-page-head p { margin: 0; color: var(--myabr-text-2); font-size: 15px; }
.myabr-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--myabr-muted); margin-bottom: 6px; }

/* ---------- Cards ---------- */
.card {
  background: var(--myabr-surface);
  border: 1px solid var(--myabr-border) !important;
  border-radius: var(--myabr-radius-lg) !important;
  box-shadow: var(--myabr-shadow-sm);
}
.card .card-header {
  background: var(--myabr-surface);
  border-bottom: 1px solid var(--myabr-border);
  border-radius: var(--myabr-radius-lg) var(--myabr-radius-lg) 0 0 !important;
  font-weight: 600;
  color: var(--myabr-navy);
}
.card .card-footer { background: var(--myabr-surface-2); border-top: 1px solid var(--myabr-border); }
.bg-white { background-color: var(--myabr-surface) !important; }
.box, .panel { border-color: var(--myabr-border); }

/* ---------- Buttons ---------- */
.btn {
  font-weight: 600;
  border-radius: var(--myabr-radius) !important;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.btn-primary,
.btn-info {
  background-color: var(--myabr-primary) !important;
  border-color: var(--myabr-primary) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-info:hover { background-color: var(--myabr-primary-hover) !important; border-color: var(--myabr-primary-hover) !important; }
.btn-primary:active,
.btn-primary.active { background-color: var(--myabr-primary-active) !important; border-color: var(--myabr-primary-active) !important; }
.btn-default,
.btn-light,
.btn-outline-light {
  background: var(--myabr-surface) !important;
  border: 1px solid var(--myabr-border-strong) !important;
  color: var(--myabr-navy) !important;
}
.btn-default:hover,
.btn-light:hover,
.btn-outline-light:hover { background: var(--myabr-surface-2) !important; border-color: var(--myabr-muted) !important; }
.btn-success { background-color: var(--myabr-success) !important; border-color: var(--myabr-success) !important; }
.btn-danger { background-color: var(--myabr-danger) !important; border-color: var(--myabr-danger) !important; }
.btn-warning { background-color: var(--myabr-warning-dot) !important; border-color: var(--myabr-warning-dot) !important; color: #1f1400 !important; }
.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
  opacity: 1 !important;
  background: var(--myabr-neutral-soft) !important;
  border-color: var(--myabr-border) !important;
  color: var(--myabr-muted) !important;
  cursor: not-allowed;
}
.btn .spinning, .spinning-btn { opacity: .9; }
.btn-soft {
  background: var(--myabr-primary-soft) !important;
  border: 1px solid transparent !important;
  color: var(--myabr-primary) !important;
}
.btn-soft:hover { background: var(--myabr-primary-soft-2) !important; }

/* ---------- Forms ---------- */
.form-control,
.form-select,
.select2-container .select2-choice,
.select2-container-multi .select2-choices {
  border: 1px solid var(--myabr-border-strong) !important;
  border-radius: var(--myabr-radius) !important;
  color: var(--myabr-text);
  background-color: var(--myabr-surface);
  box-shadow: none;
}
.form-control::placeholder { color: #8391a7; }
.form-control:hover, .form-select:hover { border-color: #a9b5c7 !important; }
.form-control:focus,
.form-select:focus,
.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
  border-color: var(--myabr-primary) !important;
  box-shadow: var(--myabr-focus-ring) !important;
  outline: none;
}
.form-control:disabled,
.form-control[readonly] { background-color: var(--myabr-surface-2); color: var(--myabr-muted); }
label, .form-label, .col-form-label { color: var(--myabr-navy); font-weight: 500; }
.form-check-input:checked { background-color: var(--myabr-primary) !important; border-color: var(--myabr-primary) !important; }
.form-check-input:focus { box-shadow: var(--myabr-focus-ring); border-color: var(--myabr-primary); }

/* validation (jquery-validate adds .error / label.error) */
.form-control.error,
.form-control.is-invalid,
input.error, textarea.error, select.error {
  border-color: var(--myabr-danger) !important;
  background-image: none;
}
.form-control.error:focus { box-shadow: 0 0 0 3px rgba(196, 43, 60, .18) !important; }
label.error,
span.error,
.invalid-feedback {
  color: var(--myabr-danger) !important;
  font-size: 12.5px;
  font-weight: 500;
  margin-top: 4px;
  display: block;
}

/* ---------- Tables / DataTables ---------- */
.table { color: var(--myabr-text); border-color: var(--myabr-border); }
.table > thead > tr > th,
.table thead th,
table.dataTable thead th {
  background: var(--myabr-surface-2) !important;
  color: var(--myabr-text-2) !important;
  font-size: 12.5px;
  font-weight: 600;
  text-transform: none;
  border-bottom: 1px solid var(--myabr-border) !important;
  border-top: 0 !important;
}
.table > tbody > tr > td,
table.dataTable tbody td { border-color: var(--myabr-border) !important; vertical-align: middle; }
.table-hover > tbody > tr:hover > *,
table.dataTable tbody tr:hover > * { background-color: #f6f8fd !important; --bs-table-accent-bg: #f6f8fd; }
.dataTables_empty,
td.dataTables_empty {
  color: var(--myabr-muted) !important;
  padding: 36px 16px !important;
  text-align: center;
  background: var(--myabr-surface) !important;
}
.datatable-tools,
.filter-section-container { background: var(--myabr-surface); }
.dataTables_info { color: var(--myabr-muted) !important; font-size: 13px; }

/* ---------- Pagination ---------- */
.pagination .page-link,
.dataTables_paginate .paginate_button a,
.dataTables_paginate .page-link {
  color: var(--myabr-navy) !important;
  border: 1px solid var(--myabr-border) !important;
  background: var(--myabr-surface) !important;
  border-radius: var(--myabr-radius) !important;
  margin: 0 2px;
  min-width: 34px;
  text-align: center;
}
.pagination .page-link:hover,
.dataTables_paginate .paginate_button a:hover { background: var(--myabr-surface-2) !important; border-color: var(--myabr-border-strong) !important; }
.pagination .active > .page-link,
.pagination .page-item.active .page-link,
.dataTables_paginate .paginate_button.active a {
  background: var(--myabr-primary) !important;
  border-color: var(--myabr-primary) !important;
  color: #fff !important;
}
.pagination .disabled > .page-link,
.dataTables_paginate .paginate_button.disabled a { color: #9aa6b8 !important; background: var(--myabr-surface-2) !important; }

/* ---------- Tabs ---------- */
.nav-tabs { border-bottom: 1px solid var(--myabr-border) !important; background: var(--myabr-surface); }
.nav-tabs .nav-link,
.nav-tabs > li > a {
  color: var(--myabr-text-2) !important;
  font-weight: 500;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.nav-tabs .nav-link:hover,
.nav-tabs > li > a:hover { color: var(--myabr-navy) !important; border-bottom-color: var(--myabr-border-strong) !important; }
.nav-tabs .nav-link.active,
.nav-tabs > li.active > a,
.nav-tabs .nav-item.show .nav-link {
  color: var(--myabr-primary) !important;
  border-bottom-color: var(--myabr-primary) !important;
  font-weight: 600;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link { background: var(--myabr-primary-soft) !important; color: var(--myabr-primary) !important; }
.list-group-item.active { background: var(--myabr-primary-soft); border-color: var(--myabr-primary-soft-2); color: var(--myabr-primary); }

/* ---------- Modals ---------- */
.modal-content {
  border: 1px solid var(--myabr-border);
  border-radius: var(--myabr-radius-lg) !important;
  box-shadow: var(--myabr-shadow-lg);
}
.modal-header { border-bottom: 1px solid var(--myabr-border); padding: 18px 22px; }
.modal-header .modal-title { font-weight: 650; color: var(--myabr-navy); font-size: 17px; }
.modal-body { padding: 20px 22px; }
.modal-footer { border-top: 1px solid var(--myabr-border); background: var(--myabr-surface-2); border-radius: 0 0 var(--myabr-radius-lg) var(--myabr-radius-lg); }
.modal-backdrop.show { background: #100830; opacity: .45; }

/* ---------- Alerts ---------- */
.alert {
  border-radius: var(--myabr-radius) !important;
  border: 1px solid transparent;
  font-size: 14px;
}
.alert-success { background: var(--myabr-success-soft) !important; border-color: #bfe3d3 !important; color: var(--myabr-success) !important; }
.alert-warning { background: var(--myabr-warning-soft) !important; border-color: #f3d9a8 !important; color: var(--myabr-warning) !important; }
.alert-danger  { background: var(--myabr-danger-soft) !important; border-color: #f4c3c9 !important; color: var(--myabr-danger) !important; }
.alert-info    { background: var(--myabr-info-soft) !important; border-color: var(--myabr-primary-soft-2) !important; color: var(--myabr-info) !important; }
/* RISE's floating toast (appAlert) */
.app-alert .alert { box-shadow: var(--myabr-shadow-lg); }

/* ---------- Badges / status pills ---------- */
.badge { font-weight: 600; border-radius: 999px; padding: .38em .7em; }
.badge.bg-primary { background: var(--myabr-primary-soft) !important; color: var(--myabr-primary) !important; }
.sidebar-menu .badge.bg-primary { background: var(--myabr-primary) !important; color: #fff !important; }
.badge.bg-success, .badge-success { background: var(--myabr-success-soft) !important; color: var(--myabr-success) !important; }
.badge.bg-danger, .badge-danger { background: var(--myabr-danger-soft) !important; color: var(--myabr-danger) !important; }
.badge.bg-warning { background: var(--myabr-warning-soft) !important; color: var(--myabr-warning) !important; }
.badge.bg-info { background: var(--myabr-info-soft) !important; color: var(--myabr-info) !important; }
.badge.bg-secondary, .badge-light { background: var(--myabr-neutral-soft) !important; color: var(--myabr-neutral) !important; }

.myabr-status {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 10px; border-radius: 999px;
  font-size: 12.5px; font-weight: 600; white-space: nowrap;
  background: var(--myabr-neutral-soft); color: var(--myabr-neutral);
}
.myabr-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.myabr-status--info { background: var(--myabr-info-soft); color: var(--myabr-info); }
.myabr-status--success { background: var(--myabr-success-soft); color: var(--myabr-success); }
.myabr-status--warning { background: var(--myabr-warning-soft); color: var(--myabr-warning); }
.myabr-status--warning::before { background: var(--myabr-warning-dot); }
.myabr-status--danger { background: var(--myabr-danger-soft); color: var(--myabr-danger); }

/* ---------- Floating buttons (RISE chat + Copilot) ---------- */
.init-chat-icon { border: 1px solid var(--myabr-border); box-shadow: var(--myabr-shadow) !important; color: var(--myabr-primary); }
.fj-copilot-launcher { background: var(--myabr-primary) !important; color: #fff !important; }
.fj-copilot-launcher:hover { background: var(--myabr-primary-hover) !important; }

/* ---------- Loading ---------- */
#pre-loader, .app-loader { background: rgba(245, 247, 250, .7); }
.loading, .inline-loader, .table-loader { border-top-color: var(--myabr-primary) !important; }
.progress-bar { background-color: var(--myabr-primary); }

/* ---------- Dropdowns / popovers ---------- */
.dropdown-menu {
  border: 1px solid var(--myabr-border);
  border-radius: var(--myabr-radius) !important;
  box-shadow: var(--myabr-shadow-lg);
}
.dropdown-item:hover, .dropdown-item:focus { background: var(--myabr-surface-2); color: var(--myabr-navy); }
.dropdown-item.active, .dropdown-item:active { background: var(--myabr-primary-soft); color: var(--myabr-primary); }

/* ==========================================================================
   MyABR PAGE COMPONENTS  (used by the overview + "coming soon" screens)
   ========================================================================== */
.myabr-page { max-width: 1440px; margin: 0; padding: 4px 8px 32px; }
.myabr-grid { display: grid; gap: 16px; }
.myabr-grid--stats { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); margin-bottom: 20px; }
.myabr-grid--main { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); align-items: start; }
@media (max-width: 991.98px) { .myabr-grid--main { grid-template-columns: minmax(0, 1fr); } }

.myabr-panel {
  background: var(--myabr-surface);
  border: 1px solid var(--myabr-border);
  border-radius: var(--myabr-radius-lg);
  box-shadow: var(--myabr-shadow-sm);
  overflow: hidden;
}
.myabr-panel + .myabr-panel { margin-top: 16px; }
.myabr-panel__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 18px 22px; border-bottom: 1px solid var(--myabr-border);
}
.myabr-panel__title { font-size: 16px; font-weight: 650; margin: 0; color: var(--myabr-navy); }
.myabr-panel__sub { margin: 2px 0 0; font-size: 13px; color: var(--myabr-text-2); }
.myabr-panel__body { padding: 18px 22px; }
.myabr-panel__body--flush { padding: 0; }

a.myabr-stat,
.myabr-stat {
  display: flex; align-items: center; gap: 14px;
  padding: 18px 20px;
  background: var(--myabr-surface);
  border: 1px solid var(--myabr-border);
  border-radius: var(--myabr-radius-lg);
  box-shadow: var(--myabr-shadow-sm);
  color: var(--myabr-text);
  text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease;
  min-width: 0;
}
a.myabr-stat:hover { border-color: var(--myabr-primary-soft-2); box-shadow: var(--myabr-shadow); color: var(--myabr-text); }
.myabr-stat__icon {
  width: 44px; height: 44px; flex: none; border-radius: var(--myabr-radius);
  display: grid; place-items: center;
  background: var(--myabr-primary-soft); color: var(--myabr-primary);
}
.myabr-stat__icon--warning { background: var(--myabr-warning-soft); color: var(--myabr-warning); }
.myabr-stat__icon--success { background: var(--myabr-success-soft); color: var(--myabr-success); }
.myabr-stat__icon--neutral { background: var(--myabr-neutral-soft); color: var(--myabr-neutral); }
.myabr-stat__icon--danger { background: var(--myabr-danger-soft); color: var(--myabr-danger); }
.myabr-stat__label { font-size: 13px; color: var(--myabr-text-2); margin: 0; }
.myabr-stat__value { font-size: 20px; font-weight: 700; line-height: 1.2; color: var(--myabr-navy); margin: 2px 0 0; overflow-wrap: anywhere; }
.myabr-stat__meta { font-size: 12.5px; color: var(--myabr-muted); margin: 2px 0 0; }
.myabr-stat__chev { margin-left: auto; color: var(--myabr-muted); flex: none; }

.myabr-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.myabr-table th {
  background: var(--myabr-surface-2); color: var(--myabr-text-2);
  font-size: 12.5px; font-weight: 600; text-align: left;
  padding: 11px 22px; border-bottom: 1px solid var(--myabr-border); white-space: nowrap;
}
.myabr-table td { padding: 13px 22px; border-bottom: 1px solid var(--myabr-border); vertical-align: middle; }
.myabr-table tr:last-child td { border-bottom: 0; }
.myabr-table tbody tr:hover td { background: #f8faff; }
.myabr-table .num { text-align: right; white-space: nowrap; }
.myabr-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 575.98px) {
  .myabr-table th, .myabr-table td { padding-left: 16px; padding-right: 16px; }
  .myabr-table .hide-sm { display: none; }
}

.myabr-link { font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.myabr-link:hover { text-decoration: underline; }

.myabr-empty {
  text-align: center; padding: 32px 22px; color: var(--myabr-text-2);
}
.myabr-empty__icon {
  width: 44px; height: 44px; margin: 0 auto 10px; border-radius: 50%;
  display: grid; place-items: center; background: var(--myabr-neutral-soft); color: var(--myabr-neutral);
}
.myabr-empty__title { font-weight: 600; color: var(--myabr-navy); margin: 0 0 4px; font-size: 14.5px; }
.myabr-empty p { margin: 0; font-size: 13.5px; }

.myabr-list { list-style: none; margin: 0; padding: 0; }
.myabr-list li { display: flex; align-items: center; gap: 12px; padding: 12px 22px; border-bottom: 1px solid var(--myabr-border); }
.myabr-list li:last-child { border-bottom: 0; }
.myabr-list__main { flex: 1 1 auto; min-width: 0; }
.myabr-list__title { font-weight: 600; color: var(--myabr-navy); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.myabr-list__meta { font-size: 12.5px; color: var(--myabr-muted); }

.myabr-roadmap li { align-items: flex-start; }
.myabr-roadmap__icon { width: 32px; height: 32px; flex: none; border-radius: var(--myabr-radius); display: grid; place-items: center; background: var(--myabr-neutral-soft); color: var(--myabr-neutral); }

.myabr-note {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 14px 16px; border-radius: var(--myabr-radius-lg);
  background: var(--myabr-info-soft); color: var(--myabr-navy); border: 1px solid var(--myabr-primary-soft-2);
  font-size: 13.5px;
}
.myabr-note .icon { color: var(--myabr-primary); flex: none; margin-top: 1px; }
.myabr-note strong { display: block; margin-bottom: 2px; }

/* coming-soon page */
.myabr-soon { max-width: 760px; }
.myabr-soon__hero { padding: 28px; }
.myabr-soon__icon { width: 52px; height: 52px; border-radius: var(--myabr-radius-lg); display: grid; place-items: center; background: var(--myabr-primary-soft); color: var(--myabr-primary); margin-bottom: 16px; }
.myabr-soon__hero h1 { font-size: 24px; margin: 8px 0 8px; font-weight: 700; }
.myabr-soon__hero p { color: var(--myabr-text-2); font-size: 15px; margin: 0; }
.myabr-soon ul.myabr-bullets { margin: 0; padding-left: 20px; color: var(--myabr-text); }
.myabr-soon ul.myabr-bullets li { margin: 6px 0; }

/* ==========================================================================
   AUTH SCREENS  (signin, reset, new password, signup)
   ========================================================================== */
body.signin-page,
body.signup-page {
  background: var(--myabr-bg) !important;
  background-image: none !important;
}
.signin-page .form-signin,
.signup-page .form-signin,
.signup-page .signup-box {
  max-width: 420px;
  margin: 56px auto 24px;
  padding: 0 16px;
}
.signin-page .form-signin .card,
.signup-page .card {
  border-radius: var(--myabr-radius-lg) !important;
  box-shadow: var(--myabr-shadow) !important;
  overflow: hidden;
}
.signin-page .card .card-header,
.signup-page .card .card-header {
  background: var(--myabr-surface) !important;
  border-bottom: 0 !important;
  padding: 32px 32px 4px !important;
}
.signin-page .card .card-header img { padding: 0 !important; max-height: 52px; width: auto; }
.signin-page .card .card-header h2,
.signup-page .card .card-header h2 { font-size: 22px; font-weight: 700; margin: 0; }
.signin-page .card .card-body,
.signup-page .card .card-body { padding: 20px 32px 32px !important; }
.signin-page .form-control,
.signup-page .form-control { height: 46px; padding: 10px 14px !important; font-size: 15px; }
.signin-page .btn-lg { height: 48px; font-size: 15px; }
.myabr-auth-sub { color: var(--myabr-text-2); font-size: 14px; margin: 10px 0 0; }
.myabr-auth-foot { text-align: center; font-size: 12.5px; color: var(--myabr-muted); margin: 0 auto 32px; max-width: 420px; padding: 0 16px; }
.myabr-auth-foot a { color: var(--myabr-muted); }
@media (max-width: 575.98px) {
  .signin-page .form-signin { margin-top: 24px; }
  .signin-page .card .card-header, .signin-page .card .card-body { padding-left: 22px !important; padding-right: 22px !important; }
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 767.98px) {
  .myabr-page { padding: 0 0 24px; }
  .myabr-page-head h1 { font-size: 22px; }
  .myabr-panel__head, .myabr-panel__body { padding-left: 16px; padding-right: 16px; }
  .myabr-list li { padding-left: 16px; padding-right: 16px; }
  .modal-dialog { margin: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation-duration: .01ms !important; }
}

/* auth refinements (after visual check) */
.signin-page .card .card-header,
.signup-page .card .card-header { font-weight: 400; }
.signin-page .form-control,
.signup-page .form-control { background-color: var(--myabr-surface) !important; }
.signin-page .card-body a,
.signup-page .card-body a { color: var(--myabr-primary) !important; font-weight: 500; }
.signin-page .card-body a:hover { color: var(--myabr-primary-hover) !important; text-decoration: underline; }
.form-control { background-color: var(--myabr-surface); }
a.myabr-link { color: var(--myabr-primary) !important; }
a.myabr-list__title { color: var(--myabr-navy); text-decoration: none; }
a.myabr-list__title:hover { color: var(--myabr-primary); text-decoration: underline; }

/* RISE dashboard widget tiles: calm tinted tiles instead of solid blocks.
   Scoped under body so the JS-injected theme colour file can't override. */
body .bg-primary { background-color: var(--myabr-primary) !important; }
body .widget-icon {
  background: var(--myabr-primary-soft) !important;
  color: var(--myabr-primary) !important;
  border-radius: var(--myabr-radius) !important;
}
body .widget-icon.bg-orange,
body .widget-icon.bg-warning { background: var(--myabr-warning-soft) !important; color: var(--myabr-warning) !important; }
body .widget-icon.bg-success,
body .widget-icon.bg-dark-success { background: var(--myabr-success-soft) !important; color: var(--myabr-success) !important; }
body .widget-icon.bg-danger,
body .widget-icon.bg-coral { background: var(--myabr-danger-soft) !important; color: var(--myabr-danger) !important; }
body .widget-icon .icon { color: inherit !important; stroke: currentColor; }
.myabr-grid > * { min-width: 0; }
@media (max-width: 400px) { .myabr-grid--stats { grid-template-columns: minmax(0, 1fr); } .myabr-panel__head { flex-wrap: wrap; } }

/* win over the JS-injected theme colour file (assets/css/color/*.css) */
body .btn-primary,
body .btn-primary:focus { background-color: var(--myabr-primary) !important; border-color: var(--myabr-primary) !important; color: #fff !important; }
body .btn-primary:hover { background-color: var(--myabr-primary-hover) !important; border-color: var(--myabr-primary-hover) !important; }
body .btn-primary:disabled,
body .btn-primary.disabled { background: var(--myabr-neutral-soft) !important; border-color: var(--myabr-border) !important; color: var(--myabr-muted) !important; }
body a { color: var(--myabr-primary); }
body .form-control:focus { background-color: var(--myabr-surface) !important; }
body .form-control.error,
body .form-control.error:focus { border-color: var(--myabr-danger) !important; }
body .form-control.error:focus { box-shadow: 0 0 0 3px rgba(196, 43, 60, .18) !important; }
.myabr-page.myabr-soon { margin-left: 0; }

/* ---------- MyABR portal v1: sign in / sign up look (ink brand panel) ---------- */
body.signin-page, body.signup-page { background: #F3F3F5 !important; }
body.signin-page::before, body.signup-page::before {
  content: "MyABR"; display: block; background: #140A3C; color: #fff;
  font-family: "Fraunces", Georgia, serif; font-size: 26px; font-weight: 600; padding: 16px 20px;
}
.signin-page .card, .signup-page .card { border-radius: 20px !important; border: 1px solid #E5E4ED !important; box-shadow: 0 6px 18px rgba(20,10,60,.06) !important; }
.signin-page .card-header h2, .signup-page .card-header h2, .signup-page h2 { font-family: "Fraunces", Georgia, serif !important; font-weight: 500 !important; color: #140A3C !important; }
.signin-page .btn-primary, .signup-page .btn-primary { background: #45E2CA !important; border-color: #45E2CA !important; color: #140A3C !important; font-weight: 700 !important; border-radius: 12px !important; }
.signin-page .btn-primary:hover, .signup-page .btn-primary:hover { background: #2fd3b9 !important; }
.signin-page .form-control, .signup-page .form-control { border-radius: 12px !important; border: 1.5px solid #CDCBE0 !important; min-height: 48px; }