@layer overrides {

/* Override Bootstrap card white background globally on dark theme */
body:not(.auth) .card {
  --bs-card-bg: var(--clr-berry-800);
  background-color: var(--clr-berry-800);
  border-color: rgba(var(--clr-berry-500-rgb),0.25);
  color: var(--white-a85);
}
body:not(.auth) .card-header {
  background-color: var(--clr-berry-700);
  border-bottom-color: rgba(var(--clr-berry-500-rgb),0.2);
  color: var(--clr-white);
}
body:not(.auth) .card-footer {
  background-color: var(--clr-berry-800);
  border-top-color: rgba(var(--clr-berry-500-rgb),0.2);
}

/* Lift Bootstrap text-white-50 for dark theme readability */
body:not(.auth) .text-white-50 {
  color: var(--white-a65) !important;
}

/* Unified tile header icons */
.fm-card-header-icon,
.dashboard-card .card-header i,
.bd-ctx-header i,
.sched-panel-header i {
  font-size: var(--fs-xl-s);
  width: 18px;
  text-align: center;
  flex-shrink: 0;
}

/* Colourable element transitions */
[data-colourable="true"] {
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}

/* Shared ghost danger button */
.btn-ghost-danger {
  background: transparent;
  color: var(--white-a50);
  border: 1px solid var(--white-a20);
  border-radius: var(--comp-radius);
  font-size: var(--fs-base-s);
  padding: 4px 10px;
  cursor: pointer;
  font-family: inherit;
  transition: color 0.15s, border-color 0.15s;
}
.btn-ghost-danger:hover {
  color: var(--clr-danger);
  border-color: var(--clr-danger);
}

/* .panel-section-divider replaced by .fm-section-divider */

.status-cell .status { font-size:var(--fs-h3-s); line-height:1; margin-left:8px; }
.status-warn { color: var(--orange-500, #ff9800) !important; }
.status-cell .text-danger { color: var(--clr-white) !important; opacity:.8; }
.status-cell .text-danger:hover { color:var(--clr-danger-light) !important; }

/* ── Mobile touch targets ── */
@media (max-width: 768px) {
  button,
  .btn,
  .sb-tab,
  .nav-link {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  /* Exceptions — small inline buttons in tables */
  .crew-del-btn,
  .bd-action-btn,
  .lc-del-btn,
  .crew-stage-import-btn,
  .bgt-lock-btn {
    min-height: unset;
  }
  /* Tab bar items — compact, touch via padding not height */
  .tab-bar button,
  .tab-bar .btn,
  .tab-bar .tools-btn {
    min-height: unset !important;
    height: 34px !important;
    width: 34px;
    padding: 0 !important;
    border-radius: 6px !important;
  }
  .tab-bar #globalSearch,
  .tab-bar .global-search-input {
    height: 34px !important;
    min-height: unset !important;
    font-size: var(--fs-xl-s) !important;
    padding: 0 10px !important;
  }
  /* Header buttons compact */
  .header-buttons .btn-icon {
    min-height: unset !important;
    width: 34px;
    height: 34px;
  }
}

/* ── Mobile text standard —
   matches Bootstrap .small
   (0.875em of 16px = 14px) ── */
@media (max-width: 768px) {
  body {
    font-size: var(--fs-xl-s);
  }

  /* Inputs stay 16px to prevent iOS zoom */
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    font-size: var(--fs-h3-s) !important;
  }
}

/* ── Mobile button sizing (480px) ── */
@media (max-width: 480px) {
  .sb-init-btn {
    font-size: var(--fs-base-s) !important;
    padding: 5px 10px !important;
    white-space: nowrap !important;
  }
  /* Tool button rows — horizontal scroll */
  .btn-group,
  [class*="btn-row"],
  [class*="action-row"],
  .toolbar,
  [class*="toolbar"] {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 4px !important;
    scrollbar-width: none !important;
  }
  .btn-group::-webkit-scrollbar,
  [class*="btn-row"]::-webkit-scrollbar,
  [class*="toolbar"]::-webkit-scrollbar {
    display: none !important;
  }
  .btn-group button,
  [class*="btn-row"] button,
  [class*="action-row"] button {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }
  .week-nav button,
  .lc-week-nav button,
  #btn-prev-week,
  #btn-next-week {
    font-size: var(--fs-sm-s) !important;
    padding: 4px 8px !important;
  }
}

}