/* Hot Water Pros team portal and Tech Training. Same surfaces, type and orange
   accents as the plumber workspace (next.css). */

/* Welcome screen: a quiet team sign-in under the main choices. */
.account-gateway-actions .gateway-team { margin:10px 0 0; padding:16px 0 0; border-top:1px solid #ffffff1f; text-align:center; }
.account-gateway-actions .gateway-team button { min-height:44px; padding:10px 12px; border:0; background:transparent; color:#ff9c59; font-size:14px; font-weight:600; }
.account-gateway-actions .gateway-team p { margin:0; color:#9a9a9a; font-size:12px; line-height:1.5; }

.training-loading { color:#62655e; font-size:14px; padding:12px 0; }

/* Program page */
.training-team-link .customer-avatar svg { width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.7; }
.training-section { margin:18px 0 26px; padding:22px 18px 18px; border:1px solid #dfe2d8; border-radius:16px; background:#fff; }
.training-section .nx-eyebrow { margin:0 0 6px; }
.training-section > h2 { margin:0 0 8px; font-size:22px; font-weight:650; letter-spacing:-.03em; }
.training-section > p { margin:0 0 12px; color:#62655e; font-size:14px; line-height:1.6; }
.training-progress { height:8px; margin:16px 0 6px; border-radius:8px; background:#eeeae3; overflow:hidden; }
.training-progress > span { display:block; height:100%; border-radius:8px; background:#fc6f13; }
.training-progress-text { margin:0 0 14px !important; font-size:12px !important; color:#62655e; }
.training-complete { display:flex; align-items:center; gap:8px; }
.training-complete svg { width:18px; height:18px; flex-shrink:0; stroke:currentColor; fill:none; stroke-width:1.8; }
.training-steps { list-style:none; margin:0; padding:0; }
.training-step { display:flex; align-items:center; gap:12px; min-height:60px; padding:12px 4px; border-top:1px solid #ecece6; color:#21251c; text-decoration:none; }
.training-step > svg { width:15px; height:15px; margin-left:auto; flex-shrink:0; color:#74786c; stroke:currentColor; fill:none; stroke-width:1.8; }
.training-step-icon { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; border-radius:50%; background:#f4eadf; color:#a23c00; }
.training-step-icon svg { width:19px; height:19px; stroke:currentColor; fill:none; stroke-width:1.7; }
.training-step-copy { display:flex; flex-direction:column; min-width:0; }
.training-step-copy strong { font-size:15px; font-weight:600; line-height:1.35; overflow-wrap:anywhere; }
.training-step-copy small { margin-top:2px; color:#62655e; font-size:12px; line-height:1.45; }
.training-step[data-state="passed"] .training-step-icon { background:#eaf2e3; color:#3e5d2c; }
.training-step[data-state="locked"] { color:#8a8d84; }
.training-step[data-state="locked"] .training-step-icon { background:#f0f0ec; color:#8a8d84; }
.training-test { margin-top:4px; border-top:2px solid #e2e4dc; }
.training-test .training-step-copy strong { font-weight:650; }

/* Lesson page */
.training-video { display:flex; justify-content:center; margin:0 0 10px; border-radius:16px; background:#000; overflow:hidden; }
.training-video video { display:block; width:auto; max-width:100%; height:56svh; min-height:320px; aspect-ratio:9 / 16; background:#000; }
.training-video-note { margin:0 0 16px; color:#62655e; font-size:13px; line-height:1.6; }
.training-video-note .nx-button { min-height:36px; padding:6px 0 6px 4px; }
.training-quiz-call { display:grid; gap:10px; margin:0 0 6px; }
.training-quiz-call .nx-fine,.training-quiz-call .nx-success { margin:0; }
.training-quiz-button { width:100%; }
.training-quiz-button svg { stroke:currentColor; fill:none; }
.training-points { margin:10px 0 0; padding-left:20px; font-size:14px; line-height:1.7; }

/* Quiz and section test */
.training-quiz { display:grid; gap:14px; }
.training-question { margin:0; padding:16px 14px 10px; border:1px solid #dfe2d8; border-radius:14px; background:#fff; min-width:0; }
.training-question legend { float:left; width:100%; margin:0 0 10px; padding:0; border:0; font-size:16px; font-weight:600; line-height:1.45; color:#21251c; }
.training-question legend span { display:block; margin:0 0 4px; color:#a23c00; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.training-choice { clear:both; display:flex; align-items:flex-start; gap:12px; min-height:48px; margin:0; padding:12px 2px; border-top:1px solid #f0f0ea; color:#21251c; font-size:15px; font-weight:400; line-height:1.5; cursor:pointer; }
.training-choice input { flex:0 0 22px; width:22px; height:22px; min-height:0; margin:0; padding:0; border:0; box-shadow:none; accent-color:#a64203; }
.training-choice span { min-width:0; overflow-wrap:anywhere; }
.training-count { margin:0; color:#62655e; font-size:13px; text-align:center; }
.training-submit { width:100%; min-height:52px; font-size:15px; }

/* Results */
.training-next { display:grid; gap:10px; margin:0 0 18px; }
.training-next .nx-button { width:100%; }
.training-next svg { stroke:currentColor; fill:none; }
.training-review { list-style:none; margin:12px 0 16px; padding:0; }
.training-review a { display:flex; align-items:center; gap:10px; min-height:48px; color:#913500; font-size:15px; font-weight:600; }
.training-review svg { width:20px; height:20px; flex-shrink:0; stroke:currentColor; fill:none; stroke-width:1.7; }
.training-answers { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.training-answer { padding:16px 14px; border:1px solid #dfe2d8; border-left:4px solid #6f9a54; border-radius:12px; background:#fff; }
.training-answer[data-correct="false"] { border-left-color:#d97a3d; }
.training-answer h3 { margin:0 0 8px; font-size:15px; line-height:1.45; font-weight:600; }
.training-answer p { margin:4px 0 0; font-size:14px; line-height:1.55; }
.training-yours { display:flex; align-items:flex-start; gap:6px; }
.training-yours svg { width:17px; height:17px; flex-shrink:0; margin-top:2px; color:#3e5d2c; stroke:currentColor; fill:none; stroke-width:2; }
.training-right { color:#3e5d2c; }
.training-why { color:#62655e; }

/* Team progress (owner) */
.training-refresh { margin:0 0 4px; }
.training-member h2 { margin:0 0 4px; font-size:19px; }
.training-member h3 { margin:16px 0 4px; font-size:15px; }
.training-member-meta { margin:0; color:#62655e; font-size:13px; overflow-wrap:anywhere; }
.training-member-summary { display:flex; align-items:center; gap:6px; margin:0; font-size:14px; line-height:1.55; }
.training-member-summary svg { width:17px; height:17px; flex-shrink:0; color:#3e5d2c; stroke:currentColor; fill:none; stroke-width:1.8; }
.training-details { margin:8px 0 0; }
.training-details summary { min-height:44px; display:flex; align-items:center; color:#913500; font-size:14px; font-weight:600; cursor:pointer; }
.training-details ol { margin:4px 0 0; padding-left:0; list-style:none; }
.training-details li { padding:9px 0; border-top:1px solid #ecece6; font-size:13px; line-height:1.5; }
.training-details li strong { display:block; font-size:14px; }
.training-details li span { color:#62655e; }

/* Short wait after a failed attempt */
.training-wait { margin:0 0 14px; padding:12px 14px; border-radius:10px; background:#f4eadf; color:#684523; font-size:14px; line-height:1.55; }
.training-wait strong { font-variant-numeric:tabular-nums; }
.training-quiz-call .training-wait { margin:0; }