.training { --training-navy: #004166; --training-cyan: #00aede; --training-green: #96bc33; }
.training [hidden] { display: none !important; }
.training-eyebrow { color: var(--training-navy); font-size: .78rem; font-weight: 700; letter-spacing: .08em; }
.training h1 { font-size: clamp(1.75rem, 2.5vw, 2.5rem); line-height: 1.3; }
.training-hero { min-height: 285px; }
.training-hero-copy { min-width: 0; }
.training-hero-copy p { line-height: 1.7; }
.training-hero-image { flex: 0 1 36%; max-width: 360px; }
.training-hero-image img { height: auto; max-height: 230px; object-fit: contain; }
.training-search-wrap { max-width: 530px; }
.training-search-icon { left: 18px; color: var(--training-navy); pointer-events: none; }
.training #training-search { padding-left: 48px; min-height: 52px; }
.training-topic-nav { gap: 4px; }
.training-topic-nav .nav-link { font-size: .96rem; }
.training-topic-nav .nav-link.active { color: var(--training-navy) !important; background: var(--bs-body-bg) !important; box-shadow: 0 1px 5px rgba(0, 0, 0, .04); }
#training-library { scroll-margin-top: calc(var(--bs-app-header-height, 70px) + 20px); }
.training-video-card { min-width: 0; }
.training-video-link { text-decoration: none; border-radius: 8px; }
.training-video-link h3 { overflow-wrap: anywhere; }
.training-thumbnail { aspect-ratio: 16 / 9; overflow: hidden; background: #101820; }
.training-thumbnail > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.training-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 20, 35, .08); transition: background-color .15s; }
.training-video-link:hover .training-play { background: rgba(0, 65, 102, .22); }
.training-video-link:hover h3 { color: var(--training-navy) !important; }
.training-duration { position: absolute; right: 10px; bottom: 10px; padding: 3px 7px; background: rgba(0, 0, 0, .8); color: #fff; font-size: .8rem; line-height: 1.4; border-radius: 4px; font-weight: 600; }
.training-topic-badge { --topic-rgb: 0, 65, 102; color: rgb(var(--topic-rgb)); background: rgba(var(--topic-rgb), .09); }
.training-color-cyan { --topic-rgb: 0, 120, 153; }
.training-color-green { --topic-rgb: 90, 119, 10; }
.training-dialog { color: var(--bs-body-color); background: var(--bs-body-bg); width: min(1100px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 32px); border: 0; border-radius: 12px; padding: 0; box-shadow: 0 20px 80px rgba(0, 0, 0, .3); overflow-y: auto; }
.training-dialog::backdrop { background: rgba(8, 17, 27, .75); }
.training-video-wrap { aspect-ratio: 16 / 9; max-height: 62dvh; background: #090e14; }
.training-video-wrap video { width: 100%; height: 100%; display: block; object-fit: contain; }
.training-player-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; }
.training .btn-primary { background: var(--training-navy) !important; border-color: var(--training-navy) !important; color: white !important; }
.training .btn-primary:hover { background: #006086 !important; border-color: #006086 !important; }
.training a:focus-visible, .training button:focus-visible, .training input:focus-visible { outline: 3px solid var(--training-cyan); outline-offset: 3px; }
[data-bs-theme="dark"] .training-eyebrow { color: #65c9e8; }
[data-bs-theme="dark"] .training-topic-nav .nav-link.active { color: #65c9e8 !important; }
[data-bs-theme="dark"] .training-topic-badge { color: #65c9e8; background: rgba(0, 174, 222, .1); }
[data-bs-theme="dark"] .training-color-green { color: #b4d366; background: rgba(150, 188, 51, .12); }
[data-bs-theme="dark"] .training-search-icon, [data-bs-theme="dark"] .training-video-link:hover h3 { color: #65c9e8 !important; }
@media (max-width: 767.98px) {
    .training-hero { min-height: 0; }
    .training-topic-nav .nav-item { flex: 0 1 calc(50% - 2px); }
    .training-topic-nav .nav-link { width: 100%; text-align: left; padding-left: 12px !important; padding-right: 8px !important; }
}
@media (max-width: 575.98px) {
    #kt_app_content:has(.training) { padding-left: 0; padding-right: 0; }
    #kt_app_content_container:has(.training) { padding-left: 12px; padding-right: 12px; }
    .training-dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px); border-radius: 8px; }
    .training-player-actions > button { flex: 1 1 130px; min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { .training-play { transition: none; } }

/* The desktop height limit must not leave the 16:9 wrapper left-aligned. */
@media (min-width: 992px) {
    .training-dialog { margin: auto; inset: 0; height: fit-content; }
    .training-video-wrap { width: 100%; display: flex; align-items: center; justify-content: center; }
    .training-video-wrap video { flex: 0 1 auto; width: 100%; max-width: 100%; margin-inline: auto; object-position: center; }
}
