/* Riverbank brand tint over Inspinia + Bootstrap 3.
   Load order: after riverbank-tokens.css. */

body {
  font-family: var(--font-sans);
  font-feature-settings: var(--font-feature-default);
  color: var(--text-primary);
  background: var(--surface-subtle);
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.005em;
}

body.md-skin.app,
body.md-skin.login { background: var(--surface-subtle); }

#page-wrapper.gray-bg { background: var(--surface-subtle); }
.wrapper.wrapper-content { background: transparent; }

/* Sidebar */
nav.navbar-default.navbar-static-side,
.navbar-default.navbar-static-side,
.navy-bg {
  background-color: var(--surface-sidebar) !important;
  border-right: 1px solid var(--border-subtle);
}
.nav-header { background: transparent !important; border-bottom: 1px solid var(--border-subtle); padding: 20px 22px; }
.nav-header a, .nav-header span { color: var(--text-primary) !important; }
.nav-header .text-muted { color: var(--text-secondary) !important; }
.nav-header strong { color: var(--text-primary) !important; }
.nav-header .img-circle { border: 2px solid var(--border-subtle); }
#side-menu > li { font-family: var(--font-sans); }
#side-menu > li > a {
  color: var(--text-secondary);
  font-weight: 500;
  border-radius: 8px;
  margin: 2px 8px;
}
#side-menu > li > a:hover { background: var(--surface-subtle); color: var(--text-primary); }
#side-menu > li.active,
.nav > li.active {
  background: transparent !important;
  border-left: none !important;
}
#side-menu > li.active > a,
#side-menu > li > a.active {
  background: var(--color-primary-500) !important;
  color: white !important;
  box-shadow: 0 4px 10px rgba(237,28,36,0.35);
}
#side-menu > li.active > a:hover { background: var(--color-primary-600) !important; color: white !important; }
#side-menu > li.active > a .fa,
#side-menu > li.active > a i { color: white !important; opacity: 1; }
#side-menu .nav-second-level > li > a {
  color: var(--text-secondary);
  font-weight: 500;
  padding-left: 44px;
}
#side-menu .nav-second-level > li > a:hover { color: var(--text-primary); background: var(--surface-subtle); }
#side-menu .nav-second-level > li.active > a { color: var(--color-primary-600); background: transparent; box-shadow: none; }
#side-menu li > a > .fa, #side-menu li > a > i { opacity: 0.85; }
.profile-element .dropdown-menu { background: var(--surface-raised); border: 1px solid var(--border-subtle); }
.profile-element .dropdown-menu > li > a { color: var(--text-primary); }

/* Dark mode: restore Inspinia-like dark sidebar with white text */
[data-theme="dark"] .nav-header { border-bottom-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .nav-header a, [data-theme="dark"] .nav-header span, [data-theme="dark"] .nav-header strong { color: rgba(255,255,255,0.92) !important; }
[data-theme="dark"] .nav-header .text-muted { color: rgba(255,255,255,0.55) !important; }
[data-theme="dark"] .nav-header .img-circle { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] #side-menu > li > a { color: rgba(255,255,255,0.75); }
[data-theme="dark"] #side-menu > li > a:hover { background: rgba(255,255,255,0.06); color: white; }
[data-theme="dark"] #side-menu .nav-second-level > li > a { color: rgba(255,255,255,0.65); }
[data-theme="dark"] #side-menu .nav-second-level > li > a:hover { color: white; background: rgba(255,255,255,0.06); }
[data-theme="dark"] #side-menu .nav-second-level > li.active > a { color: var(--color-primary-400); }

/* Top nav — strong overrides to defeat any Inspinia teal */
nav.navbar,
.navbar,
.navbar.navbar-static-top,
.navbar-static-top,
.navbar-default,
.navbar-default.navbar-static-top {
  background: var(--surface-raised) !important;
  background-color: var(--surface-raised) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border-subtle) !important;
  min-height: 56px;
  padding: 0;
}
.navbar-static-top .navbar-header { padding: 0; background: transparent !important; }
.navbar-static-top .navbar-minimalize { margin: 10px 14px; background-color: var(--color-primary-500) !important; border-color: var(--color-primary-500) !important; color: white !important; }
.navbar-static-top .navbar-minimalize:hover { background-color: var(--color-primary-600) !important; border-color: var(--color-primary-600) !important; }
.navbar-toggle { background-color: var(--color-primary-500) !important; border-color: var(--color-primary-500) !important; }
.navbar-toggle .icon-bar { background-color: white !important; }
.border-bottom { border-bottom-color: var(--border-subtle) !important; }
.row.border-bottom { background: var(--surface-raised); }

/* Collapsed sidebar (mini-navbar mode): nav-header was teal in Inspinia */
body.mini-navbar .nav-header { background-color: var(--color-primary-500) !important; }
[data-theme="dark"] body.mini-navbar .nav-header { background-color: var(--color-dark-700) !important; }

/* Inspinia "special_link" / "landing_link" — used in some sidebars, were teal */
.navbar-default .special_link a,
.navbar-default .landing_link a,
.navbar-default .landing_link a:hover,
.navbar-default .special_link a:hover { background: var(--color-primary-500) !important; }
.navbar-default .special_link a span.label,
.navbar-default .landing_link a span.label { background: white !important; color: var(--color-primary-700) !important; }

/* Brand-coloured labels/badges that were teal */
.label-primary, .badge-primary { background-color: var(--color-primary-500) !important; color: white !important; }

/* Bootstrap 3 / Inspinia .badge variants — Inspinia ships teal for primary and
   off-palette colors for the others. Re-skin to Riverbank tokens. */
.badge {
  font-family: var(--font-sans);
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: 0.02em;
  text-shadow: none;
  display: inline-block;
  line-height: 1.4;
}
.badge-primary { background-color: var(--color-primary-500) !important; color: white !important; }
.badge-warning { background-color: var(--color-warning-50) !important; color: var(--color-warning-700) !important; }
.badge-danger  { background-color: var(--color-error-50) !important;   color: var(--color-error-700) !important; }
.badge-success { background-color: var(--color-success-50) !important; color: var(--color-success-700) !important; }
.badge-info    { background-color: var(--color-info-50) !important;    color: var(--color-info-700) !important; }
.badge-default { background-color: var(--color-neutral-100) !important;color: var(--color-neutral-700) !important; }

[data-theme="dark"] .badge-primary { background-color: var(--color-primary-500) !important; color: white !important; }
[data-theme="dark"] .badge-warning { background-color: rgba(217,119,6,0.15) !important; color: var(--color-warning-300) !important; }
[data-theme="dark"] .badge-danger  { background-color: rgba(220,38,38,0.15) !important; color: var(--color-error-300) !important; }
[data-theme="dark"] .badge-success { background-color: rgba(22,163,74,0.15) !important; color: var(--color-success-300) !important; }
[data-theme="dark"] .badge-info    { background-color: rgba(37,99,235,0.15) !important; color: var(--color-info-300) !important; }
[data-theme="dark"] .badge-default { background-color: rgba(255,255,255,0.06) !important; color: var(--color-dark-200) !important; }

/* Top-nav links + buttons — dark text on light bg */
.navbar-top-links { display: flex; align-items: center; padding: 0 12px; }
.navbar-top-links > li { display: flex; align-items: center; }
.navbar-top-links > li > a,
.navbar-top-links > li > .dropdown-toggle {
  color: var(--text-primary);
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 500;
  padding: 10px 12px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
}
.navbar-top-links > li > a:hover,
.navbar-top-links > li > a:focus,
.navbar-top-links > li.open > .dropdown-toggle {
  color: var(--text-primary);
  background: var(--surface-subtle);
}
.navbar-top-links > li > a .fa { color: var(--text-secondary); }
.navbar-top-links > li > a:hover .fa { color: var(--text-primary); }

/* User dropdown trigger */
.rb-user-trigger { padding: 6px 12px !important; }
.rb-user-avatar {
  display: inline-flex;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--color-primary-500), var(--color-primary-700));
  color: white !important;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
}
.rb-user-avatar-img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }
.rb-user-name { font-weight: 600; font-size: 14px; color: var(--text-primary); }
.rb-user-trigger .fa-caret-down { color: var(--text-tertiary); font-size: 11px; }

/* Notifications icon bell */
.navbar-top-links .count-info { position: relative; }
.navbar-top-links .count-info .label-warning {
  position: absolute;
  top: 4px;
  right: 4px;
  font-size: 9px;
  padding: 2px 5px;
  line-height: 1;
  min-width: 16px;
  text-align: center;
}

/* User-dropdown menu */
.rb-user-dropdown .dropdown-menu { min-width: 220px; padding: 6px; }
.rb-user-dropdown .dropdown-menu > li > a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 14px;
  color: var(--text-primary);
}
.rb-user-dropdown .dropdown-menu > li > a:hover { background: var(--surface-subtle); }
.rb-user-dropdown .dropdown-menu > li > a .fa { width: 14px; color: var(--text-secondary); }
.rb-user-dropdown .dropdown-menu .divider { background: var(--border-subtle); margin: 6px -6px; }

/* Defeat Inspinia's teal in ALL dropdown menus app-wide:
   .dropdown-menu > .active > a → was teal #1ab394
   .md-skin .navbar-top-links .dropdown-menu li a → high-specificity Inspinia
   overrides */
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:focus,
.dropdown-menu > .active > a:hover {
  background-color: var(--surface-subtle) !important;
  color: var(--text-primary) !important;
}
.dropdown-menu > li > a:focus { background-color: var(--surface-subtle) !important; color: var(--text-primary) !important; }
.md-skin .navbar-top-links .dropdown-menu li a {
  color: var(--text-primary) !important;
  font-family: var(--font-sans);
  border-radius: 6px;
}
.md-skin .navbar-top-links .dropdown-menu li a:hover,
.md-skin .navbar-top-links .dropdown-menu li a:focus {
  background: var(--surface-subtle) !important;
  color: var(--text-primary) !important;
}
.md-skin .navbar-top-links .dropdown-menu li a .fa { color: var(--text-secondary) !important; }
.md-skin .navbar-top-links .dropdown-menu li a:hover .fa { color: var(--text-primary) !important; }

/* ibox */
.ibox {
  background: var(--surface-raised);
  border-radius: 12px;
  border: 1px solid var(--border-subtle);
  margin-bottom: 20px;
  box-shadow: none;
}
.ibox.float-e-margins { margin-bottom: 20px; }
.ibox-title {
  background: transparent;
  border-bottom: 1px solid var(--border-subtle);
  padding: 16px 20px;
}
.ibox-title h5 {
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.01em;
  margin: 0;
}
.ibox-content { background: transparent; padding: 18px 20px; border: none; }
.ibox-footer { background: var(--surface-subtle); border-top: 1px solid var(--border-subtle); padding: 12px 20px; }

/* Buttons */
.btn {
  font-family: var(--font-sans);
  font-weight: 600;
  border-radius: 8px;
  padding: 8px 16px;
  font-size: 14px;
  transition: background-color .12s, border-color .12s;
}
.btn-primary, .btn-primary:focus { background-color: var(--interactive-primary-bg); border-color: var(--interactive-primary-bg); color: var(--interactive-primary-text); }
.btn-primary:hover { background-color: var(--interactive-primary-bg-hover); border-color: var(--interactive-primary-bg-hover); }
.btn-primary:active, .btn-primary.active,
.open > .btn-primary.dropdown-toggle { background-color: var(--interactive-primary-bg-active); border-color: var(--interactive-primary-bg-active); }
.btn-primary[disabled], .btn-primary.disabled { background-color: var(--interactive-primary-bg-disabled); border-color: var(--interactive-primary-bg-disabled); color: var(--interactive-primary-text-disabled); }

.btn-warning, .btn-warning:focus { background-color: var(--color-warning-500); border-color: var(--color-warning-500); color: white; }
.btn-warning:hover { background-color: #b06005; border-color: #b06005; }
.btn-danger, .btn-danger:focus { background-color: var(--color-error-500); border-color: var(--color-error-500); color: white; }
.btn-danger:hover { background-color: #b71f1f; border-color: #b71f1f; }
.btn-success, .btn-success:focus { background-color: var(--color-success-500); border-color: var(--color-success-500); color: white; }
.btn-success:hover { background-color: #117a37; border-color: #117a37; }
.btn-default, .btn-default:focus {
  background-color: transparent;
  border-color: var(--border-default);
  color: var(--text-primary);
}
.btn-default:hover { background-color: var(--surface-subtle); border-color: var(--border-strong); }
.btn-link { color: var(--text-brand); font-weight: 600; }
.btn-link:hover { color: var(--text-link-hover); text-decoration: underline; }

/* Labels (used as badges by Inspinia) */
.label {
  font-family: var(--font-sans);
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  letter-spacing: 0.02em;
  text-shadow: none;
}
.label-primary { background-color: var(--color-primary-50); color: var(--color-primary-700); }
.label-warning { background-color: var(--color-warning-50); color: var(--color-warning-700); }
.label-danger  { background-color: var(--color-error-50);   color: var(--color-error-700); }
.label-success { background-color: var(--color-success-50); color: var(--color-success-700); }
.label-info    { background-color: var(--color-info-50);    color: var(--color-info-700); }
.label-default { background-color: var(--color-neutral-100);color: var(--color-neutral-700); }

[data-theme="dark"] .label-primary { background-color: rgba(237,28,36,0.15); color: var(--color-primary-300); }
[data-theme="dark"] .label-warning { background-color: rgba(217,119,6,0.15); color: var(--color-warning-300); }
[data-theme="dark"] .label-danger  { background-color: rgba(220,38,38,0.15); color: var(--color-error-300); }
[data-theme="dark"] .label-success { background-color: rgba(22,163,74,0.15); color: var(--color-success-300); }
[data-theme="dark"] .label-info    { background-color: rgba(37,99,235,0.15); color: var(--color-info-300); }
[data-theme="dark"] .label-default { background-color: rgba(255,255,255,0.06); color: var(--color-dark-200); }

/* Utility colors */
.text-success { color: var(--text-success) !important; }
.text-warning { color: var(--text-warning) !important; }
.text-danger  { color: var(--text-error) !important; }
.text-info    { color: var(--text-info) !important; }
.text-primary { color: var(--text-brand) !important; }
.text-muted   { color: var(--text-secondary) !important; }

.bg-primary { background-color: var(--color-primary-500) !important; color: white; }
.bg-warning { background-color: var(--color-warning-500) !important; color: white; }
.bg-danger  { background-color: var(--color-error-500) !important; color: white; }
.bg-success { background-color: var(--color-success-500) !important; color: white; }
.bg-info    { background-color: var(--color-info-500) !important; color: white; }

a { color: var(--text-brand); }
a:hover, a:focus { color: var(--text-link-hover); }

/* Forms */
.form-control {
  border-color: var(--border-default);
  background: var(--surface-raised);
  color: var(--text-primary);
  font-family: var(--font-sans);
  border-radius: 8px;
  box-shadow: none;
}
.form-control:focus {
  border-color: var(--border-brand);
  box-shadow: 0 0 0 3px rgba(237,28,36,0.12);
  outline: none;
}
.has-error .form-control { border-color: var(--border-error); }
.has-error .form-control:focus { box-shadow: 0 0 0 3px rgba(220,38,38,0.12); }
.has-success .form-control { border-color: var(--border-success); }
label, .control-label { font-family: var(--font-sans); font-weight: 600; color: var(--text-primary); font-size: 13px; }
.input-group-addon { background: var(--surface-subtle); border-color: var(--border-default); color: var(--text-secondary); }

/* Tables */
.table { color: var(--text-primary); }
.table > thead > tr > th {
  background: var(--surface-subtle);
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-family: var(--font-sans);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 12px 16px;
}
.table > tbody > tr > td { padding: 12px 16px; border-color: var(--border-subtle); font-size: 14px; }
.table-hover > tbody > tr:hover { background: var(--surface-subtle); }
.table-striped > tbody > tr:nth-of-type(odd) { background: var(--surface-subtle); }

/* Breadcrumb */
.breadcrumb {
  background: transparent;
  padding: 0;
  font-size: 13px;
  margin: 0;
  font-family: var(--font-sans);
}
.breadcrumb > li + li:before { color: var(--color-neutral-300); content: "/\00a0"; }
.breadcrumb > .active { color: var(--text-primary); font-weight: 600; }
.breadcrumb a { color: var(--text-secondary); }
.breadcrumb a:hover { color: var(--text-brand); }

/* Pagination */
.pagination > li > a, .pagination > li > span {
  color: var(--text-primary);
  border-color: var(--border-subtle);
  background: var(--surface-raised);
}
.pagination > .active > a, .pagination > .active > span,
.pagination > .active > a:hover, .pagination > .active > span:hover {
  background: var(--color-primary-500);
  border-color: var(--color-primary-500);
  color: white;
}
.pagination > li > a:hover { background: var(--surface-subtle); }

/* Modal */
.modal-content {
  border-radius: 12px;
  border: 1px solid var(--border-subtle);
  background: var(--surface-raised);
  box-shadow: var(--shadow-lg);
}
.modal-header { border-bottom: 1px solid var(--border-subtle); padding: 16px 20px; }
.modal-header h4, .modal-title { font-family: var(--font-sans); font-weight: 700; font-size: 16px; }
.modal-footer { border-top: 1px solid var(--border-subtle); padding: 16px 20px; background: var(--surface-subtle); border-radius: 0 0 12px 12px; }

/* Dropdowns */
.dropdown-menu {
  border-radius: 8px;
  border: 1px solid var(--border-subtle);
  padding: 4px;
  box-shadow: var(--shadow-md);
  background: var(--surface-raised);
}
.dropdown-menu > li > a {
  font-family: var(--font-sans);
  padding: 8px 12px;
  border-radius: 6px;
  color: var(--text-primary);
}
.dropdown-menu > li > a:hover { background: var(--surface-subtle); color: var(--text-primary); }

/* Theme toggle lives inside the user dropdown menu — no separate button styling needed */

h1, h2, h3, h4, h5, h6 { font-family: var(--font-sans); color: var(--text-primary); letter-spacing: -0.01em; }

/* ─────────────────────────────────────────────────────────────────
   Teal cleanup — Inspinia/Bootstrap 3 ship #1ab394 across many
   selectors that the earlier brand pass didn't cover. Route them
   through brand tokens so the whole UI reads as the restrained
   fintech palette (brand red for primary, blue for info).
   ───────────────────────────────────────────────────────────────── */

/* Alerts (Bootstrap 3 ships pale cyan defaults; visually reads as teal) */
.alert {
  border-radius: 8px;
  padding: 12px 16px;
  border: 1px solid transparent;
  font-family: var(--font-sans);
  font-size: 14px;
}
.alert-info    { background-color: var(--color-info-50);    border-color: var(--color-info-50);    color: var(--color-info-700); }
.alert-success { background-color: var(--color-success-50); border-color: var(--color-success-50); color: var(--color-success-700); }
.alert-warning { background-color: var(--color-warning-50); border-color: var(--color-warning-50); color: var(--color-warning-700); }
.alert-danger  { background-color: var(--color-error-50);   border-color: var(--color-error-50);   color: var(--color-error-700); }
.alert a, .alert .alert-link { color: inherit; text-decoration: underline; font-weight: 600; }

[data-theme="dark"] .alert-info    { background-color: rgba(37,99,235,0.12);  border-color: rgba(37,99,235,0.25);  color: var(--color-info-300); }
[data-theme="dark"] .alert-success { background-color: rgba(22,163,74,0.12);  border-color: rgba(22,163,74,0.25);  color: var(--color-success-300); }
[data-theme="dark"] .alert-warning { background-color: rgba(217,119,6,0.12);  border-color: rgba(217,119,6,0.25);  color: var(--color-warning-300); }
[data-theme="dark"] .alert-danger  { background-color: rgba(220,38,38,0.12);  border-color: rgba(220,38,38,0.25);  color: var(--color-error-300); }

/* Inspinia toast-style notifications (left border was teal) */
.inspinia-notify.alert-info    { border-left: 6px solid var(--color-info-500) !important; }
.inspinia-notify.alert-success { border-left: 6px solid var(--color-success-500) !important; }
.inspinia-notify.alert-warning { border-left: 6px solid var(--color-warning-500) !important; }
.inspinia-notify.alert-danger  { border-left: 6px solid var(--color-error-500) !important; }

/* Toastr fallbacks */
.toast          { background-color: var(--color-info-500) !important; }
.toast-success  { background-color: var(--color-success-500) !important; }
.toast-info     { background-color: var(--color-info-500) !important; }
.toast-warning  { background-color: var(--color-warning-500) !important; }
.toast-error    { background-color: var(--color-error-500) !important; }

/* Bootstrap 3 nav-tabs — Inspinia ships teal active state */
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.tabs-container .nav-tabs > li.active > a,
.tabs-container .nav-tabs > li.active > a:hover,
.tabs-container .nav-tabs > li.active > a:focus {
  color: var(--text-brand) !important;
  border-bottom-color: var(--color-primary-500) !important;
}

/* Bootstrap 3 panels — .panel-primary was teal */
.panel-primary { border-color: var(--color-primary-500); }
.panel-primary > .panel-heading {
  background-color: var(--color-primary-500);
  border-color: var(--color-primary-500);
  color: white;
}

/* Progress bars — default + variants were teal */
.progress-bar               { background-color: var(--color-primary-500); }
.progress-bar-info          { background-color: var(--color-info-500); }
.progress-bar-success       { background-color: var(--color-success-500); }
.progress-bar-warning       { background-color: var(--color-warning-500); }
.progress-bar-danger        { background-color: var(--color-error-500); }
.pace .pace-progress        { background: var(--color-primary-500); }

/* List groups — active item was teal */
a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus,
.list-group-item.active {
  background-color: var(--color-primary-500);
  border-color: var(--color-primary-500);
  color: white;
}

/* Inspinia .text-navy was teal — remap to brand text colour */
.text-navy { color: var(--text-brand) !important; }

/* Form has-success state — focus ring and label were teal */
.has-success .form-control:focus {
  border-color: var(--border-success);
  box-shadow: 0 0 0 3px rgba(22,163,74,0.12);
}
.has-success .control-label { color: var(--color-success-700); }

/* Single-line input focus border (Inspinia material-style inputs) */
.single-line:focus { border-color: var(--border-brand); }

/* Inspinia checkbox/radio "primary" — checked state was teal */
.checkbox-primary input[type="checkbox"]:checked + label::before,
.radio-primary input[type="radio"]:checked + label::before {
  background-color: var(--color-primary-500) !important;
  border-color: var(--color-primary-500) !important;
}

/* Select2 focus + highlighted result row */
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default .select2-selection--single:focus,
.select2-container--default .select2-selection--multiple:focus {
  border-color: var(--border-brand) !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
  background-color: var(--color-primary-500) !important;
  color: white !important;
}

/* UI-select (Angular-style) highlighted choice */
.ui-select-container.ui-select-bootstrap .ui-select-choices-row.active > a {
  background-color: var(--color-primary-500) !important;
  color: white !important;
}

/* Fullcalendar active button state */
.fc-state-active,
.fc-state-active:hover {
  background-color: var(--color-primary-500) !important;
  border-color: var(--color-primary-500) !important;
  color: white !important;
}

/* High-specificity Inspinia overrides — these were the stragglers */
.md-skin .nav .open > a:focus,
.md-skin .nav .open > a:hover {
  background: var(--surface-subtle) !important;
  color: var(--text-primary) !important;
}

/* Multi-line dropdown items — title + helper hint stacked on two lines.
   Used by the batch print/Action dropdown so long descriptions wrap
   instead of overflowing the menu. */
.dropdown-menu.rb-dropdown-multiline { min-width: 260px; max-width: 320px; }
/* Inspinia's `.table .btn-group.open .dropdown-menu { min-width: 105px }`
   (style.css) is more specific than the rule above, so inside a DataTable the
   multiline Action/print menu clamps to ~105px and its labels wrap into a
   broken, button-width column. Re-assert the intended width with a selector
   that out-specifies Inspinia's (4 classes vs 3) and loads after it. */
.table .btn-group.open .dropdown-menu.rb-dropdown-multiline { min-width: 260px; max-width: 320px; }
.dropdown-menu.rb-dropdown-multiline > li > a {
  white-space: normal;
  line-height: 1.4;
  padding: 8px 14px;
}
.dropdown-menu .rb-menu-hint {
  display: block;
  font-size: 11px;
  color: var(--text-tertiary);
  font-weight: 400;
  margin-top: 2px;
  padding-left: 22px;
  letter-spacing: 0;
}
.dropdown-menu > li > a:hover .rb-menu-hint,
.dropdown-menu > li > a:focus .rb-menu-hint { color: var(--text-secondary); }

/* Sidebar count bubbles — Bootstrap 3 .pull-right (float) lands at the
   text baseline, which puts the badge low inside our rounded brand
   item and gets clipped by the hover/active background. Pin them to
   the top-right corner with a z-index above the item chrome. */
#side-menu li > a { position: relative; padding-right: 36px; }
#side-menu li > a > .badge,
#side-menu li > a > .label {
  position: absolute;
  top: 8px;
  right: 10px;
  z-index: 5;
  float: none !important;
  margin: 0;
  pointer-events: none;
  line-height: 1.4;
}
#side-menu .nav-second-level > li > a > .badge,
#side-menu .nav-second-level > li > a > .label {
  top: 7px;
  right: 12px;
}

/* Mini-navbar (collapsed sidebar): nav-label is hidden, badge becomes
   a small corner dot so it doesn't overflow the icon-only rail. */
body.mini-navbar #side-menu > li > a > .badge,
body.mini-navbar #side-menu > li > a > .label {
  top: 4px;
  right: 4px;
  padding: 2px 5px;
  font-size: 9px;
  min-width: 16px;
  text-align: center;
}

/* ============================================================================
   FINAL teal sweep (2026-06-19) — eliminate the remaining Inspinia #1ab394.
   iCheck checkboxes/radios were a baked-in green.png sprite, so they are
   redrawn in CSS (charcoal selection). Modal header, on/off switch and unread
   notification text were teal fills/colours.
   ============================================================================ */

/* --- iCheck checkboxes & radios: drop the green sprite, draw in CSS (charcoal) --- */
.icheckbox, .iradio,
.icheckbox_square-green, .iradio_square-green {
    background: none !important;
    width: 18px; height: 18px;
    border: 2px solid var(--color-neutral-300);
    border-radius: 3px;
    position: relative;
    box-sizing: border-box;
}
.iradio, .iradio_square-green { border-radius: 50%; }

/* checked checkbox: charcoal fill + white tick */
.icheckbox.checked, .icheckbox_square-green.checked {
    background: var(--color-dark-500) !important;
    border-color: var(--color-dark-500) !important;
}
.icheckbox.checked::after, .icheckbox_square-green.checked::after {
    content: ''; position: absolute; left: 4px; top: 0;
    width: 5px; height: 10px;
    border: solid #fff; border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* checked radio: charcoal ring + charcoal dot */
.iradio.checked, .iradio_square-green.checked {
    border-color: var(--color-dark-500) !important;
}
.iradio.checked::after, .iradio_square-green.checked::after {
    content: ''; position: absolute; left: 3px; top: 3px;
    width: 8px; height: 8px; border-radius: 50%;
    background: var(--color-dark-500);
}

/* disabled / locked (muted charcoal) */
.icheckbox.disabled, .iradio.disabled,
.icheckbox_square-green.disabled, .iradio_square-green.disabled { opacity: .55; }
.icheckbox.checked.disabled, .icheckbox_square-green.checked.disabled {
    opacity: 1;
    background: var(--color-dark-300) !important;
    border-color: var(--color-dark-300) !important;
}

/* --- Dialog heading: defeat the teal .modal-header bar (style.css) --- */
.modal-header {
    background-color: var(--surface-raised) !important;
    color: var(--text-primary) !important;
}
.modal-header .close { color: var(--text-secondary); opacity: .8; }

/* --- On/off switch: teal -> brand-red --- */
.onoffswitch-label, .onoffswitch-switch { border-color: var(--color-primary-500) !important; }
.onoffswitch-inner:before { background-color: var(--color-primary-500) !important; }

/* --- Unread notification emphasis: teal -> brand link colour --- */
.unread td a strong { color: var(--text-link) !important; }
