/* ==========================================================================
   SKILLPATH ACADEMY CORE — UNIFIED STYLESHEET (PUBLIC + ADMISSIONS + PORTAL + PRINT)
   ========================================================================== */

/* Import base TT4 styles */
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --purple: #2e1b70;
  --purple-deep: #21164b;
  --purple-about: #292064;
  --blue: #0093cf;
  --blue-a11y: #0074a6;
  --gold: #f9c600;
  --gold-soft: #ffd64b;
  --ink: #25233a;
  --body-text: #555365;
  --surface: #f5f5f8;
  --surface-alt: #f8f7fc;
  --border-soft: #e4e0ef;
}

/* Form, Slip, CBT & Portal Styles */
.sia-workspace { max-width: 1000px; margin: 0 auto; }
.sia-workspace form.sia-card-form { background: #f5f5f8; padding: 28px; border-radius: 6px; border-top: 4px solid var(--gold); }
.sia-hint { background: #fff7d6; color: #604c00; padding: 12px 16px; border-radius: 4px; font-size: 14px; margin: 12px 0; }
.sia-alert { padding: 14px 18px; border-radius: 6px; margin-bottom: 18px; font-size: 14px; font-weight: 500; }
.sia-alert-error { background: #fdebed; color: #8c1d2c; border: 1px solid #f5c2c7; }
.sia-alert-success { background: #eaf8f3; color: #0f5132; border: 1px solid #b4d7c9; }
.sia-alert-info { background: #fff8dc; color: #5c4500; border: 1px solid #ebcd73; }

.sia-form-step { display: flex; align-items: center; gap: 12px; margin: 28px 0 18px; padding-bottom: 12px; border-bottom: 1px solid #ddd6eb; }
.sia-form-step span { font-size: 13px; font-weight: 700; color: var(--purple); border-radius: 50%; background: #e8e2f7; width: 34px; height: 34px; display: grid; place-items: center; flex-shrink: 0; }
.sia-form-step h3 { font-size: 21px !important; margin: 0 !important; color: var(--ink) !important; }

.sia-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
.sia-workspace label, .sia-auth-form label { display: block; font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 14px; }
.sia-workspace input:not([type=checkbox]):not([type=radio]),
.sia-workspace select,
.sia-workspace textarea,
.sia-auth-form input:not([type=radio]):not([type=checkbox]),
.sia-auth-form select {
  display: block; width: 100%; padding: 11px 13px; border: 1px solid #ccc7d9; border-radius: 6px;
  background: #ffffff; color: var(--ink); font: inherit; font-size: 14px; margin-top: 6px; box-sizing: border-box;
}
.sia-inline-check { display: flex !important; align-items: flex-start; gap: 10px; font-weight: 500 !important; cursor: pointer; }
.sia-inline-check input { width: auto !important; margin-top: 6px !important; }
.sia-passport-upload { display: flex; gap: 24px; align-items: center; margin: 14px 0; }
.sia-passport-upload > div { flex: 1; }
.sia-passport-upload img { width: 100px; height: 120px; object-fit: cover; border: 1px solid #ccc; border-radius: 4px; }
.sia-hp { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }

/* Auth / Portal Form Controls inside .sia-auth-panel */
.sia-account-choice { display: flex; border: 0; gap: 12px; padding: 0; margin: 0 0 20px; }
.sia-account-choice legend { font-size: 13px; font-weight: 700; margin-bottom: 8px; color: var(--ink); }
.sia-account-choice label { flex: 1; cursor: pointer; margin: 0; }
.sia-account-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sia-account-choice span { display: block; text-align: center; border: 1px solid #dcd6ec; border-radius: 8px; padding: 11px; font-size: 14px; font-weight: 700; color: var(--purple); background: #fbfafc; }
.sia-account-choice input:checked + span { background: var(--purple); color: #ffffff; border-color: var(--purple); }

.sia-password-wrap { position: relative; }
.sia-password-wrap input { padding-right: 62px !important; }
.sia-password-toggle { position: absolute; right: 9px; top: 7px; bottom: 7px; border: 0; background: transparent !important; color: var(--purple) !important; font-size: 12px; cursor: pointer; font-weight: 700; padding: 0 8px !important; }

.sia-submit-btn {
  display: inline-block; border: 0; border-radius: 8px; padding: 14px 24px;
  background: var(--purple) !important; color: #ffffff !important; font-size: 15px; font-weight: 700;
  cursor: pointer; text-decoration: none; transition: background 0.2s ease;
}
.sia-submit-btn.is-full { width: 100%; text-align: center; margin-top: 10px; }
.sia-submit-btn.is-gold { background: var(--gold) !important; color: var(--purple) !important; }
.sia-submit-btn:hover { filter: brightness(0.95); }

.sia-auth-help { font-size: 12.5px !important; line-height: 1.65 !important; color: #6b657a !important; margin: 14px 0 !important; }
.sia-auth-links { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 1px solid #eee9f6; padding-top: 16px; margin-top: 16px; }
.sia-auth-links a { color: var(--purple) !important; font-size: 12.5px; font-weight: 700; text-decoration: none; }

/* Printable A4 Admission Photo Slip (.sia-photo-slip) */
.sia-photo-slip { max-width: 900px; margin: 0 auto; padding: 32px; background: #ffffff; border: 2px solid var(--purple); color: var(--ink); border-radius: 4px; }
.sia-slip-header { display: grid; grid-template-columns: 90px 1fr 100px; gap: 20px; align-items: center; text-align: center; border-bottom: 2px solid var(--purple); padding-bottom: 20px; }
.sia-slip-logo { width: 86px; height: 86px; object-fit: contain; }
.sia-slip-passport { width: 100px; height: 120px; object-fit: cover; border: 1px solid #ccc; }
.sia-slip-header h2 { font-size: 23px !important; color: var(--purple) !important; margin: 0 0 6px !important; }
.sia-slip-header p { font-size: 13px !important; margin: 3px 0 !important; color: var(--ink) !important; }
.sia-slip-ref { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 14px 0; font-size: 13px; border-bottom: 1px solid #ddd; }
.sia-slip-section { margin-top: 18px; }
.sia-slip-section h4 { font-size: 14px !important; color: var(--purple) !important; background: #f4f1f9; padding: 8px 12px; margin: 0 0 8px !important; }
.sia-slip-dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; margin: 0; }
.sia-slip-dl > div { display: grid; grid-template-columns: 42% 58%; gap: 8px; padding: 6px 0; border-bottom: 1px solid #eee; font-size: 12.5px; }
.sia-slip-dl dt { font-weight: 700; }
.sia-slip-dl dd { margin: 0; overflow-wrap: anywhere; }

/* Timed CBT Exam Arena */
.sia-cbt-arena { background: #ffffff; color: var(--ink); padding: 28px; border-radius: 12px; }
.sia-cbt-topbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; background: var(--purple); color: #ffffff; padding: 14px 20px; border-radius: 8px; margin-bottom: 22px; }
.sia-cbt-timer { background: var(--gold); color: var(--purple); font-weight: 800; font-size: 18px; padding: 6px 14px; border-radius: 6px; font-variant-numeric: tabular-nums; }
.sia-cbt-palette { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.sia-cbt-qbtn { width: 36px; height: 36px; border: 1px solid #ccc7d9; background: #f8f7fc; color: var(--purple); font-weight: 700; border-radius: 6px; cursor: pointer; }
.sia-cbt-qbtn.is-current { border: 2px solid var(--blue); box-shadow: 0 0 0 2px rgba(0,147,207,0.2); }
.sia-cbt-qbtn.is-answered { background: var(--purple); color: #ffffff; border-color: var(--purple); }
.sia-cbt-question { display: none; padding: 20px; background: #f8f7fc; border: 1px solid #e4e0ef; border-radius: 10px; margin-bottom: 18px; }
.sia-cbt-question.is-active { display: block; }
.sia-cbt-opt { display: flex !important; align-items: center; gap: 10px; padding: 11px 14px; background: #ffffff; border: 1px solid #dcd6ec; border-radius: 8px; margin-bottom: 10px !important; cursor: pointer; font-weight: 500 !important; }
.sia-cbt-opt:hover { border-color: var(--purple); }

/* Printable A4 Terminal Report Sheet (.sia-terminal-report) */
.sia-terminal-report { background: #ffffff; border: 2px solid var(--purple); padding: 28px; color: #232039; max-width: 1050px; margin: 20px auto; border-radius: 4px; }
.sia-report-head { display: grid; grid-template-columns: 84px 1fr 90px; gap: 16px; align-items: center; text-align: center; border-bottom: 3px solid var(--purple); padding-bottom: 16px; margin-bottom: 14px; }
.sia-report-head h2 { color: var(--purple) !important; font-size: 24px !important; margin: 0 0 4px !important; }
.sia-report-head p { font-size: 12px !important; margin: 2px 0 !important; color: #232039 !important; }
.sia-report-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 14px 0; font-size: 12px; }
.sia-report-meta > div { border: 1px solid #ddd6e8; padding: 10px 12px; background: #faf9fc; }
.sia-score-table { width: 100%; border-collapse: collapse; margin: 14px 0; font-size: 12.5px; }
.sia-score-table th, .sia-score-table td { border: 1px solid #c7c0d3; padding: 8px 10px; text-align: center; }
.sia-score-table th:first-child, .sia-score-table td:first-child { text-align: left; font-weight: 600; }
.sia-score-table thead th { background: #eeeaf6; color: var(--purple); font-weight: 700; }
.sia-report-remarks { border-top: 2px solid #d6cde7; padding-top: 12px; margin-top: 16px; font-size: 13px; }
.sia-status-badge { display: inline-block; padding: 4px 10px; border-radius: 99px; font-size: 12px; font-weight: 700; text-transform: uppercase; }
.sia-status-admitted { background: #d1fae5; color: #065f46; }
.sia-status-cbt_scheduled { background: #dbeafe; color: #1e40af; }
.sia-status-pending { background: #fef3c7; color: #92400e; }
.sia-status-declined { background: #fee2e2; color: #991b1b; }

@media (max-width: 720px) {
  .sia-field-grid, .sia-slip-dl, .sia-report-meta { grid-template-columns: 1fr; }
  .sia-slip-header, .sia-report-head { grid-template-columns: 60px 1fr 65px; gap: 10px; }
}

@media print {
  header, footer, nav, .wp-site-blocks > header, .wp-site-blocks > footer, .sia-no-print, .sia-auth-story { display: none !important; }
  .sia-auth-section { background: #ffffff !important; padding: 0 !important; min-height: 0 !important; }
  .sia-auth-section .wp-block-cover__background, .sia-auth-section > img { display: none !important; }
  .sia-auth-panel { box-shadow: none !important; padding: 0 !important; }
  .wp-block-column { flex-basis: 100% !important; max-width: 100% !important; }
  .sia-photo-slip, .sia-terminal-report { border: 1px solid #333 !important; margin: 0 !important; max-width: none !important; }
}
.sia-cbt-save-status{font-size:.82rem;color:#46536a;margin:.4rem 0 1rem;min-height:1.2em}.sia-cbt-question .sia-cbt-opt input:focus-visible{outline:3px solid #7c3aed;outline-offset:2px}
.sia-application-review-form{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}.sia-application-review-form select{min-width:10rem;max-width:100%}.sia-application-review-form input{width:8rem;max-width:100%}

@media (max-width:720px) {
  .sia-workspace { width:100%; min-width:0; }
  .sia-workspace form.sia-card-form { padding:20px 16px; }
  .sia-account-choice { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; }
  .sia-account-choice span { padding:10px 6px; font-size:13px; }
  .sia-photo-slip,
  .sia-terminal-report { max-width:100%; padding:18px 14px; margin:12px auto; }
  .sia-slip-header,
  .sia-report-head { grid-template-columns:52px minmax(0,1fr) 58px; gap:8px; }
  .sia-slip-logo { width:48px; height:48px; }
  .sia-slip-passport { width:58px; height:72px; }
  .sia-report-meta { grid-template-columns:1fr; }
  .sia-score-table { display:block; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .sia-cbt-arena { padding:14px; }
  .sia-cbt-question { padding:14px; }
  .sia-cbt-topbar { align-items:flex-start; padding:12px; }
  .sia-passport-upload { align-items:flex-start; gap:14px; }
  .sia-auth-links { flex-direction:column; align-items:flex-start; }
}

@media (max-width:380px) {
  .sia-workspace form.sia-card-form { padding:16px 12px; }
  .sia-slip-header h2,
  .sia-report-head h2 { font-size:18px !important; }
  .sia-cbt-arena { padding:10px; }
}
