/* ==========================================================================
   CyberFraud.gov (FTC) - Unified Senior & Accessible Design System Stylesheet
   Based on U.S. Web Design System (USWDS 3.0) and Federal Trade Commission Standards
   Compliant with Section 508 & WCAG 2.1 AAA Accessibility Guidelines
   ========================================================================== */

:root {
  /* USWDS 3.0 & Federal Trade Commission High-Contrast Palette */
  --gov-navy-900: #0c2340; /* Ultra High-Contrast Dark Navy (14.2:1 against white) */
  --gov-navy-800: #16365c; /* Primary Navy Medium */
  --gov-navy-700: #1b4478; /* Primary Navy Hover */
  --gov-blue-600: #005087; /* High-contrast blue */
  --gov-blue-500: #005ea2; /* Primary Action Blue (USWDS primary) */
  --gov-blue-100: #d9e8f6; /* Ice Blue Surface */
  --gov-blue-50:  #f0f7fc; /* Ice Blue Background */
  
  --gov-emerald-800: #004d26; /* Ultra Dark Federal Green */
  --gov-emerald-700: #006633; /* High-Contrast Federal Green */
  --gov-emerald-100: #eaf6ee; /* Success Surface */
  
  --gov-amber-800: #7a3600; /* Ultra Dark Warning Amber */
  --gov-amber-700: #994400; /* High-Contrast Federal Warning Amber */
  --gov-amber-100: #fef4e6; /* Warning Surface */
  
  --gov-red-800: #8c0000; /* Ultra Dark Emergency Red */
  --gov-red-700: #b30000; /* High-Contrast Emergency Alert Red */
  --gov-red-100: #fde8e8; /* Emergency Surface */
  
  --ftc-card-border: #94a3b8; /* High-contrast border */
  --ftc-text-main: #0f172a;   /* 17.5:1 contrast against white */
  --ftc-text-muted: #334155;  /* 9.6:1 contrast against white */
}

/* Base Senior Typography: Large & Highly Legible */
html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-size: 1.0625rem; /* ~17px base for senior readability */
  line-height: 1.65;
  color: var(--ftc-text-main);
  background-color: #f8fafc;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ==========================================================================
   Global Color Utilities
   ========================================================================== */
.bg-gov-900 { background-color: var(--gov-navy-900) !important; }
.bg-gov-800 { background-color: var(--gov-navy-800) !important; }
.bg-gov-700 { background-color: var(--gov-navy-700) !important; }
.bg-gov-500 { background-color: var(--gov-blue-500) !important; }
.bg-gov-100 { background-color: var(--gov-blue-100) !important; }
.bg-gov-50  { background-color: var(--gov-blue-50)  !important; }

.text-gov-900 { color: var(--gov-navy-900) !important; }
.text-gov-800 { color: var(--gov-navy-800) !important; }
.text-gov-700 { color: var(--gov-navy-700) !important; }
.text-gov-500 { color: var(--gov-blue-500) !important; }

.border-gov-900 { border-color: var(--gov-navy-900) !important; }
.border-gov-800 { border-color: var(--gov-navy-800) !important; }
.border-gov-700 { border-color: var(--gov-navy-700) !important; }
.border-gov-500 { border-color: var(--gov-blue-500) !important; }
.border-gov-200 { border-color: #94a3b8 !important; }
.border-gov-100 { border-color: var(--gov-blue-100) !important; }

.hover\:bg-gov-700:hover { background-color: var(--gov-navy-700) !important; }
.hover\:bg-gov-800:hover { background-color: var(--gov-navy-800) !important; }
.hover\:text-gov-700:hover { color: var(--gov-navy-700) !important; }
.hover\:text-gov-500:hover { color: var(--gov-blue-500) !important; }

/* ==========================================================================
   Accessibility & Focus System (Section 508 / WCAG AAA)
   ========================================================================== */
*:focus-visible {
  outline: 4px solid #005ea2 !important;
  outline-offset: 3px !important;
}

/* ==========================================================================
   Global Layout Containers & Cards
   ========================================================================== */
.ftc-card {
  background-color: #ffffff;
  border: 2px solid var(--ftc-card-border);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
  transition: all 0.2s ease-in-out;
}

.ftc-card:hover {
  border-color: #475569;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
}

.ftc-card-active,
.ftc-card.selected {
  border-color: var(--gov-blue-500) !important;
  background-color: #f0f7fc !important;
  box-shadow: 0 0 0 3px var(--gov-blue-500), 0 6px 16px rgba(0, 94, 162, 0.15) !important;
}

.ftc-card-header {
  padding: 20px 24px;
  border-bottom: 2px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ftc-card-body {
  padding: 24px;
}

/* Page Headers */
.ftc-page-header {
  margin-bottom: 28px;
}

.ftc-page-header h1 {
  font-size: 2.125rem;
  font-weight: 800;
  color: var(--gov-navy-900);
  line-height: 1.25;
  letter-spacing: -0.01em;
}

.ftc-page-header p {
  font-size: 1.1875rem;
  color: var(--ftc-text-muted);
  margin-top: 8px;
  font-weight: 500;
  line-height: 1.55;
}

/* Metric / Stat Display Cards */
.ftc-stat-card {
  padding: 18px;
  border-radius: 10px;
  background-color: #f8fafc;
  border: 2px solid #cbd5e1;
}

.ftc-stat-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #334155;
  margin-bottom: 4px;
}

.ftc-stat-value {
  display: block;
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--ftc-text-main);
}

/* ==========================================================================
   Global Alerts & Callout Banners (USWDS Standard - Senior High Contrast)
   ========================================================================== */
.ftc-alert {
  padding: 20px 24px;
  border-radius: 10px;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  border-left-width: 8px;
  font-size: 1.0625rem;
  line-height: 1.6;
}

.ftc-alert-info {
  background-color: #eef6fc;
  border: 1px solid #bfdbfe;
  border-left-width: 8px;
  border-left-color: var(--gov-blue-500);
  color: var(--gov-navy-900);
}

.ftc-alert-warning {
  background-color: var(--gov-amber-100);
  border: 1px solid #fed7aa;
  border-left-width: 8px;
  border-left-color: var(--gov-amber-700);
  color: #4a2800;
}

.ftc-alert-error {
  background-color: var(--gov-red-100);
  border: 1px solid #fecaca;
  border-left-width: 8px;
  border-left-color: var(--gov-red-700);
  color: #5c0b0b;
}

.ftc-alert-success {
  background-color: var(--gov-emerald-100);
  border: 1px solid #bbf7d0;
  border-left-width: 8px;
  border-left-color: var(--gov-emerald-700);
  color: #042e18;
}

/* ==========================================================================
   Global Button System (USWDS Standard - Large 54px+ Targets)
   ========================================================================== */
.ftc-btn-primary {
  background-color: var(--gov-blue-500);
  color: #ffffff !important;
  font-weight: 800;
  min-height: 56px;
  padding: 14px 28px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 1.125rem;
  transition: background-color 0.15s ease-in-out, transform 0.1s;
  box-shadow: 0 3px 6px rgba(0, 94, 162, 0.3);
  cursor: pointer;
  border: none;
  text-decoration: none;
}

.ftc-btn-primary:hover {
  background-color: var(--gov-navy-800);
}

.ftc-btn-primary:active {
  transform: translateY(1px);
}

.ftc-btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.ftc-btn-secondary {
  background-color: #ffffff;
  color: var(--gov-blue-500) !important;
  border: 2px solid var(--gov-blue-500);
  font-weight: 800;
  min-height: 56px;
  padding: 14px 26px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 1.125rem;
  transition: all 0.15s ease-in-out;
  cursor: pointer;
  text-decoration: none;
}

.ftc-btn-secondary:hover {
  background-color: #f0f7fc;
  border-color: var(--gov-navy-800);
  color: var(--gov-navy-800) !important;
}

.ftc-btn-danger {
  background-color: var(--gov-red-700);
  color: #ffffff !important;
  font-weight: 800;
  min-height: 56px;
  padding: 14px 24px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 1.125rem;
  transition: background-color 0.15s ease-in-out;
  box-shadow: 0 2px 5px rgba(179, 0, 0, 0.3);
  cursor: pointer;
  border: none;
  text-decoration: none;
}

.ftc-btn-danger:hover {
  background-color: #8c0000;
}

.ftc-btn-success {
  background-color: var(--gov-emerald-700);
  color: #ffffff !important;
  font-weight: 800;
  min-height: 52px;
  padding: 12px 22px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 1rem;
  transition: background-color 0.15s ease-in-out;
  box-shadow: 0 2px 4px rgba(0, 102, 51, 0.25);
  cursor: pointer;
  border: none;
  text-decoration: none;
}

.ftc-btn-success:hover {
  background-color: #004d26;
}

.ftc-btn-sm {
  min-height: 44px !important;
  padding: 8px 16px !important;
  font-size: 0.9375rem !important;
}

/* ==========================================================================
   Global Form Field Controls (USWDS Standard - Senior Legible)
   ========================================================================== */
.ftc-form-group {
  margin-bottom: 20px;
}

.ftc-label {
  display: block;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 8px;
}

.ftc-input,
.ftc-select,
.ftc-textarea {
  width: 100%;
  min-height: 54px;
  padding: 12px 16px;
  border-radius: 8px;
  border: 2px solid #475569;
  background-color: #ffffff;
  color: var(--ftc-text-main);
  font-size: 1.125rem;
  line-height: 1.5;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.ftc-textarea {
  min-height: 120px;
  padding: 14px 16px;
}

.ftc-input:focus,
.ftc-select:focus,
.ftc-textarea:focus {
  border-color: var(--gov-blue-500) !important;
  outline: none;
  box-shadow: 0 0 0 4px rgba(0, 94, 162, 0.25);
}

.ftc-input::placeholder,
.ftc-textarea::placeholder {
  color: #64748b;
  font-size: 1rem;
}

.ftc-help-text {
  display: block;
  font-size: 0.9375rem;
  color: #475569;
  margin-top: 6px;
  font-weight: 500;
}

/* Custom Large Checkbox & Radio Controls */
.ftc-checkbox,
.ftc-radio {
  width: 24px;
  height: 24px;
  border: 2px solid #475569;
  border-radius: 6px;
  cursor: pointer;
  flex-shrink: 0;
}

.ftc-checkbox:checked,
.ftc-radio:checked {
  background-color: var(--gov-blue-500);
  border-color: var(--gov-blue-500);
}

/* ==========================================================================
   Global Badges & Indicators
   ========================================================================== */
.ftc-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 9999px;
  font-size: 0.875rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.ftc-badge-critical {
  background-color: #fee2e2;
  color: #991b1b;
  border: 1.5px solid #f87171;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.ftc-badge-high {
  background-color: #fef3c7;
  color: #92400e;
  border: 1.5px solid #fcd34d;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.ftc-badge-medium {
  background-color: #e0f2fe;
  color: #0369a1;
  border: 1.5px solid #7dd3fc;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.ftc-badge-open {
  background-color: #fef3c7;
  color: #92400e;
  border: 1.5px solid #fcd34d;
}

.ftc-badge-closed {
  background-color: #dcfce7;
  color: #166534;
  border: 1.5px solid #86efac;
}

.ftc-badge-officer {
  background-color: #e0f2fe;
  color: #0369a1;
  border: 1.5px solid #7dd3fc;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.ftc-badge-director {
  background-color: #fee2e2;
  color: #991b1b;
  border: 1.5px solid #f87171;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

/* ==========================================================================
   Navigation Bar & Links
   ========================================================================== */
.ftc-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
  transition: all 0.15s ease-in-out;
  text-decoration: none;
}

.ftc-nav-link:hover {
  color: var(--gov-blue-500);
  background-color: #e2e8f0;
}

.ftc-nav-link.active {
  background-color: var(--gov-blue-500) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 4px rgba(0, 94, 162, 0.25);
}

.ftc-nav-link.active i,
.ftc-nav-link.active svg {
  color: #ffffff !important;
}

/* ==========================================================================
   Wizard Step Indicator (USWDS Standard - Senior Legible)
   ========================================================================== */
.ftc-step-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1rem;
  font-weight: 700;
  color: #475569;
}

.ftc-step-item.active {
  color: var(--gov-blue-500);
  font-weight: 800;
}

.ftc-step-item.completed {
  color: var(--gov-emerald-700);
}

.ftc-step-number {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9375rem;
  font-weight: 800;
  background-color: #e2e8f0;
  color: #334155;
  border: 2px solid #cbd5e1;
}

.ftc-step-item.active .ftc-step-number {
  background-color: var(--gov-blue-500);
  color: #ffffff;
  border-color: var(--gov-blue-500);
}

.ftc-step-item.completed .ftc-step-number {
  background-color: var(--gov-emerald-700);
  color: #ffffff;
  border-color: var(--gov-emerald-700);
}

/* ==========================================================================
   Standard Table System
   ========================================================================== */
.ftc-table-container {
  overflow-x: auto;
  border-radius: 8px;
  border: 2px solid #cbd5e1;
  background-color: #ffffff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.ftc-table {
  width: 100%;
  text-align: left;
  font-size: 0.9375rem;
  color: #0f172a;
}

.ftc-table thead {
  background-color: #f1f5f9;
  color: #0c2340;
  text-transform: uppercase;
  font-size: 0.8125rem;
  font-weight: 800;
  border-bottom: 2px solid #cbd5e1;
}

.ftc-table th,
.ftc-table td {
  padding: 16px 20px;
}

.ftc-table tbody tr {
  border-bottom: 1px solid #e2e8f0;
  transition: background-color 0.15s ease-in-out;
}

.ftc-table tbody tr:hover {
  background-color: #f8fafc;
}

/* ==========================================================================
   Modals & Overlays (Unified Dialog System)
   ========================================================================== */
.ftc-modal-backdrop {
  position: fixed;
  inset: 0;
  background-color: rgba(12, 35, 64, 0.75);
  backdrop-filter: blur(4px);
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

.ftc-modal-dialog {
  background-color: #ffffff;
  border-radius: 12px;
  padding: 28px;
  width: 100%;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.35);
  border: 2px solid #cbd5e1;
}

.ftc-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid #e2e8f0;
  padding-bottom: 16px;
  margin-bottom: 20px;
}

.ftc-modal-header h3 {
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--gov-navy-900);
  display: flex;
  align-items: center;
  gap: 10px;
}

.ftc-modal-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ftc-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 14px;
  border-top: 2px solid #e2e8f0;
  padding-top: 20px;
  margin-top: 20px;
}

/* ==========================================================================
   Scrollbar & Print Styles
   ========================================================================== */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #94a3b8;
  border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

@media print {
  header, nav, footer, .no-print, #step-indicator-bar, #btn-step1-next, #btn-step2-next, #btn-step2-back, #btn-step3-back, #submit-intake-btn, #btn-copy-docket, #docket-logout-btn, #evidence-form {
    display: none !important;
  }
  body {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 12pt !important;
    line-height: 1.4 !important;
  }
  .ftc-card {
    border: 1px solid #000000 !important;
    box-shadow: none !important;
    break-inside: avoid;
    padding: 16px !important;
    margin-bottom: 16px !important;
  }
  .ftc-alert {
    border: 1px solid #000000 !important;
    color: #000000 !important;
    background: #f4f4f4 !important;
  }
  .print-header {
    display: block !important;
    margin-bottom: 20px;
    border-bottom: 2px solid #000000;
    padding-bottom: 10px;
  }
}