/* =========================================================
   Bhasha Infra Pvt. Ltd. – Professional Construction Theme
   Frappe Framework v15 Compatible
   Fixes Included:
   - Uniform background even on scroll (no white patches)
   - Awesomebar / Help / Profile dropdown background + text visible
   - List view left filters panel themed (not white)
   - Page title/breadcrumb readable
   ========================================================= */

/* ---------------------------
   0) COLOR PALETTE VARIABLES
----------------------------*/
:root {
  /* Primary - Construction Orange */
  --primary: #E67E22;
  --primary-light: #F39C12;
  --primary-dark: #D35400;
  --primary-color: #E67E22;

  /* Secondary - Steel Gray */
  --secondary: #34495E;
  --secondary-light: #5D6D7E;
  --secondary-dark: #2C3E50;

  /* Accent - Blueprint Blue */
  --accent-blue: #2980B9;
  --accent-blue-light: #3498DB;
  --accent-blue-dark: #1F618D;

  /* Construction Orange Scale */
  --orange-50:  #FEF5E7;
  --orange-100: #FDEBD0;
  --orange-200: #FAD7A0;
  --orange-300: #F8C471;
  --orange-400: #F5B041;
  --orange-500: #E67E22;
  --orange-600: #DC7633;
  --orange-700: #CA6F1E;
  --orange-800: #BA4A00;

  /* Gray Scale */
  --gray-50:  #F8F9FA;
  --gray-100: #ECF0F1;
  --gray-200: #D5DBDB;
  --gray-300: #AEB6BF;
  --gray-400: #85929E;
  --gray-500: #5D6D7E;
  --gray-600: #34495E;
  --gray-700: #2C3E50;
  --gray-800: #1C2833;

  /* Blue Scale */
  --blue-50:  #EBF5FB;
  --blue-100: #D6EAF8;
  --blue-200: #AED6F1;
  --blue-300: #85C1E9;
  --blue-400: #5DADE2;
  --blue-500: #3498DB;
  --blue-600: #2980B9;
  --blue-700: #21618C;

  /* Semantic */
  --success: #27AE60;
  --warning: #F39C12;
  --danger: #E74C3C;
  --info: #3498DB;

  /* Links / text */
  --link-color: var(--primary);
  --text-on-primary: #ffffff;
  --text-on-dark: #ffffff;

  /* Shadows */
  --shadow-sm: 0 2px 4px rgba(52, 73, 94, 0.10);
  --shadow-md: 0 4px 12px rgba(52, 73, 94, 0.15);
  --shadow-lg: 0 8px 24px rgba(52, 73, 94, 0.20);
  --shadow-construction: 0 6px 16px rgba(230, 126, 34, 0.18);

  /* Background tokens */
  --bg-base: #FFF3E8;     /* warm base */
  --bg-tint: #FFE6D1;     /* peach tint */
  --surface: rgba(255, 255, 255, 0.92);
  --surface-2: rgba(255, 255, 255, 0.86);
}

/* =========================================================
   1) UNIFORM BACKGROUND (Fix scroll mismatch / white areas)
   ========================================================= */
html,
body {
  min-height: 100% !important;
  height: auto !important;
  background: linear-gradient(135deg, var(--bg-base) 0%, var(--bg-tint) 50%, var(--bg-base) 100%) !important;
  background-attachment: fixed !important;
}

/* Make all main wrappers transparent so gradient shows everywhere */
#body,
.app-main,
.page-container,
.page-body,
.page-wrapper,
.layout-main,
.layout-main-section,
.main-section,
.main-section-container,
.container.page-body,
.container.page-body > .row,
.layout-side-section,
.layout-main-section-wrapper,
.layout-main-section .row,
.desk-page,
.desk,
.workspace,
.route-container {
  background: transparent !important;
}

/* Sometimes Frappe paints white cards behind pages */
.page-content,
.page-content-wrapper,
.layout-main-section .page-content,
.layout-main-section .page-content .page-form,
.layout-main-section .page-content .page-form .form-page,
.layout-main-section .page-content .page-form .form-dashboard {
  background: transparent !important;
}

/* A soft surface behind content blocks (keeps it readable) */
.page-head,
.page-head-content,
.standard-sidebar-section,
.list-page,
.form-layout {
  background: transparent !important;
}

/* =========================================================
   2) TOP NAVBAR
   ========================================================= */
.navbar {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
  box-shadow: 0 4px 12px rgba(230, 126, 34, 0.22) !important;
  border-bottom: 3px solid var(--orange-700) !important;
}

.navbar,
.navbar a,
.navbar .nav-link,
.navbar .navbar-brand,
.navbar .navbar-home,
.navbar .text-muted,
.navbar .dropdown-toggle {
  color: #ffffff !important;
}

.navbar svg,
.navbar .icon {
  color: #ffffff !important;
  opacity: 0.95;
}

.navbar .nav-link:hover,
.navbar a:hover {
  opacity: 0.90 !important;
  background-color: rgba(255, 255, 255, 0.10) !important;
  border-radius: 6px !important;
}

/* Navbar search input (awesomebar trigger input) */
.navbar .form-control,
#navbar-search,
.navbar .search-bar input {
  background-color: rgba(255, 255, 255, 0.16) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
}
.navbar .form-control::placeholder,
#navbar-search::placeholder,
.navbar .search-bar input::placeholder {
  color: rgba(255, 255, 255, 0.78) !important;
}

/* =========================================================
   3) PAGE HEADER + TITLE + BREADCRUMB (Readable)
   ========================================================= */
.page-head {
  background: var(--surface-2) !important;
  border-bottom: 2px solid var(--orange-200) !important;
  box-shadow: var(--shadow-sm) !important;
}

/* Title text */
.page-title,
.page-title .title-text,
.page-title h1,
h1, h2, h3 {
  color: var(--gray-800) !important;
}

/* Breadcrumbs */
.breadcrumb,
.page-breadcrumb,
.page-breadcrumb a,
.breadcrumb-item,
.breadcrumb-item a {
  color: var(--gray-600) !important;
}
.page-breadcrumb a:hover,
.breadcrumb-item a:hover {
  color: var(--primary-dark) !important;
}

/* =========================================================
   4) SIDEBAR (Workspace / Modules)
   ========================================================= */
.desk-sidebar,
.standard-sidebar {
  background: linear-gradient(180deg, #FFF6EE 0%, #FFE6D1 100%) !important;
  border-right: 3px solid var(--orange-200) !important;
  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.05) !important;
}

/* Sidebar section headers */
.sidebar-label,
.standard-sidebar-label,
.desk-sidebar-label {
  color: var(--primary-dark) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  letter-spacing: 1.1px !important;
  padding: 16px 16px 8px !important;
  border-bottom: 2px solid var(--orange-200) !important;
  margin-bottom: 8px !important;
}

/* Sidebar items */
.sidebar-item {
  color: var(--gray-700) !important;
  border-radius: 10px !important;
  margin: 4px 12px !important;
  padding: 12px 16px !important;
  transition: all 0.25s ease !important;
  font-weight: 600 !important;
}

.sidebar-item svg,
.sidebar-item .icon {
  color: var(--primary) !important;
}

.sidebar-item:hover {
  background: linear-gradient(90deg, var(--orange-50) 0%, var(--orange-100) 100%) !important;
  transform: translateX(3px) !important;
  color: var(--primary-dark) !important;
  border-left: 3px solid var(--primary-light) !important;
}

/* Active */
.standard-sidebar .sidebar-item.active,
.standard-sidebar .sidebar-item.selected,
.desk-sidebar .sidebar-item.active,
.desk-sidebar .sidebar-item.selected {
  background: linear-gradient(90deg, var(--primary) 0%, var(--primary-light) 100%) !important;
  border-left: 4px solid var(--orange-800) !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(230, 126, 34, 0.25) !important;
}

.sidebar-item.active svg,
.sidebar-item.selected svg,
.sidebar-item.active .icon,
.sidebar-item.selected .icon {
  color: #ffffff !important;
}

/* =========================================================
   5) BUTTONS
   ========================================================= */
.btn-primary,
.btn.btn-primary {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%) !important;
  border: none !important;
  color: var(--text-on-primary) !important;
  font-weight: 700 !important;
  box-shadow: var(--shadow-construction) !important;
  transition: all 0.25s ease !important;
}

.btn-primary:hover,
.btn.btn-primary:hover {
  background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 20px rgba(230, 126, 34, 0.26) !important;
}

.btn-default,
.btn.btn-default {
  border: 2px solid var(--gray-300) !important;
  color: var(--gray-700) !important;
  background-color: rgba(255,255,255,0.92) !important;
  font-weight: 600 !important;
  transition: all 0.25s ease !important;
}

.btn-default:hover,
.btn.btn-default:hover {
  border-color: var(--primary) !important;
  color: var(--primary-dark) !important;
  background-color: var(--orange-50) !important;
}

/* =========================================================
   6) CARDS / WIDGETS / FORM SECTIONS (Surface)
   ========================================================= */
.card,
.widget,
.shortcut-card,
.widget-group,
.form-section,
.form-dashboard-section,
.section-body,
.dashboard-card {
  border: 2px solid var(--orange-200) !important;
  border-radius: 12px !important;
  background: var(--surface) !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 2px 8px rgba(230, 126, 34, 0.08) !important;
}

.card:hover,
.widget:hover,
.shortcut-card:hover,
.dashboard-card:hover {
  border-color: var(--primary) !important;
  box-shadow: 0 6px 20px rgba(230, 126, 34, 0.20) !important;
  transform: translateY(-2px) !important;
  background: rgba(255, 250, 245, 0.95) !important;
}

/* Section heads */
.widget-group-head,
.section-head {
  border-left: 5px solid var(--primary) !important;
  padding-left: 16px !important;
  background: linear-gradient(90deg, var(--orange-100) 0%, var(--orange-50) 55%, transparent 100%) !important;
  font-weight: 800 !important;
  color: var(--gray-800) !important;
  margin: 24px 0 16px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 4px rgba(230, 126, 34, 0.10) !important;
}

/* =========================================================
   7) LIST VIEW (Rows + Headers)
   ========================================================= */
.list-row,
.list-row-container {
  border-bottom: 1px solid var(--gray-200) !important;
  transition: all 0.2s ease !important;
}

.list-row:hover,
.list-row-container:hover {
  background: linear-gradient(90deg, var(--orange-50) 0%, transparent 100%) !important;
  border-left: 4px solid var(--primary) !important;
  box-shadow: var(--shadow-sm) !important;
}

.list-row-head,
.list-row-head .list-row-col,
.datatable .dt-header {
  background-color: var(--gray-700) !important;
  color: #ffffff !important;
  font-weight: 800 !important;
}

/* =========================================================
   8) LIST VIEW LEFT FILTER PANEL (Fix white background)
   ========================================================= */
.list-sidebar,
.list-sidebar .list-filters,
.list-sidebar .sidebar-section,
.list-sidebar .sidebar-section .sidebar-label,
.list-sidebar .filter-area,
.list-sidebar .filters,
.list-sidebar .form-group,
.filter-area,
.filter-group,
.list-filters {
  background: linear-gradient(180deg, rgba(255, 246, 238, 0.95) 0%, rgba(255, 230, 209, 0.92) 100%) !important;
  border-radius: 12px !important;
}

/* The actual filter cards/boxes inside sidebar */
.list-sidebar .sidebar-section,
.list-sidebar .list-filters,
.list-sidebar .filter-area,
.list-sidebar .form-group {
  border: 2px solid var(--orange-200) !important;
  box-shadow: 0 2px 10px rgba(230, 126, 34, 0.08) !important;
  padding: 12px !important;
}

/* Filter labels and text */
.list-sidebar,
.list-sidebar label,
.list-sidebar .control-label,
.list-sidebar .sidebar-label,
.list-sidebar .h6,
.list-sidebar .text-muted {
  color: var(--gray-700) !important;
}

/* Filter inputs should not look pure white */
.list-sidebar .form-control,
.list-sidebar input,
.list-sidebar select {
  background: rgba(255, 255, 255, 0.70) !important;
  border: 1px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
}

/* =========================================================
   9) FORMS – FOCUS / REQUIRED
   ========================================================= */
.form-control:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(230, 126, 34, 0.25) !important;
  outline: none !important;
}

.reqd {
  color: var(--primary) !important;
  font-weight: 800 !important;
}

/* =========================================================
   10) LINKS
   ========================================================= */
a {
  color: var(--link-color) !important;
  transition: all 0.2s ease !important;
}
a:hover {
  color: var(--primary-dark) !important;
  text-decoration: underline !important;
}

/* =========================================================
   11) DROPDOWNS + AWESOME BAR (Fix white dropdowns)
   ========================================================= */

/* Generic dropdown menu (help/profile/3-dot menus) */
.dropdown-menu {
  background: linear-gradient(180deg, rgba(255, 246, 238, 0.98) 0%, rgba(255, 230, 209, 0.96) 100%) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 12px !important;
  box-shadow: var(--shadow-md) !important;
  overflow: hidden !important;
}

.dropdown-menu .dropdown-item,
.dropdown-menu a,
.dropdown-menu button,
.dropdown-menu .dropdown-header,
.dropdown-menu .menu-item-label,
.dropdown-menu .text-muted {
  color: var(--gray-800) !important;
}

.dropdown-menu .dropdown-divider {
  border-top: 1px solid rgba(202, 111, 30, 0.25) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: linear-gradient(90deg, var(--orange-50) 0%, var(--orange-100) 100%) !important;
  color: var(--primary-dark) !important;
}

/* Navbar dropdown menu specifically (profile/help) */
.navbar .dropdown-menu {
  background: linear-gradient(180deg, rgba(255, 246, 238, 0.98) 0%, rgba(255, 230, 209, 0.96) 100%) !important;
}

/* Awesomebar (Awesomplete) container */
.awesomplete > ul,
.awesomplete ul,
.awesomplete .dropdown-menu,
#awesomplete_list_1,
#awesomplete_list_2 {
  background: linear-gradient(180deg, rgba(255, 246, 238, 0.98) 0%, rgba(255, 230, 209, 0.96) 100%) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-lg) !important;
  padding: 6px !important;
}

.awesomplete > ul > li,
.awesomplete ul li {
  color: var(--gray-800) !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
}

.awesomplete > ul > li:hover,
.awesomplete ul li:hover,
.awesomplete > ul > li[aria-selected="true"],
.awesomplete ul li[aria-selected="true"] {
  background: linear-gradient(90deg, var(--orange-50) 0%, var(--orange-100) 100%) !important;
  color: var(--primary-dark) !important;
}

/* Awesomebar match highlight */
.awesomplete mark {
  background: rgba(243, 156, 18, 0.35) !important;
  color: var(--gray-800) !important;
  padding: 0 2px !important;
  border-radius: 4px !important;
}

/* Ensure search result subtext is visible */
.awesomplete small,
.awesomplete .help,
.awesomplete .text-muted {
  color: var(--gray-600) !important;
}

/* =========================================================
   12) TABS
   ========================================================= */
.nav-tabs {
  border-bottom: 3px solid var(--orange-200) !important;
}

.nav-tabs .nav-link {
  color: var(--gray-600) !important;
  font-weight: 700 !important;
  border: none !important;
  padding: 12px 18px !important;
}

.nav-tabs .nav-link:hover {
  color: var(--primary-dark) !important;
  background-color: rgba(254, 245, 231, 0.9) !important;
  border-radius: 10px 10px 0 0 !important;
}

.nav-tabs .nav-link.active {
  color: var(--primary-dark) !important;
  background-color: rgba(255, 255, 255, 0.92) !important;
  border-bottom: 4px solid var(--primary) !important;
  font-weight: 900 !important;
}

/* =========================================================
   13) BADGES / INDICATORS
   ========================================================= */
.badge {
  font-weight: 700 !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
}

.badge-primary { background: var(--primary) !important; }
.badge-success { background: var(--success) !important; }
.badge-warning { background: var(--warning) !important; color: var(--gray-800) !important; }
.badge-danger  { background: var(--danger) !important; }

.indicator.orange,
.indicator-pill.orange { background-color: var(--primary) !important; }
.indicator.blue,
.indicator-pill.blue { background-color: var(--accent-blue) !important; }

/* =========================================================
   14) MODALS
   ========================================================= */
.modal-header {
  background: linear-gradient(135deg, var(--gray-700) 0%, var(--secondary) 100%) !important;
  color: #ffffff !important;
  border-bottom: 3px solid var(--primary) !important;
}

.modal-title {
  font-weight: 900 !important;
}

.modal-content {
  background: var(--surface) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-lg) !important;
}

/* =========================================================
   15) DATA TABLES (Frappe datatable)
   ========================================================= */
.datatable {
  border: 2px solid var(--orange-200) !important;
  border-radius: 12px !important;
  background: var(--surface) !important;
  overflow: hidden !important;
}

.datatable .dt-row:hover {
  background-color: rgba(254, 245, 231, 0.9) !important;
}

/* =========================================================
   16) TIMELINE
   ========================================================= */
.timeline-item {
  border-left: 3px solid var(--primary) !important;
  padding-left: 16px !important;
  margin-bottom: 16px !important;
}

.timeline-item::before {
  background-color: var(--primary) !important;
  border: 3px solid #ffffff !important;
  box-shadow: 0 0 0 3px var(--orange-200) !important;
}

/* =========================================================
   17) KANBAN
   ========================================================= */
.kanban-column {
  background-color: rgba(236, 240, 241, 0.85) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 12px !important;
}

.kanban-card {
  background: var(--surface) !important;
  border: 1px solid var(--gray-200) !important;
  border-left: 4px solid var(--primary) !important;
  border-radius: 10px !important;
  box-shadow: var(--shadow-sm) !important;
  transition: all 0.2s ease !important;
}

.kanban-card:hover {
  box-shadow: var(--shadow-construction) !important;
  transform: translateY(-2px) !important;
}

/* =========================================================
   18) SCROLLBAR
   ========================================================= */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: rgba(236, 240, 241, 0.85);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb {
  background: var(--primary);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--primary-dark);
}

/* =========================================================
   19) ACCESSIBILITY
   ========================================================= */
:focus-visible {
  outline: 3px solid rgba(230, 126, 34, 0.70) !important;
  outline-offset: 2px !important;
}

/* =========================================================
   20) PRINT
   ========================================================= */
@media print {
  .navbar,
  .desk-sidebar,
  .page-head-actions {
    display: none !important;
  }
  html, body {
    background: #ffffff !important;
  }
}

/* =========================================================
   21) RESPONSIVE
   ========================================================= */
@media (max-width: 768px) {
  .sidebar-item {
    padding: 10px 12px !important;
  }
  .navbar .navbar-brand {
    font-size: 16px !important;
  }
}

/* =========================================================
   LIST VIEW – TOP FILTER BAR (Main Filters at top)
   ========================================================= */

/* The top list header area that contains Filter button + sort + pills */
.list-page .list-header,
.list-page .list-header-subject,
.list-page .list-header .list-header-actions,
.list-page .list-header .list-filters,
.list-page .list-filters,
.list-page .list-filters .filter-area,
.list-page .list-row-head + .result,
.list-page .result,
.list-page .list-header .result {
  background: transparent !important;
}

/* The “top filter strip” container (where pills show up) */
.list-page .list-filters,
.list-page .filter-area,
.list-page .standard-filter-section,
.list-page .standard-filter-section .standard-filter {
  background: linear-gradient(
    180deg,
    rgba(255, 246, 238, 0.92) 0%,
    rgba(255, 230, 209, 0.88) 100%
  ) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 10px rgba(230, 126, 34, 0.08) !important;
}

/* Make the “Filter” / “Sort” / quick buttons match theme */
.list-page .list-header .btn,
.list-page .list-header .btn.btn-default,
.list-page .list-header .btn-group .btn {
  background: rgba(255, 255, 255, 0.78) !important;
  border: 2px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
}

.list-page .list-header .btn:hover,
.list-page .list-header .btn.btn-default:hover,
.list-page .list-header .btn-group .btn:hover {
  background: var(--orange-50) !important;
  border-color: var(--primary) !important;
  color: var(--primary-dark) !important;
}

/* The top filter input boxes (ID/Name/etc) */
.list-page .standard-filter-section input,
.list-page .standard-filter-section .form-control,
.list-page .list-filters input,
.list-page .list-filters .form-control {
  background: rgba(255, 255, 255, 0.70) !important;
  border: 1px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
  border-radius: 10px !important;
}

.list-page .standard-filter-section input::placeholder,
.list-page .standard-filter-section .form-control::placeholder,
.list-page .list-filters input::placeholder,
.list-page .list-filters .form-control::placeholder {
  color: rgba(44, 62, 80, 0.55) !important;
}

/* Filter “pills/tags” (selected filters) */
.list-page .filter-pill,
.list-page .filters .filter-pill,
.list-page .list-filters .filter-pill,
.list-page .filter-tag,
.list-page .tag-pill {
  background: linear-gradient(135deg, var(--orange-50) 0%, var(--orange-100) 100%) !important;
  border: 1px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
}

/* X/close icon inside pills */
.list-page .filter-pill .remove-filter,
.list-page .filter-pill .icon,
.list-page .filter-tag .icon {
  color: var(--primary-dark) !important;
  opacity: 0.95 !important;
}

/* When a pill is active/hover */
.list-page .filter-pill:hover,
.list-page .filter-tag:hover,
.list-page .tag-pill:hover {
  background: linear-gradient(135deg, var(--orange-100) 0%, var(--orange-200) 100%) !important;
  border-color: var(--primary) !important;
}

/* The “Filter” popover/dialog when you click Filter button */
.filter-popover,
.filter-popover .popover,
.popover.filter-popover,
.filter-popover .popover-body,
.filter-popover .filter-group,
.filter-popover .filters {
  background: linear-gradient(
    180deg,
    rgba(255, 246, 238, 0.98) 0%,
    rgba(255, 230, 209, 0.96) 100%
  ) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-lg) !important;
  color: var(--gray-800) !important;
}

/* Text inside filter popover */
.filter-popover label,
.filter-popover .control-label,
.filter-popover .text-muted,
.filter-popover .small {
  color: var(--gray-700) !important;
}

/* Inputs inside filter popover */
.filter-popover input,
.filter-popover select,
.filter-popover .form-control {
  background: rgba(255, 255, 255, 0.78) !important;
  border: 1px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
  border-radius: 10px !important;
}

/* Apply/Reset buttons inside filter popover */
.filter-popover .btn-primary {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%) !important;
  color: #fff !important;
  border: none !important;
}
.filter-popover .btn-default {
  background: rgba(255,255,255,0.80) !important;
  border: 2px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
}
/* =========================================================
   AWESOME BAR – FORCE RESULT TEXT DARK (Fix white text)
   ========================================================= */

/* The dropdown/popup list container */
.awesomplete > ul,
.awesomplete ul,
.awesomplete .dropdown-menu,
.awesomplete [role="listbox"],
.awesomplete .awesomplete-container,
.awesomplete .awesomplete-items,
#awesomplete_list_1,
#awesomplete_list_2 {
  background: linear-gradient(180deg, rgba(255, 246, 238, 0.98) 0%, rgba(255, 230, 209, 0.96) 100%) !important;
  border: 2px solid var(--orange-200) !important;
  box-shadow: var(--shadow-lg) !important;
}

/* Each item text = DARK */
.awesomplete > ul > li,
.awesomplete ul li,
.awesomplete li,
.awesomplete a,
.awesomplete span,
.awesomplete strong,
.awesomplete small,
.awesomplete .text-muted,
.awesomplete [role="option"] {
  color: var(--gray-800) !important;   /* ✅ black-ish */
}

/* Secondary/sub text slightly lighter */
.awesomplete small,
.awesomplete .help,
.awesomplete .awesomplete-item span.text-muted {
  color: var(--gray-600) !important;
}

/* Highlighted/selected item */
.awesomplete > ul > li:hover,
.awesomplete ul li:hover,
.awesomplete > ul > li[aria-selected="true"],
.awesomplete ul li[aria-selected="true"],
.awesomplete [role="option"][aria-selected="true"] {
  background: linear-gradient(90deg, var(--orange-50) 0%, var(--orange-100) 100%) !important;
  color: var(--primary-dark) !important;
}

/* Matched letters (mark) */
.awesomplete mark {
  background: rgba(243, 156, 18, 0.35) !important;
  color: var(--gray-800) !important;
}
/* =========================================================
   LOGIN PAGE THEME (Frappe v15)
   URL: /login
   ========================================================= */

/* Full page background */
body[data-route="login"],
body.login-page,
.page-card-container,
.login-content {
  background: linear-gradient(
    135deg,
    var(--bg-base) 0%,
    var(--bg-tint) 50%,
    var(--bg-base) 100%
  ) !important;
  background-attachment: fixed !important;
}

/* Center card (login modal) */
.page-card,
.login-content .page-card,
.page-card-container .page-card {
  background: rgba(255, 255, 255, 0.92) !important;
  border: 2px solid var(--orange-200) !important;
  border-radius: 16px !important;
  box-shadow: var(--shadow-lg) !important;
}

/* Headings text */
.page-card h4,
.page-card .page-card-head h4,
.page-card .page-card-head,
.page-card .page-card-head .indicator {
  color: var(--gray-800) !important;
  font-weight: 900 !important;
}

/* Inputs */
.page-card input,
.page-card .form-control {
  background: rgba(255, 255, 255, 0.75) !important;
  border: 1px solid var(--orange-200) !important;
  border-radius: 10px !important;
  color: var(--gray-800) !important;
}

.page-card input::placeholder,
.page-card .form-control::placeholder {
  color: rgba(44, 62, 80, 0.55) !important;
}

/* Focus */
.page-card input:focus,
.page-card .form-control:focus {
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(230, 126, 34, 0.25) !important;
}

/* Primary Login button */
.page-card .btn-primary,
.page-card button.btn-primary {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 800 !important;
  border-radius: 10px !important;
  box-shadow: var(--shadow-construction) !important;
}

.page-card .btn-primary:hover,
.page-card button.btn-primary:hover {
  background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%) !important;
}

/* Secondary button: Login with Email Link */
.page-card .btn:not(.btn-primary),
.page-card a.btn:not(.btn-primary) {
  background: rgba(255, 255, 255, 0.80) !important;
  border: 2px solid var(--orange-200) !important;
  color: var(--gray-800) !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
}

.page-card .btn:not(.btn-primary):hover,
.page-card a.btn:not(.btn-primary):hover {
  background: var(--orange-50) !important;
  border-color: var(--primary) !important;
  color: var(--primary-dark) !important;
}

/* Links like Forgot Password */
.page-card a,
.page-card a:hover {
  color: var(--primary-dark) !important;
}

/* Small helper text */
.page-card .text-muted,
.page-card small,
.page-card .help-box {
  color: var(--gray-600) !important;
}
