/* ============================================================
   ALMACON BRANDING OVERRIDES — Metrics Plus ERP
   Based on Almacon Basic Branding Manual
   Colors: Prussian Blue #18495C, Gold #EAAB21, Dark #231F20
   Typography: Russo One (headings), Nunito (UI text)
   ============================================================ */

/* --- TYPOGRAPHY --- */
@import url('https://fonts.googleapis.com/css2?family=Russo+One&family=Nunito:wght@300;400;500;600;700&display=swap');

:root {
  --almacon-prussian: #18495C;
  --almacon-gold: #EAAB21;
  --almacon-dark: #231F20;
  --almacon-bg-light: #F8F9FA;
  --almacon-border: #E5E7EB;
}

/* Override theme default font */
body, .app-sidebar, .main-content, .card, .table, .form-control,
.form-label, input, select, textarea, button, .sidebar-link,
.data-table-cell, .dropdown-item, .badge, .alert, .btn,
.side-menu__label, .side-menu__item, .main-menu-label,
.page-header, .breadcrumb, .nav-link, .list-group-item,
.modal-content, .modal-header, .modal-body, .modal-footer,
.popover, .tooltip, .toast, .offcanvas {
  font-family: 'Nunito', sans-serif !important;
}

/* Russo One for primary headings */
h1, h2, h3, h4, .h1, .h2, .h3, .h4,
.section-title, .page-title, .card-title,
.metric-value-large, .metric-value,
.main-sidebar-header h5,
.display-1, .display-2, .display-3, .display-4,
.total-value, .stat-value,
.kpi-value, .dashboard-stat-number {
  font-family: 'Russo One', sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* --- SIDEBAR — Prussian Blue background --- */
.app-sidebar {
  background-color: var(--almacon-prussian) !important;
}

.main-sidebar-header {
  background-color: var(--almacon-prussian) !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}

.main-sidebar-header h5 {
  color: var(--almacon-gold) !important;
  font-size: 1.25rem;
}

/* Sidebar menu items — light text on dark bg */
.app-sidebar .side-menu__label,
.app-sidebar .side-menu__icon,
.app-sidebar .side-menu__angle {
  color: rgba(255,255,255,0.75) !important;
}

.app-sidebar .main-menu-label {
  color: var(--almacon-gold) !important;
  opacity: 0.7;
  font-size: 0.65rem;
  letter-spacing: 1px;
}

/* Sidebar active/hover — Gold accent */
.side-menu__item:hover,
.side-menu__item.active,
.slide.active > .side-menu__item {
  background-color: rgba(255,255,255,0.1) !important;
}

.side-menu__item:hover .side-menu__label,
.side-menu__item:hover .side-menu__icon,
.side-menu__item:hover .side-menu__angle,
.side-menu__item.active .side-menu__label,
.side-menu__item.active .side-menu__icon,
.side-menu__item.active .side-menu__angle,
.slide.active > .side-menu__item .side-menu__label,
.slide.active > .side-menu__item .side-menu__icon {
  color: var(--almacon-gold) !important;
}

/* Sidebar sub-menu */
.app-sidebar .slide-menu {
  background-color: rgba(0,0,0,0.15) !important;
}

/* Sub-menu item text (no .side-menu__label wrapper — text is inside <a> directly) */
.app-sidebar .slide-menu .side-menu__item {
  color: rgba(255,255,255,0.65) !important;
}

.app-sidebar .slide-menu .side-menu__item:hover,
.app-sidebar .slide-menu .side-menu__item.active {
  color: var(--almacon-gold) !important;
  background-color: rgba(255,255,255,0.1) !important;
  border-radius: 4px;
}

/* --- HEADER --- */
.app-header {
  background-color: #fff !important;
  border-bottom: 1px solid var(--almacon-border) !important;
}

/* --- PRIMARY BUTTONS — Gold or Prussian --- */
.btn-primary {
  background-color: var(--almacon-prussian) !important;
  border-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #123a4a !important;
  border-color: #123a4a !important;
  color: #fff !important;
}

.btn-success {
  background-color: var(--almacon-gold) !important;
  border-color: var(--almacon-gold) !important;
  color: var(--almacon-dark) !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active {
  background-color: #d49a1e !important;
  border-color: #d49a1e !important;
  color: var(--almacon-dark) !important;
}

/* --- OUTLINE BUTTONS --- */
.btn-outline-primary {
  border-color: var(--almacon-prussian) !important;
  color: var(--almacon-prussian) !important;
}

.btn-outline-primary:hover {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

/* Table action buttons — outline style */
.table td .btn.btn-info,
.table td .btn.btn-secondary,
.table td .btn.btn-warning {
  background-color: transparent !important;
  border: 1px solid var(--almacon-prussian) !important;
  color: var(--almacon-prussian) !important;
}

.table td .btn.btn-info:hover,
.table td .btn.btn-secondary:hover,
.table td .btn.btn-warning:hover {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.table td .btn.btn-danger {
  background-color: transparent !important;
  border: 1px solid #dc3545 !important;
  color: #dc3545 !important;
}

.table td .btn.btn-danger:hover {
  background-color: #dc3545 !important;
  color: #fff !important;
}

.table td .btn.btn-success {
  background-color: var(--almacon-gold) !important;
  border-color: var(--almacon-gold) !important;
  color: var(--almacon-dark) !important;
}

.table td .btn.btn-success:hover {
  background-color: #d49a1e !important;
  border-color: #d49a1e !important;
}

.table .btn-group .btn,
.table td .btn,
.data-table .btn {
  border-radius: 4px !important;
  padding: 0.2rem 0.5rem !important;
  font-size: 0.8rem !important;
}

/* --- STATUS BADGES — Tinted backgrounds --- */
/* Approved / Success status */
.badge.bg-success,
span.badge.bg-success {
  background-color: rgba(38, 191, 148, 0.15) !important;
  color: #0d7a5a !important;
  border: 1px solid rgba(38, 191, 148, 0.3);
  font-weight: 500;
}

/* Pending / Warning status */
.badge.bg-warning,
span.badge.bg-warning {
  background-color: rgba(234, 171, 33, 0.15) !important;
  color: #b87d0a !important;
  border: 1px solid rgba(234, 171, 33, 0.3);
  font-weight: 500;
}

/* Rejected / Danger status */
.badge.bg-danger,
span.badge.bg-danger {
  background-color: rgba(255, 0, 0, 0.1) !important;
  color: #c00 !important;
  border: 1px solid rgba(255, 0, 0, 0.2);
  font-weight: 500;
}

/* Info status */
.badge.bg-info,
span.badge.bg-info {
  background-color: rgba(41, 135, 147, 0.15) !important;
  color: #1a6b7a !important;
  border: 1px solid rgba(41, 135, 147, 0.3);
  font-weight: 500;
}

/* Secondary status */
.badge.bg-secondary,
span.badge.bg-secondary {
  background-color: rgba(108, 117, 125, 0.12) !important;
  color: #495057 !important;
  border: 1px solid rgba(108, 117, 125, 0.2);
  font-weight: 500;
}

/* --- DASHBOARD KPI CARDS --- */
.card.dashboard-card,
.card.card-stat,
.card:has(.metric-value) {
  border: 1px solid var(--almacon-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.card.dashboard-card .card-body,
.card.card-stat .card-body {
  padding: 1.25rem !important;
}

.metric-value,
.stat-value,
.kpi-value {
  color: var(--almacon-prussian) !important;
  font-size: 1.75rem;
}

/* KPI icons in gold */
.kpi-icon,
.metric-icon,
.stat-icon {
  color: var(--almacon-gold) !important;
}

/* Dashboard stat labels */
.metric-label,
.stat-label,
.kpi-label {
  color: #6c757d !important;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* --- DATA TABLES --- */

/* Default table headers — Prussian Blue (exclude light variants) */
.table thead:not(.table-light):not(.thead-light):not(.bg-light),
.table-dark {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.table thead:not(.table-light):not(.thead-light):not(.bg-light) th,
.table-dark th {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: none !important;
}

/* Light table headers — preserve light bg with dark text */
.table thead.table-light th,
.table thead.thead-light th,
.table thead.bg-light th {
  background-color: #f8f9fa !important;
  color: #212529 !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Sort links inside Prussian Blue table headers — inherit white */
.table thead:not(.table-light):not(.thead-light):not(.bg-light) th a,
.table-dark th a,
.table thead:not(.table-light):not(.thead-light):not(.bg-light) th a:visited,
.table-dark th a:visited {
  color: inherit !important;
  text-decoration: none;
}

.table thead:not(.table-light):not(.thead-light):not(.bg-light) th a:hover,
.table-dark th a:hover {
  color: var(--almacon-gold) !important;
}

/* Hover on sortable header cells in Prussian Blue tables */
.table thead:not(.table-light):not(.thead-light):not(.bg-light) th:hover,
.table-dark th:hover {
  color: var(--almacon-gold) !important;
}

/* Sort icons in Prussian Blue headers — white instead of text-muted */
.table thead:not(.table-light):not(.thead-light):not(.bg-light) th .bx-sort,
.table-dark th .bx-sort {
  color: rgba(255,255,255,0.7) !important;
}

.table thead:not(.table-light):not(.thead-light):not(.bg-light) th .text-muted,
.table-dark th .text-muted {
  color: rgba(255,255,255,0.5) !important;
}

/* Active sort state — icon turns Gold when column is actively sorted */
.table thead:not(.table-light):not(.thead-light):not(.bg-light) th .bx-sort-up,
.table-dark th .bx-sort-up,
.table thead:not(.table-light):not(.thead-light):not(.bg-light) th .bx-sort-down,
.table-dark th .bx-sort-down {
  color: var(--almacon-gold) !important;
}

/* Hover on sortable header cells in light tables */
.table thead.table-light th:hover,
.table thead.thead-light th:hover,
.table thead.bg-light th:hover {
  color: var(--almacon-prussian) !important;
}

/* Sort icons in light headers — Prussian Blue accent */
.table thead.table-light th .bx-sort,
.table thead.thead-light th .bx-sort,
.table thead.bg-light th .bx-sort,
.table thead.table-light th .bx-sort-up,
.table thead.thead-light th .bx-sort-up,
.table thead.bg-light th .bx-sort-up,
.table thead.table-light th .bx-sort-down,
.table thead.thead-light th .bx-sort-down,
.table thead.bg-light th .bx-sort-down {
  color: var(--almacon-prussian) !important;
}

/* Sortable-header active state — use Prussian Blue instead of Bootstrap blue */
.sortable-header.active {
  background-color: rgba(24, 73, 92, 0.1) !important;
  color: var(--almacon-prussian) !important;
}

.sortable-header.active i {
  color: var(--almacon-prussian) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(24, 73, 92, 0.03) !important;
}

.table-hover > tbody > tr:hover {
  background-color: rgba(24, 73, 92, 0.06) !important;
}

/* Table row actions — clean icons */
.table td .btn-group .btn,
.table td .btn {
  padding: 0.2rem 0.5rem !important;
  font-size: 0.8rem !important;
  border-radius: 4px !important;
}

/* --- PAGINATION --- */
.page-link {
  color: var(--almacon-prussian) !important;
}

.page-link:hover {
  color: var(--almacon-prussian) !important;
  background-color: rgba(24, 73, 92, 0.08) !important;
}

.page-item.active .page-link {
  background-color: var(--almacon-prussian) !important;
  border-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.page-item.active .page-link:hover {
  color: var(--almacon-gold) !important;
}

/* Disabled pagination */
.page-item.disabled .page-link {
  color: var(--text-muted) !important;
}

/* --- FORMS --- */
.form-control:focus,
.form-select:focus {
  border-color: var(--almacon-prussian) !important;
  box-shadow: 0 0 0 0.2rem rgba(24, 73, 92, 0.15) !important;
}

/* Prevent word wrapping in select dropdowns — never break mid-word */
select.form-select {
  white-space: nowrap;
  text-overflow: ellipsis;
}

select.form-select option {
  white-space: nowrap;
}

/* --- LINKS --- */
a {
  color: var(--almacon-prussian) !important;
}

a:hover {
  color: #123a4a !important;
}

.attachment-item a:hover {
  color: inherit !important;
}

/* --- ALERTS --- */
.alert-info {
  background-color: rgba(24, 73, 92, 0.08) !important;
  border-color: rgba(24, 73, 92, 0.2) !important;
  color: var(--almacon-prussian) !important;
}

.alert-success {
  background-color: rgba(38, 191, 148, 0.1) !important;
  border-color: rgba(38, 191, 148, 0.25) !important;
  color: #0d7a5a !important;
}

.alert-warning {
  background-color: rgba(234, 171, 33, 0.12) !important;
  border-color: rgba(234, 171, 33, 0.25) !important;
  color: #b87d0a !important;
}

.alert-danger {
  background-color: rgba(255, 0, 0, 0.08) !important;
  border-color: rgba(255, 0, 0, 0.15) !important;
  color: #c00 !important;
}

/* --- NAV TABS --- */
.nav-tabs .nav-link.active {
  color: var(--almacon-prussian) !important;
  border-bottom: 2px solid var(--almacon-prussian) !important;
}

.nav-tabs .nav-link:hover {
  color: var(--almacon-prussian) !important;
}

/* --- MODAL --- */
.modal-header {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.modal-header .btn-close {
  filter: brightness(0) invert(1) !important;
}

.modal-header .modal-title {
  color: #fff !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600;
}

/* --- CARD HEADERS matching header color --- */
.card-header {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.card-header h5, .card-header .card-title,
.card-header h3, .card-header h4, .card-header h6 {
  color: #fff !important;
}

/* BREADCRUMB */
.breadcrumb-item.active {
  color: var(--almacon-prussian) !important;
}

.breadcrumb-item a {
  color: var(--almacon-prussian) !important;
}

/* --- PROGRESS BARS --- */
.progress-bar {
  background-color: var(--almacon-prussian) !important;
}

/* --- SWITCH / TOGGLE --- */
.form-check-input:checked {
  background-color: var(--almacon-prussian) !important;
  border-color: var(--almacon-prussian) !important;
}

/* --- SELECT2 overrides --- */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  border-color: var(--almacon-border) !important;
}

.select2-container--default .select2-results__option--highlighted {
  background-color: var(--almacon-prussian) !important;
}

/* --- Flatpickr --- */
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange {
  background-color: var(--almacon-prussian) !important;
  border-color: var(--almacon-prussian) !important;
}

/* Choices.js */
.choices__inner {
  border-color: var(--almacon-border) !important;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

/* Responsive table wrapper */
.table-responsive {
  border-radius: 8px;
  border: 1px solid var(--almacon-border);
}

/* --- DASHBOARD SUMMARY STAT CARDS (like Export Item Requests) --- */
.card.bg-primary.text-white .card-body h6,
.card.bg-primary.text-white .card-body h2 {
  color: #fff !important;
}

.card.bg-primary.text-white .card-body .opacity-50 {
  opacity: 0.7 !important;
}

/* Pending card */
.card.bg-warning.text-white .card-body h6,
.card.bg-warning.text-white .card-body h2 {
  color: #fff !important;
}

/* Approved card */
.card.bg-success.text-white .card-body h6,
.card.bg-success.text-white .card-body h2 {
  color: #fff !important;
}

/* Rejected card */
.card.bg-danger.text-white .card-body h6,
.card.bg-danger.text-white .card-body h2 {
  color: #fff !important;
}

/* Stat card h6 label slightly larger for readability */
.card.bg-primary.text-white .card-body h6,
.card.bg-warning.text-white .card-body h6,
.card.bg-success.text-white .card-body h6,
.card.bg-danger.text-white .card-body h6 {
  font-family: 'Nunito', sans-serif !important;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  opacity: 0.9;
}

/* --- DROPDOWN MENUS — Branding colors --- */
.dropdown-menu {
  border-color: var(--almacon-border) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
}

.dropdown-item {
  color: #333335 !important;
  font-family: 'Nunito', sans-serif !important;
  font-size: 0.85rem;
  transition: all 0.15s ease;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: rgba(24, 73, 92, 0.08) !important;
  color: var(--almacon-prussian) !important;
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--almacon-prussian) !important;
  color: #fff !important;
}

.dropdown-header {
  color: var(--almacon-prussian) !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.5px;
}

.dropdown-divider {
  border-color: var(--almacon-border) !important;
}

/* User dropdown header area */
.dropdown-item-text {
  color: #333335 !important;
}