/*
 * SPEDGenie™ — Readability Override
 * Global accessibility pass for educators aged 30–65
 * Optimizes for district laptops, older monitors, after-school use
 * Inject into every page: <link rel="stylesheet" href="/readability.css">
 */

/* ── BASE BODY ─────────────────────────────────────────────────── */
body {
  font-size: 16px;
  line-height: 1.75;
}

/* ── NAVIGATION ────────────────────────────────────────────────── */
nav, .nav, header nav {
  height: auto !important;
  min-height: 60px;
  padding: 0 24px;
}

.nav-link, .nav-btn, nav a, nav button {
  font-size: 14px !important;
  padding: 8px 14px !important;
  line-height: 1.4 !important;
}

/* ── FORM LABELS ───────────────────────────────────────────────── */
.field-label,
label.field-label,
label[style],
.pf-label,
.snap-label,
.card-sub,
.section-label,
.sb-label {
  font-size: 13px !important;
  letter-spacing: 0.3px !important;
}

/* ── INPUT FIELDS ──────────────────────────────────────────────── */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
textarea,
select,
.inp,
.field-input,
.pilot-input {
  font-size: 16px !important;
  padding: 12px 14px !important;
  line-height: 1.5 !important;
  min-height: 48px !important;
  border-radius: 10px !important;
}

textarea, textarea.inp, textarea.field-textarea {
  min-height: 96px !important;
  font-size: 16px !important;
  padding: 12px 14px !important;
  line-height: 1.7 !important;
}

/* ── SELECT DROPDOWNS ──────────────────────────────────────────── */
select, select.inp {
  min-height: 48px !important;
  font-size: 16px !important;
  padding: 12px 14px !important;
  cursor: pointer !important;
}

/* ── CHECKBOXES & RADIOS ───────────────────────────────────────── */
input[type="checkbox"],
input[type="radio"] {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  cursor: pointer !important;
  accent-color: #0d9488 !important;
}

/* ── BUTTONS ───────────────────────────────────────────────────── */
button, .btn, .gen-btn,
.btn-primary, .btn-secondary, .btn-outline,
.pilot-submit-btn, .print-btn, .quiz-btn,
input[type="submit"], input[type="button"] {
  font-size: 15px !important;
  padding: 12px 22px !important;
  min-height: 48px !important;
  line-height: 1.4 !important;
  border-radius: 10px !important;
  cursor: pointer !important;
}

/* Small/secondary buttons keep a bit smaller but still readable */
.btn-sm, button.btn-sm, .btn-copy {
  font-size: 13px !important;
  padding: 9px 16px !important;
  min-height: 40px !important;
}

/* Nav/icon-only buttons — don't inflate */
.nav-reset, .print-btn {
  font-size: 13px !important;
  padding: 8px 16px !important;
  min-height: 38px !important;
}

/* ── BODY TEXT ─────────────────────────────────────────────────── */
p, li, td, th,
.card-text, .card-sub,
.engine-tagline, .engine-feature,
.wf-step-sub, .section-sub,
.arch-sub, .who-use,
.training-detail .td-text,
.snap-chip, .snap-field,
.pchip, .profile-field,
.log-text, .data-log {
  font-size: 15px !important;
  line-height: 1.8 !important;
}

/* Card titles */
.card-title, .engine-name, .who-name,
.module-name, .tc-title, .data-card-title {
  font-size: 15px !important;
}

/* Section titles and headers */
.section-title, h2 {
  line-height: 1.25 !important;
}

/* ── CHIP/BADGE TEXT ───────────────────────────────────────────── */
.chip, .snap-chip, .hf, .feat-pill,
.review-chip, .pchip, .vocab-chip,
.interest-chip {
  font-size: 13px !important;
  padding: 5px 12px !important;
}

/* ── SIDEBAR NAV ───────────────────────────────────────────────── */
.sb-item {
  font-size: 14px !important;
  padding: 11px 16px !important;
  min-height: 44px !important;
}

/* ── TABLE TEXT ────────────────────────────────────────────────── */
.data-table td, .data-table th {
  font-size: 14px !important;
  padding: 12px 14px !important;
}

/* ── FORM FIELD SPACING ────────────────────────────────────────── */
.field-label, label.field-label {
  margin-bottom: 6px !important;
  display: block !important;
}

.field-input, .inp, input, select, textarea {
  margin-bottom: 16px !important;
}

/* ── OUTPUT TEXT IN CARDS ──────────────────────────────────────── */
.chunk-body, .goal-text, .review-text,
.snap-notes, #snap-notes,
.td-text, .pl-desc, .pl-example,
.accomm-section-content, .mistake-text {
  font-size: 15px !important;
  line-height: 1.85 !important;
}

/* ── TOAST ─────────────────────────────────────────────────────── */
.toast {
  font-size: 14px !important;
  padding: 12px 20px !important;
}

/* ── LOADING MESSAGES ──────────────────────────────────────────── */
.loading-msg, #loading-msg {
  font-size: 13px !important;
}

/* ── SECTION VERTICAL SPACING ──────────────────────────────────── */
/* Every section gets at least 64px top/bottom */
.section {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.card-body {
  padding: 20px 22px !important;
}

.card-hdr {
  padding: 16px 22px !important;
}

/* ── PROMPT LEVEL ITEMS ─────────────────────────────────────────── */
.prompt-level {
  padding: 16px 18px !important;
  gap: 16px !important;
}

.pl-name {
  font-size: 15px !important;
  font-weight: 800 !important;
}

/* ── RESPONSIVE SAFETY NET ──────────────────────────────────────── */
@media (max-width: 768px) {
  body { font-size: 16px; }
  input, select, textarea, .inp { font-size: 16px !important; } /* prevent iOS zoom */
  .nav-link, .nav-btn { font-size: 13px !important; }
}

/* ── FOCUS RINGS — accessibility ────────────────────────────────── */
input:focus, select:focus, textarea:focus, button:focus {
  outline: 2px solid #0d9488 !important;
  outline-offset: 2px !important;
}