/**
 * ADHD Assets Tenant - CSS Overrides
 *
 * This file provides tenant-specific STRUCTURAL customizations.
 * Colors are defined in the theme (adhd_assets_minimal).
 *
 * Color palette (from theme):
 * - Brand: #fdb614
 * - Black: #141414
 * - White: #FFFFFF
 * - Grey: #A3A3A3
 */

/* =====================================================
   REMOVE ALL GRADIENTS - Use solid colors only
   ===================================================== */

:root {
  /* Override brand RGB for shadows - use black instead of yellow */
  --brand-rgb: 20, 20, 20;
  --brand-1: #141414;

  /* Override gradient variables with solid brand color */
  --grad-brand: #fdb614;
  --grad-brand-90: #fdb614;
  --grad-brand-rev: #fdb614;
  --brand-gradient: #fdb614;

  /* Override all numbered gradients */
  --gradient-1: #fdb614;
  --gradient-2: #fdb614;
  --gradient-3: #fdb614;
  --gradient-4: #fdb614;
  --gradient-5: #fdb614;
  --gradient-6: #fdb614;
  --gradient-7: #fdb614;
  --gradient-8: #fdb614;
  --gradient-9: #fdb614;
  --gradient-10: #fdb614;
  --gradient-11: #fdb614;
  --gradient-12: #fdb614;
  --gradient-13: #fdb614;
  --gradient-14: #fdb614;
  --gradient-15: #fdb614;
  --gradient-16: #fdb614;
  --gradient-17: #fdb614;
  --gradient-18: #fdb614;

  /* State/semantic gradients - all solid */
  --color-success-gradient: #fdb614;
  --color-danger-gradient: #fdb614;
  --color-warning-gradient: #fdb614;
  --color-info-gradient: #fdb614;
  --button-gradient: #fdb614;
  --card-gradient: #fdb614;
  --badge-gradient: #fdb614;
  --progress-gradient: #fdb614;
}

/* =====================================================
   BODY BACKGROUND IMAGE
   ===================================================== */

body {
  background-image: url('/tenant/images/background.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-color: #141414 !important;
}

/* =====================================================
   LOGO STYLING
   ===================================================== */

.logo-frame:has(img) {
  border: none !important;
  box-shadow: none !important;
}

/* =====================================================
   BUTTONS - Solid brand color, black text
   ===================================================== */

.btn-brand,
.btn-success {
  background: #fdb614 !important;
  color: #141414 !important;
}

.btn-brand:hover,
.btn-success:hover {
  background: #e5a412 !important;
}

/* Primary button - black with white text */
.btn-primary,
.btn.btn-primary,
button.btn-primary,
a.btn-primary {
  background: #141414 !important;
  background-color: #141414 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

.btn-primary:hover,
.btn.btn-primary:hover,
button.btn-primary:hover,
a.btn-primary:hover {
  background: #333333 !important;
  background-color: #333333 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Secondary button - white with black border */
.btn-secondary,
.btn.btn-secondary {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #141414 !important;
  border: 1px solid #141414 !important;
}

.btn-secondary:hover,
.btn.btn-secondary:hover {
  background: #f0f0f0 !important;
  background-color: #f0f0f0 !important;
  color: #141414 !important;
  border-color: #141414 !important;
}

/* Danger button - white text */
.btn-danger,
.btn.btn-danger,
button.btn-danger,
a.btn-danger {
  background: #dc3545 !important;
  background-color: #dc3545 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

.btn-danger:hover,
.btn.btn-danger:hover,
button.btn-danger:hover,
a.btn-danger:hover {
  background: #c82333 !important;
  background-color: #c82333 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* =====================================================
   CARDS - Glassmorphism
   ===================================================== */

.main-card {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  border-color: #141414 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.card {
  border-color: #141414 !important;
  background-color: transparent !important;
  background-image: none !important;
  -webkit-backdrop-filter: blur(5px) !important;
  backdrop-filter: blur(5px) !important;
}

.page-header-card {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: none !important;
}

.page-header-card h1,
.page-header-card h2,
.page-header-card h3,
.page-header-card .page-title,
.page-header-card .page-subtitle,
.page-header-card p {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: none !important;
}

/* Goal items (subscription cards, etc.) - white background */
.goal-item {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 1px solid #141414 !important;
}

.goal-item h3,
.goal-item h4,
.goal-item .subscription-name,
.goal-item .subscription-price,
.goal-item label,
.goal-item p {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

.goal-item .subscription-features li {
  color: #333333 !important;
}

.goal-item-roadmap {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 1px solid #141414 !important;
}

.goal-item-roadmap h3,
.goal-item-roadmap h4,
.goal-item-roadmap .goal-title,
.goal-item-roadmap label,
.goal-item-roadmap .form-label,
.goal-item-roadmap .form-text,
.goal-item-roadmap small,
.goal-item-roadmap p,
.goal-item-roadmap a {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

.goal-item-roadmap .form-control,
.goal-item-roadmap .form-select {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #141414 !important;
}

/* Submit section - white background */
.submit-section,
.submit-section.d-flex {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

/* Coach cards - white background, black border and text */
.coach-card,
.coach-card.card {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #141414 !important;
}

/* Coach profile hover popup - white background */
.coach-profile-hover {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-color: #141414 !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.1) !important;
}

.coach-profile-header {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  border-bottom-color: rgba(0, 0, 0, 0.15) !important;
}

.coach-profile-avatar img,
.coach-avatar-placeholder-large {
  border-color: #141414 !important;
}

.coach-card-name,
.coach-profile-name,
.coach-card .coach-card-name {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

.coach-profile-description,
.coach-card .coach-profile-description {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Coaching team tiles in overview - white bg, black text */
.card.h-100[style*="--color-surface"],
.card.h-100[style*="color-surface"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #141414 !important;
}

.card.h-100 .fw-semibold,
.card.h-100 .small,
.card.h-100 [style*="--color-text"] {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Large primary button - black background, white text */
.btn-primary.btn-lg,
.btn.btn-primary.btn-lg {
  background: #141414 !important;
  background-color: #141414 !important;
  color: #FFFFFF !important;
  border: none !important;
}

.btn-primary.btn-lg:hover,
.btn.btn-primary.btn-lg:hover {
  background: #333333 !important;
  background-color: #333333 !important;
  color: #FFFFFF !important;
}

/* Large flex button - white text */
.btn.btn-lg.flex-grow-1 {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* =====================================================
   MODALS - Solid white background
   ===================================================== */

.modal-content {
  background-color: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #141414 !important;
}

.modal-header,
.modal-body,
.modal-footer {
  background: transparent !important;
  background-color: transparent !important;
  border-color: rgba(20, 20, 20, 0.2) !important;
}

.modal-backdrop {
  background-color: rgba(20, 20, 20, 0.7) !important;
}

/* =====================================================
   NAVBAR - Solid white background
   ===================================================== */

.navbar,
.navbar.navbar-expand-lg,
.navbar.navbar-expand-lg.modern-navbar {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.admin-header,
.admin-navbar,
.admin-menu,
header.admin-header {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.nav-item.dropdown,
.nav-item.dropdown.show,
.navbar .nav-item.dropdown {
  background: transparent !important;
  background-color: transparent !important;
}

.navbar-nav.me-auto {
  background: transparent !important;
}

.nav-link,
.dropdown-item,
.modern-nav-link,
.navbar .modern-nav-link,
.nav-item .modern-nav-link {
  background: transparent !important;
  background-color: transparent !important;
}

/* =====================================================
   DROPDOWN MENU - White background
   ===================================================== */

.dropdown-menu,
.dropdown-menu.show,
.dropdown-menu.dropdown-menu-end,
.dropdown-menu.dropdown-menu-end.show,
ul.dropdown-menu {
  background-color: #FFFFFF !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 1px solid #141414 !important;
}

/* =====================================================
   FOOTER - Glassmorphism
   ===================================================== */

footer,
.footer,
.modern-footer {
  background: transparent !important;
  background-color: transparent !important;
  -webkit-backdrop-filter: blur(20px) !important;
  backdrop-filter: blur(20px) !important;
  border-top: 1px solid rgba(20, 20, 20, 0.3) !important;
}

/* =====================================================
   CLOSE BUTTON - Solid brand color
   ===================================================== */

.btn-close {
  background: #fdb614 url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23141414'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat !important;
  opacity: 1 !important;
  border-radius: 50% !important;
  padding: 0.5em !important;
}

/* =====================================================
   PROGRESS BARS - Solid brand color
   ===================================================== */

.progress-bar {
  background: #fdb614 !important;
}

/* =====================================================
   BADGES - Solid brand color
   ===================================================== */

.badge,
.adhd-tool-badge,
.adhd-tool-state-badge {
  background: #fdb614 !important;
  color: #141414 !important;
}

/* =====================================================
   FOCUS STATES
   ===================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-color: #141414 !important;
  box-shadow: 0 0 0 3px rgba(20, 20, 20, 0.2) !important;
}

/* =====================================================
   DROPDOWN ITEMS - Transparent/white background
   ===================================================== */

/* Regular dropdown items - flat style, full width, no shadows */
.dropdown-item {
  background: transparent !important;
  background-color: transparent !important;
  color: #141414 !important;
  width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border: none !important;
  font-weight: 500 !important;
}

.dropdown-item i {
  color: #141414 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: rgba(20, 20, 20, 0.05) !important;
  background-color: rgba(20, 20, 20, 0.05) !important;
  color: #141414 !important;
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
}

/* Add dividers between all dropdown menu items */
.dropdown-menu li:not(:last-child) {
  border-bottom: 1px solid rgba(20, 20, 20, 0.1) !important;
}

/* Hide the explicit dropdown-divider hr elements since we have borders now */
.dropdown-menu .dropdown-divider {
  display: none !important;
}

/* Colored dropdown item variants - all same style (transparent bg, black text) */
.dropdown-item-purple,
.dropdown-item-success,
.dropdown-item-info,
.dropdown-item-warning,
.dropdown-item-primary,
.dropdown-item-danger,
.dropdown-item-teal {
  background: transparent !important;
  background-color: transparent !important;
  color: #141414 !important;
}

.dropdown-item-purple:hover,
.dropdown-item-success:hover,
.dropdown-item-info:hover,
.dropdown-item-warning:hover,
.dropdown-item-primary:hover,
.dropdown-item-danger:hover,
.dropdown-item-teal:hover {
  background: rgba(20, 20, 20, 0.05) !important;
  background-color: rgba(20, 20, 20, 0.05) !important;
  color: #141414 !important;
}

/* =====================================================
   FLOATING BUTTONS - Solid brand color
   ===================================================== */

.floating-btn,
.floating-admin-btn,
.floating-buddy-btn {
  background: #fdb614 !important;
  color: #141414 !important;
}

/* =====================================================
   ACCESSIBILITY
   ===================================================== */

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-contrast: more) {
  .btn-primary,
  .btn-brand {
    border: 2px solid #c48c0f;
  }

  .badge {
    border: 1px solid #c48c0f;
  }
}

/* =====================================================
   SESSIONS MANAGER LAYOUT - 2 Column List Layout
   ===================================================== */

.sessions-tab-content > p.text-muted.text-center.mb-4 {
  display: none !important;
}

.main-session-grid {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 1.5rem !important;
}

.main-session-grid.sessions-grid-3col,
.main-session-grid.sessions-grid-6col {
  grid-template-columns: repeat(2, 1fr) !important;
}

.main-session-tile {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  grid-template-rows: auto auto !important;
  gap: 0.25rem 1.5rem !important;
  align-items: start !important;
  text-align: left !important;
  min-height: auto !important;
  padding: 1.5rem !important;
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  border: none !important;
}

.main-session-icon {
  display: none !important;
}

.main-session-level-badge {
  position: static !important;
  grid-row: 1 / 3 !important;
  grid-column: 1 !important;
  width: 60px !important;
  height: 60px !important;
  margin: 0 !important;
  background: #141414 !important;
  color: #FFFFFF !important;
  border-radius: 50% !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-size: 1.2rem !important;
  font-weight: 900 !important;
  transform: none !important;
  border: none !important;
}

.main-session-title {
  grid-column: 2 !important;
  grid-row: 1 !important;
  margin-bottom: 0 !important;
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 900 !important;
  letter-spacing: 1px !important;
  color: #000000 !important;
  background: transparent !important;
  -webkit-text-fill-color: #000000 !important;
  padding: 4px 0 !important;
  border-radius: 4px !important;
  display: inline-block !important;
}

.main-session-description {
  grid-column: 2 !important;
  grid-row: 2 !important;
  margin-bottom: 0 !important;
  font-size: 0.875rem !important;
  line-height: 1.4 !important;
  background: none !important;
  background-clip: unset !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #000000 !important;
  color: #000000 !important;
}

.main-session-tile .main-session-description {
  background: none !important;
  background-clip: unset !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #000000 !important;
  color: #000000 !important;
}

.main-session-tile .main-session-title {
  background: transparent !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 0.25rem !important;
  width: 100% !important;
}

/* Split title styling */
.main-session-title-part1 {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 1.1rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: #FFFFFF !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
}

.main-session-title-part2 {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 1.1rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  background: #141414 !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
  margin-left: 0 !important;
}

/* Tool icons - black */
.tool-icon {
  background-color: #141414 !important;
}

.tool-icon::before {
  background-color: #141414 !important;
}

.tool-icon-svg {
  filter: brightness(0) !important;
}

/* Hide level badge when play indicator is present */
.main-session-tile:has(.main-session-tile-play-indicator) .main-session-level-badge {
  display: none !important;
}

.main-session-tile-play-indicator {
  position: static !important;
  grid-row: 1 / 3 !important;
  grid-column: 1 !important;
  width: 60px !important;
  height: 60px !important;
  margin: 0 !important;
  background: #141414 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  border-radius: 50% !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.5rem !important;
  line-height: 1 !important;
  padding: 0 !important;
  opacity: 1 !important;
}

/* Responsive: tablet */
@media (max-width: 992px) {
  .main-session-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .main-session-grid.sessions-grid-3col,
  .main-session-grid.sessions-grid-6col {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .main-session-tile {
    padding: 1.25rem !important;
    gap: 0.25rem 1.25rem !important;
  }

  .main-session-level-badge {
    width: 50px !important;
    height: 50px !important;
    font-size: 1.1rem !important;
  }
}

/* Mobile: single column */
@media (max-width: 576px) {
  .main-session-grid,
  .main-session-grid.sessions-grid-3col,
  .main-session-grid.sessions-grid-6col {
    grid-template-columns: 1fr !important;
  }

  .main-session-tile {
    padding: 1rem !important;
    gap: 0.25rem 1rem !important;
  }

  .main-session-level-badge {
    width: 48px !important;
    height: 48px !important;
    font-size: 1rem !important;
  }
}

/* Mentor button */
.floating-buddy-btn {
  font-size: 0 !important;
}

.floating-buddy-btn .buddy-btn-text {
  font-size: 1rem !important;
}

/* Navbar toggle buttons - white bg, black icon, gold border on hover */
.modern-theme-toggle,
.btn.modern-theme-toggle,
.modern-theme-toggle.dropdown-toggle {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid #e0e0e0 !important;
  color: #141414 !important;
}

.modern-theme-toggle i,
.btn.modern-theme-toggle i,
.modern-theme-toggle.dropdown-toggle i {
  color: #141414 !important;
}

.modern-theme-toggle:hover,
.btn.modern-theme-toggle:hover,
.modern-theme-toggle.dropdown-toggle:hover,
.modern-theme-toggle.dropdown-toggle[aria-expanded="true"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #141414 !important;
  color: #141414 !important;
}

/* =====================================================
   HOME PAGE STYLING - Black/White/Grey Theme
   ===================================================== */

/* All container headers - match title font (Arial Black, bold, uppercase) */
.main-card h2,
.main-card h3,
.main-card h4,
.main-card .section-header h2,
.section-header h2,
h2,
.card h2,
.card-header h2 {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 1.1rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: none !important;
}

/* =====================================================
   UNIFIED STAT ITEMS - All tiles same centralized style
   ===================================================== */

/* Base stat item - white background, centered content */
.stat-item,
.stat-item-link,
a.stat-item-link,
button.stat-item-compact,
.stat-item-compact {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  text-decoration: none !important;
}

.stat-item::before {
  display: none !important;
}

.stat-item:hover,
.stat-item-link:hover,
a.stat-item-link:hover,
button.stat-item-compact:hover,
.stat-item-compact:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  transform: translateY(-2px) !important;
}

/* Stat icons - black circle with white symbol */
.stat-icon,
.stat-item .stat-icon,
.stat-item-link .stat-icon,
i.stat-icon,
i.bi.stat-icon {
  width: 60px !important;
  height: 60px !important;
  background: #141414 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 0.75rem auto !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-size: 1.5rem !important;
}

/* Compact stat icons */
.stat-icon-compact,
i.stat-icon-compact,
i.bi.stat-icon-compact {
  width: 50px !important;
  height: 50px !important;
  background: #141414 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 0.5rem auto !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font-size: 1.25rem !important;
}

/* Stat values and labels - black text */
.stat-value,
.stat-item .stat-value,
.stat-number {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  font-weight: 700 !important;
  background: none !important;
}

.stat-label,
.stat-item .stat-label,
.stat-label-compact,
.session-label {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: none !important;
}

.rc-tile-actions .stat-label-compact,
.stat-label-compact {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Suggestion items - black left border, black title */
.suggestion-item,
.notification-card {
  border-left-color: #141414 !important;
}

.suggestion-title,
.suggestion-item h4,
.suggestion-item .suggestion-title {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* All Sessions button - matches session tiles */
.view-all-sessions-btn,
a[href*="sessions_manager"] {
  background: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #e0e0e0 !important;
}

/* Sessions responsive grid - transparent container, white cards */
.sessions-responsive-grid {
  background: transparent !important;
  background-color: transparent !important;
}

.sessions-responsive-grid .session-tile,
.sessions-responsive-grid .main-session-tile {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
}

/* Recent completions section - hide the | delimiter in title */
.recent-completions-section .section-header h2 .title-separator,
.recent-completions-section h2 .title-separator {
  display: none !important;
}

/* If separator is just text, hide via content or font-size */
.recent-completions-section .section-header h2 {
  word-spacing: normal !important;
}

/* Suggestion card - white background, thin border, shadow */
.suggestion-card,
#suggestions-container .suggestion-card,
#suggestions-list .suggestion-card {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.suggestion-card:hover,
#suggestions-container .suggestion-card:hover,
#suggestions-list .suggestion-card:hover {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.suggestion-content,
.suggestion-card .suggestion-content,
.suggestion-text,
.suggestion-card .suggestion-text {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

.suggestion-content:hover,
.suggestion-card:hover .suggestion-content {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

/* Suggestion description - white background, dark text */
.suggestion-description,
.suggestion-item .suggestion-description,
.suggestion-card .suggestion-description {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #333333 !important;
}

/* Suggestion title - black text */
.suggestion-title,
.suggestion-card .suggestion-title {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Stat number - black color */
.stat-number,
.stat-item .stat-number {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: none !important;
}

/* "What to do next" section header icon - keep default styling */
#suggestions-container .section-header h2 i,
#suggestions-container .section-header i {
  display: inline !important;
  background: none !important;
  border-radius: 0 !important;
  width: auto !important;
  height: auto !important;
  color: #000000 !important;
}

/* "What to do next" suggestion icons - white on black circle */
.suggestion-icon,
.suggestion-card .suggestion-icon,
#suggestions-container .suggestion-icon,
#suggestions-list .suggestion-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 50px !important;
  height: 50px !important;
  min-width: 50px !important;
  background: #141414 !important;
  border-radius: 50% !important;
  color: #FFFFFF !important;
  font-size: 1.25rem !important;
  margin-right: 1rem !important;
}

/* "What to do next" action buttons - white text on black background */
.suggestion-action-btn,
.suggestion-actions .suggestion-action-btn,
.suggestion-card .suggestion-action-btn,
#suggestions-container .suggestion-action-btn {
  background: #141414 !important;
  background-color: #141414 !important;
  color: #FFFFFF !important;
  border: none !important;
}

.suggestion-action-btn:hover,
.suggestion-actions .suggestion-action-btn:hover,
.suggestion-card .suggestion-action-btn:hover,
#suggestions-container .suggestion-action-btn:hover {
  background: #333333 !important;
  background-color: #333333 !important;
  color: #FFFFFF !important;
}

/* Suggestion card - relative positioning for dismiss button */
.suggestion-card,
#suggestions-container .suggestion-card,
#suggestions-list .suggestion-card {
  position: relative !important;
}

/* Dismiss button - hidden by default, top right corner, red circle */
.suggestion-dismiss-btn,
.suggestion-card .suggestion-dismiss-btn,
#suggestions-container .suggestion-dismiss-btn {
  position: absolute !important;
  top: 5px !important;
  right: 8px !important;
  width: 28px !important;
  height: 28px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #dc3545 !important;
  border: none !important;
  border-radius: 50% !important;
  color: #FFFFFF !important;
  font-size: 0.75rem !important;
  opacity: 0 !important;
  transition: opacity 0.2s ease !important;
  cursor: pointer !important;
  z-index: 10 !important;
}

/* Show dismiss button on card hover */
.suggestion-card:hover .suggestion-dismiss-btn,
#suggestions-container .suggestion-card:hover .suggestion-dismiss-btn {
  opacity: 1 !important;
}

.suggestion-dismiss-btn:hover {
  background: #c82333 !important;
}

/* =====================================================
   CHAT PAGE - White background
   ===================================================== */

body.chat-page .main-card,
body.chat-page .card,
body.chat-page .chat-container,
body.chat-page .chat-messages-container,
body.chat-page .chat-area,
body.chat-page #chat-messages,
.chat-container,
.chat-messages,
.chat-messages-container,
.dialogue-chat-messages {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
}

/* =====================================================
   MODALS - Black text on white background
   ===================================================== */

.modal-content,
.modal-content * {
  color: #000000 !important;
}

.modal-content h1,
.modal-content h2,
.modal-content h3,
.modal-content h4,
.modal-content h5,
.modal-content h6,
.modal-content p,
.modal-content span,
.modal-content label,
.modal-content div,
.modal-content li,
.modal-content td,
.modal-content th {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* Modal title - match card header H2 style */
.modal-title,
.modal-content .modal-title,
.modal-header .modal-title {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 1.1rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: none !important;
}

.modal-content a {
  color: #141414 !important;
}

.modal-content a:hover {
  color: #fdb614 !important;
}

/* Preserve button text colors */
.modal-content .btn-primary,
.modal-content .btn-brand,
.modal-content .btn-success {
  color: #141414 !important;
}

.modal-content .btn-close {
  color: #141414 !important;
}

/* =====================================================
   HOME PAGE SESSIONS GRID - Fix container vs cards
   ===================================================== */

/* Container should be transparent */
.sessions-responsive-grid {
  background: transparent !important;
  background-color: transparent !important;
}

/* Individual session cards - white background */
.sessions-responsive-grid .session-tile,
.sessions-responsive-grid .stat-item,
.sessions-responsive-grid .stat-item-link,
.session-tile.stat-item,
.session-tile {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.session-tile:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* All sessions tile - same white style */
.all-sessions-tile {
  background: #FFFFFF !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.all-sessions-tile:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Stat item links - black shadows only */
.stat-item,
.stat-item-link,
a.stat-item-link {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

.stat-item:hover,
.stat-item-link:hover,
a.stat-item-link:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Session label text - black */
.session-tile .session-label,
.session-tile .stat-label {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

/* =====================================================
   LAST COMPLETED & LEVEL BADGE - Match title font
   ===================================================== */

/* "Last completed:" header text - match main-session-title-part1 font */
#recent-completions-section .section-header h2,
#recent-completions-section h2 {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 1.1rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: transparent !important;
}

/* Icon in last completed header */
#recent-completions-section .section-header h2 i,
#recent-completions-section h2 i {
  color: #000000 !important;
}

/* Level badge - match title font, no background */
.session-level-badge,
.session-tile .session-level-badge {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 0.9rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: transparent !important;
  opacity: 1 !important;
}

/* =====================================================
   NAV DROPDOWN - Remove any black background
   ===================================================== */

/* Override new_style.css:1617 - .navbar, .navbar-nav, .nav-link, .dropdown-menu, .dropdown-item */
.navbar-nav,
.nav-link,
.dropdown-item,
.navbar .navbar-nav,
.navbar .nav-link,
.navbar .dropdown-item,
ul.navbar-nav.ms-auto {
  background: transparent !important;
  background-color: transparent !important;
}

.nav-item.dropdown,
.nav-item.dropdown.show,
.navbar .nav-item.dropdown,
.navbar .nav-item,
.nav-item {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

.dropdown-toggle,
.nav-link.dropdown-toggle,
.modern-nav-link.dropdown-toggle {
  background: transparent !important;
  background-color: transparent !important;
}

.dropdown-toggle::after,
.dropdown-toggle::before {
  background: transparent !important;
}

/* =====================================================
   FORM CONTROLS - White background
   ===================================================== */

.form-control,
.form-control.flex-grow-1,
input.form-control,
textarea.form-control,
select.form-control {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #e0e0e0 !important;
}

.form-control:focus,
.form-control.flex-grow-1:focus {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-color: #141414 !important;
  box-shadow: 0 0 0 3px rgba(20, 20, 20, 0.2) !important;
}

/* =====================================================
   ACTION BUTTONS - Outline style (white bg, dark border)
   ===================================================== */

/* Primary action button - should look like outline-light */
.action-btn.primary,
.action-btn.primary.btn-sm,
.action-btn.primary.dropdown-toggle {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  color: #141414 !important;
  border: 1px solid #141414 !important;
  box-shadow: none !important;
}

.action-btn.primary:hover,
.action-btn.primary.btn-sm:hover,
.action-btn.primary.dropdown-toggle:hover {
  background: #141414 !important;
  background-color: #141414 !important;
  color: #FFFFFF !important;
  border-color: #141414 !important;
}

/* Outline light style reference */
.action-btn.outline-light,
.action-btn.outline-light.btn-sm {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #141414 !important;
  border: 1px solid #141414 !important;
}

.action-btn.outline-light:hover,
.action-btn.outline-light.btn-sm:hover {
  background: #141414 !important;
  background-color: #141414 !important;
  color: #FFFFFF !important;
}

/* =====================================================
   BUDDY WIDGET - White backgrounds, black text
   ===================================================== */

/* Buddy header - white background, black text */
.buddy-header {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #e0e0e0 !important;
}

.mentor-header-title,
.buddy-header-title {
  font-family: 'Arial Black', Helvetica, sans-serif !important;
  font-weight: 900 !important;
  font-size: 1rem !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

.mentor-header-subtitle,
.buddy-header p {
  color: #666666 !important;
  -webkit-text-fill-color: #666666 !important;
}

/* Buddy header buttons - black icons */
.buddy-close-btn,
.buddy-maximize-btn,
.buddy-reset-btn {
  color: #000000 !important;
  background: transparent !important;
}

.buddy-close-btn:hover,
.buddy-maximize-btn:hover,
.buddy-reset-btn:hover {
  background: rgba(0, 0, 0, 0.05) !important;
}

/* Buddy messages container - white background */
.buddy-messages {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

/* User message bubble - black text on white background */
.buddy-message.user .buddy-message-bubble {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #e0e0e0 !important;
}

/* Assistant message bubble - also ensure white bg */
.buddy-message.assistant .buddy-message-bubble {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #e0e0e0 !important;
}

/* Buddy widget container */
.buddy-widget,
.buddy-widget-container,
.buddy-content {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

/* Buddy input area - white background, black text */
.buddy-input-area {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

.buddy-input,
.buddy-input-area .buddy-input,
textarea.buddy-input {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #e0e0e0 !important;
}

.buddy-input::placeholder {
  color: #666666 !important;
}

/* =====================================================
   NOTIFICATION DOT - Brand yellow instead of red
   ===================================================== */

.notification-dot,
#notificationCircleDot {
  background-color: #fdb614 !important;
  background: #fdb614 !important;
}

/* =====================================================
   ALERTS - White background
   ===================================================== */

.alert,
.alert-info,
.alert.alert-info {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid #141414 !important;
  color: #000000 !important;
}

/* =====================================================
   HIDE FAVORITE/STAR FUNCTIONALITY
   ===================================================== */

.main-session-tile-favorite-indicator {
  display: none !important;
}

/* =====================================================
   END OF TENANT OVERRIDES
   ===================================================== */