/**
 * BFTH shared QOL — Vanilla-A + Vanilla-B + Vanilla-C + Vanilla-D
 * Applies to stock / Normal UI only (not [data-ui="v3"]), except empty stubs.
 *
 * A: focus-visible, tabular-nums, denser tables + row hover
 * B: control heights, soft nav/button hover wash, quieter card headers
 * C: empty-stub quieting, secondary copy demotion
 *     (collapse persistence wired on party overview via bfthCollapse)
 * D: badge radius consistency, table scroll affordance,
 *     corp/admin collapse dual-write via bfthCollapse.writeExpanded/writeCollapsed
 *
 * No surface remaps, no IA chrome, no background shorthand.
 */

html:not([data-ui="v3"]) {
  --bfth-qol-focus: rgba(59, 130, 246, 0.55);
  --bfth-qol-hover: rgba(255, 255, 255, 0.05);
  --bfth-qol-hover-wash: rgba(255, 255, 255, 0.06);
  --bfth-qol-nav-hover: rgba(255, 255, 255, 0.04);
  --bfth-qol-stripe: rgba(255, 255, 255, 0.02);
  --bfth-qol-header-border: rgba(255, 255, 255, 0.08);
  --bfth-qol-motion: 160ms;
  --bfth-qol-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --bfth-qol-row-pad-y: 0.5rem;
  --bfth-qol-row-pad-x: 0.65rem;
  --bfth-qol-control-h: 40px;
  --bfth-qol-control-h-sm: 32px;
}

/* =========================================================================
   Vanilla-A
   ========================================================================= */

/* ----- Focus-visible (keyboard only) ----- */
html:not([data-ui="v3"]) :focus:not(:focus-visible) {
  outline: none;
}

html:not([data-ui="v3"]) :focus-visible {
  outline: 2px solid var(--bfth-qol-focus);
  outline-offset: 2px;
}

html:not([data-ui="v3"]) main input:focus-visible,
html:not([data-ui="v3"]) main select:focus-visible,
html:not([data-ui="v3"]) main textarea:focus-visible {
  outline: 2px solid var(--bfth-qol-focus);
  outline-offset: 1px;
}

/* ----- Tabular numbers (scanable metrics) ----- */
html:not([data-ui="v3"]) [data-user-stat],
html:not([data-ui="v3"]) .bottom-stats-bar .font-bold,
html:not([data-ui="v3"]) .bottom-stats-bar [data-user-stat],
html:not([data-ui="v3"]) main .card .font-bold.text-red-500,
html:not([data-ui="v3"]) main .card .font-bold.text-green-500,
html:not([data-ui="v3"]) main .card .font-bold.text-blue-500,
html:not([data-ui="v3"]) main .card .font-bold.text-yellow-500,
html:not([data-ui="v3"]) main .card .font-bold.text-yellow-400,
html:not([data-ui="v3"]) main table tbody td {
  font-variant-numeric: tabular-nums;
}

/* ----- Tables: density + hover ----- */
html:not([data-ui="v3"]) main table thead th {
  padding-top: var(--bfth-qol-row-pad-y);
  padding-bottom: var(--bfth-qol-row-pad-y);
  padding-left: var(--bfth-qol-row-pad-x);
  padding-right: var(--bfth-qol-row-pad-x);
}

html:not([data-ui="v3"]) main table tbody td {
  padding-top: var(--bfth-qol-row-pad-y);
  padding-bottom: var(--bfth-qol-row-pad-y);
  padding-left: var(--bfth-qol-row-pad-x);
  padding-right: var(--bfth-qol-row-pad-x);
}

html:not([data-ui="v3"]) main table tbody tr {
  transition: background-color var(--bfth-qol-motion) var(--bfth-qol-ease);
}

html:not([data-ui="v3"]) main table tbody tr:nth-child(even) {
  background-color: var(--bfth-qol-stripe);
}

html:not([data-ui="v3"]) main table tbody tr:hover {
  background-color: var(--bfth-qol-hover);
}

@media (max-width: 767px) {
  html:not([data-ui="v3"]) main .overflow-x-auto {
    -webkit-overflow-scrolling: touch;
  }
}

/* =========================================================================
   Vanilla-B
   ========================================================================= */

/* ----- Control heights (forms feel less uneven) ----- */
html:not([data-ui="v3"]) main button:not(.tablinks):not([class*="w-5"]):not([class*="w-4"]):not([class*="p-0"]),
html:not([data-ui="v3"]) main .btn,
html:not([data-ui="v3"]) main a.btn,
html:not([data-ui="v3"]) main input[type="submit"],
html:not([data-ui="v3"]) main input[type="button"] {
  min-height: var(--bfth-qol-control-h);
  box-sizing: border-box;
}

html:not([data-ui="v3"]) main button.px-3.py-1\.5,
html:not([data-ui="v3"]) main button.text-sm,
html:not([data-ui="v3"]) main .btn.text-sm,
html:not([data-ui="v3"]) main a.btn.text-sm,
html:not([data-ui="v3"]) nav button.min-h-\[32px\] {
  min-height: var(--bfth-qol-control-h-sm);
}

html:not([data-ui="v3"]) main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]):not([type="image"]),
html:not([data-ui="v3"]) main select {
  min-height: var(--bfth-qol-control-h-sm);
  box-sizing: border-box;
}

/* ----- Soft hover wash (preserve stock button colors) ----- */
html:not([data-ui="v3"]) nav a,
html:not([data-ui="v3"]) nav button,
html:not([data-ui="v3"]) main button,
html:not([data-ui="v3"]) main .btn,
html:not([data-ui="v3"]) main a.btn,
html:not([data-ui="v3"]) main input[type="submit"],
html:not([data-ui="v3"]) main input[type="button"] {
  transition:
    background-color var(--bfth-qol-motion) var(--bfth-qol-ease),
    box-shadow var(--bfth-qol-motion) var(--bfth-qol-ease),
    border-color var(--bfth-qol-motion) var(--bfth-qol-ease),
    color var(--bfth-qol-motion) var(--bfth-qol-ease);
}

html:not([data-ui="v3"]) nav a:hover,
html:not([data-ui="v3"]) nav button:hover {
  background-color: var(--bfth-qol-nav-hover);
}

/* Inset wash keeps green/red/gray fills intact (no background-color overwrite) */
html:not([data-ui="v3"]) main button:hover:not(:disabled),
html:not([data-ui="v3"]) main .btn:hover:not(:disabled),
html:not([data-ui="v3"]) main a.btn:hover,
html:not([data-ui="v3"]) main input[type="submit"]:hover:not(:disabled),
html:not([data-ui="v3"]) main input[type="button"]:hover:not(:disabled) {
  filter: none;
  box-shadow: inset 0 0 0 9999px var(--bfth-qol-hover-wash);
}

html:not([data-ui="v3"]) main button:active:not(:disabled),
html:not([data-ui="v3"]) main .btn:active:not(:disabled),
html:not([data-ui="v3"]) main a.btn:active,
html:not([data-ui="v3"]) main input[type="submit"]:active:not(:disabled),
html:not([data-ui="v3"]) main input[type="button"]:active:not(:disabled) {
  box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.12);
}

/* ----- Quieter card headers (thinner rules, denser padding; keep stock fills) ----- */
html:not([data-ui="v3"]) main .card-header,
html:not([data-ui="v3"]) main [class*="card-header"] {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: var(--bfth-qol-header-border);
}

html:not([data-ui="v3"]) main .card-header.bg-dark,
html:not([data-ui="v3"]) main .border-b-2 {
  border-bottom-width: 1px !important;
  border-bottom-color: var(--bfth-qol-header-border) !important;
}

html:not([data-ui="v3"]) main .card-header {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}

/* =========================================================================
   Vanilla-C
   ========================================================================= */

/* Empty stubs: no meaningful body content (e.g. Party National Control) */
.bfth-empty-stub {
  display: none !important;
}

/* Secondary / explanatory copy: quieter than leadership and actions */
html:not([data-ui="v3"]) .bfth-secondary-copy {
  font-size: 0.875rem;
  line-height: 1.45;
  color: #9ca3af;
}

html:not([data-ui="v3"]) .bfth-secondary-copy p,
html:not([data-ui="v3"]) .bfth-secondary-copy li {
  color: inherit;
}

html:not([data-ui="v3"]) .bfth-secondary-copy a {
  color: #60a5fa;
}

html:not([data-ui="v3"]) .bfth-secondary-copy a:hover {
  color: #93c5fd;
}

/* Soften long description cards relative to action modules */
html:not([data-ui="v3"]) .bfth-secondary-card {
  opacity: 0.92;
}

html:not([data-ui="v3"]) .bfth-secondary-card > .card-header h5,
html:not([data-ui="v3"]) .bfth-secondary-card > .card-header .mb-0 {
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #9ca3af;
}

/* =========================================================================
   Vanilla-D
   ========================================================================= */

/* Badge pills: 4px, not circles. Keep true avatar images circular. */
html:not([data-ui="v3"]) main span.rounded-full,
html:not([data-ui="v3"]) nav span.rounded-full,
html:not([data-ui="v3"]) main a.rounded-full:not(:has(img)),
html:not([data-ui="v3"]) nav button.rounded-full {
  border-radius: 4px !important;
}

html:not([data-ui="v3"]) main img.rounded-full,
html:not([data-ui="v3"]) nav img.rounded-full {
  border-radius: 9999px !important;
}

/* Wide table scroll affordance */
html:not([data-ui="v3"]) main .overflow-x-auto {
  scrollbar-width: thin;
  scrollbar-color: rgba(156, 163, 175, 0.45) transparent;
}

html:not([data-ui="v3"]) main .overflow-x-auto::-webkit-scrollbar {
  height: 6px;
}

html:not([data-ui="v3"]) main .overflow-x-auto::-webkit-scrollbar-track {
  background: transparent;
}

html:not([data-ui="v3"]) main .overflow-x-auto::-webkit-scrollbar-thumb {
  background: rgba(156, 163, 175, 0.45);
  border-radius: 4px;
}