/*
 * Prodigy Training - student-facing styles for the [prodigy_training] page.
 *
 * Palette and control treatment match the practitioner portal
 * (prodigy-portal-supabase.php): every color is a Prodigy theme token (cards on
 * var(--surface), var(--heading) headings, var(--accent) pill buttons) with the
 * old literal as the fallback. Every button and summary sets text-transform:none
 * explicitly because the previous theme force-uppercased.
 */

.pt-app {margin:0;}
.pt-app .pt-panel {color:var(--fg,inherit);border:1px solid var(--line,#ececec);border-radius:8px;background:var(--surface,#fff);padding:22px;box-sizing:border-box;margin:0 0 18px;}
.pt-app h2 {color:var(--heading,#4c255f);margin:0 0 10px;}
.pt-app h3 {color:var(--heading,#4c255f);margin:0 0 14px;}
.pt-app h4 {color:var(--heading,#4c255f);margin:0 0 8px;}
.pt-app .pt-auth-panel {max-width:520px;}
.pt-app .pt-sub {color:var(--fg-2,#66706f);font-size:.96em;line-height:1.55;margin:0 0 18px;}
.pt-app .pt-small {font-size:.92em;color:var(--fg-2,#555);}
.pt-app .pt-msg {display:none;border-left:4px solid var(--accent,#00a38d);background:var(--surface-2,#e5f3f3);padding:12px 14px;margin:0 0 18px;}
.pt-app .pt-msg.pt-show {display:block;}
.pt-app .pt-msg.pt-error {border-left-color:#b3443e;background:var(--surface-2,#fbeeed);}
.pt-app .pt-field {margin:0 0 14px;}
.pt-app .pt-label-text {display:block;font-weight:700;margin:0 0 5px;}
.pt-app input[type="text"],
.pt-app input[type="email"],
.pt-app input[type="password"] {width:100%;height:38px;padding:7px 10px;box-sizing:border-box;border:1px solid var(--line-2,#d8d8d8);border-radius:4px;background:var(--surface,#fff);}
.pt-app input[type="file"] {font-size:.92em;}
.pt-app .pt-button {display:inline-flex;font-family:var(--f-body,inherit);align-items:center;justify-content:center;height:auto;min-height:48px;background:var(--accent,#00a38d);color:var(--accent-ink,#fff);border:0;border-radius:var(--radius-btn,4px);padding:0 24px;font-weight:var(--w-body-strong,700);font-size:1rem;line-height:1;cursor:pointer;text-decoration:none;text-transform:none;letter-spacing:normal;box-sizing:border-box;}
.pt-app .pt-button:hover,
.pt-app .pt-button:focus {background:var(--accent,#008976);color:var(--accent-ink,#ffffff);text-decoration:none;}
.pt-app .pt-button-secondary {background:var(--glass,#fff);color:var(--heading,#00a38d);border:1px solid var(--line-2,#00a38d);}
.pt-app .pt-button-secondary:hover,
.pt-app .pt-button-secondary:focus {background:var(--surface-2,#f2faf9);color:var(--heading,#008976);border-color:var(--accent-2,#008976);}
.pt-app button[disabled] {opacity:.6;cursor:default;}
.pt-app .pt-actions {display:flex;gap:10px;flex-wrap:wrap;margin:0;}
.pt-app .pt-link-button {background:transparent;border:0;padding:0;color:var(--link,#00a38d);font-weight:700;cursor:pointer;text-transform:none;letter-spacing:normal;}
.pt-app .pt-link-button:hover,
.pt-app .pt-link-button:focus {color:var(--link-hover,#008976);text-decoration:underline;}
.pt-app .pt-links {display:flex;gap:18px;flex-wrap:wrap;margin:16px 0 0;}
.pt-app .pt-divider {display:flex;align-items:center;gap:10px;color:var(--fg-2,#777);margin:18px 0;}
.pt-app .pt-divider:before,
.pt-app .pt-divider:after {content:"";flex:1;height:1px;background:var(--line,#e4e4e4);}

/* Auth card (portal conventions). Apple ALWAYS renders before Google. */
.pt-app .pt-oauth {display:flex;flex-direction:column;gap:10px;margin:0;}
.pt-app .pt-oauth-button {display:inline-flex;font-family:var(--f-body,inherit);align-items:center;justify-content:center;width:100%;height:auto;min-height:48px;padding:0 24px;border-radius:var(--radius-btn,4px);font-weight:var(--w-body-strong,700);font-size:1rem;line-height:1;cursor:pointer;box-sizing:border-box;text-transform:none;letter-spacing:normal;}
.pt-app .pt-oauth-apple {background:#111111;border:1px solid #111111;color:#ffffff;}
.pt-app .pt-oauth-apple:hover,
.pt-app .pt-oauth-apple:focus {background:#000000;border-color:#000000;color:#ffffff;}
.pt-app .pt-oauth-google {background:#ffffff;border:1px solid #d8d8d8;color:#3c4043;}
.pt-app .pt-oauth-google:hover,
.pt-app .pt-oauth-google:focus {background:#f7f7f7;border-color:#c8c8c8;color:#3c4043;}
.pt-app .pt-apple-logo {width:14px;height:17px;margin:-2px 8px 0 0;flex:0 0 auto;vertical-align:middle;}
.pt-app .pt-tabs {display:flex;margin:0 0 14px;}
.pt-app .pt-tab {flex:1 1 0;font-family:var(--f-body,inherit);display:inline-flex;align-items:center;justify-content:center;height:auto;min-height:48px;padding:0 10px;border:1px solid var(--line-2,#d5e8e6);border-radius:0;background:var(--surface,#fff);color:var(--heading,#00a38d);font-weight:var(--w-body-strong,700);font-size:1rem;line-height:1;cursor:pointer;box-sizing:border-box;text-transform:none;letter-spacing:normal;}
.pt-app .pt-tab + .pt-tab {margin-left:-1px;}
.pt-app .pt-tab:first-child {border-radius:var(--radius-btn,4px) 0 0 var(--radius-btn,4px);}
.pt-app .pt-tab:last-child {border-radius:0 var(--radius-btn,4px) var(--radius-btn,4px) 0;}
.pt-app .pt-tab.pt-tab-active {position:relative;z-index:1;background:var(--accent,#00a38d);border-color:var(--accent,#00a38d);color:var(--accent-ink,#fff);}
.pt-app .pt-sr-only {position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;}
.pt-app .pt-field-hint {color:var(--fg-2,#66706f);font-size:.9em;line-height:1.4;margin:-8px 0 14px;}

/* Buy screen. */
.pt-app .pt-price-row {display:flex;gap:14px;flex-wrap:wrap;margin:16px 0 0;}
.pt-app .pt-price-card {flex:1 1 220px;border:1px solid var(--line,#d9eee9);background:var(--surface-2,#f7fcfb);border-radius:8px;padding:16px 18px;box-sizing:border-box;}
.pt-app .pt-price-card strong {display:block;color:var(--heading,#4c255f);font-size:1.2em;margin:0 0 4px;}
.pt-app .pt-price-card p {margin:0 0 12px;color:var(--fg-2,#555);font-size:.92em;}
.pt-app .pt-facts {margin:0 0 6px;padding:0 0 0 20px;}
.pt-app .pt-facts li {margin:0 0 7px;line-height:1.45;}

/* Dashboard lists. */
.pt-app .pt-rows {margin:0;padding:0;list-style:none;}
.pt-app .pt-row {display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;border:1px solid var(--line,#ececec);border-radius:6px;padding:12px 14px;margin:0 0 8px;background:var(--surface,#fff);}
.pt-app .pt-row-main {flex:1 1 260px;min-width:0;}
.pt-app .pt-row-title {display:block;color:var(--heading,#4c255f);font-weight:700;overflow-wrap:anywhere;}
.pt-app .pt-row-meta {display:block;color:var(--fg-2,#66706f);font-size:.88em;margin:3px 0 0;}
.pt-app .pt-row-locked {background:var(--surface-2,#fafafa);}
.pt-app .pt-row-locked .pt-row-title {color:var(--fg-2,#8b8f98);}
.pt-app .pt-badge {display:inline-block;border-radius:10px;padding:3px 10px;font-size:.8em;font-weight:700;white-space:nowrap;text-transform:none;letter-spacing:normal;}
.pt-app .pt-badge-passed {background:var(--surface-2,#e5f3f3);color:var(--label,#00806f);}
.pt-app .pt-badge-open {background:var(--surface-2,#f3f0f6);color:var(--heading,#4c255f);}
.pt-app .pt-badge-locked {background:var(--surface-2,#f0f0f0);color:var(--fg-2,#777);}
.pt-app .pt-badge-pending {background:var(--surface-2,#fdf4e3);color:var(--fg-2,#8a6116);}
.pt-app .pt-badge-returned {background:var(--surface-2,#fbeeed);color:#b3443e;color:color-mix(in srgb,#b3443e 65%,var(--fg,#b3443e));}
.pt-app .pt-back {margin:0 0 14px;}

/* Lessons. */
.pt-app .pt-lesson {border:1px solid var(--line,#ececec);border-radius:8px;background:var(--surface,#fff);padding:18px 20px;margin:0 0 14px;}
.pt-app .pt-lesson h4 {margin:0 0 10px;}
.pt-app .pt-video {position:relative;padding-top:56.25%;margin:0 0 14px;background:var(--surface-2,#f4f4f4);border-radius:6px;overflow:hidden;}
.pt-app .pt-video iframe {position:absolute;inset:0;width:100%;height:100%;border:0;}
.pt-app .pt-video-soon {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--fg-2,#66706f);font-size:.94em;}
.pt-app .pt-prose p {margin:0 0 12px;line-height:1.6;}
.pt-app .pt-prose .pt-h {margin:18px 0 8px;line-height:1.3;font-weight:600;color:var(--heading,#4c255f);}
.pt-app .pt-prose .pt-h:first-child {margin-top:0;}
.pt-app .pt-prose h4.pt-h {font-size:1.06em;}
.pt-app .pt-prose h5.pt-h {font-size:0.99em;}
.pt-app .pt-prose h6.pt-h {font-size:0.93em;opacity:0.88;}
.pt-app .pt-prose ul.pt-ul,.pt-app .pt-prose ol.pt-ol {margin:0 0 12px;padding-left:22px;line-height:1.6;}
.pt-app .pt-prose li {margin:0 0 6px;}
.pt-app .pt-prose strong {font-weight:600;}
.pt-app .pt-lesson-foot {display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:6px 0 0;}

/* Quiz. */
.pt-app .pt-question {border:1px solid var(--line,#ececec);border-radius:8px;background:var(--surface,#fff);padding:14px 16px;margin:0 0 12px;}
.pt-app .pt-question.pt-question-wrong {border-color:#b3443e;background:var(--surface-2,#fdf7f7);}
.pt-app .pt-question-text {font-weight:700;color:var(--fg,#333);margin:0 0 10px;line-height:1.45;}
.pt-app .pt-choice {display:flex;gap:9px;align-items:flex-start;margin:0 0 8px;font-weight:400;line-height:1.4;cursor:pointer;}
.pt-app .pt-choice input {margin:3px 0 0;flex:0 0 auto;}
.pt-app .pt-wrong-note {color:#b3443e;color:color-mix(in srgb,#b3443e 65%,var(--fg,#b3443e));font-size:.88em;font-weight:700;margin:8px 0 0;}

/* Practicum. */
.pt-app .pt-progress {margin:0 0 16px;}
.pt-app .pt-progress-track {display:flex;height:12px;background:var(--surface-2,#eef0ef);border-radius:999px;overflow:hidden;}
.pt-app .pt-progress-fill {height:100%;transition:width .3s ease;}
.pt-app .pt-progress-accepted {background:var(--accent,#00a38d);}
.pt-app .pt-progress-submitted {background:var(--accent-2,#9ad6cd);}
.pt-app .pt-progress-label {margin:7px 0 0;font-size:.9em;font-weight:600;color:var(--heading,#4c255f);}
.pt-app .pt-form-title {margin:0 0 12px;color:var(--heading,#4c255f);}
.pt-app .pt-session-row {border:1px solid var(--line,#ececec);border-radius:8px;background:var(--surface,#fff);padding:12px 15px;margin:0 0 10px;}
.pt-app .pt-session-row:last-child {margin-bottom:0;}
/* Sign-in modal (jamie 2026-07-20): the auth form opens over the landing
   instead of dropping in below the pricing. */
.pt-app .pt-modal-backdrop {position:fixed;inset:0;background:rgba(20,16,25,0.55);display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px 24px;z-index:99999;overflow-y:auto;}
/* The Prodigy theme isolates each .band; the band holding an open modal rises above the sticky header. */
.band:has(.pt-modal-backdrop) {z-index:100000;}
.pt-app .pt-modal-card {position:relative;max-width:480px;width:100%;margin:auto;box-shadow:0 20px 60px rgba(0,0,0,0.35);}
.pt-app .pt-modal-close {position:absolute;top:8px;right:12px;background:transparent;border:0;font-size:26px;line-height:1;color:var(--fg-2,#66706f);cursor:pointer;padding:4px 8px;}
.pt-app .pt-modal-close:hover,.pt-app .pt-modal-close:focus {color:var(--heading,#4c255f);}
.pt-app .pt-tally {display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px;}
.pt-app .pt-tally-chip {border:1px solid var(--line,#d9eee9);background:var(--surface-2,#f7fcfb);border-radius:8px;padding:9px 13px;font-size:.9em;color:var(--fg,#333);}
.pt-app .pt-tally-chip strong {color:var(--heading,#4c255f);}
.pt-app .pt-slot {border:1px solid var(--line,#ececec);border-radius:8px;background:var(--surface,#fff);padding:14px 16px;margin:0 0 10px;}
.pt-app .pt-slot-head {display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.pt-app .pt-slot-title {color:var(--heading,#4c255f);font-weight:700;}
.pt-app .pt-slot-note {border-left:4px solid #b3443e;background:var(--surface-2,#fbeeed);padding:10px 12px;margin:10px 0 0;font-size:.92em;line-height:1.5;white-space:pre-wrap;}
.pt-app .pt-upload-form {display:flex;flex-direction:column;gap:10px;margin:12px 0 0;}
.pt-app .pt-session-type {display:flex;gap:18px;flex-wrap:wrap;}
.pt-app .pt-check {display:flex;gap:9px;align-items:center;font-weight:400;cursor:pointer;}
.pt-app .pt-check input {margin:0;}

@media (max-width: 720px) {
    .pt-app .pt-row {flex-direction:column;align-items:flex-start;}
}

/* Collapsible lessons (jamie, 2026-07-19): header row is a real button,
   chevron flips with the open state, body hides when collapsed. */
.pt-app .pt-lesson-head {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	background: none;
	border: none;
	padding: 4px 0;
	cursor: pointer;
	text-align: left;
	text-transform: none;
}
.pt-app .pt-lesson-head h4 { margin: 0; flex: 1; }
.pt-app .pt-chevron {
	width: 9px;
	height: 9px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
	transition: transform 0.15s ease;
	flex-shrink: 0;
	opacity: 0.6;
}
.pt-app .pt-lesson-open .pt-chevron { transform: rotate(45deg); }
.pt-app .pt-lesson-body { display: none; }
.pt-app .pt-lesson-open .pt-lesson-body { display: block; }