:root {
  --mustard: #e1ad01;
  --mustard-light: #fff8dd;
  --mustard-border: rgba(225,173,1,.35);
  --black: #080808;
  --bg: #f6f7f9;
  --border: #dee2e6;
  --sidebar-w: 260px;
}

/* ===== BASE ===== */
body {
  background: var(--bg);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
}

/* ===== LOGIN ===== */
.login-screen {
  min-height: 100vh;
  background: linear-gradient(135deg, #e1ad01 0%, #f1d676 100%);
}
.login-card {
  width: min(440px, calc(100vw - 32px));
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 45px rgba(0,0,0,.18);
}
.login-head {
  background: var(--mustard);
  color: #000;
}
.login-logo {
  display: block;
  width: 86px;
  height: 86px;
  margin: 0 auto;
  border-radius: 14px;
  object-fit: cover;
  background: #fff;
  box-shadow: 0 8px 18px rgba(0,0,0,.16);
}

/* ===== APP SHELL ===== */
.app-shell { min-height: 100vh; }

/* ===== SIDEBAR ===== */
.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: var(--sidebar-w);
  background: #000;
  color: #fff;
  z-index: 1040;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.sidebar-brand {
  flex: 0 0 auto;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,.12);
  display: flex;
  align-items: center;
  gap: 10px;
}
.sidebar-logo {
  display: block;
  width: 42px;
  height: 42px;
  border-radius: 9px;
  object-fit: cover;
  background: #fff;
  flex: 0 0 auto;
}
.sidebar-nav {
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1 1 auto;
  padding: 10px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.25) transparent;
}
.sidebar-nav::-webkit-scrollbar { width: 6px; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.25); border-radius: 4px; }
.sidebar .nav-link {
  color: rgba(255,255,255,.86);
  border-radius: 8px;
  margin: 2px 0;
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0.55rem 0.85rem;
  font-size: .92rem;
  transition: background .15s, color .15s;
  white-space: normal;
  word-break: break-word;
}
.sidebar .nav-link .fa { width: 1.1rem; text-align: center; flex-shrink: 0; }
.sidebar .nav-link.active {
  background: var(--mustard);
  color: #000;
  font-weight: 800;
}
.sidebar .nav-link:hover:not(.active) {
  background: rgba(225,173,1,.18);
  color: #fff;
}

/* ===== MAIN ===== */
.main { margin-left: var(--sidebar-w); min-height: 100vh; }

/* ===== TOPBAR ===== */
.topbar {
  position: sticky;
  top: 0;
  z-index: 1020;
  background: #fff;
  border-bottom: 1px solid var(--border);
  padding: 10px 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,.05);
}

/* ===== LOCATION BANNER ===== */
.location-banner {
  border-left: 5px solid var(--mustard);
  border-radius: 10px;
  background: linear-gradient(135deg, #fff 0%, var(--mustard-light) 100%);
}

/* ===== BUTTONS ===== */
.btn-mustard {
  background: var(--mustard);
  border-color: var(--mustard);
  color: #000;
  font-weight: 700;
}
.btn-mustard:hover, .btn-mustard:focus {
  background: #ce9e00;
  border-color: #ce9e00;
  color: #000;
}
.btn-outline-mustard {
  border-color: var(--mustard);
  color: #705a00;
  font-weight: 700;
}
.btn-outline-mustard:hover {
  background: var(--mustard);
  color: #000;
}
.btn-outline-mustard:disabled {
  opacity: .5;
}

/* ===== CARDS ===== */
.card {
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.card-header {
  background: #fff;
  border-bottom: 1px solid var(--border);
  border-radius: 10px 10px 0 0 !important;
  padding: .85rem 1.1rem;
}

/* ===== STAT CARDS ===== */
.stat-card { min-height: 100px; transition: transform .15s, box-shadow .15s; }
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.1); }
.stat-label { font-size: .75rem; color: #6c757d; text-transform: uppercase; letter-spacing: .04em; }
.stat-value { font-size: 1.35rem; font-weight: 850; }
.kpi-clickable { cursor: pointer; border-left: 4px solid transparent; transition: border-color .2s, box-shadow .2s; }
.kpi-clickable:hover { border-left-color: var(--mustard); box-shadow: 0 4px 14px rgba(225,173,1,.25); }
.kpi-clickable.active { border-left-color: var(--mustard); background: var(--mustard-light); }

/* ===== SALARY TYPE CARDS ===== */
.salary-type-card {
  border: 1px solid var(--mustard-border);
  background: linear-gradient(135deg, #fff 0%, var(--mustard-light) 100%);
  border-radius: 10px;
  padding: .75rem 1rem;
}
.salary-type-card .amount { font-size: 1.05rem; font-weight: 800; }

/* ===== FILTER BOX ===== */
.filter-box {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
}

/* ===== ACTION BAR ===== */
.action-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  overflow: visible;
  position: relative;
  z-index: 40;
}
.view-select { max-width: 190px; }
.action-bar:has(.dropdown-menu.show),
.action-bar.dd-dropdown-open-parent,
.dd-export-dropdown:has(.dropdown-menu.show) {
  position: relative;
  z-index: 2147483000 !important;
}
.dd-export-menu.dd-clean-menu-open {
  overflow: visible !important;
  min-width: 210px !important;
  border-radius: 12px !important;
}

/* ===== TABLE ===== */
.table th {
  background: #f8f9fa;
  white-space: nowrap;
  font-weight: 700;
  font-size: .82rem;
  color: #495057;
  border-bottom-width: 2px;
  cursor: pointer;
  user-select: none;
  position: relative;
}
.table th:hover { background: #eef0f2; }
.table th.sort-asc::after { content: " ↑"; color: var(--mustard); font-size: .75em; }
.table th.sort-desc::after { content: " ↓"; color: var(--mustard); font-size: .75em; }
.table th.sortable::after { content: " ↕"; opacity: .3; font-size: .75em; }
.table td { vertical-align: middle; }
.table-hover tbody tr:hover { background: rgba(225,173,1,.05); }
.money { text-align: right; font-variant-numeric: tabular-nums; }
.text-neg { color: #dc3545; font-weight: 600; }
.select-col { width: 42px; text-align: center; }
.attach-col { width: 36px; text-align: center; }
tr.locked { opacity: .7; }

/* ===== ROW SELECTION SUMMARY ===== */
.selected-summary-panel {
  border: 1px dashed var(--mustard-border);
  background: var(--mustard-light);
  border-radius: 10px;
  padding: .6rem .8rem;
  margin-top: .5rem;
}

/* ===== PAYMENT DETAILS (record modal) ===== */
.payment-details {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fffaf0;
}
.payment-details summary {
  cursor: pointer;
  list-style: none;
  padding: 12px 14px;
  font-weight: 800;
}
.payment-details summary::-webkit-details-marker { display: none; }
.payment-details summary i { transition: transform .18s ease; }
.payment-details[open] summary i { transform: rotate(90deg); }
.payment-details > .row { padding: 0 14px 14px; }

/* ===== PROOF ATTACHMENT ===== */
.proof-preview {
  border: 1px dashed var(--border);
  border-radius: 8px;
  padding: 12px;
  background: #f8f9fa;
}
.proof-preview a { text-decoration: none; }
.proof-preview a:hover { text-decoration: underline; }
.attach-icon { color: var(--mustard); }

/* ===== BULK ADD TABLE ===== */
.bulk-table-wrap { max-height: 68vh; overflow: auto; }
.bulk-table-wrap th, .bulk-table-wrap td { min-width: 140px; white-space: nowrap; }

/* ===== BULK EDIT FIELDS ===== */
.bulk-edit-field {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .75rem;
  background: #fff;
  transition: border-color .15s, background .15s;
}
.bulk-edit-field.active {
  border-color: var(--mustard);
  background: var(--mustard-light);
}
.bulk-edit-field .form-check-label { font-weight: 700; font-size: .85rem; }

/* ===== SALES ADJUSTMENT ===== */
.sales-adjustment-group {
  background: #fff;
  border: 1px solid var(--border);
  border-left: 4px solid var(--mustard);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 14px;
}

/* ===== VENDOR PAYMENTS ===== */
.payment-bucket-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
  background: #fff;
  height: 100%;
}
.payment-bucket-card .bucket-title { font-weight: 800; font-size: .95rem; }
.payment-timeline-list { max-height: 280px; overflow: auto; }

/* ===== SALES ANALYSIS ===== */
.drilldown-card { border-top: 4px solid var(--mustard); }
.drilldown-toolbar {
  background: var(--mustard-light);
  border: 1px solid var(--mustard-border);
  border-radius: 10px;
  padding: 1rem;
}
.mini-chip {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: .2rem .5rem;
  margin: .12rem;
  background: #fff;
  font-size: .78rem;
}

/* ===== SMART MATRIX ===== */
.matrix-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 8px;
}
.matrix-chip {
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 8px;
  padding: 9px 10px;
  cursor: pointer;
  font-size: .88rem;
  user-select: none;
  display: flex;
  align-items: center;
  gap: .35rem;
  transition: border-color .15s, background .15s;
}
.matrix-chip input[type=checkbox] { width: 16px; height: 16px; margin: 0; }
.matrix-chip.active { border-color: var(--mustard); background: var(--mustard-light); font-weight: 750; }
.matrix-table-wrap { max-height: 68vh; overflow: auto; }
.matrix-table th, .matrix-table td { white-space: nowrap; }
.matrix-table th { cursor: pointer; }
.matrix-table th:hover { background: #eef0f2 !important; }
.sticky-col { position: sticky; left: 0; background: #fff; z-index: 2; box-shadow: 2px 0 0 rgba(0,0,0,.04); }
.matrix-table thead .sticky-col, .matrix-table .table-light .sticky-col { background: #f8f9fa; }
.matrix-detail-row { background: var(--mustard-light) !important; }
.matrix-detail-row td { font-size: .82rem; }
.matrix-total-col { background: rgba(225,173,1,.08) !important; }
.matrix-expand-btn {
  border: 0;
  background: rgba(225,173,1,.18);
  border-radius: 999px;
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: .35rem;
  color: #000;
  font-size: .75rem;
  transition: background .15s;
}
.matrix-expand-btn:hover { background: var(--mustard); }
.matrix-child-indent { padding-left: 2.5rem !important; }
.matrix-preset-bar { gap: 6px; }
.matrix-preset-bar .btn { border-radius: 999px; font-size: .8rem; }

/* ===== MATRIX SUMMARY CARDS ===== */
.matrix-summary-card { min-height: 90px; }

/* ===== FORMS ===== */
.form-control:focus, .form-select:focus {
  border-color: var(--mustard);
  box-shadow: 0 0 0 .2rem rgba(225,173,1,.25);
}
.form-check-input:checked {
  background-color: var(--mustard);
  border-color: var(--mustard);
}

/* ===== TABS ===== */
.nav-tabs .nav-link.active {
  background: var(--mustard);
  color: #000;
  border-color: var(--mustard);
  font-weight: 700;
}
.nav-tabs .nav-link { color: #495057; }

/* ===== SIDEBAR BACKDROP ===== */
.sidebar-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 1030;
  display: none;
}
.sidebar-backdrop.show { display: block; }

/* ===== LOADING ===== */
.loading {
  position: fixed;
  inset: 0;
  z-index: 3000;
  background: rgba(0,0,0,.68);
  display: none;
  align-items: center;
  justify-content: center;
  color: #fff;
  backdrop-filter: blur(3px);
}
.loading.show { display: flex; }

/* ===== FADE IN ===== */
.fade-in { animation: fadeIn .25s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ===== RESPONSIVE ===== */
@media (max-width: 991.98px) {
  .sidebar {
    transform: translateX(-100%);
    transition: transform .22s ease;
    width: min(86vw, 320px);
  }
  .sidebar.show { transform: translateX(0); }
  .main { margin-left: 0; }
  .action-bar { justify-content: flex-start; }
  .card { border-radius: 8px; }
  .bulk-table-wrap th, .bulk-table-wrap td { min-width: 120px; }
}
@media (max-width: 575.98px) {
  body { font-size: 13px; }
  .stat-value { font-size: 1.1rem; }
  .topbar { padding: 8px 12px; }
  main { padding: .75rem !important; }
}

/* ===== SETTINGS PAGE ===== */
.settings-section {
  border: 1px solid var(--border);
  border-left: 4px solid var(--mustard);
  border-radius: 10px;
  padding: 16px;
  background: #fff;
  margin-bottom: 16px;
}
.settings-section h6 { font-weight: 800; margin-bottom: 12px; }
.vendor-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--mustard-light);
  border: 1px solid var(--mustard-border);
  border-radius: 999px;
  padding: 3px 10px;
  margin: 2px;
  font-size: .82rem;
}
.vendor-tag .rm-tag {
  cursor: pointer;
  color: #dc3545;
  font-size: .75rem;
  margin-left: 3px;
}
.vendor-tag-input-row { display: flex; gap: 8px; margin-top: 8px; }

/* ===== LOCATION DELETE MODAL ===== */
.loc-count-table td { padding: 4px 10px; }
.loc-count-table .count-num { font-weight: 800; color: #dc3545; }

/* ===== DATA ACCESS RESTRICTION ===== */
.access-badge { font-size: .75rem; background: #fff3cd; color: #856404; border-radius: 999px; padding: 2px 8px; }

/* ===== MEAT MONTHLY TABLE ===== */
.meat-monthly-table th, .meat-monthly-table td { white-space: nowrap; font-size: .8rem; }
.meat-monthly-table .sticky-col { position: sticky; left: 0; background: #fff; z-index: 2; }
.meat-monthly-table thead .sticky-col { background: #f8f9fa; }

/* ===== PAYMENTS EDIT ===== */
.vp-row-editing td { background: #fffdf4 !important; }

/* ===== BULK ANALYSIS EDIT ===== */
.ba-bulk-select { width: 18px; height: 18px; cursor: pointer; }
.ba-selected-info { background: var(--mustard-light); border: 1px dashed var(--mustard-border); border-radius: 8px; padding: 8px 12px; }

/* ===== OVERVIEW SORT ===== */
.ba-sortable { cursor: pointer; user-select: none; }
.ba-sortable:hover { background: rgba(225,173,1,.08) !important; }
.ba-sort-asc::after { content: " ↑"; color: var(--mustard); font-size: .8em; }
.ba-sort-desc::after { content: " ↓"; color: var(--mustard); font-size: .8em; }
.ba-sortable:not(.ba-sort-asc):not(.ba-sort-desc)::after { content: " ↕"; opacity: .35; font-size: .8em; }

/* ===== AUDIT TRAIL ===== */
.audit-row:hover { background: rgba(225,173,1,0.04) !important; }
.audit-detail-row td { padding: 0 !important; }
.audit-detail-inner { animation: auditSlideDown 0.2s ease-out; }
@keyframes auditSlideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
.audit-detail-inner table { background: #fff; }
.audit-detail-inner .text-danger { text-decoration: line-through; opacity: .7; }
.audit-detail-inner .text-success { font-weight: 600; }
#auditSummary .card { transition: transform .15s, box-shadow .15s; cursor: pointer; }
#auditSummary .card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,.1); }


/* ===== PRODUCTION SIDEBAR VERTICAL SCROLL + LOGO FIX ===== */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

.app-shell {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

.sidebar {
  width: var(--sidebar-w) !important;
  max-width: var(--sidebar-w) !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

.sidebar-brand {
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

.sidebar-brand > div {
  min-width: 0 !important;
  overflow: hidden !important;
}

.sidebar-nav {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  flex: 1 1 auto !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.25) transparent;
}

.sidebar-nav::-webkit-scrollbar {
  width: 6px;
  height: 0;
}

.sidebar-nav::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.25);
  border-radius: 4px;
}

.sidebar .nav-link,
.sidebar-nav .nav-link {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}

.sidebar .nav-link i,
.sidebar .nav-link .fa {
  flex: 0 0 24px !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  text-align: center !important;
}

.sidebar .nav-link span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.sidebar-logo {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
  flex: 0 0 48px !important;
}

.login-logo {
  width: 92px !important;
  height: 92px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.main {
  overflow-x: hidden !important;
}

@media (max-width: 991.98px) {
  .sidebar {
    width: min(86vw, 320px) !important;
    max-width: min(86vw, 320px) !important;
    overflow-x: hidden !important;
  }
}

/* 2026-06-10 enhancements */
.btn-xs {
  --bs-btn-padding-y: .12rem;
  --bs-btn-padding-x: .3rem;
  --bs-btn-font-size: .72rem;
  line-height: 1.1;
}
.history-json {
  max-width: 520px;
  max-height: 180px;
  overflow: auto;
  white-space: pre-wrap;
  font-size: .78rem;
  background: #f8f9fa;
  border: 1px solid #e5e7eb;
  border-radius: .5rem;
  padding: .5rem;
}
.matrix-filter-collapsible > summary {
  cursor: pointer;
  list-style: none;
}
.matrix-filter-collapsible > summary::-webkit-details-marker {
  display: none;
}
.matrix-row-actions .btn {
  vertical-align: middle;
}
.quick-range-control .quick-nav-btn {
  min-width: 2.25rem;
}

/* Critical update: Capex, Roles, readable history */
.capex-pnl-box {
  border: 1px solid rgba(225, 173, 1, .45);
  background: rgba(225, 173, 1, .10);
  border-radius: .85rem;
  padding: .85rem 1rem;
}
.history-human {
  min-width: 260px;
  line-height: 1.45;
}
.history-human div + div {
  margin-top: .25rem;
}
.role-permissions-grid {
  max-height: 420px;
  overflow: auto;
  background: #fff;
}
.role-permissions-grid th {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 1;
}
.location-roles-editor {
  border-color: rgba(0, 0, 0, .12) !important;
}

/* Users + Roles Toast-style module tabs */
.users-admin-tabs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: .75rem;
}
.users-admin-tab {
  border: 1px solid #d9dee6;
  background: #fff;
  border-radius: .9rem;
  padding: .9rem 1rem;
  display: flex;
  align-items: center;
  gap: .65rem;
  text-align: left;
  min-height: 76px;
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.users-admin-tab i {
  font-size: 1.35rem;
  color: #2b2f36;
}
.users-admin-tab span {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}
.users-admin-tab small {
  color: #6c757d;
  margin-top: .15rem;
  font-size: .78rem;
}
.users-admin-tab.active {
  border-color: #e1ad01;
  background: rgba(225, 173, 1, .12);
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.users-admin-tab.active i {
  color: #b58900;
}


/* ===== 2026 Upgrade: notifications, page search, file manager, spark boards ===== */
.top-page-search-wrap {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
}
.top-page-search {
  width: min(430px, 38vw);
  border: 1px solid rgba(8,8,8,.14);
  border-radius: 999px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
}
.top-page-search .input-group-text,
.top-page-search .form-control {
  border: 0;
  background: transparent !important;
}
.top-page-search .form-control {
  min-height: 38px;
  font-weight: 600;
}
.top-page-search:focus-within {
  border-color: var(--mustard);
  box-shadow: 0 0 0 3px rgba(225,173,1,.18), 0 8px 22px rgba(0,0,0,.1);
}
.page-search-results { position:absolute; top: calc(100% + 8px); left:50%; transform:translateX(-50%); width: min(430px, 90vw); z-index: 2500; background:#fff; border:1px solid rgba(0,0,0,.12); border-radius:.75rem; overflow:hidden; max-height: 360px; overflow-y:auto; }
.page-search-item { display:flex; align-items:center; gap:.65rem; padding:.65rem .85rem; text-decoration:none; color:#222; border-bottom:1px solid #f1f1f1; }
.page-search-item:hover, .page-search-item.active { background:#fff7db; color:#111; }
.notification-menu { min-width: 360px; max-width: 92vw; max-height: 480px; overflow-y:auto; border-radius:.9rem; }
.notification-item { border-bottom:1px solid #eee; padding:.75rem .85rem; cursor:pointer; }
.notification-item:hover { background:#fff8e5; }
.notification-title { font-weight:700; font-size:.92rem; }
.notification-msg { color:#666; font-size:.82rem; }
.notification-time { color:#999; font-size:.75rem; }
.fm-folder-card, .spark-board-card { transition:.16s ease; cursor:pointer; }
.fm-folder-card:hover, .spark-board-card:hover { transform: translateY(-1px); box-shadow:0 .5rem 1rem rgba(0,0,0,.08); }
.fm-icon-box { width:44px; height:44px; display:flex; align-items:center; justify-content:center; border-radius:12px; background:#fff3cd; color:#6d5200; }
.fm-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .85rem; }
.fm-list-row { border-bottom:1px solid #eee; padding:.7rem; display:grid; grid-template-columns: 36px 1fr auto; gap:.75rem; align-items:center; }
.spark-board { display:flex; gap:1rem; overflow-x:auto; min-height:500px; padding-bottom:1rem; }
.spark-column { min-width:300px; max-width:300px; background:#f8f9fa; border:1px solid #e6e6e6; border-radius:1rem; display:flex; flex-direction:column; max-height:70vh; }
.spark-column-head { padding:.85rem; border-bottom:1px solid #e7e7e7; font-weight:800; display:flex; justify-content:space-between; align-items:center; }
.spark-task-list { padding:.75rem; overflow-y:auto; flex:1; }
.spark-task-card { background:#fff; border:1px solid #e9ecef; border-radius:.85rem; padding:.75rem; margin-bottom:.7rem; cursor:grab; box-shadow:0 .25rem .65rem rgba(0,0,0,.04); }
.spark-task-card:active { cursor:grabbing; }
.spark-drop { outline:2px dashed #d9a500; outline-offset:-6px; background:#fff8dd; }
.spark-priority-High, .spark-priority-Urgent { color:#b42318; font-weight:700; }
.spark-priority-Medium { color:#915b00; font-weight:700; }
.spark-priority-Low { color:#166534; font-weight:700; }
.role-perm-table th.role-action-head { cursor:pointer; user-select:none; }
.role-perm-table th.role-action-head:hover { background:#fff3cd; }
@media (max-width: 991px) {
  .top-page-search-wrap {
    position: static;
    transform: none;
    order: 3;
    width: 100%;
    margin-top: .5rem;
  }
  .top-page-search { width: 100%; }
  .page-search-results { left: 0; right: auto; transform: none; width: 100%; }
}
@media (max-width: 767px) { .notification-menu { min-width: 310px; } }

/* =====================================================================
   Clean Relaunch Professional UI Layer
   ===================================================================== */
:root {
  --surface: #ffffff;
  --surface-soft: #f9fafb;
  --ink: #15181d;
  --muted: #6b7280;
  --ring: rgba(225,173,1,.28);
  --shadow-soft: 0 10px 30px rgba(17,24,39,.08);
}
body { background: #f3f4f6; color: var(--ink); }
.sidebar { background: linear-gradient(180deg,#050505 0%,#141414 100%); box-shadow: 8px 0 28px rgba(0,0,0,.18); }
.sidebar .nav-link { border: 1px solid transparent; }
.sidebar .nav-link.active { box-shadow: inset 0 0 0 1px rgba(0,0,0,.08), 0 8px 18px rgba(225,173,1,.22); }
.topbar { backdrop-filter: blur(12px); background: rgba(255,255,255,.92); }
.card { border-color: rgba(17,24,39,.08); box-shadow: 0 8px 22px rgba(17,24,39,.045); }
.btn { border-radius: .65rem; }
.form-control, .form-select { border-radius: .7rem; border-color: #d9dde4; }
.form-control:focus, .form-select:focus { border-color: var(--mustard); box-shadow: 0 0 0 .2rem var(--ring); }
.table thead th { background: #f9fafb; color: #374151; font-size: .76rem; letter-spacing: .02em; text-transform: uppercase; }
.table tbody tr:hover { background: #fffdf2; }
.module-refresh-btn { min-width: 38px; }

.page-hero {
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding: 1.15rem 1.25rem; border-radius: 1.1rem; margin-bottom: 1rem;
  color: #111; background: linear-gradient(135deg,#111 0%,#2c2c2c 58%,#e1ad01 160%);
  box-shadow: var(--shadow-soft); border: 1px solid rgba(225,173,1,.18);
}
.page-hero h4 { margin:0; color:#fff; font-weight:850; letter-spacing:-.02em; }
.page-hero p { margin:.25rem 0 0; color:rgba(255,255,255,.70); max-width:760px; }
.page-hero .eyebrow { color: var(--mustard); text-transform: uppercase; letter-spacing:.11em; font-size:.72rem; font-weight:800; margin-bottom:.22rem; }
.page-hero .btn-light { background: rgba(255,255,255,.92); border-color: rgba(255,255,255,.75); color:#111; font-weight:700; }
.page-hero .btn-mustard { box-shadow: 0 10px 20px rgba(225,173,1,.22); }

.fm-command-card { border-radius: 1rem; }
.fm-drop-zone {
  display:flex; align-items:center; justify-content:center; gap:1rem;
  border: 1.8px dashed rgba(17,24,39,.18); border-radius: 1.1rem;
  background: linear-gradient(135deg,#fff 0%,#fff9e5 100%); color:#4b5563;
  padding: 1rem; margin-bottom:1rem; transition: .15s ease;
}
.fm-drop-zone i { width: 42px; height:42px; border-radius:1rem; display:grid; place-items:center; background: var(--mustard); color:#111; font-size:1.2rem; }
.fm-drop-zone span { display:block; font-size:.84rem; color:#6b7280; }
.fm-drop-zone.border-warning, .fm-drop-zone:hover { border-color: var(--mustard)!important; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(225,173,1,.16); }
.fm-breadcrumb-pro { display:flex; align-items:center; gap:.75rem; background:#fff; border:1px solid rgba(17,24,39,.08); padding:.6rem .8rem; border-radius:.85rem; }
.fm-location-section { margin-bottom: 1.15rem; }
.fm-section-title { display:flex; justify-content:space-between; align-items:center; color:#4b5563; font-weight:800; font-size:.86rem; margin:.25rem .15rem .6rem; }
.fm-section-title small { font-weight:600; color:#9ca3af; }
.fm-grid-pro { display:grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: .9rem; }
.fm-card-pro { cursor:pointer; border-radius:1.05rem; min-height: 160px; overflow: visible; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.fm-card-pro:hover { transform: translateY(-2px); border-color: rgba(225,173,1,.55); box-shadow: 0 16px 34px rgba(17,24,39,.10); }
.fm-pro-icon, .fm-row-icon { width: 44px; height:44px; border-radius: 1rem; display:grid; place-items:center; background:#fff4bf; color:#5d4700; flex:0 0 auto; font-size:1.08rem; }
.fm-row-icon { width: 38px; height:38px; border-radius:.85rem; }
.fm-title-line { font-size: 1rem; line-height:1.25; }
.fm-desc-line { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.fm-list-card { border-radius: 1rem; overflow:hidden; }
.fm-row-pro { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.85rem 1rem; border-bottom:1px solid rgba(17,24,39,.07); background:#fff; transition: background .12s ease; }
.fm-row-pro:last-child { border-bottom:0; }
.fm-row-pro:hover { background:#fffdf3; }
.fm-selection-bar { display:flex; justify-content:space-between; align-items:center; background:#111; color:#fff; padding:.65rem .85rem; border-radius:.9rem; margin-bottom:.85rem; box-shadow: var(--shadow-soft); }
.fm-empty { border-style:dashed; }
.fm-empty-icon { width:64px; height:64px; margin:auto; display:grid; place-items:center; border-radius:1.4rem; background:#fff7d6; color:#6f5600; font-size:1.55rem; }
.fm-share-hero { display:flex; align-items:center; gap:1rem; padding:1rem; background:#f9fafb; border:1px solid rgba(17,24,39,.08); border-radius:1rem; }
.fm-access-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap:.55rem; max-height: 290px; overflow:auto; padding:.35rem; border:1px solid rgba(17,24,39,.08); background:#fff; border-radius:1rem; }
.fm-access-chip { display:flex; align-items:center; gap:.65rem; padding:.65rem .7rem; border:1px solid #e5e7eb; border-radius:.85rem; background:#fff; cursor:pointer; transition:.12s ease; }
.fm-access-chip:hover { border-color: rgba(225,173,1,.7); background:#fffdf2; }
.fm-access-chip input:checked + span b { color:#6f5600; }
.fm-access-chip b { display:block; font-size:.88rem; line-height:1.1; }
.fm-access-chip small { display:block; color:#8a9099; font-size:.75rem; margin-top:.15rem; }
.fm-permission-strip { display:flex; flex-wrap:wrap; gap:.85rem; padding:.85rem; background:#111827; color:#fff; border-radius:1rem; }
.fm-permission-strip .form-check { margin:0; display:flex; align-items:center; gap:.35rem; }
.fm-permission-strip .form-check-input:checked { background-color: var(--mustard); border-color: var(--mustard); }
.fm-editor-panel .alert { border-radius:1rem; }

.spark-board-card { border-radius:1.05rem; transition:.15s ease; }
.spark-board-card:hover { transform: translateY(-2px); box-shadow: 0 15px 32px rgba(17,24,39,.10); border-color: rgba(225,173,1,.45); }
.kanban-column, .spark-column { border-radius:1rem; }
.modal-content { border-radius: 1rem; border: 0; box-shadow: 0 24px 80px rgba(0,0,0,.2); }
.modal-header { border-bottom-color: rgba(17,24,39,.08); }
.modal-footer { border-top-color: rgba(17,24,39,.08); }

@media (max-width: 768px) {
  .page-hero { align-items:flex-start; flex-direction:column; }
  .fm-grid-pro { grid-template-columns: 1fr; }
  .fm-row-pro { align-items:flex-start; }
  .fm-access-grid { grid-template-columns: 1fr; }
}

/* =====================================================================
 *  PREMIUM ANIMATIONS & POLISH LAYER  (2026-06-13)
 *  Added on top of the original styles – no colour changes
 * ===================================================================== */

/* ── Smooth entrance for page content ── */
@keyframes slideUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeScale {
  from { opacity: 0; transform: scale(.97); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes pulseGold {
  0%, 100% { box-shadow: 0 0 0 0 rgba(225,173,1,.45); }
  50%       { box-shadow: 0 0 0 8px rgba(225,173,1,0); }
}
@keyframes shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}
@keyframes spinSlow {
  to { transform: rotate(360deg); }
}

/* Apply entrance animation to page content */
#content > * { animation: slideUp .28s cubic-bezier(.22,1,.36,1) both; }
.card        { animation: fadeScale .22s cubic-bezier(.22,1,.36,1) both; }

/* ── Stat card micro-lift ── */
.stat-card {
  transition: transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease !important;
}
.stat-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.12) !important;
}

/* ── KPI hover pulse ── */
.kpi-clickable.active { animation: pulseGold 1.8s ease infinite; }

/* ── Button ripple feel ── */
.btn-mustard {
  transition: filter .15s, transform .15s, box-shadow .15s !important;
}
.btn-mustard:hover {
  filter: brightness(1.07);
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(225,173,1,.4) !important;
}
.btn-mustard:active { transform: translateY(0) !important; }

/* ── Sidebar nav link animation ── */
.sidebar .nav-link {
  transition: background .18s ease, color .18s ease, padding-left .18s ease !important;
}
.sidebar .nav-link.active {
  box-shadow: 0 6px 16px rgba(225,173,1,.2) !important;
}
.sidebar .nav-link:hover:not(.active) { padding-left: 1.1rem !important; }

/* ── Modal entrance animation ── */
.modal.fade .modal-dialog {
  transition: transform .25s cubic-bezier(.34,1.25,.64,1), opacity .2s ease !important;
  transform: scale(.95) translateY(-12px) !important;
}
.modal.show .modal-dialog { transform: none !important; }
.modal-content {
  transition: box-shadow .2s ease;
}

/* ── Table row hover ── */
.table tbody tr {
  transition: background .12s ease;
}
.table-hover tbody tr:hover {
  background: rgba(225,173,1,.06) !important;
}

/* ── Form focus ring pulse ── */
.form-control:focus, .form-select:focus {
  transition: border-color .15s ease, box-shadow .15s ease !important;
}

/* ── Toast slide-in ── */
.toast.showing, .toast.show {
  animation: slideUp .2s cubic-bezier(.22,1,.36,1) both !important;
}

/* ── Topbar subtle separator line ── */
.topbar::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(225,173,1,.4), transparent);
}
.topbar { position: sticky; }

/* ── Location banner gold left-border glow ── */
.location-banner {
  transition: box-shadow .2s ease;
}
.location-banner:hover {
  box-shadow: -4px 0 16px rgba(225,173,1,.3), 0 4px 16px rgba(0,0,0,.06) !important;
}

/* ── Skeleton loading shimmer for tables ── */
.skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 800px 100%;
  animation: shimmer 1.4s infinite;
  border-radius: 4px;
  display: inline-block;
}

/* ── Improved record history human display ── */
.history-human div + div { margin-top: .3rem; }
.history-human .text-success { font-weight: 600; }
.history-human .text-danger  { font-weight: 600; }

/* ── Matrix expand button spin ── */
.matrix-expand-btn i { transition: transform .18s ease; }
.matrix-expand-btn.expanded i { transform: rotate(90deg); }

/* ── Vendor tag add animation ── */
.vendor-tag {
  animation: fadeScale .18s ease both;
}

/* ── Spark task card lift ── */
.spark-task-card {
  transition: transform .15s cubic-bezier(.34,1.3,.64,1), box-shadow .15s ease !important;
}
.spark-task-card:hover {
  transform: translateY(-2px) rotate(.3deg) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.1) !important;
}

/* ── File manager card hover ── */
.fm-card-pro {
  transition: transform .18s cubic-bezier(.34,1.3,.64,1), box-shadow .18s ease, border-color .18s ease !important;
}

/* ── Audit trail expand animation already defined; add summary card hover ── */
#auditSummary .card {
  transition: transform .18s cubic-bezier(.34,1.3,.64,1), box-shadow .18s ease !important;
}

/* ── Badge subtle animation on create/update ── */
.badge { transition: opacity .15s ease; }

/* ── Notification badge pulse ── */
#notificationBadge:not(.d-none) {
  animation: pulseGold .9s ease infinite;
}

/* ── Loading spinner replacement: use the existing .loading.show ── */
.loading.show {
  backdrop-filter: blur(4px) !important;
}
.loading .spinner-border {
  width: 3.2rem !important; height: 3.2rem !important;
  border-width: .3rem !important;
  border-color: rgba(225,173,1,.25) !important;
  border-top-color: var(--mustard) !important;
  animation: spinSlow .75s linear infinite !important;
}

/* ── Improved page-hero text rendering ── */
.page-hero h4 { text-shadow: 0 1px 3px rgba(0,0,0,.25); }

/* ── Settings section left-border glow on hover ── */
.settings-section {
  transition: border-left-color .2s ease, box-shadow .2s ease;
}
.settings-section:hover {
  box-shadow: -3px 0 12px rgba(225,173,1,.25), 0 2px 8px rgba(0,0,0,.04);
}

/* ── Bulk edit field active state animation ── */
.bulk-edit-field {
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease !important;
}
.bulk-edit-field.active {
  box-shadow: 0 0 0 3px rgba(225,173,1,.2) !important;
}

/* ── Accessibility: focus outlines use brand colour ── */
:focus-visible {
  outline: 2px solid var(--mustard) !important;
  outline-offset: 2px !important;
}
.btn-close:focus-visible { box-shadow: 0 0 0 3px rgba(225,173,1,.4) !important; }

/* ── Improved topbar page search placeholder animation ── */
#topPageSearch::placeholder { transition: opacity .2s ease; }
#topPageSearch:focus::placeholder { opacity: .45; }

/* ── Spark column drag-over glow ── */
.spark-drop {
  box-shadow: inset 0 0 0 2px var(--mustard) !important;
  transition: box-shadow .15s ease;
}

/* ── Small responsive tweak: disable heavy animations on mobile for perf ── */
@media (prefers-reduced-motion: reduce) {
  *, ::before, ::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* =====================================================================
 *  TOPBAR CENTERED SEARCH + FULL MOBILE FIX  (v8 2026-06-13)
 * ===================================================================== */

/* ── 3-column topbar layout ──────────────────────────────────────────── */
.topbar-3col {
  display: flex;              /* flex is more predictable than grid on mobile */
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 18px;
  height: 56px;
  min-height: 56px;
  position: relative;         /* needed for absolute-positioned search results */
}

.topbar-col-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  min-width: 0;
}

.topbar-col-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-width: 0;
}

/* Centre column: absolutely positioned so it truly centres on all sizes */
.topbar-col-mid {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  /* Must not be wider than the space between left and right columns */
  max-width: min(380px, calc(100% - 320px));
  width: 100%;
}

/* ── Pill search input ───────────────────────────────────────────────── */
.top-page-search-pill {
  border-radius: 20px !important;
  overflow: hidden;
  border: 1.5px solid #d0d5dd;
  background: #f7f8fa;
  width: 100%;
  transition: border-color .2s, box-shadow .2s, background .15s;
}
.top-page-search-pill:focus-within {
  border-color: var(--mustard) !important;
  box-shadow: 0 0 0 3px rgba(225,173,1,.18) !important;
  background: #fff;
}
.top-page-search-pill .input-group-text {
  background: transparent;
  border: none;
  padding: 0 8px 0 12px;
  color: #aab0bb;
  font-size: 12px;
}
.top-page-search-pill .form-control {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 6px 12px 6px 2px;
  font-size: 13px;
  color: #333;
  min-width: 0;
}
.top-page-search-pill .form-control:focus { box-shadow: none; outline: none; }
.top-page-search-pill .form-control::placeholder { color: #b0b8c4; }

/* Search results dropdown */
.page-search-results {
  position: absolute;
  top: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 280px;
  width: max(100%, 300px);
  z-index: 2500;
  background: #fff;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: .75rem;
  box-shadow: 0 8px 28px rgba(0,0,0,.14);
  overflow: hidden;
  max-height: 340px;
  overflow-y: auto;
}

/* ── Password toggle ─────────────────────────────────────────────────── */
.input-group .btn-outline-secondary:focus {
  box-shadow: 0 0 0 2px rgba(225,173,1,.3);
  outline: none;
}

/* ══ TABLET (≤992px) ════════════════════════════════════════════════════ */
@media (max-width: 991.98px) {
  .topbar-3col {
    padding: 0 12px;
    height: 52px;
  }
  .topbar-col-mid {
    max-width: min(260px, calc(100% - 280px));
  }
}

/* ══ PHONE (≤640px) ─────────────────────────────────────────────────── */
/* On small phones the search can't be centred without overflowing.     */
/* Move it to a second row below the title and actions.                  */
@media (max-width: 640px) {
  .topbar-3col {
    flex-wrap: wrap;
    height: auto;
    padding: 8px 12px 6px;
    gap: 4px;
  }
  .topbar-col-left  { order: 1; flex: 1 1 auto; }
  .topbar-col-right { order: 2; flex: 0 0 auto; }
  .topbar-col-mid {
    order: 3;
    position: static;          /* back to normal flow on mobile */
    transform: none;
    max-width: 100%;
    width: 100%;
    flex: 0 0 100%;
    padding-bottom: 4px;
  }
  .top-page-search-pill { border-radius: 12px !important; }
  .page-search-results {
    left: 0;
    right: 0;
    transform: none;
    width: 100%;
    border-radius: 0 0 .75rem .75rem;
  }
}

/* ══ GENERAL MOBILE LAYOUT FIXES ════════════════════════════════════════ */
@media (max-width: 991.98px) {
  .main { margin-left: 0 !important; }
  .sidebar {
    width: min(82vw, 290px) !important;
    transform: translateX(-100%);
    transition: transform .22s cubic-bezier(.4,0,.2,1);
  }
  .sidebar.show { transform: translateX(0); box-shadow: 6px 0 24px rgba(0,0,0,.22); }
}

@media (max-width: 767.98px) {
  body  { font-size: 13px; }
  main  { padding: .75rem !important; }
  .card-body { padding: .85rem; }
  .card { border-radius: 8px; }
  .stat-value { font-size: 1.1rem; }
  .table th, .table td { padding: .45rem .6rem; font-size: .8rem; }
  .action-bar { flex-wrap: wrap; gap: 4px; }
  .action-bar .btn { font-size: .78rem; padding: .25rem .55rem; }
  .modal-dialog { margin: .5rem; }
  .modal-dialog.modal-xl { max-width: calc(100vw - 1rem); }
  .notification-menu { min-width: 290px; max-width: 92vw; }
}

@media (max-width: 479px) {
  .topbar-col-right .d-none.d-sm-block { display: none !important; }
}

/* ══ RESPONSIVE ══════════════════════════════════ */

/* Tablet: 992px and below */
@media (max-width: 991.98px) {
  :root { --sidebar-w: 0px; }
  .sidebar {
    transform: translateX(-100%);
    transition: transform .22s ease;
    width: min(86vw, 300px) !important;
    position: fixed; z-index: 1050;
  }
  .sidebar.show { transform: translateX(0); box-shadow: 4px 0 20px rgba(0,0,0,.2); }
  .main { margin-left: 0 !important; }
  .topbar-3col {
    grid-template-columns: auto 1fr auto;
    padding: 0 12px;
    height: 52px;
  }
  .top-page-search-pill { width: 100%; max-width: 100%; }
  .top-page-search-pill:focus-within { width: 100%; max-width: 100%; }
}

/* Phone: 768px and below */
@media (max-width: 767.98px) {
  /* Stack search below page title+actions on small screens */
  .topbar-3col {
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    height: auto;
    padding: 8px 12px;
    gap: 6px;
  }
  .topbar-col-left  { grid-column: 1; grid-row: 1; }
  .topbar-col-right { grid-column: 2; grid-row: 1; }
  .topbar-col-mid   { grid-column: 1 / -1; grid-row: 2; }
  .top-page-search-pill { width: 100%; max-width: 100%; }
  .top-page-search-pill:focus-within { width: 100%; max-width: 100%; }
  /* Compact tables on mobile */
  .table th, .table td { padding: .5rem .6rem; font-size: .8rem; }
  /* Card body less padding */
  .card-body { padding: .85rem; }
  main { padding: .75rem !important; }
  .stat-value { font-size: 1.1rem; }
  /* Matrix table horizontal scroll */
  .matrix-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* Hide non-essential columns */
  .hide-mobile { display: none !important; }
  /* Action bar wrap */
  .action-bar { flex-wrap: wrap; gap: 4px; }
  .action-bar .btn { font-size: .78rem; padding: .25rem .5rem; }
  /* Bulk table */
  .bulk-table-wrap th, .bulk-table-wrap td { min-width: 110px; }
  /* Sidebar overlay backdrop */
  .sidebar-backdrop { backdrop-filter: blur(2px); }
  /* Modal full width */
  .modal-dialog { margin: .5rem; }
  .modal-dialog.modal-xl { max-width: calc(100vw - 1rem); }
}

/* Extra small: 480px and below */
@media (max-width: 479.98px) {
  .page-search-results { left: 0; right: 0; transform: none; width: 100vw; border-radius: 0; }
  .notification-menu { min-width: 290px; max-width: 96vw; }
  .topbar-col-right .text-end { display: none; } /* hide username on very small */
}


/* =====================================================================
 *  AUDIT FIX 2026-06-13: compact mobile search + neat icon buttons
 * ===================================================================== */
.topbar-icon-btn,
#notificationBtn,
#logoutBtn,
#menuBtn {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px !important;
  padding: 0 !important;
  background: #fff;
}
.topbar-icon-btn.active,
#notificationBtn.show,
#notificationBtn:focus,
#notificationBtn:hover {
  border-color: var(--mustard) !important;
  box-shadow: 0 0 0 3px rgba(225,173,1,.16) !important;
}
#notificationWrap { display: inline-flex; }
.notification-menu { border-radius: 14px; overflow: hidden; }

@media (min-width: 768px) {
  #topSearchColumn { display: block !important; }
}

@media (max-width: 767.98px) {
  .topbar-3col {
    flex-wrap: nowrap !important;
    height: 56px !important;
    min-height: 56px !important;
    padding: 8px 10px !important;
    gap: 8px !important;
  }
  .topbar-col-left { flex: 1 1 auto !important; min-width: 0; }
  .topbar-col-left > div { min-width: 0; }
  #pageTitle { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 48vw; }
  #pageSubtitle { display: none !important; }
  .topbar-col-right { flex: 0 0 auto !important; gap: 6px !important; }
  #topSearchColumn {
    display: none;
    position: fixed !important;
    top: 58px;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
    z-index: 2600;
    padding: 0 !important;
  }
  #topSearchColumn.mobile-open { display: block !important; }
  #topSearchColumn .top-page-search-pill {
    background: #fff;
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.18);
  }
  #topSearchColumn .page-search-results {
    position: fixed;
    top: 104px;
    left: 10px !important;
    right: 10px !important;
    width: auto !important;
    min-width: 0 !important;
    transform: none !important;
    border-radius: 14px !important;
    max-height: min(420px, calc(100vh - 118px));
  }
}

@media (max-width: 420px) {
  .topbar-icon-btn,
  #notificationBtn,
  #logoutBtn,
  #menuBtn { width: 36px; height: 36px; border-radius: 11px !important; }
  #pageTitle { max-width: 40vw; }
}


/* =====================================================================
 * FINAL HARDENING 2026-06-13: search icon only + clean modal chips
 * ===================================================================== */
#topSearchToggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#topSearchColumn,
#topSearchColumn.top-search-hidden-final {
  display: none !important;
}
#topSearchColumn.mobile-open {
  display: block !important;
  position: fixed !important;
  top: 64px !important;
  left: max(12px, calc(var(--sidebar-w, 0px) + 12px)) !important;
  right: 12px !important;
  width: auto !important;
  max-width: min(560px, calc(100vw - var(--sidebar-w, 0px) - 24px)) !important;
  transform: none !important;
  z-index: 2600 !important;
}
#topSearchColumn.mobile-open .top-page-search-wrap {
  position: static !important;
  transform: none !important;
  width: 100% !important;
}
#topSearchColumn.mobile-open .top-page-search-pill {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.18) !important;
}
#topSearchColumn.mobile-open .page-search-results {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  transform: none !important;
  border-radius: 14px !important;
  max-height: min(420px, calc(100vh - 128px)) !important;
}
@media (max-width: 991.98px) {
  #topSearchColumn.mobile-open {
    left: 10px !important;
    right: 10px !important;
    max-width: none !important;
    top: 58px !important;
  }
}
.fm-access-chip small {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fm-access-chip small:empty { display: none; }

/* 2026-06-14: Record attachment chips with per-file remove controls */
.attachment-chip {
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.35rem .5rem;
  border:1px solid var(--bs-border-color, #dee2e6);
  border-radius:.75rem;
  background:#fff;
  max-width:100%;
}
.attachment-chip .btn { white-space:nowrap; }
.new-file-chip { background:#fffdf4; }
.existing-attachment-chip { background:#f8fafc; }
@media (max-width: 576px) {
  .attachment-chip { width:100%; justify-content:space-between; }
}

.role-perm-table .role-perm-parent td:first-child { background: #fffaf0; }
.role-perm-table .role-perm-child td:first-child { font-size: .95rem; }
.record-ai-totals { position: sticky; bottom: 0; z-index: 2; }


/* =====================================================================
   FINAL DEPLOYMENT UI FIX 2026-06-14
   ===================================================================== */
#globalLocationSearch { display: none !important; }
#globalLocation { display: none !important; }
.dd-location-picker, .dd-location-multi { min-width: 260px; }
.dd-location-picker-btn, .dd-location-multi-btn { min-height: 38px; display: flex; align-items: center; padding-right: 2.25rem; }
.dd-location-menu { width: min(420px, calc(100vw - 28px)); max-height: min(520px, 72vh); overflow: hidden; border-radius: 14px; z-index: 4000 !important; }
.dd-location-options { max-height: 360px; overflow-y: auto; overscroll-behavior: contain; }
.dd-location-option, .dd-location-check-option { white-space: normal; padding: .7rem .85rem; border-bottom: 1px solid rgba(17,24,39,.06); }
.dd-location-option.active { background: #fff4bf; color: #111; font-weight: 800; }
.dd-location-option:hover, .dd-location-check-option:hover { background: #fff8dd; }
.dd-loc-tags { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .25rem; }
.dd-loc-tags span { display:inline-flex; align-items:center; max-width: 140px; padding: .12rem .42rem; border-radius: 999px; background: #f3f4f6; color: #4b5563; font-size: .72rem; font-weight: 650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dd-location-multi-holder { width: 100%; }
.dd-location-multi { width: 100%; min-width: 0; }
.dd-location-multi-menu { width: min(560px, calc(100vw - 28px)); }
.dd-location-multi-btn { width: 100%; min-height: 44px; }
.dd-selected-chips { display:flex; flex-wrap:wrap; gap:.35rem; min-height: 28px; }
.dd-selected-chip { display:inline-flex; align-items:center; gap:.35rem; padding:.26rem .5rem; border-radius:999px; background:#fff4bf; color:#4b3a00; font-size:.82rem; font-weight:700; cursor:pointer; }
.dd-selected-chip:hover { background:#ffe58a; }
.dd-tag-filter-row { display:flex; flex-wrap:wrap; gap:.35rem; max-height: 78px; overflow:auto; }
.dd-location-check-option { display:flex; align-items:flex-start; gap:.25rem; cursor:pointer; }
.dd-location-check-option input { margin-top: .25rem; flex: 0 0 auto; }
.dd-location-check-option > span { min-width: 0; display:block; }
.dropdown-menu, .dd-actions-menu { z-index: 5000 !important; }
.dd-actions-menu { min-width: 210px; border-radius: 14px; overflow: hidden; }
.dd-action-menu-btn { width: 42px; height: 42px; display:grid; place-items:center; }
.fm-list-card, .fm-list-card .card-body, .fm-row-pro, .fm-card-pro, .fm-grid-pro, .fm-location-section, .dd-dropdown-open-parent { overflow: visible !important; }
.card:has(.dropdown-menu.show), .card-body:has(.dropdown-menu.show), .table-responsive:has(.dropdown-menu.show), .filter-box:has(.dropdown-menu.show) { overflow: visible !important; }
.table-responsive.dd-dropdown-open-parent { overflow: visible !important; }
.fm-row-pro { position: relative; z-index: 1; }
.fm-row-pro:has(.dropdown-menu.show), .fm-card-pro:has(.dropdown-menu.show) { z-index: 50; }
@media (max-width: 576px) {
  .dd-location-picker, .dd-location-multi { min-width: 0; width: 100%; }
  .dd-location-menu { width: calc(100vw - 24px); }
}

/* =====================================================================
   FINAL DROPDOWN STACKING FIX 2026-06-14 PM
   Keeps Active Location/search menus and row action menus above page
   toolbars/cards. This fixes the menu appearing behind Bulk Add/Import
   buttons and filter cards.
   ===================================================================== */
main, #content, .location-banner, .location-banner .card-body {
  overflow: visible !important;
}
.location-banner {
  position: relative !important;
  z-index: 3000 !important;
}
.location-banner:has(.dropdown-menu.show),
.dd-location-picker:has(.dropdown-menu.show),
.dd-location-multi:has(.dropdown-menu.show),
.dd-actions-dropdown:has(.dropdown-menu.show) {
  z-index: 11000 !important;
}
.dd-portal-dropdown {
  position: fixed !important;
  transform: none !important;
  z-index: 11000 !important;
  will-change: top, left;
}
.dd-location-menu.dd-portal-dropdown,
.dd-actions-menu.dd-portal-dropdown,
.dropdown-menu.dd-portal-dropdown {
  z-index: 11000 !important;
}
.dd-location-menu.show {
  box-shadow: 0 18px 50px rgba(17, 24, 39, .22) !important;
}

/* =====================================================================
   FINAL DROPDOWN VIEWPORT FIX 2026-06-14 PM2
   Prevents the right-side Active Location dropdown from being cut off.
   ===================================================================== */
.dd-portal-dropdown {
  position: fixed !important;
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
  z-index: 12000 !important;
  box-sizing: border-box !important;
}
.dd-location-menu.dd-portal-dropdown {
  overflow: hidden !important;
}
.dd-location-menu.dd-portal-dropdown .dd-location-options {
  max-height: calc(72vh - 58px) !important;
  overflow-y: auto !important;
}
.dd-actions-menu.dd-portal-dropdown {
  overflow: visible !important;
}

/* =====================================================================
   FINAL TRUE DROPDOWN PORTAL FIX 2026-06-14 PM3
   Forces location/search/action menus to render inside the visible browser
   viewport instead of being clipped on the right side.
   ===================================================================== */
.dd-menu-portaled {
  position: fixed !important;
  transform: none !important;
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  z-index: 2147483000 !important;
  box-sizing: border-box !important;
  max-width: calc(100vw - 24px) !important;
}
.dd-location-menu.dd-menu-portaled {
  width: min(430px, calc(100vw - 24px)) !important;
  min-width: min(430px, calc(100vw - 24px)) !important;
  overflow: hidden !important;
}
.dd-location-multi-menu.dd-menu-portaled {
  width: min(560px, calc(100vw - 24px)) !important;
  min-width: min(560px, calc(100vw - 24px)) !important;
}
.dd-actions-menu.dd-menu-portaled {
  width: max-content !important;
  min-width: 220px !important;
  max-width: calc(100vw - 24px) !important;
}
.dd-menu-portaled .dd-location-options {
  max-height: calc(72vh - 70px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.dd-menu-portaled input.form-control {
  min-width: 0 !important;
}
body.dd-any-menu-open {
  overflow-x: hidden !important;
}

/* =====================================================================
   FINAL CLEAN DROPDOWN / MODAL USABILITY FIX 2026-06-14 PM4
   ===================================================================== */
.location-banner { z-index: 20 !important; }
.modal-backdrop { z-index: 2147483200 !important; }
.modal { z-index: 2147483300 !important; }
.modal-dialog { z-index: 2147483310 !important; }

.dd-clean-menu-open {
  position: fixed !important;
  transform: none !important;
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  z-index: 2147483000 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 40px rgba(17,24,39,.20) !important;
}
.dd-location-menu.dd-clean-menu-open {
  max-width: min(380px, calc(100vw - 24px)) !important;
}
.dd-location-multi-menu.dd-clean-menu-open {
  max-width: min(460px, calc(100vw - 24px)) !important;
}
.dd-clean-menu-open .sticky-top {
  position: sticky !important;
  top: 0 !important;
  z-index: 2 !important;
  padding: .55rem !important;
}
.dd-clean-menu-open .input-group { min-width: 0 !important; }
.dd-clean-menu-open input.form-control {
  min-width: 0 !important;
  height: 36px !important;
  font-size: .94rem !important;
}
.dd-clean-menu-open .dd-location-options {
  max-height: 245px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.dd-clean-menu-open .dd-location-option,
.dd-clean-menu-open .dd-location-check-option {
  padding: .52rem .72rem !important;
  min-height: 46px !important;
  border-bottom: 1px solid rgba(17,24,39,.05) !important;
}
.dd-clean-menu-open .dd-location-option .fw-semibold,
.dd-clean-menu-open .dd-location-check-option b {
  font-size: .98rem !important;
  line-height: 1.18 !important;
}
.dd-clean-menu-open .dd-loc-tags {
  gap: .22rem !important;
  margin-top: .2rem !important;
}
.dd-clean-menu-open .dd-loc-tags span {
  max-width: 112px !important;
  padding: .08rem .34rem !important;
  font-size: .68rem !important;
  line-height: 1.2 !important;
}
.dd-clean-menu-open .dd-tag-filter-row {
  display: none !important;
}
.dd-clean-menu-open .dd-select-visible,
.dd-clean-menu-open .dd-clear-selected {
  padding: .25rem .55rem !important;
  font-size: .82rem !important;
}
.dd-location-multi-holder .dd-selected-chips {
  min-height: 0 !important;
  margin-top: .35rem !important;
}
.dd-location-multi-holder .dd-selected-chip {
  padding: .18rem .42rem !important;
  font-size: .75rem !important;
}
.dd-location-multi-btn,
.dd-location-picker-btn {
  min-height: 38px !important;
}
.dd-location-multi-btn span,
.dd-location-picker-btn span,
.dd-picker-main {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
@media (max-width: 576px) {
  .dd-location-menu.dd-clean-menu-open,
  .dd-location-multi-menu.dd-clean-menu-open {
    max-width: calc(100vw - 18px) !important;
  }
  .dd-clean-menu-open .dd-location-options { max-height: 52vh !important; }
}

/* FINAL DROPDOWN OPEN FIX 2026-06-14 PM5: ensure custom portaled menus are visible when opened by JS. */
.dd-clean-menu-open {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
.modal .dd-location-picker,
.modal .dd-location-multi {
  position: relative !important;
  z-index: auto !important;
}

/* =====================================================================
   STABLE LOCATION DROPDOWN RECOVERY FIX 2026-06-14 PM6
   Uses native <details> dropdowns so opening is reliable. Compact layout.
   ===================================================================== */
#globalLocationPicker, .dd-location-single-holder, .dd-location-multi-holder { display: none !important; }
#globalLocationPickerStable, .dd-stable-single-holder, .dd-stable-multi-holder { display: block !important; position: relative !important; max-width: 100%; }
details.dd-stable-location-details, details.dd-stable-multi-details { position: relative !important; max-width: 100%; }
details.dd-stable-location-details > summary, details.dd-stable-multi-details > summary {
  list-style: none !important;
  cursor: pointer !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  padding-right: 2.2rem !important;
  user-select: none !important;
}
details.dd-stable-location-details > summary::-webkit-details-marker, details.dd-stable-multi-details > summary::-webkit-details-marker { display: none !important; }
details.dd-stable-location-details > summary::after, details.dd-stable-multi-details > summary::after {
  content: "\f107";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: .8rem;
  top: 50%;
  transform: translateY(-50%);
  color: #111827;
}
details.dd-stable-location-details[open] > summary::after, details.dd-stable-multi-details[open] > summary::after { transform: translateY(-50%) rotate(180deg); }
.dd-stable-summary span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dd-stable-menu {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  width: min(380px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  background: #fff !important;
  border: 1px solid rgba(15,23,42,.16) !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 42px rgba(15,23,42,.22) !important;
  z-index: 2147483000 !important;
  overflow: hidden !important;
}
.dd-stable-menu-right { right: 0 !important; left: auto !important; }
.dd-stable-multi-menu { width: min(430px, calc(100vw - 24px)) !important; }
.dd-stable-search-row { display: flex; align-items: center; gap: .45rem; padding: .5rem; border-bottom: 1px solid rgba(15,23,42,.08); background: #fff; }
.dd-stable-search-row i { color: #374151; width: 20px; text-align: center; }
.dd-stable-search { width: 100%; min-width: 0; height: 34px; border: 1px solid #d1d5db; border-radius: 8px; padding: .3rem .5rem; font-size: .95rem; outline: none; }
.dd-stable-search:focus { border-color: #eab308; box-shadow: 0 0 0 .18rem rgba(234,179,8,.20); }
.dd-stable-options { max-height: 255px; overflow-y: auto; overflow-x: hidden; }
.dd-stable-option, .dd-stable-check { display: block; width: 100%; text-align: left; background: #fff; border: 0; border-bottom: 1px solid rgba(15,23,42,.06); padding: .55rem .75rem; color: #111827; cursor: pointer; }
.dd-stable-option:hover, .dd-stable-check:hover { background: #fff8dd; }
.dd-stable-option.active { background: #fff2b8; font-weight: 800; }
.dd-stable-option-title { display: flex; align-items: center; gap: .45rem; font-weight: 800; min-width: 0; }
.dd-stable-option-title span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dd-stable-option-title i { color: #eab308; flex: 0 0 auto; }
.dd-stable-tags { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .25rem; }
.dd-stable-tags span { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-flex; padding: .08rem .35rem; border-radius: 999px; background: #f3f4f6; color: #4b5563; font-size: .68rem; font-weight: 700; }
.dd-stable-check { display: flex; align-items: flex-start; gap: .45rem; }
.dd-stable-check input { margin-top: .25rem; flex: 0 0 auto; }
.dd-stable-check b { display: block; font-size: .97rem; line-height: 1.15; }
.dd-stable-actions { display: flex; gap: .4rem; padding: .45rem .5rem; border-bottom: 1px solid rgba(15,23,42,.08); }
.dd-stable-chips { display: flex; flex-wrap: wrap; gap: .28rem; margin-top: .35rem; min-height: 0; }
.dd-stable-chip { border: 0; border-radius: 999px; background: #fff2b8; color: #4b3a00; font-size: .73rem; font-weight: 800; padding: .18rem .42rem; }
.dd-stable-help { color: #6b7280; font-size: .82rem; }
.location-banner, .filter-box, .card, .card-body, main, #content { overflow: visible !important; }
.modal .location-banner { display: none !important; }
@media (max-width: 576px) {
  .dd-stable-menu, .dd-stable-multi-menu { width: calc(100vw - 20px) !important; max-height: 70vh; }
  .dd-stable-options { max-height: 50vh; }
}

/* =====================================================================
   FINAL LOCATION DROPDOWN FIX 2026-06-14 PM7
   Fresh-source dropdown. Compact, visible, and not affected by older dropdown
   experiments above.
   ===================================================================== */
#globalLocationPickerStable,
#globalLocationPicker,
.dd-stable-single-holder,
.dd-stable-multi-holder,
.dd-location-single-holder,
.dd-location-multi-holder { display: none !important; }
#globalLocationPickerFinal,
.dd-final-single-holder,
.dd-final-multi-holder { display:block !important; position:relative !important; max-width:100% !important; z-index: 5; }
details.dd-final-location-details,
details.dd-final-multi-details { position:relative !important; max-width:100% !important; }
details.dd-final-location-details > summary,
details.dd-final-multi-details > summary {
  list-style:none !important; cursor:pointer !important; min-height:38px !important; display:flex !important; align-items:center !important;
  padding-right:2.25rem !important; user-select:none !important; background:#fff !important;
}
details.dd-final-location-details > summary::-webkit-details-marker,
details.dd-final-multi-details > summary::-webkit-details-marker { display:none !important; }
details.dd-final-location-details > summary::after,
details.dd-final-multi-details > summary::after {
  content:"\f107"; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; right:.8rem; top:50%; transform:translateY(-50%); color:#111827; pointer-events:none;
}
details.dd-final-location-details[open] > summary::after,
details.dd-final-multi-details[open] > summary::after { transform:translateY(-50%) rotate(180deg); }
.dd-final-summary span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dd-final-menu {
  position:absolute !important; top:calc(100% + 6px) !important; left:0 !important; width:min(420px, calc(100vw - 24px)) !important;
  max-width:calc(100vw - 24px) !important; background:#fff !important; border:1px solid rgba(15,23,42,.16) !important;
  border-radius:12px !important; box-shadow:0 18px 42px rgba(15,23,42,.22) !important; z-index:2147483647 !important; overflow:hidden !important;
}
.dd-final-menu-right { right:0 !important; left:auto !important; }
.dd-final-multi-menu { width:min(460px, calc(100vw - 24px)) !important; }
.dd-final-search-row { display:flex; align-items:center; gap:.45rem; padding:.5rem; border-bottom:1px solid rgba(15,23,42,.08); background:#fff; }
.dd-final-search-row i { color:#374151; width:20px; text-align:center; }
.dd-final-search { width:100%; min-width:0; height:34px; border:1px solid #d1d5db; border-radius:8px; padding:.3rem .5rem; font-size:.95rem; outline:none; }
.dd-final-search:focus { border-color:#eab308; box-shadow:0 0 0 .18rem rgba(234,179,8,.20); }
.dd-final-options { max-height:310px; overflow-y:auto; overflow-x:hidden; }
.dd-final-option,
.dd-final-check { display:block; width:100%; text-align:left; background:#fff; border:0; border-bottom:1px solid rgba(15,23,42,.06); padding:.55rem .75rem; color:#111827; cursor:pointer; }
.dd-final-option:hover,
.dd-final-check:hover { background:#fff8dd; }
.dd-final-option.active { background:#fff2b8; font-weight:800; }
.dd-final-option-title { display:flex; align-items:center; gap:.45rem; font-weight:800; min-width:0; }
.dd-final-option-title span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dd-final-option-title i { color:#eab308; flex:0 0 auto; }
.dd-final-tags { display:flex; flex-wrap:wrap; gap:.25rem; margin-top:.25rem; }
.dd-final-tags span { max-width:115px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-flex; padding:.08rem .35rem; border-radius:999px; background:#f3f4f6; color:#4b5563; font-size:.68rem; font-weight:700; }
.dd-final-check { display:flex; align-items:flex-start; gap:.45rem; }
.dd-final-check input { margin-top:.25rem; flex:0 0 auto; }
.dd-final-check b { display:block; font-size:.97rem; line-height:1.15; }
.dd-final-actions { display:flex; gap:.4rem; padding:.45rem .5rem; border-bottom:1px solid rgba(15,23,42,.08); }
.dd-final-chips { display:flex; flex-wrap:wrap; gap:.28rem; margin-top:.35rem; min-height:0; }
.dd-final-chip { border:0; border-radius:999px; background:#fff2b8; color:#4b3a00; font-size:.73rem; font-weight:800; padding:.18rem .42rem; }
.dd-final-help { color:#6b7280; font-size:.82rem; }
@media (max-width: 576px) {
  .dd-final-menu,
  .dd-final-multi-menu { width:calc(100vw - 20px) !important; max-height:70vh; }
  .dd-final-options { max-height:52vh; }
}

/* FINAL ACTUAL LOCATION DROPDOWN DATA/VISIBILITY FIX 2026-06-14 PM9 */
#globalLocationPickerActual,
.dd-actual-single-holder,
.dd-actual-multi-holder { position: relative; width: 100%; }
#globalLocationPickerActual .dd-actual-loc-details { position: relative; }
.dd-actual-loc-details,
.dd-actual-multi-details { position: relative; }
.dd-actual-summary {
  display: flex !important;
  align-items: center;
  min-height: 42px;
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 2.4rem !important;
}
.dd-actual-summary::-webkit-details-marker { display: none; }
.dd-actual-summary span { overflow: hidden; text-overflow: ellipsis; }
.dd-actual-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 2147483600;
  width: min(420px, calc(100vw - 32px));
  max-height: min(420px, calc(100vh - 150px));
  overflow: auto;
  background: #fff;
  border: 1px solid #d6dbe3;
  border-radius: 14px;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .22);
}
.dd-actual-menu-right { right: 0; left: auto; }
.dd-actual-search-row {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 8px;
  background: #fff;
  border-bottom: 1px solid #eef1f5;
}
.dd-actual-search-row i { color: #334155; flex: 0 0 auto; }
.dd-actual-search {
  width: 100%;
  border: 2px solid #f0b800;
  outline: none;
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 14px;
}
.dd-actual-option,
.dd-actual-check {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: #fff;
  padding: 10px 12px;
  border-bottom: 1px solid #f1f5f9;
  color: #111827;
}
.dd-actual-option:hover,
.dd-actual-check:hover,
.dd-actual-option.active { background: #fff4bd; }
.dd-actual-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  min-width: 0;
}
.dd-actual-title span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dd-actual-title i { color: #eab308; }
.dd-actual-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.dd-actual-tags span {
  display: inline-flex;
  align-items: center;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 2px 7px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 700;
}
.dd-actual-check { display: flex; gap: 9px; align-items: flex-start; }
.dd-actual-check input { margin-top: 4px; }
.dd-actual-actions { display: flex; gap: 8px; padding: 8px; border-bottom: 1px solid #eef1f5; background: #fff; }
.modal-backdrop { z-index: 1040 !important; }
.modal { z-index: 1055 !important; }
.modal.show { z-index: 1055 !important; }
.modal.show ~ .dd-actual-global-picker,
.modal.show ~ #globalLocationPickerActual { z-index: 1 !important; }
@media (max-width: 640px) {
  .dd-actual-menu,
  .dd-actual-menu-right { left: 0; right: auto; width: min(360px, calc(100vw - 24px)); }
}

/* FINAL TESTING CLEANUP 2026-06-15 */
/* Avoid showing the module name twice: left nav + page body title are enough. */
.topbar-col-left > div:not(:has(button)) { display: none !important; }
.topbar-col-left #pageTitle,
.topbar-col-left #pageSubtitle { display: none !important; }

.payment-details-pro {
  border: 1px solid #e8dfc5;
  border-radius: 14px;
  background: #fffaf0;
  padding: 0;
  overflow: hidden;
}
.payment-details-pro > summary {
  list-style: none;
  cursor: pointer;
  padding: 12px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-weight: 800;
}
.payment-details-pro > summary::-webkit-details-marker { display:none; }
.payment-details-pro[open] > summary { border-bottom: 1px solid #eadfbd; }
.payment-details-pro > .row { padding: 14px; }

.attachment-section {
  border: 1px solid #e3e7ee;
  background: #fff;
  border-radius: 14px;
  padding: 12px;
}
.attachment-section-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.info-dot {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  font-weight: 800;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  color: #475569;
  cursor: help;
}
.highlighted-proof {
  border: 2px dashed #e3c45a !important;
  background: #fff8dc !important;
  border-radius: 14px;
  padding: 12px;
}
.payment-highlight {
  border-color: #56b58b !important;
  background: #f2fff8 !important;
}
.attachment-tile-wrap {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.attachment-tile {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width: 230px;
  max-width: 100%;
  padding: 8px 10px;
  border: 1px solid #dbe2ea;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 12px rgba(15,23,42,.05);
}
.attachment-tile-main {
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
}
.attachment-tile-main span {
  white-space: nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width: 220px;
}
.bill-proof-tile .attachment-tile-main i { color:#e0a800; }
.payment-proof-tile .attachment-tile-main i { color:#198754; }
.attachment-actions .dropdown-menu { z-index: 1095; }

.table tbody tr[data-id], #recordedChecksBody tbody tr[data-check-source-id] { cursor: pointer; }
.topbar-col-left > div { display: none !important; }


/* FINAL FILE MANAGER ACTION MENU PATCH 2026-06-15 */
.fm-card-pro,
.fm-row-pro,
.fm-list-card,
.fm-list-card .card-body,
.fm-grid-pro,
.fm-location-section { overflow: visible !important; }
.fm-native-actions { position: relative; display: inline-block; flex: 0 0 auto; z-index: 20; }
.fm-native-actions[open] { z-index: 2147483000; }
.fm-native-actions summary { list-style: none; }
.fm-native-actions summary::-webkit-details-marker { display: none; }
.fm-native-actions-btn {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: #f3f4f6;
  color: #111827;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.04);
}
.fm-native-actions-btn:hover,
.fm-native-actions[open] .fm-native-actions-btn { background: #e5e7eb; }
.fm-native-actions-menu {
  position: absolute;
  top: calc(100% + 7px);
  right: 0;
  min-width: 220px;
  background: #fff;
  border: 1px solid #d7dde6;
  border-radius: 14px;
  box-shadow: 0 18px 45px rgba(15,23,42,.22);
  padding: 6px;
  z-index: 2147483001;
}
.fm-native-action {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 0;
  background: transparent;
  color: #111827;
  text-decoration: none;
  text-align: left;
  font-weight: 700;
  font-size: 14px;
  padding: 9px 10px;
  border-radius: 10px;
  cursor: pointer;
}
.fm-native-action:hover { background: #fff4bf; color: #111827; }
.fm-native-action i { width: 18px; text-align: center; color: #5b6472; }
.fm-native-action.text-danger,
.fm-native-action.text-danger i { color: #dc3545 !important; }
.fm-native-divider { height: 1px; background: #edf0f4; margin: 5px 4px; }
@media (max-width: 768px) {
  .fm-native-actions-menu { right: auto; left: 50%; transform: translateX(-88%); max-width: calc(100vw - 24px); }
}

/* Final attachment direct-delete polish */
.attachment-tile.attachment-marked-remove{opacity:.62;background:#fff5f5!important;border-color:#ff6b6b!important;text-decoration:line-through;}
.attachment-tile.attachment-marked-remove .attachment-actions a,.attachment-tile.attachment-marked-remove .attachment-actions .dropdown-toggle{pointer-events:none;opacity:.45;}

/* Keep OCR/AI raw text from blowing up the record modal row height. */
.record-ai-raw-text{max-height:2.9em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35;}

/* FINAL ACTIVE LOCATION / FILE MANAGER DROPDOWN VISIBILITY FIX 2026-06-17 */
#fmFilters,
.fm-command-card,
.fm-command-card .card-body,
#fmFilters .col-lg-3,
#fmFilters .col-md-6 {
  overflow: visible !important;
}
#fmLocation {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
[data-dd-single-for="fmLocation"],
[data-dd-stable-single-for="fmLocation"],
[data-dd-final-single-for="fmLocation"],
[data-dd-actual-single-for="fmLocation"] {
  display: none !important;
}
.fm-drop-zone {
  position: relative;
  z-index: 1;
}
#fmFilters {
  position: relative;
  z-index: 20;
}