/* Training lives in the native shell. Every rule is scoped to its own host. */
.crm-training{container-type:inline-size;flex:1 0 auto;min-width:0;padding:24px;color:var(--ink);font-size:var(--text-base);line-height:1.55}
.crm-training *, .crm-training *::before,.crm-training *::after{box-sizing:border-box}
.crm-training [hidden]{display:none!important}
.crm-training a{color:var(--accent);text-underline-offset:3px}
.crm-training :is(a,button,input,summary):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.crm-training :is(button,input){font:inherit;color:inherit}
.crm-training button,.crm-training summary{cursor:pointer}
.crm-training button:disabled{opacity:.65;cursor:wait}
.crm-training :is(h2,h3,p){margin:0}
.crm-training .training-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:0 0 22px}
.crm-training .training-heading h2{font-size:28px;line-height:1.25;margin:5px 0 7px;font-weight:700}
.crm-training .training-heading p,.crm-training .training-course-copy p,.crm-training .training-progress p,.crm-training .training-toolbar p{color:var(--muted)}
.crm-training .training-eyebrow{font-size:var(--text-sm)}
.crm-training :is(.training-primary,.course-primary){display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;border:1px solid var(--accent);border-radius:12px;padding:10px 16px;background:var(--accent);color:var(--accent-ink);font-weight:600;text-align:center;text-decoration:none;line-height:1.4;white-space:normal}
.crm-training :is(.training-primary,.course-primary):hover{background:var(--accent-deep);color:var(--accent-ink)}
.crm-training :is(.training-progress-card,.training-library,.training-tip,.training-reader){border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-solid,var(--surface));box-shadow:0 1px 2px rgb(var(--lift-lo)/.025)}
.crm-training .training-progress-card{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(220px,.65fr);align-items:center;gap:22px;padding:24px;margin-bottom:20px}
.crm-training .training-mark{display:grid;place-items:center;width:64px;height:64px;border:1px solid var(--line);border-radius:16px;background:var(--accent-wash);color:var(--accent)}
.crm-training .training-course-copy h3{font-size:var(--text-lg);font-weight:650;line-height:1.35;margin:10px 0 6px;overflow-wrap:anywhere}
.crm-training .training-tag{display:inline-block;padding:4px 8px;border-radius:6px;background:var(--accent-wash);color:var(--accent);font-weight:600;font-size:var(--text-sm)}
.crm-training .training-progress{min-width:0}.crm-training .training-progress>div{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.crm-training .training-progress>div>span{color:var(--accent)}
.crm-training progress{display:block;width:100%;height:6px;appearance:none;border:0;border-radius:8px;overflow:hidden;background:var(--line);accent-color:var(--accent);margin:12px 0}
.crm-training progress::-webkit-progress-bar{background:var(--line)}.crm-training progress::-webkit-progress-value{background:var(--accent);border-radius:8px}.crm-training progress::-moz-progress-bar{background:var(--accent);border-radius:8px}
.crm-training .training-progress p{font-size:var(--text-sm);overflow-wrap:anywhere}
.crm-training .training-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:start;gap:20px}
.crm-training .training-library{min-width:0;overflow:clip}
.crm-training .training-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;padding:20px 20px 12px}
.crm-training .training-toolbar h3{font-size:var(--text-lg);font-weight:650}.crm-training .training-toolbar p{font-size:var(--text-sm);margin-top:3px}
.crm-training .training-search{display:block;flex:0 1 250px;min-width:0}.crm-training .training-search>span{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
.crm-training .training-search input{display:block;width:100%;min-width:0;min-height:44px;padding:9px 12px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);font:inherit;color:var(--ink)}
.crm-training .training-search input::placeholder{color:var(--muted);opacity:1}
.crm-training .training-categories{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px;border-bottom:1px solid var(--line)}
.crm-training .training-categories button{min-height:44px;border:1px solid transparent;border-radius:8px;padding:8px 10px;background:transparent;color:var(--muted);font-weight:600;white-space:normal}
.crm-training .training-categories button[aria-pressed=true]{background:var(--accent-wash);color:var(--accent);border-color:var(--accent-wash)}
.crm-training .training-result{padding:8px 20px;font-size:var(--text-sm);color:var(--muted)}.crm-training .training-result:empty{display:none}
.crm-training .training-lesson{display:grid;grid-template-columns:36px minmax(0,1fr) auto auto;gap:14px;align-items:center;min-height:78px;padding:14px 20px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line);transition:background-color 140ms ease}
.crm-training .training-lesson:last-child{border-bottom:0}.crm-training .training-lesson:hover,.crm-training .training-lesson:focus-visible{background:var(--accent-wash)}
.crm-training .training-number{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:9px;color:var(--muted);font-variant-numeric:tabular-nums;background:var(--surface-sunken)}
.crm-training .training-lesson-title{min-width:0}.crm-training .training-lesson-title strong{display:block;font-weight:600;line-height:1.4;overflow-wrap:anywhere}.crm-training .training-lesson-title small{display:block;color:var(--muted);font-size:var(--text-sm);margin-top:5px;overflow-wrap:anywhere}
.crm-training .training-minutes{font-size:var(--text-sm);color:var(--muted);white-space:nowrap}.crm-training .training-lesson-state{font-size:var(--text-sm);color:var(--accent);text-align:right;white-space:nowrap}
.crm-training .is-done .training-number,.crm-training .is-done .training-lesson-state{color:var(--ok)}
.crm-training .training-tip{padding:22px}.crm-training .training-tip>svg{color:var(--accent);margin:3px 0 20px}.crm-training .training-tip h3{font-size:var(--text-lg);font-weight:650;line-height:1.4;margin-bottom:16px}.crm-training .training-tip>p{color:var(--muted);margin-bottom:16px}.crm-training .training-tip details{padding-top:14px;border-top:1px solid var(--line)}.crm-training .training-tip summary{min-height:44px;color:var(--accent);font-weight:600}
.crm-training .training-empty{padding:24px;line-height:1.6;color:var(--muted)}.crm-training .training-empty h2,.crm-training .training-empty strong{color:var(--ink)}.crm-training .training-empty p{margin:8px 0 14px}
.crm-training :is(.training-empty,#course-save-status) button{min-height:44px;padding:8px 12px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);color:var(--accent)}
/* The existing full lesson content is retained in a restrained reading column. */
.crm-training .training-reader-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;max-width:820px;margin:0 auto 14px;color:var(--muted)}.crm-training .training-reader-top a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-weight:600}
.crm-training .training-reader{max-width:820px;width:100%;margin:auto;padding:28px clamp(18px,4cqi,44px);overflow-wrap:anywhere}
.crm-training .course-eyebrow{font-size:var(--text-sm);color:var(--muted);font-weight:600;margin-bottom:10px}
.crm-training #course-heading{scroll-margin-top:20px}.crm-training .training-reader>h2{font-size:28px;line-height:1.3;font-weight:700;margin-bottom:16px}
.crm-training .course-lead{font-size:var(--text-md);color:var(--muted);line-height:1.7;margin-bottom:18px}
.crm-training .course-article-meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;color:var(--muted);margin:20px 0;font-size:var(--text-sm)}
.crm-training .course-article-meta a{min-height:44px;display:inline-flex;align-items:center}
.crm-training .course-contents{display:grid;gap:9px;border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:24px;background:var(--surface-sunken)}.crm-training .course-contents a{line-height:1.6}
.crm-training .course-article section{margin:30px 0;scroll-margin-top:20px}.crm-training .course-article h2{font-size:var(--text-lg);font-weight:650;line-height:1.4;margin-bottom:14px}
.crm-training .course-article ol{margin:0;padding-left:24px;list-style:decimal}.crm-training .course-article li{max-width:66ch;margin:0 0 14px;line-height:1.85;color:var(--ink-soft);font-size:var(--text-md)}
.crm-training .course-article p{margin-bottom:14px}
.crm-training .course-note{color:var(--muted);font-size:var(--text-sm);line-height:1.65;margin:12px 0}
.crm-training .course-table-wrap{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:10px}
.crm-training table{border-collapse:collapse;width:100%;min-width:460px;background:var(--surface);font-size:var(--text-base);line-height:1.6;text-align:left}
.crm-training :is(th,td){padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}.crm-training thead th{background:var(--surface-sunken);font-weight:600;color:var(--muted)}.crm-training tbody th{width:26%;font-weight:600}.crm-training tr:last-child>*{border-bottom:0}
.crm-training .course-practice,.crm-training .course-example{padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface-sunken);margin:24px 0}.crm-training .course-example h2{font-size:var(--text-md);font-weight:650;margin-bottom:12px}.crm-training .course-example-links{display:grid;gap:10px;margin:14px 0}.crm-training .course-example-links a{display:inline-flex;align-items:center;min-height:44px}
.crm-training .course-checklist ul{padding:0;list-style:none}.crm-training .course-checklist li{padding:10px 12px;border-left:2px solid var(--ok);background:var(--surface-sunken);color:var(--ink-soft);margin:8px 0;border-radius:6px}
.crm-training .course-screenshot{margin:24px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface)}.crm-training .course-screenshot img{display:block;width:100%;height:auto;border-bottom:1px solid var(--line)}.crm-training .course-screenshot figcaption{padding:16px;color:var(--muted);font-size:var(--text-sm)}.crm-training .course-screenshot figcaption p{margin:8px 0}.crm-training .course-screenshot figcaption small{display:block;margin-top:10px}
.crm-training .course-completion{border-top:1px solid var(--line);padding-top:20px;margin:28px 0 22px}.crm-training #course-save-status{min-height:24px;color:var(--muted);font-size:var(--text-sm);margin-top:12px}
.crm-training .course-next{display:grid;grid-template-columns:1fr 1fr;gap:20px;border-top:1px solid var(--line);padding-top:18px}.crm-training .course-next a{display:block;min-height:44px;text-decoration:none;font-weight:600;overflow-wrap:anywhere}.crm-training .course-next a:last-child{text-align:right}.crm-training .course-next small{display:block;color:var(--muted);font-weight:400;margin-bottom:5px}
@container (max-width:950px){.crm-training .training-layout{grid-template-columns:minmax(0,1fr)}.crm-training .training-progress-card{grid-template-columns:64px minmax(0,1fr)}.crm-training .training-progress{grid-column:2}.crm-training .training-tip>svg{margin-bottom:10px}.crm-training .training-tip{padding:18px}}
@container (max-width:580px){.crm-training .training-lesson{grid-template-columns:32px minmax(0,1fr) auto;gap:6px 12px;padding:14px}.crm-training .training-number{width:32px;height:32px;grid-row:1/3}.crm-training .training-lesson-title{grid-column:2/-1}.crm-training .training-minutes{grid-column:2;grid-row:2}.crm-training .training-lesson-state{grid-column:3;grid-row:2;text-align:right}.crm-training .training-progress-card{padding:18px;gap:14px;grid-template-columns:44px minmax(0,1fr)}.crm-training .training-mark{width:44px;height:44px;border-radius:12px}.crm-training .training-progress{grid-column:1/-1}.crm-training .training-toolbar{padding:16px}.crm-training .training-search{flex-basis:100%}.crm-training .training-categories{padding-inline:10px}}
@media(max-width:767.98px){.crm-training{padding:16px 12px 28px}.crm-training .training-heading{gap:14px}.crm-training .training-heading h2,.crm-training .training-reader>h2{font-size:24px}.crm-training .training-search input{font-size:16px}.crm-training .training-reader{padding:20px 16px}.crm-training .course-next{gap:12px}}
@media(prefers-reduced-motion:reduce){.crm-training *{transition:none!important;scroll-behavior:auto!important}}

/* Confirmed completion makes the deliberate next step the primary action. */
.crm-training .course-completion-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.crm-training .course-passed{color:var(--ok);font-weight:600;margin:0 0 12px}
.crm-training .course-undo{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:10px 14px;border:1px solid var(--line-strong);border-radius:12px;background:transparent;color:var(--muted);line-height:1.4;white-space:normal}
.crm-training .course-undo:hover{background:var(--surface-sunken);color:var(--ink)}
.crm-training .course-upcoming{margin:12px 0 0;color:var(--muted);font-size:var(--text-sm);overflow-wrap:anywhere}
@container(max-width:450px){.crm-training .course-completion-actions .course-primary{width:100%}}