/*
 * Prodigy Training - student-facing styles for the [prodigy_training] page.
 *
 * Palette and control treatment match the practitioner portal
 * (prodigy-portal-supabase.php): white cards, purple #4c255f headings, teal
 * #00a38d buttons with the #008976 hover. Every button and summary sets
 * text-transform:none explicitly because the site theme force-uppercases.
 */

.pt-app {margin:0;}
.pt-app .pt-panel {border:1px solid #ececec;border-radius:8px;background:#fff;padding:22px;box-sizing:border-box;margin:0 0 18px;}
.pt-app h2 {color:#4c255f;margin:0 0 10px;}
.pt-app h3 {color:#4c255f;margin:0 0 14px;}
.pt-app h4 {color:#4c255f;margin:0 0 8px;}
.pt-app .pt-auth-panel {max-width:520px;}
.pt-app .pt-sub {color:#66706f;font-size:.96em;line-height:1.55;margin:0 0 18px;}
.pt-app .pt-small {font-size:.92em;color:#555;}
.pt-app .pt-msg {display:none;border-left:4px solid #00a38d;background:#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:#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 #d8d8d8;border-radius:4px;background:#fff;}
.pt-app input[type="file"] {font-size:.92em;}
.pt-app .pt-button {display:inline-flex;align-items:center;justify-content:center;height:36px;min-height:36px;background:#00a38d;color:#fff;border:0;border-radius:4px;padding:0 14px;font-weight:700;font-size:.94em;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:#008976;color:#ffffff;text-decoration:none;}
.pt-app .pt-button-secondary {background:#fff;color:#00a38d;border:1px solid #00a38d;}
.pt-app .pt-button-secondary:hover,
.pt-app .pt-button-secondary:focus {background:#f2faf9;color:#008976;border-color:#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:#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:#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:#777;margin:18px 0;}
.pt-app .pt-divider:before,
.pt-app .pt-divider:after {content:"";flex:1;height:1px;background:#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;align-items:center;justify-content:center;width:100%;height:36px;min-height:36px;padding:0 14px;border-radius:4px;font-weight:700;font-size:.94em;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;display:inline-flex;align-items:center;justify-content:center;height:36px;min-height:36px;padding:0 10px;border:1px solid #d5e8e6;border-radius:0;background:#fff;color:#00a38d;font-weight:700;font-size:.94em;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:4px 0 0 4px;}
.pt-app .pt-tab:last-child {border-radius:0 4px 4px 0;}
.pt-app .pt-tab.pt-tab-active {position:relative;z-index:1;background:#00a38d;border-color:#00a38d;color:#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:#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 #d9eee9;background:#f7fcfb;border-radius:8px;padding:16px 18px;box-sizing:border-box;}
.pt-app .pt-price-card strong {display:block;color:#4c255f;font-size:1.2em;margin:0 0 4px;}
.pt-app .pt-price-card p {margin:0 0 12px;color:#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 #ececec;border-radius:6px;padding:12px 14px;margin:0 0 8px;background:#fff;}
.pt-app .pt-row-main {flex:1 1 260px;min-width:0;}
.pt-app .pt-row-title {display:block;color:#4c255f;font-weight:700;overflow-wrap:anywhere;}
.pt-app .pt-row-meta {display:block;color:#66706f;font-size:.88em;margin:3px 0 0;}
.pt-app .pt-row-locked {background:#fafafa;}
.pt-app .pt-row-locked .pt-row-title {color:#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:#e5f3f3;color:#00806f;}
.pt-app .pt-badge-open {background:#f3f0f6;color:#4c255f;}
.pt-app .pt-badge-locked {background:#f0f0f0;color:#777;}
.pt-app .pt-badge-pending {background:#fdf4e3;color:#8a6116;}
.pt-app .pt-badge-returned {background:#fbeeed;color:#b3443e;}
.pt-app .pt-back {margin:0 0 14px;}

/* Lessons. */
.pt-app .pt-lesson {border:1px solid #ececec;border-radius:8px;background:#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:#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:#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:#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 #ececec;border-radius:8px;background:#fff;padding:14px 16px;margin:0 0 12px;}
.pt-app .pt-question.pt-question-wrong {border-color:#b3443e;background:#fdf7f7;}
.pt-app .pt-question-text {font-weight:700;color:#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;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:#eef0ef;border-radius:999px;overflow:hidden;}
.pt-app .pt-progress-fill {height:100%;transition:width .3s ease;}
.pt-app .pt-progress-accepted {background:#00a38d;}
.pt-app .pt-progress-submitted {background:#9ad6cd;}
.pt-app .pt-progress-label {margin:7px 0 0;font-size:.9em;font-weight:600;color:#4c255f;}
.pt-app .pt-form-title {margin:0 0 12px;color:#4c255f;}
.pt-app .pt-session-row {border:1px solid #ececec;border-radius:8px;background:#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;}
.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:#66706f;cursor:pointer;padding:4px 8px;}
.pt-app .pt-modal-close:hover,.pt-app .pt-modal-close:focus {color:#4c255f;}
.pt-app .pt-tally {display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px;}
.pt-app .pt-tally-chip {border:1px solid #d9eee9;background:#f7fcfb;border-radius:8px;padding:9px 13px;font-size:.9em;color:#333;}
.pt-app .pt-tally-chip strong {color:#4c255f;}
.pt-app .pt-slot {border:1px solid #ececec;border-radius:8px;background:#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:#4c255f;font-weight:700;}
.pt-app .pt-slot-note {border-left:4px solid #b3443e;background:#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; }
