/* AGRITRACK global light UI theme — presentation only. No application logic. */
:root {
  --ag-bg: #f7f8fa;
  --ag-surface: #ffffff;
  --ag-surface-soft: #fffaf6;
  --ag-text: #1f2937;
  --ag-muted: #6b7280;
  --ag-border: #e5e7eb;
  --ag-orange: #f97316;
  --ag-orange-dark: #ea580c;
  --ag-orange-soft: #fff1e7;
  --ag-shadow: 0 8px 24px rgba(15,23,42,.06);
}
html, body { background: var(--ag-bg) !important; color: var(--ag-text) !important; }
body, .main-content, .content, .content-wrapper, .page-content, .dashboard-content,
.wrapper, main, section, .container-fluid { color: var(--ag-text); }

/* Dominant white surfaces */
.sidebar, .side-bar, aside, .sidenav, .side-nav, .navigation,
.main-sidebar, .left-sidebar, .sidebar-wrapper,
header, .header, .topbar, .top-bar, .navbar, nav.navbar,
.card, .panel, .box, .widget, .modal-content, .dropdown-menu,
.table-container, .table-responsive, .form-container, .content-card,
.dashboard-card, .stat-card, .summary-card, .profile-card {
  background-color: var(--ag-surface) !important;
  color: var(--ag-text) !important;
}
.sidebar, .side-bar, aside, .sidenav, .side-nav, .main-sidebar, .left-sidebar, .sidebar-wrapper {
  border-right: 1px solid var(--ag-border) !important;
  box-shadow: 4px 0 18px rgba(15,23,42,.04) !important;
}
.card, .panel, .box, .widget, .content-card, .dashboard-card, .stat-card, .summary-card,
.table-container, .form-container, .modal-content {
  border-color: var(--ag-border) !important;
  box-shadow: var(--ag-shadow);
}

/* Readable neutral typography */
h1,h2,h3,h4,h5,h6,.card-title,.page-title,.section-title,.modal-title { color: #111827 !important; }
p, label, small, .text-muted, .subtitle, .description { color: var(--ag-muted); }
.sidebar a, .side-bar a, aside a, .sidenav a, .side-nav a, .main-sidebar a,
.navbar a, .dropdown-menu a { color: #374151 !important; }

/* Orange only for interaction, active state, highlights and CTAs */
a:not(.sidebar a):not(.side-bar a):not(aside a):not(.sidenav a):not(.side-nav a):not(.main-sidebar a) { color: var(--ag-orange-dark); }
.sidebar a:hover, .side-bar a:hover, aside a:hover, .sidenav a:hover, .side-nav a:hover,
.main-sidebar a:hover, .sidebar .active > a, .sidebar a.active, .nav-link.active,
.menu-item.active, li.active > a, .dropdown-item:hover, .dropdown-item:focus {
  background: var(--ag-orange-soft) !important;
  color: var(--ag-orange-dark) !important;
}
.sidebar .active i, .sidebar a:hover i, .nav-link.active i { color: var(--ag-orange) !important; }

.btn-primary, .btn-warning, .btn-orange, .btn-success,
button[type="submit"], input[type="submit"], .action-btn.primary,
.pagination .active > a, .pagination .active > span {
  background-color: var(--ag-orange) !important;
  border-color: var(--ag-orange) !important;
  color: #fff !important;
}
.btn-primary:hover, .btn-warning:hover, .btn-orange:hover, .btn-success:hover,
button[type="submit"]:hover, input[type="submit"]:hover, .action-btn.primary:hover {
  background-color: var(--ag-orange-dark) !important;
  border-color: var(--ag-orange-dark) !important;
  color: #fff !important;
}
.btn-outline-primary, .btn-outline-warning {
  background: #fff !important; border-color: var(--ag-orange) !important; color: var(--ag-orange-dark) !important;
}
.btn-outline-primary:hover, .btn-outline-warning:hover { background: var(--ag-orange-soft) !important; }

/* Forms */
input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control, .form-select {
  background-color: #fff !important; color: var(--ag-text) !important; border-color: #d1d5db !important;
}
input:focus, select:focus, textarea:focus, .form-control:focus, .form-select:focus {
  border-color: var(--ag-orange) !important;
  box-shadow: 0 0 0 .2rem rgba(249,115,22,.14) !important;
  outline: none !important;
}
input[type="checkbox"]:checked, input[type="radio"]:checked { accent-color: var(--ag-orange); }

/* Tables */
table { background: #fff !important; color: var(--ag-text) !important; }
thead, thead tr, th { background: #fff7ed !important; color: #9a3412 !important; border-color: var(--ag-border) !important; }
td { background: #fff !important; color: #374151 !important; border-color: var(--ag-border) !important; }
tbody tr:hover td { background: #fffaf6 !important; }

/* Common framework colors that previously create dark/green surfaces */
.bg-dark, .bg-secondary, .bg-success, .bg-primary:not(.btn):not(button),
[class*="bg-gradient"]:not(.btn):not(button) { background-color: #fff !important; color: var(--ag-text) !important; }
.text-primary, .text-warning, .text-success { color: var(--ag-orange-dark) !important; }
.badge.bg-primary, .badge.bg-warning, .badge.bg-success, .badge-primary, .badge-warning, .badge-success {
  background: var(--ag-orange-soft) !important; color: var(--ag-orange-dark) !important;
}
hr { border-color: var(--ag-border) !important; opacity: 1; }

/* Preserve semantic destructive/error styling rather than disguising it as a CTA. */
.btn-danger, .alert-danger, .text-danger { }

/* Sidebar refinement: predominantly white across every role. */
.sidebar, .side-bar, aside, .sidenav, .side-nav, .navigation,
.main-sidebar, .left-sidebar, .sidebar-wrapper,
.sidebar .sidebar-header, .sidebar .sidebar-brand, .sidebar .brand,
.sidebar .logo, .sidebar .menu, .sidebar .nav, .sidebar ul,
.side-bar .sidebar-header, .side-bar .menu, .side-bar ul,
aside .sidebar-header, aside .menu, aside ul,
.main-sidebar .sidebar-header, .main-sidebar .menu, .main-sidebar ul {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #1f2937 !important;
}
.sidebar::before, .side-bar::before, aside::before, .sidenav::before,
.side-nav::before, .main-sidebar::before, .left-sidebar::before,
.sidebar-wrapper::before { background: #ffffff !important; }
.sidebar a, .sidebar .nav-link, .sidebar .menu-item,
.side-bar a, .side-bar .nav-link, aside a, aside .nav-link,
.sidenav a, .side-nav a, .main-sidebar a, .left-sidebar a,
.sidebar-wrapper a {
  background-color: transparent !important;
  color: #374151 !important;
}
.sidebar a:hover, .sidebar .nav-link:hover, .sidebar .menu-item:hover,
.side-bar a:hover, aside a:hover, .sidenav a:hover, .side-nav a:hover,
.main-sidebar a:hover, .left-sidebar a:hover, .sidebar-wrapper a:hover {
  background: #fff7ed !important;
  color: #ea580c !important;
}
.sidebar .active > a, .sidebar a.active, .sidebar .nav-link.active,
.side-bar .active > a, .side-bar a.active, aside .active > a, aside a.active,
.sidenav .active > a, .side-nav .active > a, .main-sidebar .active > a,
.left-sidebar .active > a, .sidebar-wrapper .active > a {
  background: #fff1e7 !important;
  color: #ea580c !important;
  box-shadow: inset 3px 0 0 #f97316 !important;
}
.sidebar i, .side-bar i, aside i, .sidenav i, .side-nav i,
.main-sidebar i, .left-sidebar i, .sidebar-wrapper i { color: #6b7280 !important; }
.sidebar a:hover i, .sidebar .active > a i, .sidebar a.active i,
.side-bar a:hover i, .side-bar .active > a i, aside a:hover i, aside .active > a i,
.main-sidebar a:hover i, .main-sidebar .active > a i { color: #f97316 !important; }
.sidebar hr, .side-bar hr, aside hr, .main-sidebar hr { border-color: #e5e7eb !important; }

/* 2026-10-06 final sidebar normalization: white shell + one orange interaction language. */
:root {
  --ag-sidebar-bg: #ffffff;
  --ag-sidebar-active: #ffa667;
  --ag-sidebar-hover: #fff1e7;
  --ag-sidebar-active-text: #111827;
  --ag-sidebar-accent: #f97316;
}
html body .sidebar,
html body .side-bar,
html body aside.sidebar,
html body aside.side-bar,
html body .sidenav,
html body .side-nav,
html body .navigation,
html body .main-sidebar,
html body .left-sidebar,
html body .sidebar-wrapper,
html body .sidebar-container,
html body .sidebar-content,
html body .sidebar-inner,
html body .sidebar-header,
html body .sidebar-brand,
html body .sidebar-logo,
html body .sidebar .brand,
html body .sidebar .logo,
html body .sidebar nav,
html body .sidebar .nav,
html body .sidebar .menu,
html body .sidebar ul,
html body .sidebar li,
html body .sidebar .nav-section,
html body .sidebar .nav-group {
  background-color: var(--ag-sidebar-bg) !important;
  background-image: none !important;
}
html body .sidebar::before,
html body .sidebar::after,
html body .side-bar::before,
html body .side-bar::after,
html body .sidebar-wrapper::before,
html body .sidebar-wrapper::after,
html body .main-sidebar::before,
html body .main-sidebar::after {
  background-color: var(--ag-sidebar-bg) !important;
  background-image: none !important;
}
/* Inactive entries always stay neutral. */
html body .sidebar a:not(.active),
html body .sidebar .nav-link:not(.active),
html body .side-bar a:not(.active),
html body .main-sidebar a:not(.active),
html body .sidebar-wrapper a:not(.active) {
  background-color: transparent !important;
  background-image: none !important;
  color: #111827 !important;
}
/* One hover color everywhere. */
html body .sidebar a:hover,
html body .sidebar .nav-link:hover,
html body .side-bar a:hover,
html body .main-sidebar a:hover,
html body .sidebar-wrapper a:hover {
  background: var(--ag-sidebar-hover) !important;
  color: #c2410c !important;
}
/* One selected/current-page highlight everywhere. */
html body .sidebar a.active,
html body .sidebar .nav-link.active,
html body .sidebar li.active > a,
html body .sidebar li.active > .nav-link,
html body .sidebar .menu-item.active,
html body .side-bar a.active,
html body .side-bar li.active > a,
html body .main-sidebar a.active,
html body .main-sidebar li.active > a,
html body .sidebar-wrapper a.active,
html body .sidebar-wrapper li.active > a {
  background: var(--ag-sidebar-active) !important;
  background-color: var(--ag-sidebar-active) !important;
  background-image: none !important;
  color: var(--ag-sidebar-active-text) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
html body .sidebar a.active i,
html body .sidebar .nav-link.active i,
html body .sidebar li.active > a i,
html body .side-bar a.active i,
html body .main-sidebar a.active i,
html body .sidebar-wrapper a.active i {
  color: #111827 !important;
}
/* Keep the small orange current-page indicator where a page uses one. */
html body .sidebar a.active::before,
html body .sidebar .nav-link.active::before,
html body .sidebar li.active > a::before,
html body .main-sidebar a.active::before {
  background: var(--ag-sidebar-accent) !important;
}

/* 2026-10-06 universal role sidebar final override.
   Presentation only: force the complete sidebar shell white on MAO and BRGY pages. */
html body > aside.sidebar,
html body > .sidebar,
html body aside#sidebar,
html body #sidebar.sidebar {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border-right: 1px solid #e5e7eb !important;
  color: #111827 !important;
}
html body #sidebar .logo,
html body #sidebar .menu,
html body #sidebar .nav-section-label,
html body #sidebar .nav-dash {
  background: #ffffff !important;
  background-color: #ffffff !important;
  background-image: none !important;
}
html body #sidebar .logo { border-bottom-color:#e5e7eb !important; }
html body #sidebar .logo-text h2,
html body #sidebar .logo-text small,
html body #sidebar .nav-section-label { color:#111827 !important; }
html body #sidebar .nav-link:not(.active) {
  background:#ffffff !important;
  color:#111827 !important;
  box-shadow:none !important;
}
html body #sidebar .nav-link:not(.active) i { color:#111827 !important; }
html body #sidebar .nav-link:not(.active):hover {
  background:#fff1e7 !important;
  color:#c2410c !important;
}
html body #sidebar .nav-link:not(.active):hover i { color:#f97316 !important; }
html body #sidebar .nav-link.active {
  background:#ffa667 !important;
  color:#111827 !important;
  box-shadow:none !important;
}
html body #sidebar .nav-link.active i { color:#111827 !important; }
html body #sidebar .nav-link.active::before { background:#f97316 !important; }