.profile-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.profile-stats .stat {
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--glass-border);
  border-radius: 12px;
  text-align: center;
  padding: .75rem;
}
.profile-stats .stat .val { font-weight: 700; }
.profile-stats .stat .lbl { font-size: .8rem; color: rgba(229,231,235,.75); }
/*
 |--------------------------------------------------------------
 | Project custom styles
 |--------------------------------------------------------------
 */

:root {
  --app-primary: #0d6efd;
  --app-bg: linear-gradient(135deg, #0e1420 0%, #121a2e 100%);
  --sidebar-link: #334155;
  --glass-bg: rgba(17, 24, 39, 0.55);
  --glass-border: rgba(255, 255, 255, 0.18);
  --glass-text: #f8fafc; /* brighter for high contrast */
  --glass-shadow: 0 10px 30px rgba(0,0,0,0.35);
  --glass-radius: 14px;
  --topbar-height: 56px;
  --bottombar-height: 62px;
}

html, body {
  scroll-behavior: smooth;
  overflow-x: hidden; /* prevent unexpected horizontal scroll */
}

body {
  font-family: IRANSans, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  background: var(--app-bg);
  background-attachment: fixed;
  color: var(--glass-text);
}

/* -------------------------------------------------------------
   Admin light theme override (only admin pages)
   Apply via body.admin-light in admin layout
-------------------------------------------------------------- */
body.admin-light {
  --app-bg: #f8f9fa;
  --glass-bg: #ffffff;
  --glass-text: #212529;
  --glass-border: rgba(0,0,0,0.075);
  color: #212529;
  background: #f8f9fa;
}

body.admin-light .glass-nav,
body.admin-light .glass-bottom-nav,
body.admin-light .glass-sidebar,
body.admin-light .glass-card,
body.admin-light .card.glass,
body.admin-light .modal-content.glass,
body.admin-light .offcanvas.glass {
  background: #ffffff !important;
  color: #212529 !important;
  border-color: rgba(0,0,0,0.075) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.06) !important;
}

body.admin-light .sidebar .nav-link { color: #495057; }
body.admin-light .sidebar .nav-link:hover,
body.admin-light #adminSidebar .nav-link:hover { color: #0d6efd; background: rgba(13,110,253,.06); }
body.admin-light .sidebar .nav-link.active,
body.admin-light #adminSidebar .nav-link.active {
  background: rgba(13,110,253,.12);
  color: #0d6efd;
}

body.admin-light .navbar.navbar-light .nav-link { color: #495057; }
body.admin-light .navbar.navbar-light .nav-link:hover { color: #0d6efd; }

.app-main {
  padding-top: calc(var(--topbar-height) + 8px) !important;
  padding-bottom: calc(var(--bottombar-height) + 18px + env(safe-area-inset-bottom)) !important;
  min-height: calc(100vh - (var(--topbar-height) + var(--bottombar-height) + 2rem));
}

/* Ensure form controls inherit font */
button, input, optgroup, select, textarea {
  font-family: inherit;
}

/* Font Awesome v4/v5-style compatibility
   Allows using icons as: <i class="fa fa-xxx"></i>
   Prefer FA5 Free; fall back to FA6 Free if present locally */

 

/* Layout helpers */
.min-h-main {
  min-height: calc(100vh - 6rem);
}

/* Cards (auth and common) */
.auth-card {
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.brand-avatar {
  width: 56px;
  height: 56px;
  object-fit: cover;
}

/* Consistent tiny avatar size for tables/lists */
.avatar-34 {
  width: 34px;
  height: 34px;
  object-fit: cover;
}

/* Admin shell & sidebar */
.admin-shell {
  min-height: 100vh;
}

.sidebar {
  width: 260px;
  flex: 0 0 260px; /* prevent collapsing in flex container on desktop */
}

.sidebar .nav-link {
  color: rgba(229,231,235,0.85);
  transition: padding .12s ease, background-color .12s ease, color .12s ease;
}

.sidebar .nav-link.active {
  background: linear-gradient(135deg, rgba(59,130,246,0.25), rgba(37,99,235,0.25));
  color: #fff;
  border-radius: 10px;
}

/* Increase padding for active sidebar items (blue background area) */
#adminSidebar .nav-link.active {
  padding-right: .75rem !important;
  padding-left: .75rem !important;
}
#adminSidebar .nav-link.active:hover,
#adminSidebar .nav-link.active:focus {
  padding-right: .75rem !important;
  padding-left: .75rem !important;
}

/* Hover padding for sidebar links (keep base px-0 in markup; add slight space on hover) */
#adminSidebar .nav-link:hover,
#adminSidebar .nav-link:focus {
  padding-right: .5rem !important;
  padding-left: .5rem !important;
}

/* Only force white text on hover/focus in dark admin theme */
body:not(.admin-light) #adminSidebar .nav-link:hover,
body:not(.admin-light) #adminSidebar .nav-link:focus {
  color: #fff;
}

@media (max-width: 991.98px) {
  .sidebar {
    position: fixed;
    top: 56px; /* navbar height */
    bottom: 0;
    z-index: 1030;
    transform: translateX(100%);
    transition: transform .2s ease-in-out;
    background: var(--glass-bg);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    border-left: 1px solid var(--glass-border);
  }
  .sidebar.show {
    transform: translateX(0);
  }
}

/* Example utility overrides */
.text-primary {
  color: var(--app-primary) !important;
}

/* Action buttons: unified styling */
.action-buttons {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.action-buttons form {
  margin: 0;
}
.action-btn {
  --bs-btn-padding-y: 0.25rem;
  --bs-btn-padding-x: 0.65rem;
  --bs-btn-font-size: 0.85rem;
  line-height: 1.2;
  border-radius: 0.375rem;
  color: #212529 !important; /* black text by default */
}
.action-btn:hover,
.action-btn:focus {
  color: #fff !important; /* force white text on hover/focus */
}

/* Ensure white text for chat header action buttons on dark glass */
.chat-header .action-btn {
  color: #ffffff !important;
}


/* -------------------------------------------------------------
   Liquid Glass UI (iOS-style) theme
   Apply via: .glass-page on body and components below
------------------------------------------------------------- */

.glass-page {
  --bs-body-bg: transparent;
}

.glass-nav {
  background: var(--glass-bg) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%);
  backdrop-filter: blur(16px) saturate(130%);
  border-bottom: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
  min-height: var(--topbar-height);
}

.navbar .nav-link.text-primary i { color: #93c5fd !important; }

.glass-bottom-nav {
  background: var(--glass-bg) !important;
  -webkit-backdrop-filter: blur(12px) saturate(130%);
  backdrop-filter: blur(12px) saturate(130%);
  border-top: 1px solid var(--glass-border);
  box-shadow: 0 -8px 20px rgba(0,0,0,0.25);
  min-height: var(--bottombar-height);
  padding-bottom: env(safe-area-inset-bottom);
}

.glass-bottom-nav .container {
  flex-wrap: nowrap !important;
  gap: clamp(0.5rem, 4vw, 1.5rem) !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.glass-bottom-nav .container::-webkit-scrollbar { display: none; }

.glass-bottom-nav .nav-link {
  gap: 4px;
  padding: .35rem .75rem;
  white-space: nowrap;
}
.glass-bottom-nav .nav-link i { font-size: 1.15rem; }
.glass-bottom-nav .nav-link .small { font-size: .7rem; }

/* Active bottom nav: apply gradient to icon and label (no box) */
.glass-bottom-nav .nav-link.text-primary i,
.glass-bottom-nav .nav-link.text-primary .small {
  color: #93c5fd; /* fallback for non-supporting browsers */
}

@supports (-webkit-background-clip: text) {
  .glass-bottom-nav .nav-link.text-primary i,
  .glass-bottom-nav .nav-link.text-primary i::before,
  .glass-bottom-nav .nav-link.text-primary .small {
    background: linear-gradient(90deg, #bfdbfe 0%, #93c5fd 50%, #bfdbfe 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    animation: nav-gradient-move 12s ease-in-out infinite;
  }
}

@supports (background-clip: text) {
  .glass-bottom-nav .nav-link.text-primary i,
  .glass-bottom-nav .nav-link.text-primary i::before,
  .glass-bottom-nav .nav-link.text-primary .small {
    background: linear-gradient(90deg, #bfdbfe 0%, #93c5fd 50%, #bfdbfe 100%);
    background-size: 200% 100%;
    background-clip: text;
    color: transparent !important;
    display: inline-block;
    animation: nav-gradient-move 12s ease-in-out infinite;
  }
}

@keyframes nav-gradient-move {
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .glass-bottom-nav .nav-link.text-primary i,
  .glass-bottom-nav .nav-link.text-primary i::before,
  .glass-bottom-nav .nav-link.text-primary .small {
    animation: none;
  }
}

@media (max-width: 380px) {
  .glass-bottom-nav .container { gap: 0.75rem !important; }
  .glass-bottom-nav .nav-link { padding: .25rem .5rem; }
}

@media (max-width: 360px) {
  .glass-bottom-nav .nav-link i { font-size: 1rem; }
  .glass-bottom-nav .nav-link .small { font-size: .66rem; }
}

.glass-card,
.card.glass,
.modal-content.glass,
.offcanvas.glass {
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
  box-shadow: var(--glass-shadow);
  color: var(--glass-text);
}

/* Slightly darker glass for modal only */
.modal-content.glass {
  background: linear-gradient(180deg, rgba(17,24,39,0.58), rgba(17,24,39,0.42));
}

/* Darker modal backdrop (Bootstrap 5) for dark theme only */
body:not(.admin-light) .modal-backdrop {
  --bs-backdrop-opacity: 0.6;
}

/* Make modal/offcanvas close (X) white in dark theme */
body:not(.admin-light) .btn-close {
  filter: invert(1) grayscale(100%) brightness(160%);
  opacity: .9;
}
body:not(.admin-light) .btn-close:hover { opacity: 1; }
body.admin-light .btn-close { filter: none; }

.glass-sidebar {
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  border-right: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

.glass-input,
.form-control.glass,
.form-select.glass {
  background: rgba(17, 24, 39, 0.75); /* Made darker by increasing opacity */
  border: 1px solid var(--glass-border);
  color: var(--glass-text);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.glass-input::placeholder,
.form-control.glass::placeholder {
  color: rgba(255,255,255,0.88);
}

/* Ensure white caret on all selects inside user (glass) layout */
.glass-page select.form-select {
  color-scheme: dark; /* enables white native caret on some browsers */
}

.form-control.glass:focus,
.form-select.glass:focus {
  border-color: rgba(147,197,253,0.8);
  box-shadow: 0 0 0 0.2rem rgba(59,130,246,0.25);
}

/* Force readable text inside the closed select on bright bg */
.form-select.glass {
  color: var(--glass-text); /* Use glass text variable for consistency */
}
@media (prefers-color-scheme: light) {
  .form-select.glass {
    color: #0b1220;
  }
}

.glass-page .form-select,
.glass-page .form-select.glass {
  background: rgba(17, 24, 39, 0.75); /* Made darker by increasing opacity */
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
}

.input-group .input-group-text {
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--glass-border);
  color: var(--glass-text);
}

/* Hide default number input spinners (arrows) */
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.btn-primary {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  border: 0;
  box-shadow: 0 6px 20px rgba(37, 99, 235, 0.35);
}
.btn-primary:hover {
  filter: brightness(1.05);
}
.btn-outline-primary {
  color: #93c5fd;
  border-color: rgba(147,197,253,0.6);
}

.list-group.glass .list-group-item {
  background: rgba(255,255,255,0.04);
  border-color: var(--glass-border);
  color: var(--glass-text);
}

/* Notification card specific adjustments */
.notification-card {
  border: 1px solid rgba(255,255,255,0.06);
  padding: 0; /* card-body handles padding */
}
.notification-card .card-body { padding: .85rem 1rem; }
.notification-card.bg-glass { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.09); }
.notification-card .fw-semibold { font-size: 1rem; }
.notification-card .text-glass-muted { color: rgba(255,255,255,0.8) !important; }

.table.glass {
  --bs-table-bg: rgba(255,255,255,0.02);
  color: var(--glass-text);
}

/* Compact, elegant dark table for requests */
.table-compact.table.glass {
  --row-bg: rgba(255,255,255,0.03);
  --row-hover: rgba(147,197,253,0.12);
  --row-border: rgba(255,255,255,0.08);
}
.table-compact.table.glass thead th {
  background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.04));
  color: #ffffff;
  border-bottom: 1px solid var(--row-border);
  font-weight: 700;
}
.table-compact.table.glass tbody tr {
  background: var(--row-bg);
}
.table-compact.table.glass tbody tr + tr td {
  border-top: 1px dashed var(--row-border);
}
.table-compact.table.glass tbody td,
.table-compact.table.glass tbody th {
  border-bottom: 0 !important; /* remove default bottom border to avoid white line at table bottom */
}
.table-compact.table.glass tbody tr:hover {
  background: var(--row-hover);
}
.table-compact.table.glass td, .table-compact.table.glass th {
  padding-top: .55rem;
  padding-bottom: .55rem;
}
.table-compact.table.glass th,
.table-compact.table.glass td,
.table-compact.table.glass .small,
.table-compact.table.glass .pill,
.table-compact.table.glass .pill i,
.table-compact.table.glass .badge,
.table-compact.table.glass .badge-soft,
.table-compact.table.glass .text-glass-muted {
  color: #ffffff !important;
}
.cell-mono {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" on, "lnum" on;
}
.pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .15rem .5rem;
  border-radius: 999px;
  font-size: .825rem;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.06);
}
.pill i { opacity: .9; }
.pill-blue { color: #bfdbfe; border-color: rgba(147,197,253,0.45); background: rgba(59,130,246,0.18); }
.pill-amber { color: #fde68a; border-color: rgba(251,191,36,0.45); background: rgba(245,158,11,0.18); }
.badge-soft {
  background: rgba(59,130,246,0.18);
  color: #c7d2fe;
  border: 1px solid rgba(147,197,253,0.45);
}
.badge-soft.success { background: rgba(16,185,129,0.18); color: #bbf7d0; border-color: rgba(110,231,183,0.45); }
.badge-soft.warning { background: rgba(245,158,11,0.18); color: #fde68a; border-color: rgba(251,191,36,0.45); }
.badge-soft.muted { background: rgba(255,255,255,0.06); color: #e5e7eb; border-color: rgba(255,255,255,0.18); }

.toast.glass,
.dropdown-menu.glass,
.offcanvas-body.glass {
  background: rgba(17,24,39,0.65);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border: 1px solid var(--glass-border);
  color: var(--glass-text);
}

.text-glass-muted { color: rgba(255,255,255,0.82) !important; }
.border-glass { border-color: var(--glass-border) !important; }
.bg-glass { background: var(--glass-bg) !important; backdrop-filter: blur(12px); }

/* Accordion glass variant */
.accordion.glass .accordion-item {
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--glass-border);
  color: var(--glass-text);
  border-radius: 12px;
}
.accordion.glass .accordion-item + .accordion-item {
  margin-top: 0.5rem;
}
.accordion.glass .accordion-button {
  background: rgba(255,255,255,0.06);
  color: var(--glass-text);
  border-bottom: 1px solid var(--glass-border);
}
.accordion.glass .accordion-button:not(.collapsed) {
  background: rgba(255,255,255,0.1);
  color: var(--glass-text);
  box-shadow: none;
}
.accordion.glass .accordion-body {
  background: rgba(17,24,39,0.55);
  color: var(--glass-text);
}

/* Home FAQ: match feature-card background/look */
#homeFaq.accordion.glass .accordion-item {
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
}
#homeFaq .accordion-button {
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  color: var(--glass-text);
}
#homeFaq .accordion-button:not(.collapsed) {
  background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.05));
  color: var(--glass-text);
}
#homeFaq .accordion-body {
  background: rgba(255,255,255,0.02);
}


/* -------------------------------------------------------------
   Native select dropdown readability
   Ensure options render dark text on white background when opened
-------------------------------------------------------------- */
.form-select option,
.form-select optgroup {
  color: #0b1220;
  background-color: #ffffff;
}
.form-select option:checked {
  background-color: #e6f0ff;
  color: #0b1220;
}
.form-select[multiple] option:checked {
  background-color: #dbeafe;
}

/* Map custom styles removed by request */

/* -------------------------------------------------------------
   Ticketing/Chat minimal dark UI
-------------------------------------------------------------- */
.ticketing .chat-sidebar .chat-item {
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--glass-border);
  color: var(--glass-text);
  margin-bottom: .35rem;
  border-radius: 12px;
}
.ticketing .chat-sidebar .chat-item:hover {
  background: rgba(255,255,255,0.08);
}
.ticketing .chat-sidebar .chat-active {
  background: rgba(59,130,246,0.20) !important;
  border-color: rgba(147,197,253,0.45) !important;
}
.ticketing .chat-badge { box-shadow: 0 0 0 2px rgba(0,0,0,0.15); }

.ticketing .chat-header { border-bottom: 1px solid var(--glass-border); padding-bottom: .25rem; }

.chat-bubble {
  max-width: 78%;
  border-radius: 14px;
  padding: .5rem .75rem;
  line-height: 1.6;
  word-break: break-word;
  overflow-wrap: anywhere; /* break very long words/URLs */
  overflow-x: hidden; /* avoid horizontal overflow inside bubbles */
}
.chat-bubble-in {
  background: linear-gradient(135deg, rgba(16,185,129,0.25) 0%, rgba(5,150,105,0.25) 100%);
  border: 1px solid rgba(16,185,129,0.45);
  color: #d1fae5;
}
.chat-bubble-out {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  color: #fff;
}

/* -------------------------------------------------------------
   Features (home): animated icons and special cards
-------------------------------------------------------------- */
.feature-card {
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  border: 1px solid var(--glass-border);
  border-radius: var(--glass-radius);
  box-shadow: var(--glass-shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.feature-card:hover {
  transform: translateY(-4px);
  border-color: rgba(147,197,253,0.6);
}

.feature-icon-wrap {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(closest-side, rgba(147,197,253,.25), rgba(59,130,246,.15));
  box-shadow: 0 8px 20px rgba(59,130,246,0.35), inset 0 0 12px rgba(147,197,253,0.35);
}

.feature-icon {
  font-size: 1.5rem;
  color: #93c5fd;
  animation: feature-float 3.6s ease-in-out infinite;
  will-change: transform, filter;
}

.feature-card:hover .feature-icon {
  animation-duration: 2.2s;
  filter: brightness(1.1);
}

@keyframes feature-float {
  0% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
  100% { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .feature-icon { animation: none !important; }
  .feature-card { transition: none; }
}

/* Messages tabs on dark glass cards */
.card.glass .nav-tabs {
  border-color: var(--glass-border);
}
.card.glass .nav-tabs .nav-link {
  color: #ffffff;
  border: 1px solid transparent;
}
.card.glass .nav-tabs .nav-link:hover,
.card.glass .nav-tabs .nav-link:focus {
  color: #ffffff;
  border-color: transparent;
}
.card.glass .nav-tabs .nav-link.active,
.card.glass .nav-tabs .nav-item.show .nav-link {
  color: #ffffff;
  background: rgba(255,255,255,0.06);
  border-color: var(--glass-border) var(--glass-border) transparent;
}

/* -------------------------------------------------------------
   Light-mode overrides for admin chat (chat-light)
   Ensure text/bubble backgrounds are light so content is readable
-------------------------------------------------------------- */
.chat-light {
  background: #fff !important;
  color: #0b1220 !important;
}
.chat-light .bg-glass { background: #f8fafc !important; backdrop-filter: none; }
.chat-light .border-glass { border-color: rgba(11,18,32,0.06) !important; }
.chat-light .text-glass-muted { color: rgba(11,18,32,0.75) !important; }
.chat-light .chat-bubble-in {
  background: linear-gradient(135deg, rgba(16,185,129,0.12) 0%, rgba(5,150,105,0.12) 100%);
  border: 1px solid rgba(16,185,129,0.12);
  color: #06321a;
}
.chat-light .chat-bubble-out {
  background: linear-gradient(135deg, #e6f0ff 0%, #dbeafe 100%);
  border: 1px solid rgba(59,130,246,0.12);
  color: #0b1220;
}
.chat-light .btn-outline-light { color: #0b1220; border-color: rgba(11,18,32,0.08); }
.chat-light .btn.text-light { color: #0b1220 !important; }

/* Ensure Bootstrap tooltips use white text in dark/glass themes */
.tooltip-inner,
.bs-tooltip-top .tooltip-inner,
.bs-tooltip-bottom .tooltip-inner,
.bs-tooltip-start .tooltip-inner,
.bs-tooltip-end .tooltip-inner {
  color: #ffffff !important;
  background-color: rgba(0,0,0,0.95) !important; /* keep good contrast */
  border-radius: .35rem;
}

/* Make tooltip arrow match dark background */
.tooltip.bs-tooltip-top .tooltip-arrow::before,
.tooltip.bs-tooltip-bottom .tooltip-arrow::before,
.tooltip.bs-tooltip-start .tooltip-arrow::before,
.tooltip.bs-tooltip-end .tooltip-arrow::before {
  color: rgba(0,0,0,0.95) !important;
}

