/* The training site's own sheet, loaded after site.css (the public site's system, identical file).
   Rebuilt 10/23/2026: every store page now uses the public site's department parts (.dept-wrap,
   .dept, .dept__main, .dept__side, .sidecard, .figs) the way Nurse training does; this sheet adds
   only what the store needs on top: the course offers, the account card, the sign-up form, and
   WooCommerce's and LearnDash's own markup brought onto the site's type, colour and buttons.
   Pairings (WCAG): blue on white 12.10; blue on blush 11.39; teal-deep on white 4.96 (labels 14px+
   bold); blue on gold 6.15; white on blue 12.10; error red #b3261e on white 6.54. */

.head__site { margin: 0 0 0 .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: .8rem; opacity: .85; }
.vh { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* The title band's line is a sentence here, not a capitalised slogan. */
.safe-training .title__line { text-transform: none; letter-spacing: 0; line-height: 1.6; max-width: 62ch; margin-left: auto; margin-right: auto; font-weight: 500; }
.safe-training .ico { width: 1em; height: 1em; vertical-align: -.12em; margin-right: .35em; }
.safe-training .btn .ico { margin: 0 0 0 .4em; }

/* A blue outline button for the second action on a light card (.btn--ghost is white, for dark grounds). */
.btn--line { border: 2px solid var(--blue); color: var(--blue); background: #fff; }
.btn--line:hover { background: var(--blue); color: var(--paper); }

/* ---------- The side card ---------- */
.side__p { margin: 0 0 18px; line-height: 1.6; }
.side__btn { display: flex; width: 100%; justify-content: center; text-align: center; }
.side__btn + .side__btn { margin-top: 12px; }
.side__ok { margin: 0 0 18px; padding: 12px 14px; background: var(--tint); font-weight: 700; line-height: 1.5; }
.mine { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 18px; }
.mine__item { display: grid; gap: 6px; }
.mine__name { font-weight: 700; color: var(--blue); line-height: 1.4; }
.mine__bar { display: block; height: 8px; background: #e6e9ec; border-radius: 4px; overflow: hidden; }
.mine__bar span { display: block; height: 100%; background: var(--teal-deep); }
.mine__pct { font-size: .875rem; color: var(--teal-deep); font-weight: 700; }

/* ---------- The store home's course offers, inside the main card ---------- */
.offer { border-top: 1px solid #dde1e4; padding-top: 26px; margin-top: 26px; }
.offer__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; }
.offer__h { margin: 0; font-size: 1.125rem; font-weight: 700; line-height: 1.4; }
.offer__h a { color: inherit; text-decoration: none; }
.offer__h a:hover { text-decoration: underline; }
.offer__price { margin: 0; font-weight: 800; font-size: 1.125rem; color: var(--teal-deep); white-space: nowrap; }
.offer__desc { margin-top: 10px; }
.offer__desc p { margin: 0 0 10px; }
.offer .dept__actions { margin-top: 16px; }

/* ---------- Running text from the store's database (product descriptions, policy pages) ---------- */
.prose p { margin: 0 0 1.1em; }
.prose h2, .prose h3 { margin: 1.4em 0 .5em; line-height: 1.3; }
.prose ul, .prose ol { margin: 0 0 1.1em; padding-left: 1.3em; }
.prose li { margin-bottom: .4em; }
.prose > :first-child { margin-top: 0; }
.prose > :last-child { margin-bottom: 0; }
/* The old site centred and italicised its descriptions in the editor; on a card they read left. */
.prose [style*="text-align"] { text-align: left !important; }
.prose em, .prose i { font-style: normal; }
.back { margin: 26px 0 0; font-weight: 700; }
.back a { color: var(--blue); }
.ico--back { transform: rotate(180deg); }

/* ---------- Buying, in the "At a glance" card ---------- */
.dept__side .figs span .woocommerce-Price-amount { color: var(--teal-deep); }
.buy { margin-top: 22px; }
.buy form.cart { margin: 0; }
.buy .quantity { display: none; }   /* a course is bought once */
.buy .single_add_to_cart_button { width: 100%; }
/* WooCommerce's own sheet paints this button purple at higher specificity; the site's gold wins here. */
.safe-training .buy form.cart button.single_add_to_cart_button.button.alt { background-color: var(--gold); color: var(--blue); width: 100%; }
.safe-training .buy form.cart button.single_add_to_cart_button.button.alt:hover { background-color: var(--gold-deep); }
/* At a glance, as Nurse training at laptop width: each name above its value, both left. */
.dept__side .figs li { display: grid; grid-template-columns: 1fr; gap: 4px; padding: 14px 0; line-height: 1.5; }
.dept__side .figs span { text-align: left; font-weight: 600; }
/* A long course name steps down so the band holds it in two lines. */
.single-product .title h1, .single-sfwd-courses .title h1 { font-size: clamp(2.125rem, 1.4rem + 2.6vw, 3.75rem); line-height: 1.12; max-width: 22ch; margin-inline: auto; }
/* Beside a long description or the long sign-up form, the side card stays in view. */
.single-product .dept__side > .sidecard, .page-template-page-register .dept__side > .sidecard:first-child, .reg-page .dept__side > .sidecard:first-child { position: sticky; top: 24px; }
.buy__note { margin: 14px 0 0; font-size: .9375rem; line-height: 1.55; }

/* ---------- One white sheet for WooCommerce's pages, a course and plain pages ---------- */
.sheet { max-width: calc(1200px + 2 * var(--pad)); margin: 0 auto; padding: 60px var(--pad) 100px; }
.sheet > * { background: #fff; border: 1px solid #dde1e4; padding: 40px; }
.sheet > .woocommerce { display: block; }
@media (max-width: 760px) { .sheet { padding: 30px 16px 60px; } .sheet > * { padding: 26px 20px; } }

/* WooCommerce's buttons are the site's: square, capitals, gold for the main action, blue otherwise. */
.safe-training .woocommerce .button, .safe-training .woocommerce button.button, .safe-training .woocommerce a.button,
.safe-training .woocommerce input.button, .safe-training .woocommerce #respond input#submit, .buy .button,
.safe-training .wc-block-components-button:not(.is-link) {
  display: inline-flex; align-items: center; justify-content: center; min-height: 55px; padding: 14px 32px; border: 0; border-radius: 0;
  background: var(--blue); color: var(--paper); font-family: Montserrat, "Open Sans", sans-serif; font-size: 1rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase; line-height: 1.2; text-decoration: none; cursor: pointer;
}
.safe-training .woocommerce .button:hover, .safe-training .woocommerce a.button:hover { background: var(--blue-deep); color: var(--paper); }
.safe-training .woocommerce .button.alt, .safe-training .woocommerce .checkout-button, .safe-training #place_order, .buy .single_add_to_cart_button { background: var(--gold); color: var(--blue); }
.safe-training .woocommerce .button.alt:hover, .safe-training .woocommerce .checkout-button:hover, .safe-training #place_order:hover, .buy .single_add_to_cart_button:hover { background: var(--gold-deep); color: var(--blue); }
.safe-training .woocommerce .button:disabled, .safe-training .woocommerce .button.disabled { opacity: .55; cursor: not-allowed; }

/* Notices read as the site's form notes. */
.safe-training .woocommerce-message, .safe-training .woocommerce-info, .safe-training .woocommerce-error {
  list-style: none; margin: 0 0 24px; padding: 18px 20px; border: 0; border-radius: 6px; background: var(--tint); color: var(--blue); line-height: 1.55;
}
.safe-training .woocommerce-message::before, .safe-training .woocommerce-info::before, .safe-training .woocommerce-error::before { display: none; }
.safe-training .woocommerce-error { background: #fbeceb; border: 2px solid #b3261e; color: #7a1a14; }
/* WooCommerce prints some notices button first ("Confirm email address") and some text first ("No order
   has been made yet"); the button sat inline and the sentence wrapped under it (Jesse's screenshot of
   My account > Orders, 10/27). Every notice reads text left, button right, on one centred line; the
   selectors carry a.button because WooCommerce's own `.woocommerce a.button` outranked the plain one. */
.safe-training .woocommerce-message, .safe-training .woocommerce-info { display: flex; align-items: center; gap: 14px 24px; }
.safe-training .woocommerce-message .button, .safe-training .woocommerce-info .button,
.safe-training .woocommerce .woocommerce-message a.button, .safe-training .woocommerce .woocommerce-info a.button { order: 1; flex: none; float: none; margin: 0 0 0 auto; min-height: 0; padding: 11px 22px; font-size: .8125rem; letter-spacing: .1em; }
.dept-wrap > .woocommerce-notices-wrapper { max-width: calc(1200px + 2 * var(--pad)); margin: 0 auto; padding: 40px var(--pad) 0; }
.dept-wrap > .woocommerce-notices-wrapper:empty { display: none; }

/* Fields read as the site's fields. */
.safe-training .woocommerce form .form-row { padding: 0; margin: 0 0 18px; }
.safe-training .woocommerce form .form-row label { display: block; font-weight: 700; margin-bottom: 8px; line-height: 1.4; }
.safe-training .woocommerce form .form-row .input-text, .safe-training .woocommerce form .form-row select,
.safe-training .woocommerce form .form-row textarea, .safe-training .woocommerce .select2-container .select2-selection--single {
  width: 100%; font: inherit; font-size: 1.0625rem; color: var(--blue); background: #fff; border: 1px solid #aeb8c0; border-radius: var(--radius); padding: 13px 14px; min-height: 50px;
}
.safe-training .woocommerce .select2-container .select2-selection--single { height: auto; }
.safe-training .woocommerce .select2-container .select2-selection__rendered { padding: 0; line-height: 1.5; color: var(--blue); }
.safe-training .woocommerce .select2-container .select2-selection__arrow { top: 12px; right: 10px; }
.safe-training .woocommerce form .form-row .input-text:focus-visible, .safe-training .woocommerce form .form-row select:focus-visible { outline: 3px solid var(--blue); outline-offset: 1px; }
.safe-training .woocommerce form .form-row .required { color: #b3261e; text-decoration: none; }
.safe-training .woocommerce form .form-row.woocommerce-invalid .input-text { border-color: #b3261e; border-width: 2px; }
.safe-training .woocommerce form .form-row input[type="checkbox"], .safe-training .woocommerce form .form-row input[type="radio"] { width: 20px; height: 20px; accent-color: var(--blue); }

/* Tables: the cart, the order review, past orders. */
.safe-training .woocommerce table.shop_table { border: 1px solid #dde1e4; border-radius: 0; border-collapse: collapse; width: 100%; margin: 0 0 26px; }
.safe-training .woocommerce table.shop_table th, .safe-training .woocommerce table.shop_table td { padding: 14px 16px; border-top: 1px solid #dde1e4; line-height: 1.5; vertical-align: middle; }
.safe-training .woocommerce table.shop_table thead th { font-family: Montserrat, "Open Sans", sans-serif; font-weight: 600; font-size: .8125rem; letter-spacing: .1em; text-transform: uppercase; background: var(--blush); }
.safe-training .woocommerce table.shop_table .product-thumbnail { display: none; }
.safe-training .woocommerce table.cart td.actions .coupon .input-text { width: 200px; min-height: 55px; padding: 12px 14px; border: 1px solid #aeb8c0; margin-right: 8px; }
.safe-training .woocommerce a.remove { color: #b3261e !important; font-size: 1.5rem; }
.safe-training .woocommerce a.remove:hover { background: #b3261e; color: #fff !important; }
.safe-training .cart-collaterals .cart_totals { width: 100%; max-width: 460px; float: right; }
.safe-training .cart-collaterals .cart_totals h2 { font-size: 1.25rem; margin: 0 0 14px; }
.safe-training .wc-proceed-to-checkout .checkout-button { width: 100%; }
@media (max-width: 760px) { .safe-training .cart-collaterals .cart_totals { float: none; max-width: none; } }

/* Checkout: billing on the left, the order on the right from 1000px; one column below. */
.safe-training form.checkout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 0 48px; align-items: start; }
.safe-training form.checkout > .col2-set { grid-column: 1; width: auto; float: none; }
.safe-training form.checkout > .col2-set .col-1, .safe-training form.checkout > .col2-set .col-2 { width: 100%; float: none; }
.safe-training form.checkout > #order_review_heading, .safe-training form.checkout > #order_review { grid-column: 2; }
.safe-training form.checkout > #order_review_heading { grid-row: 1; margin: 0 0 14px; }
.safe-training form.checkout > #order_review { grid-row: 1; margin-top: 46px; }
.safe-training form.checkout h3 { font-size: 1.25rem; margin: 0 0 14px; }
.safe-training #payment { background: var(--blush) !important; border-radius: 0 !important; }
.safe-training #payment div.payment_box { background: #fff !important; color: var(--blue) !important; }
.safe-training #payment div.payment_box::before { border-bottom-color: #fff !important; }
.safe-training #place_order { width: 100%; float: none; margin-top: 10px; }
@media (max-width: 999px) {
  .safe-training form.checkout { grid-template-columns: 1fr; }
  .safe-training form.checkout > #order_review_heading, .safe-training form.checkout > #order_review { grid-column: 1; grid-row: auto; margin-top: 0; }
}
.safe-agree { margin: 6px 0 10px; display: grid; gap: 12px; }
.safe-agree .form-row label.checkbox { display: grid !important; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; align-items: start; font-weight: 400 !important; line-height: 1.55; }
.safe-agree .form-row label.checkbox input { margin-top: 3px; }
.safe-agree .optional { display: none; }

/* The thank-you page. */
.thanks { background: var(--tint); padding: 26px 28px; margin: 0 0 30px; }
.thanks__h { margin: 0 0 10px; font-size: 1.5rem; }
.thanks p { margin: 0 0 12px; line-height: 1.6; }
.thanks p:last-child { margin: 0; }

/* My account: the menu as a side list on the left, the page on the right; stacked on a phone. */
.safe-training .woocommerce-account .sheet > .woocommerce,
.safe-training .sheet--account > .woocommerce { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; align-items: start; }
.safe-training .woocommerce-MyAccount-navigation, .safe-training .woocommerce-MyAccount-content { width: auto !important; float: none !important; }
.safe-training .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--teal-deep); }
.safe-training .woocommerce-MyAccount-navigation li a { display: block; padding: 13px 4px; border-bottom: 1px solid #e6e9ec; color: var(--blue); font-weight: 600; text-decoration: none; }
.safe-training .woocommerce-MyAccount-navigation li.is-active a { color: var(--teal-deep); font-weight: 800; }
.safe-training .woocommerce-MyAccount-navigation li a:hover { text-decoration: underline; }
.acct__h { margin: 0 0 18px; font-size: 1.5rem; }
.acct__more { margin: 24px 0 0; line-height: 1.6; }
.sheet--account > .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.sheet--account > .woocommerce > .woocommerce-notices-wrapper:empty { display: none; }
/* Logged out, the account page carries the log-in form on the left and the way in for a new nurse
   on the right. WooCommerce's own "Login" heading goes: the title band already says it. */
.sheet--account > .woocommerce:has(form.login) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 56px; row-gap: 0; }
.sheet--account > .woocommerce:has(form.login) > * { grid-column: 1; }
.sheet--account > .woocommerce:has(form.login) > h2 { display: none; }
.sheet--account > .woocommerce:has(form.login) > .newhere { grid-column: 2; grid-row: 1 / span 6; }
.safe-training form.woocommerce-form-login { border: 0 !important; padding: 0 !important; margin: 0 !important; }
.safe-training .woocommerce-form-login__rememberme { display: flex !important; align-items: center; gap: 10px; font-weight: 400 !important; margin: 0 0 16px; }
.safe-training .woocommerce-LostPassword { margin-top: 14px; }
.newhere { background: var(--blush); padding: 30px; align-self: stretch; }
.newhere__h { font-size: 1.25rem; margin: 0 0 10px; }
.newhere p { margin: 0 0 18px; line-height: 1.6; }
@media (max-width: 860px) {
  .safe-training .sheet--account > .woocommerce, .safe-training .sheet--account > .woocommerce:has(form.login) { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .sheet--account > .woocommerce:has(form.login) > .newhere { grid-column: 1; grid-row: auto; }
}

/* ---------- LearnDash on a course page: the site's type inside LearnDash's own course layout ---------- */
.sheet--course .learndash-wrapper, .sheet--course .learndash-wrapper * { font-family: inherit; }
.sheet--course .learndash-wrapper .ld-button, .learndash-wrapper .ld-button { border-radius: 0 !important; font-family: Montserrat, "Open Sans", sans-serif; letter-spacing: .08em; text-transform: uppercase; font-weight: 500; }
.sheet--course .learndash-wrapper .ld-item-list .ld-item-list-item { border-radius: 0; }

/* ---------- LearnDash focus mode (lessons, topics, quizzes) ---------- */
.ld-in-focus-mode { font-family: "Open Sans", sans-serif; }
.ld-in-focus-mode .learndash-wrapper * { font-family: inherit; }
/* The Quick exit sits over the focus header's right end, where LearnDash puts the user menu;
   the header makes room so nothing covers either. */
.ld-in-focus-mode .ld-focus-header { padding-right: 170px; }
@media (max-width: 640px) { .ld-in-focus-mode .ld-focus-header { padding-right: 140px; } }

/* ---------- The sign-up form ---------- */
.reg { margin-top: 0; gap: 0; }
.reg .dept__section + .dept__section { margin-top: 34px; padding-top: 30px; border-top: 1px solid #dde1e4; }
.reg .dept__section > h2 { margin-bottom: 18px; }
.reg .field, .reg .fset { margin: 0 0 20px; }
.reg__note { margin: 0 0 30px; font-size: .9375rem; }
.req { color: #b3261e; font-weight: 700; }
.opt { font-weight: 400; color: #4a5d78; }
.hint { margin: 6px 0 0; font-size: .875rem; color: #4a5d78; }
.fset { border: 0; padding: 0; min-width: 0; }
.fset legend { font-weight: 700; padding: 0; margin-bottom: 10px; line-height: 1.45; }
.fset .field label { font-weight: 600; font-size: .9375rem; }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.grid2 .field { margin: 0; }
.grid2 .field--wide { grid-column: 1 / -1; }
.grid2--tight { gap: 14px; }
.choices { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px 18px; }
.choices--row { grid-template-columns: repeat(2, max-content); gap: 10px 32px; }
.choice { display: flex; align-items: center; gap: 10px; font-weight: 400; line-height: 1.4; cursor: pointer; }
.choice input { width: 20px; height: 20px; accent-color: var(--blue); flex: none; }
.field__err { margin: 0 0 8px; color: #b3261e; font-weight: 700; font-size: .9375rem; }
.reg [aria-invalid="true"] { border-color: #b3261e; border-width: 2px; }
.loc { border-left: 3px solid var(--teal); padding: 4px 0 4px 20px; margin: 6px 0 24px; }
.loc__h { font-size: 1.0625rem; margin: 0 0 14px; }
.reg__submit { margin-top: 30px; }
[hidden] { display: none !important; }
@media (max-width: 640px) {
  .grid2 { grid-template-columns: 1fr; }
  .grid2 .grid2--tight { grid-template-columns: minmax(0, 1fr) 120px; }
  .reg__submit { width: 100%; }
}

/* A course page for someone not enrolled: how to register, in place of LearnDash's "Closed" bar. */
.sheet > .enrol { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px; background: var(--tint); border: 0; padding: 28px 32px; margin-bottom: 24px; }
.enrol__h { margin: 0 0 6px; font-size: 1.375rem; }
.enrol__p { margin: 0; line-height: 1.6; }
.enrol__price { display: inline-block; margin-left: 8px; font-weight: 800; color: var(--teal-deep); }
.course-locked .learndash-wrapper .ld-course-status.ld-course-status-not-enrolled { display: none; }

/* WooCommerce's clearfix puts empty ::before/::after boxes on its wrappers; inside a grid each one
   takes a cell and pushes the real columns over (seen 10/23 on My account). Grids here have no floats. */
.sheet > .woocommerce::before, .sheet > .woocommerce::after,
.safe-training form.checkout::before, .safe-training form.checkout::after { display: none !important; content: none !important; }
.newhere p { margin-bottom: 22px; }

/* The photo title band (10/23): the public site's band over the team photo, at the store's height.
   site.css's .title padding is the public homepage-scale band; the store's pages are tools, so the
   band keeps the compact band's bottom and the photo's top. The line stays a sentence. */
.title--photo { padding-bottom: clamp(64px, 7vw, 110px); }
.title--photo .title__bg img { object-position: 50% 32%; }
.title--photo .title__shade { background: rgba(24, 54, 96, .7); }

/* A course's facts on the store home: the public site's "Course at a glance", two by two. */
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 18px 0 8px; border-top: 2px solid var(--teal-deep); }
.facts__item { padding: 14px 18px 14px 0; border-bottom: 1px solid #e6e9ec; }
.facts__item:nth-child(even) { padding-left: 18px; border-left: 1px solid #e6e9ec; }
.facts dt { font-family: Montserrat, "Open Sans", sans-serif; font-weight: 600; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--teal-deep); margin-bottom: 4px; }
.facts dd { margin: 0; font-weight: 700; line-height: 1.45; font-size: .9375rem; }
@media (max-width: 520px) { .facts { grid-template-columns: 1fr; } .facts__item:nth-child(even) { padding-left: 0; border-left: 0; } }

/* ---------- The 10/27 review pass ---------- */

/* Reading leading. site.css sets the body at 2.25, the public site's leading for short marketing
   lines; on a store whose pages are read (course descriptions, lessons, forms, policies) it set every
   paragraph double-spaced. Reading text sits at 1.7 here; the title band and the side cards keep theirs. */
.safe-training .dept__main p, .safe-training .dept__main li, .safe-training .sheet,
.safe-training .learndash-wrapper, .ld-in-focus-mode .ld-focus, .safe-training .prose { line-height: 1.7; }
.safe-training .sheet h1, .safe-training .sheet h2, .safe-training .sheet h3,
.safe-training .learndash-wrapper h1, .safe-training .learndash-wrapper h2, .safe-training .learndash-wrapper h3 { line-height: 1.2; }

/* Lines break where a reader expects: headings balance, running text never strands a word. */
.safe-training h1, .safe-training h2, .safe-training h3, .safe-training h4, .offer__h, .sidecard__head, .enrol__h, .newhere__h, .fset legend { text-wrap: balance; }
.safe-training p, .safe-training li, .safe-training dd, .safe-training label, .safe-training td { text-wrap: pretty; }
/* A button's label is one line wherever it fits; on a phone it may wrap rather than overflow. */
.safe-training .btn, .safe-training .woocommerce .button, .learndash-wrapper .ld-button, .learndash-wrapper .ld-content-action .ld-button, .learndash-wrapper .ld-expand-button { white-space: nowrap; }
@media (max-width: 420px) { .safe-training .btn, .safe-training .woocommerce .button { white-space: normal; text-align: center; } }

/* The old store's Elementor kit (uploads/elementor/css/post-5.css) still loads on every page whose
   stored layout was Elementor's, and its "custom CSS" carries global rules with !important:
   `ul, ol { margin-bottom: 20px }`, `p:last-of-type { margin-bottom: 0 }`, `body { background }`.
   The kit stays (the privacy policy is still drawn by Elementor and needs its colours and type);
   the theme's own parts take their spacing back. Seen 10/27: the header's links rode 10px above the
   button on every page but a course page (where the kit does not load), and a side card's last
   paragraph sat on its button. */
.safe-training .nav__list, .safe-training .menu__list, .safe-training .foot__list, .safe-training .mine, .safe-training .figs { margin-bottom: 0 !important; }
.safe-training .nav__list { margin: 0; padding: 0; list-style: none; }
.safe-training .side__p { margin-bottom: 18px !important; }
.safe-training .newhere p { margin-bottom: 22px !important; }
.safe-training .offer__desc p { margin-bottom: 10px !important; }
body.safe-training { background-color: var(--paper) !important; }

/* The side column holds its cards and stays in view; it no longer stretches into a tall empty
   white panel beside a long main card. */
.safe-training .dept { align-items: start; }
.safe-training .dept__side { position: sticky; top: 24px; }
@media (max-width: 960px) { .safe-training .dept__side { position: static; } }

/* A product's short description keeps its own list. */
.offer__desc ul, .offer__desc ol { margin: 0 0 10px; padding-left: 1.25em; list-style: disc; }
.offer__desc li { margin-bottom: .35em; }
.offer__desc li::marker { color: var(--teal-deep); }

/* A long course name steps down so it holds in two or three lines (beats the 22ch rule above). */
.safe-training .title.title--long h1 { font-size: clamp(1.75rem, 1.2rem + 2.2vw, 3rem); line-height: 1.15; max-width: 30ch; margin-inline: auto; }

/* The cart: every course and event seat is sold one to a person, so the quantity column and
   "Update cart" have nothing to do (on a phone the empty quantity row overlapped the subtotal). */
.safe-training .woocommerce table.cart .product-quantity, .safe-training .woocommerce button[name="update_cart"] { display: none !important; }
@media (max-width: 520px) {
  .safe-training .woocommerce table.cart td.actions .coupon { display: grid; gap: 10px; float: none; width: 100%; }
  .safe-training .woocommerce table.cart td.actions .coupon .input-text { width: 100%; margin: 0; }
  .safe-training .woocommerce table.cart td.actions .coupon .button { width: 100%; }
}
/* On a phone a notice reads text first, then its button, full width. */
@media (max-width: 760px) {
  .safe-training .woocommerce-message, .safe-training .woocommerce-info { flex-direction: column; align-items: stretch; gap: 12px; }
  .safe-training .woocommerce-message .button, .safe-training .woocommerce-info .button,
  .safe-training .woocommerce .woocommerce-message a.button, .safe-training .woocommerce .woocommerce-info a.button { margin: 0; width: 100%; white-space: nowrap; font-size: .8125rem; letter-spacing: .08em; padding: 12px 14px; }
}
/* Legal pages carry the old store's long numbered headings; on a phone they are section heads, not page titles. */
@media (max-width: 760px) {
  .safe-training .prose h2, .safe-training .sheet .elementor-widget-heading .elementor-heading-title { font-size: 1.25rem !important; line-height: 1.3; }
  .safe-training .prose h3 { font-size: 1.125rem; }
}

/* Lost password: one column, the form at a readable width (it fell into the account grid's 240px column). */
.sheet--account > .woocommerce:has(form.lost_reset_password),
.sheet--account > .woocommerce:has(.woocommerce-ResetPassword) { display: block; }
.safe-training form.lost_reset_password { max-width: 560px; }
.safe-training form.lost_reset_password .form-row { width: 100% !important; float: none !important; }

/* Checkout: a site that sells courses and event seats asks for no shipping (inc/store.php); the
   agreement's required star sat alone on a third grid row under its sentence. */
.safe-agree .form-row label.checkbox .required, .safe-agree .form-row label.checkbox abbr.required { display: none; }

/* From 1800px site.css runs the main card as a two-column magazine body (the public site's rule 10).
   Prose takes that well (a product's description stays in two columns). Two things here do not:
   the course list, where an offer's title and price ended one column and its bullets and button
   began the next, and the sign-up form, whose right column squeezed the State menu to "Ch".
   Each section of the list now moves whole (inline-block cannot be split in any engine), and the
   form runs as one column across the card. Measured 10/27 at 1920. */
@media (min-width: 1800px) {
  .home .dept__main > .dept__section, .safe-training .dept__main > .dept__section:has(.offer) { display: inline-block; width: 100%; vertical-align: top; break-inside: avoid; }
  .safe-training .dept__main:has(.reg), .page-template-page-register .dept__main { column-count: 1; }
}
/* Checkout: the order-notes heading sat on the email field above it. */
.safe-training .woocommerce-additional-fields > h3 { margin-top: 32px; }

/* ---------- LearnDash, the 10/27 pass ---------- */
/* Section headings are one label style. The course data names them "Chapter 1", "Chapter 2", then
   "CHAPTER 3" to "CHAPTER 15"; as a label they read the same without touching the course. */
.learndash-wrapper .ld-lesson-section-heading, .learndash-wrapper .ld-item-list-section-heading .ld-lesson-section-heading { font-family: Montserrat, "Open Sans", sans-serif; font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--teal-deep); }
/* The Quick exit is fixed at the top right (150 x 82 px, 26px down). From 961 to 1679px the lesson
   column reached under it (measured 10/27: 77px at 1050, 97px at 1440), so lesson text scrolled
   beneath the exit and its "What does this do?" label sat on the lesson's title. The column keeps
   the same lane the public site's header keeps; from 1680px the centred column clears it. */
@media (min-width: 961px) and (max-width: 1679px) { .ld-in-focus-mode .ld-focus-main { padding-right: 170px; box-sizing: border-box; } }
/* The focus bar is 50px: its buttons (Previous, Next, Mark Complete) fit inside it rather than
   hanging 4px above and below, which left a stray pill edge under the timer. */
.ld-in-focus-mode .ld-focus-header .ld-content-actions { top: 0; height: 50px; align-items: center; }
.ld-in-focus-mode .ld-focus-header .ld-content-action .ld-button,
.ld-in-focus-mode .ld-focus-header .learndash_mark_complete_button { min-height: 0 !important; height: auto; padding-top: 7px; padding-bottom: 7px; line-height: 1.2; }
/* One line each: in a 159px cell (1050 wide) "Previous Lesson" and "Mark Complete" wrapped, and the
   two-line Mark Complete grew to 57px, so its edge showed under the timer and over the lesson. */
/* LearnDash styles its Mark Complete button through a chain of :not() selectors that outranks any
   theme selector, so these few declarations carry !important (measured 10/27: without it the
   button kept LearnDash's 1em padding and wrapped). */
.ld-in-focus-mode .ld-focus-header .ld-button .ld-text, .ld-in-focus-mode .ld-focus-header .learndash_mark_complete_button { white-space: nowrap !important; }
.ld-in-focus-mode .ld-focus-header .learndash_mark_complete_button { padding: 7px 14px !important; }
@media (max-width: 1279px) {
  .ld-in-focus-mode .ld-focus-header .ld-content-action .ld-button,
  .ld-in-focus-mode .ld-focus-header .learndash_mark_complete_button { font-size: .6875rem !important; letter-spacing: .04em !important; padding-left: 10px !important; padding-right: 10px !important; }
}
/* The lesson's title and the focus bar. */
.ld-in-focus-mode .ld-focus-content h1 { line-height: 1.15; }
.ld-in-focus-mode .ld-focus-header { line-height: 1.3; }
.ld-in-focus-mode .ld-focus-header .ld-progress-stats, .ld-in-focus-mode .ld-focus-header .ld-button, .ld-in-focus-mode .ld-focus-header .ld-content-action a { white-space: nowrap; }
/* LearnDash's warning prints amber text on white (about 2:1); here it is the site's ink beside the
   amber mark, and the message takes the room it needs before the button. */
.learndash-wrapper .ld-alert { flex-wrap: wrap; gap: 14px 24px; line-height: 1.5; }
.learndash-wrapper .ld-alert .ld-alert-content { flex: 1 1 240px; }
.learndash-wrapper .ld-alert-warning .ld-alert-content, .learndash-wrapper .ld-alert-warning .ld-alert-messages { color: var(--blue); }


/* My account > Addresses (10/27): WooCommerce titles each address with class "title", the class of
   the site's title band, so each heading drew a navy band 600px tall. Here it is a plain heading
   with its Edit link, the address in upright type, each address in a light frame. */
.safe-training .woocommerce-Addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; margin-top: 14px; }
.safe-training .woocommerce-Addresses::before, .safe-training .woocommerce-Addresses::after { content: none !important; display: none !important; }
.safe-training .woocommerce-Address { width: auto !important; float: none !important; border: 1px solid #dde1e4; padding: 20px 22px; }
.safe-training .woocommerce-Address .title { position: static; overflow: visible; min-height: 0; padding: 0; margin: 0 0 12px; background: none; color: var(--blue); text-align: left; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; }
.safe-training .woocommerce-Address .title::before, .safe-training .woocommerce-Address .title::after { content: none; display: none; }
.safe-training .woocommerce-Address .title h2, .safe-training .woocommerce-Address .title h3 { margin: 0; font-size: 1.25rem; line-height: 1.3; color: var(--blue); text-shadow: none; }
.safe-training .woocommerce-Address .title .edit { float: none; font-weight: 700; color: var(--blue); }
.safe-training .woocommerce-Address address { font-style: normal; line-height: 1.7; }
/* The address and account forms: room under the heading, the password box in the site's frame. */
.safe-training .woocommerce-MyAccount-content form > h2, .safe-training .woocommerce-MyAccount-content form > h3 { margin: 0 0 18px; }
.safe-training .woocommerce-EditAccountForm fieldset { border: 1px solid #dde1e4; padding: 20px 22px 4px; margin: 26px 0 22px; }
.safe-training .woocommerce-EditAccountForm legend { padding: 0 8px; font-weight: 700; }
.safe-training .woocommerce-EditAccountForm em, .safe-training .woocommerce-MyAccount-content .description { font-style: normal; font-size: .875rem; color: #4a5d78; }

/* 11/1 eye pass: phone footer spacing to match the public site; the State box no longer cuts off "Choose" at laptop widths. */
@media (max-width: 700px) {
  .foot__addr, .foot__list a, .foot p, .foot .frame, .foot .frame *, .opt { line-height: 1.55 !important; }
}
@media (max-width: 1200px) { .grid2--tight { grid-template-columns: minmax(130px, 1.4fr) minmax(84px, 1fr); } }