/* ============================================================================
   FoundationPress — Lyrisk Diktion : visual restyle
   Müller-Brockmann / Swiss. Loaded AFTER the parent's foundation.css, so plain
   single-class overrides win by source order; !important is used only where
   foundation.css uses higher-specificity or inline-ish rules.

   Palette sampled from the course poster (FBAffischITAmedLogo):
     blue  #0060a8  — navigation, structure, primary buttons
     green #30a800  — progress / success
     red   #d81800  — ACCENT ONLY (links, selection, alerts, brand dot)
     white background, black ink.

   Scope: repaint existing markup only. No layout restructure. WPBakery page-
   builder content, Adobe Edge compositions and the audio player are left
   functionally intact (see "Protected" section at the end).
   ========================================================================== */

:root {
  --paper:      #ffffff;
  --paper-warm: #f4f4f3;
  --ink:        #0a0a0a;
  --ink-soft:   #1a1a1a;
  --mute:       #8a8a87;
  --mute-2:     #d8d8d4;

  /* Poster colours */
  --blue:       #0060a8;   /* nav, structure, primary buttons */
  --blue-deep:  #004890;
  --green:      #30a800;   /* progress / success */
  --green-deep: #1f8a00;
  --red:        #d81800;   /* accent only */
  --red-deep:   #b01400;
  --ok:         #1f8a00;   /* success text/border (poster green, darker for contrast) */
  --warn:       #a86a00;

  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --measure: 70ch;   /* readable line length for body prose */
}

/* ----------------------------------------------------------------------------
   Base + typography
   -------------------------------------------------------------------------- */
html { background: var(--paper); }
body {
  background: var(--paper) !important;
  color: var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern", "liga";
}

h1, h2, h3, h4, h5, h6,
.entry-title {
  font-family: var(--sans);
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.08;
}
h1, .entry-title { letter-spacing: -0.025em; }
h4, h5, h6 { font-weight: 500; letter-spacing: -0.005em; }

p, li, dd, dt { color: var(--ink-soft); }
p { line-height: 1.6; }

/* Reading measure — prose contexts ONLY. Never LearnDash single types
   (lessons/topics/courses) or builder/comp content. */
.blog .entry-content p,
.archive .entry-content p,
.search .entry-content p,
.single-post .entry-content p,
.error404 p {
  max-width: var(--measure);
}

hr {
  border: 0;
  border-top: 1px solid var(--ink);
  margin: 1.5rem 0;
}

/* Links — red is the accent; underline on hover */
a { color: var(--red); }
a:hover, a:focus { color: var(--red-deep); }
.entry-content a { text-underline-offset: 2px; text-decoration: underline; }

::selection { background: var(--red); color: var(--paper); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--ink); border-radius: 0; }

/* Monospace flavour for small meta */
.post-meta, .entry-meta, time, .breadcrumbs, .pagination { font-family: var(--mono); }

/* ----------------------------------------------------------------------------
   Top-bar / title-bar / menus / off-canvas nav  (→ paper + ink, blue active)
   -------------------------------------------------------------------------- */
.top-bar,
.top-bar ul {
  background: var(--paper) !important;
  color: var(--ink);
}
header#masthead .top-bar,
.main-navigation.top-bar {
  border-bottom: 1px solid var(--ink);
}

.top-bar .menu a,
.top-bar .menu .home a,
.top-bar .menu > li > a {
  color: var(--ink) !important;
  font-family: var(--sans);
  font-weight: 500;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.top-bar .menu a:hover:not(.button) { background: var(--blue) !important; color: var(--paper) !important; }
.top-bar .menu li:not(:last-child) { border-right: 1px solid var(--mute-2); }
.top-bar .menu .active > a,
.top-bar .menu li.current-menu-item > a { color: var(--blue) !important; }

/* Dropdown submenu */
.top-bar .dropdown.menu .submenu,
.dropdown.menu .submenu {
  background: var(--paper) !important;
  border: 1px solid var(--ink) !important;
}
.dropdown.menu .submenu a { color: var(--ink) !important; }
.dropdown.menu .submenu a:hover { background: var(--blue) !important; color: var(--paper) !important; }

/* Mobile title bar + off-canvas */
.title-bar { background: var(--ink) !important; color: var(--paper); border: 0; }
.title-bar-title a, .title-bar .menu-icon { color: var(--paper) !important; }
.off-canvas { background: var(--paper) !important; border-right: 1px solid var(--ink); }
.off-canvas a { color: var(--ink) !important; }
.off-canvas ul#menu-main-menu li { border-bottom: 1px solid var(--mute-2); }

/* Brand dot — the single red accent in the nav (decorative) */
.top-bar .menu .home a::before {
  content: "";
  display: inline-block;
  width: 10px; height: 10px;
  margin-right: 8px;
  background: var(--red);
  vertical-align: baseline;
}

/* ----------------------------------------------------------------------------
   Buttons  (primary = blue; .alert = red accent; .success = green)
   -------------------------------------------------------------------------- */
.button {
  background: var(--blue);
  color: var(--paper);
  border: 1px solid var(--blue);
  border-radius: 0;
  font-family: var(--sans);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  transition: background 120ms, color 120ms;
}
.button:hover, .button:focus { background: var(--blue-deep); border-color: var(--blue-deep); color: var(--paper); }

.button.secondary { background: transparent; color: var(--ink); border-color: var(--ink); }
.button.secondary:hover, .button.secondary:focus { background: var(--ink); color: var(--paper); }

.button.alert { background: var(--red); border-color: var(--red); color: var(--paper); }
.button.alert:hover, .button.alert:focus { background: var(--red-deep); border-color: var(--red-deep); }

.button.success { background: var(--green); border-color: var(--green); color: var(--paper); }
.button.success:hover { background: var(--green-deep); border-color: var(--green-deep); }
.button.warning { background: var(--warn); border-color: var(--warn); color: var(--paper); }
.button.hollow  { background: transparent; color: var(--ink); border-color: var(--ink); }
.button.hollow:hover { background: var(--ink); color: var(--paper); }

.button-group .button { border-right-color: var(--paper); }

/* ----------------------------------------------------------------------------
   Callouts  (flattened: squared, hairline border, paper-tinted, accent bar)
   -------------------------------------------------------------------------- */
.callout {
  background: var(--paper-warm);
  color: var(--ink-soft);
  border: 1px solid var(--ink);
  border-left: 4px solid var(--ink);
  border-radius: 0;
}
.callout.secondary { border-left-color: var(--mute); }
.callout.primary   { border-left-color: var(--blue); background: #eaf2f8; }
.callout.alert     { border-left-color: var(--red);  background: #f8eae8; }
.callout.success   { border-left-color: var(--green); background: #eef5e8; }
.callout.warning   { border-left-color: var(--warn); background: #f4eede; }
.callout h1, .callout h2, .callout h3, .callout h4, .callout h5 { color: var(--ink); }

/* ----------------------------------------------------------------------------
   Accordion  (active/hover = blue structure)
   -------------------------------------------------------------------------- */
.accordion { background: transparent; border-top: 1px solid var(--ink); }
.accordion-item { border-bottom: 1px solid var(--ink); }
.accordion-title {
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 500;
  border: 0;
  font-size: 1.05rem;
}
.accordion-title:hover, .accordion-title:focus { background: var(--paper-warm); color: var(--blue); }
.accordion-title::before { color: var(--blue); }
.accordion-item.is-active > .accordion-title { color: var(--blue); }
.accordion-content { background: transparent; border: 0; color: var(--ink-soft); }

/* ----------------------------------------------------------------------------
   Tabs  (active = blue)
   -------------------------------------------------------------------------- */
.tabs { background: transparent; border: 1px solid var(--ink); border-radius: 0; }
.tabs-title > a {
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 0.82rem;
}
.tabs-title > a:hover { background: var(--paper-warm); color: var(--blue); }
.tabs-title > a:focus, .tabs-title > a[aria-selected="true"] {
  background: var(--blue); color: var(--paper);
}
.tabs-content { background: transparent; border: 1px solid var(--ink); border-top: 0; color: var(--ink-soft); }

/* ----------------------------------------------------------------------------
   Tooltip (.has-tip + .tooltip) — black bubble, squared, mono
   -------------------------------------------------------------------------- */
.has-tip {
  border-bottom: 1px dotted var(--ink);
  font-weight: 600;
  cursor: help;
}
.tooltip {
  background-color: var(--ink);
  color: var(--paper);
  border-radius: 0;
  font-family: var(--mono);
  font-size: 0.78rem;
  letter-spacing: 0.01em;
}
.tooltip::before { border-color: transparent transparent var(--ink) transparent; }   /* top pip */
.tooltip.bottom::before { border-color: transparent transparent var(--ink) transparent; }
.tooltip.top::before { border-color: var(--ink) transparent transparent transparent; }
.tooltip.left::before { border-color: transparent transparent transparent var(--ink); }
.tooltip.right::before { border-color: transparent var(--ink) transparent transparent; }

/* ----------------------------------------------------------------------------
   Labels / badges / breadcrumbs / pagination
   -------------------------------------------------------------------------- */
.label {
  background: var(--ink); color: var(--paper); border-radius: 0;
  font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.04em;
}
.label.primary { background: var(--blue); }
.label.secondary { background: var(--mute); }

.badge { background: var(--red); color: var(--paper); border-radius: 0; font-family: var(--mono); }
.badge.secondary { background: var(--ink); }

.breadcrumbs { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; }
.breadcrumbs li { color: var(--mute); }
.breadcrumbs a { color: var(--ink); }
.breadcrumbs a:hover { color: var(--blue); }
.breadcrumbs .disabled { color: var(--mute-2); }

.pagination a, .pagination button { color: var(--ink); border-radius: 0; }
.pagination a:hover { background: var(--paper-warm); }
.pagination .current { background: var(--blue); color: var(--paper); border-radius: 0; }
.pagination .disabled { color: var(--mute-2); }

/* ----------------------------------------------------------------------------
   Progress bar / meter  (→ green)
   -------------------------------------------------------------------------- */
.progress { background: var(--mute-2); border-radius: 0; height: 0.6rem; }
.progress-meter { background: var(--green); border-radius: 0; }
.progress.success .progress-meter { background: var(--green); }
.progress.alert .progress-meter { background: var(--red); }
progress { accent-color: var(--green); }

/* ----------------------------------------------------------------------------
   Tables
   -------------------------------------------------------------------------- */
table { border-collapse: collapse; border: 1px solid var(--ink); background: transparent; }
table thead { background: var(--ink); color: var(--paper); border: 0; }
table thead th { font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; }
table tbody { background: transparent; border: 0; }
table tbody tr { border-bottom: 1px solid var(--mute-2); }
table.unstriped tbody, table:not(.unstriped) tbody tr:nth-child(even) { background: var(--paper-warm); }
table tbody td, table tbody th { color: var(--ink-soft); }
/* Foundation's `table.hover tr:hover` (foundation.css) repaints EVERY row on
   hover — including the <thead> row — to a light grey, which made the black
   header's white text vanish. Keep the header black; tint body rows with the
   warm paper instead of Foundation's greys. */
table.hover thead tr:hover { background: var(--ink); }
table.hover tbody tr:hover,
table.hover tbody tr:nth-of-type(even):hover { background: var(--paper-warm); }

/* ----------------------------------------------------------------------------
   Reveal modal + overlay + close-button
   -------------------------------------------------------------------------- */
.reveal { background: var(--paper); border: 1px solid var(--ink); border-radius: 0; box-shadow: 12px 12px 0 var(--ink); }
.reveal-overlay { background: rgba(10,10,10,0.55); }
.close-button { color: var(--ink); }
.close-button:hover, .close-button:focus { color: var(--red); }

/* ----------------------------------------------------------------------------
   Forms  (focus = blue)
   -------------------------------------------------------------------------- */
label { color: var(--ink); font-weight: 500; }
input[type="text"], input[type="password"], input[type="email"], input[type="url"],
input[type="search"], input[type="number"], input[type="tel"], textarea, select {
  background: var(--paper);
  border: 1px solid var(--ink);
  border-radius: 0;
  color: var(--ink);
  box-shadow: none;
  font-family: var(--sans);
}
input:focus, textarea:focus, select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 2px rgba(0,96,168,0.20);
  background: var(--paper);
}
::placeholder { color: var(--mute); }
fieldset { border: 1px solid var(--mute-2); border-radius: 0; }

/* Switch / slider accents (→ blue control state) */
.switch-paddle { border-radius: 0; background: var(--mute-2); }
input:checked ~ .switch-paddle { background: var(--blue); }
.switch-paddle::after { border-radius: 0; }
.slider-fill { background: var(--blue); }
.slider-handle { background: var(--ink); border-radius: 0; }

/* Dropdown pane */
.dropdown-pane { background: var(--paper); border: 1px solid var(--ink); border-radius: 0; }

/* ----------------------------------------------------------------------------
   LearnDash (LD30) — primary buttons blue, progress green, links red
   -------------------------------------------------------------------------- */
.learndash-wrapper { font-family: var(--sans); color: var(--ink); }
.learndash-wrapper a { color: var(--red); }
.learndash-wrapper h1, .learndash-wrapper h2, .learndash-wrapper h3 { color: var(--ink); letter-spacing: -0.01em; }

.learndash-wrapper .ld-button,
.learndash-wrapper .learndash_mark_complete_button,
.learndash-wrapper #sfwd-mark-complete input[type="submit"],
.learndash-wrapper .wpProQuiz_button,
.learndash-wrapper .wpProQuiz_QuestionButton {
  background: var(--blue) !important;
  color: var(--paper) !important;
  border: 1px solid var(--blue) !important;
  border-radius: 0 !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 500;
  box-shadow: none !important;
  padding: 0.85em 1.6em !important;
  line-height: 1.2 !important;
  height: auto !important;
}
.learndash-wrapper .ld-button:hover,
.learndash-wrapper .learndash_mark_complete_button:hover { background: var(--blue-deep) !important; border-color: var(--blue-deep) !important; }

.learndash-wrapper .ld-progress .ld-progress-bar {
  background: var(--mute-2) !important; border-radius: 0 !important; height: 0.6rem !important;
}
.learndash-wrapper .ld-progress .ld-progress-bar .ld-progress-bar-percentage {
  background: var(--green) !important; border-radius: 0 !important;
}

.learndash-wrapper .ld-item-list .ld-item-list-item,
.learndash-wrapper .ld-table-list .ld-table-list-items .ld-table-list-item,
.learndash-wrapper .ld-table-list .ld-table-list-header {
  border-radius: 0 !important; border-color: var(--mute-2) !important; background: transparent !important;
}
.learndash-wrapper .ld-item-list .ld-item-list-item-preview:hover { background: var(--paper-warm) !important; }
.learndash-wrapper .ld-status.ld-status-complete { background: var(--green) !important; color: var(--paper) !important; border-radius: 0 !important; }
.learndash-wrapper .ld-status.ld-status-incomplete { background: var(--mute-2) !important; color: var(--ink) !important; border-radius: 0 !important; }
.learndash-wrapper .ld-tabs .ld-tabs-navigation .ld-tab.ld-active { border-bottom-color: var(--blue) !important; color: var(--blue) !important; }
.learndash-wrapper .ld-focus-sidebar { background: var(--paper-warm) !important; }
.learndash-wrapper .ld-alert.ld-alert-success { border-color: var(--green) !important; }
.learndash-wrapper .ld-alert.ld-alert-warning { border-color: var(--warn) !important; }

/* ----------------------------------------------------------------------------
   design-upgrade-learndash ("ldx") — this plugin skins LearnDash via --ldx-*
   custom properties (blue #00a2e8, green #019e7c, pill buttons). It defines
   them in :root WITHOUT !important, so redefining them here with !important
   repaints its whole palette in one place — order-independent.
   -------------------------------------------------------------------------- */
:root {
  /* Square everything off */
  --ldx-global-border-radius: 0 !important;
  --ldx-btn-border-radius: 0 !important;
  --ldx-progress-bar-border-radius: 0 !important;
  --ldx-grid-item-border-radius: 0 !important;
  --ldx-achievements-popup-border-radius: 0 !important;

  /* Links / accents stay red */
  --ldx-color-link-hover: var(--red) !important;

  /* Buttons — primary actions = blue */
  --ldx-btn-primary-bg-color: var(--blue) !important;
  --ldx-btn-primary-bg-color-hover: var(--blue-deep) !important;
  --ldx-btn-primary-text-color: var(--paper) !important;
  --ldx-btn-primary-text-color-hover: var(--paper) !important;
  --ldx-btn-standard-bg-color: var(--blue) !important;
  --ldx-btn-standard-bg-color-hover: var(--blue-deep) !important;
  --ldx-btn-standard-text-color: var(--paper) !important;
  --ldx-btn-standard-text-color-hover: var(--paper) !important;

  /* Content lists (course/lesson tables) */
  --ldx-content-lists-header-bg-color: var(--ink) !important;
  --ldx-content-lists-header-text-color: var(--paper) !important;
  --ldx-content-lists-lesson-text-color-hover: var(--red) !important;
  --ldx-content-lists-lesson-border-color: var(--mute-2) !important;
  --ldx-content-lists-separator-color: var(--mute-2) !important;
  --ldx-course-status-bg-color: var(--paper-warm) !important;

  /* Focus mode */
  --ldx-focus-mode-topmenu-bg-color: var(--ink) !important;
  --ldx-focus-mode-sidebar-course-bg-color: var(--ink) !important;
  --ldx-course-nav-section-bg-color: var(--paper-warm) !important;
  --ldx-course-nav-link-text-color: var(--ink) !important;
  --ldx-course-nav-link-text-color-hover: var(--blue) !important;

  /* Progress bars (the green sidebar bar) — green */
  --ldx-progress-bar-container-bg: var(--mute-2) !important;
  --ldx-progress-bar-bg: var(--green) !important;

  /* Tooltip / alerts / status */
  --ldx-tooltip-bg-color: var(--ink) !important;
  --ldx-tooltip-text-color: var(--paper) !important;
  --ldx-color-correct: var(--green-deep) !important;
  --ldx-color-incorrect: var(--red) !important;
  --ldx-color-in-progress: var(--warn) !important;
  --ldx-alert-success-color-text: var(--green-deep) !important;
  --ldx-alert-success-color-border: var(--green) !important;

  /* Login / register panels */
  --ldx-register-panel-bg-color: var(--blue) !important;
  --ldx-login-panel-heading-color: var(--blue) !important;

  /* Course-grid ribbons + star rating */
  --ldx-grid-ribbon-bg-color: var(--red) !important;
  --ldx-grid-ribbon-custom-bg-color: var(--red) !important;
  --ldx-grid-ribbon-free-bg-color: var(--green) !important;
  --ldx-grid-ribbon-enrolled-bg-color: var(--blue) !important;
  --ldx-grid-item-border-color: var(--mute-2) !important;
  --ldx-star-rating-color-filled: var(--red) !important;
  --ldx-pagination-bg-color: var(--paper-warm) !important;
}

/* ----------------------------------------------------------------------------
   LearnDash LEGACY theme (profile, course-progress widget, resume button,
   join/continue buttons). Non-LD30 classes from
   sfwd-lms/themes/legacy/.../learndash_template_style.css.
   -------------------------------------------------------------------------- */

/* Resume / join / continue → blue primary CTA */
.learndash-resume-button input[type="submit"],
.btn-join, #btn-join,
a#quiz_continue_link,
.learndash_checkout_buttons input.btn-join[type="button"] {
  background: var(--blue) !important;
  color: var(--paper) !important;
  border: 1px solid var(--blue) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 500;
  text-shadow: none !important;
  /* breathing room — the plugin ships almost none */
  padding: 0.85em 1.6em !important;
  line-height: 1.2 !important;
  height: auto !important;
  white-space: nowrap;
}
/* The wrapper <a> shouldn't add its own box around the padded input */
.learndash-resume-button { background: transparent !important; border: 0 !important; display: inline-block; }
.learndash-resume-button:hover input[type="submit"],
.btn-join:hover, .btn-join:focus, .btn-join:active, .btn-join:visited,
#btn-join:hover, #btn-join:focus {
  background: var(--blue-deep) !important;
  border-color: var(--blue-deep) !important;
  color: var(--paper) !important;
}

/* Legacy course-progress bars (widget + profile) → green */
.course_progress { background: var(--mute-2) !important; border-radius: 0 !important; }
.course_progress_blue { background: var(--green) !important; border-radius: 0 !important; }
.widget_ldcourseprogress .course_progress { height: 0.6rem !important; }

/* ----------------------------------------------------------------------------
   Legacy PROFILE (/min-profil/) — Swiss reskin of the EXISTING markup only.
   (No invented stats/heatmap/notes — those don't exist in the real profile.)
   -------------------------------------------------------------------------- */

/* Identity: avatar + name/username/email + points + edit */
.profile_avatar img {
  border-radius: 0 !important;
  border: 1px solid var(--ink);
  display: block;
}
.learndash_profile_details { color: var(--ink-soft); }
.learndash_profile_details > div { padding: 3px 0; }
.learndash_profile_details b,
.learndash_profile_details strong { color: var(--ink); font-weight: 700; }
.learndash-course-points { font-family: var(--mono); margin-top: 8px; color: var(--ink); }
.profile_edit_profile { margin-top: 12px; }
.profile_edit_profile a {
  display: inline-block;
  padding: 0.55em 1.1em;
  border: 1px solid var(--blue);
  color: var(--blue) !important;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 0.8rem;
  font-weight: 500;
}
.profile_edit_profile a:hover { background: var(--blue); color: var(--paper) !important; }

/* Section + column headings (bold ink with a hairline rule) */
.learndash_profile_heading {
  color: var(--ink) !important;
  font-family: var(--sans) !important;
  font-weight: 700;
  letter-spacing: -0.01em;
  font-size: 1.2rem;
  border-bottom: 1px solid var(--ink);
  padding-bottom: 10px;
  margin: 32px 0 4px;
}
/* Column labels read as mono caps (table-header feel) */
.ld_profile_course, .ld_profile_status, .ld_profile_certificate,
.course_overview_heading,
.learndash_profile_quiz_heading .quiz_title,
.learndash_profile_quiz_heading .certificate,
.learndash_profile_quiz_heading .scores,
.learndash_profile_quiz_heading .statistics {
  font-family: var(--mono) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.72rem !important;
  color: var(--mute) !important;
  font-weight: 500 !important;
}
.course_overview_heading { border: 0 !important; padding: 0 !important; margin: 6px 0 4px !important; }

/* Course rows */
#course_list > div { border-bottom: 1px solid var(--ink); padding: 14px 0; }
.learndash_profile a,
.learndash_profile_details a,
.learndash-course-link a,
#course_list a { color: var(--ink) !important; }
.learndash-course-link a { font-weight: 700; font-size: 1.05rem; }
.learndash-course-link a:hover,
#course_list a:hover,
.learndash_profile_details a:hover { color: var(--blue) !important; }
.learndash-course-status .completed,
.learndash-course-status a.completed { color: var(--green) !important; }
.list_arrow { color: var(--ink); }
.right { font-family: var(--mono); font-size: 0.8rem; color: var(--ink); }
dd.course_progress { margin: 6px 0 0 !important; }
.course_progress, .course_progress_blue { height: 8px !important; }

/* Quizzes table — mono numerics */
.learndash_profile_quizzes { margin-top: 8px; }
.learndash_profile_quizzes .scores,
.learndash_profile_quizzes .statistics,
.learndash_profile_quizzes .quiz_date { font-family: var(--mono); }
.learndash_profile_quizzes .quiz_title { font-weight: 500; }

/* Expand All / Collapse All toggle */
.expand_collapse, .expand_collapse a {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.72rem;
  color: var(--ink) !important;
}
.expand_collapse a:hover { color: var(--blue) !important; }

/* Identity hero injected by profile-enhance.js — big name + % box */
.lk-identity { margin: 8px 0 16px; }
.lk-identity__kicker {
  font-family: var(--mono); text-transform: uppercase; letter-spacing: 0.06em;
  font-size: 0.72rem; color: var(--red);
}
.lk-identity__rule { border: 0; border-top: 1px solid var(--ink); margin: 12px 0 0; }
.lk-identity__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px;
  align-items: stretch; margin-top: 32px;
}
@media (max-width: 900px) { .lk-identity__grid { grid-template-columns: 1fr; gap: 24px; } }
.lk-identity__role {
  font-family: var(--mono) !important; text-transform: uppercase; letter-spacing: 0.06em;
  font-size: 0.72rem !important; color: var(--mute); margin-bottom: 12px;
}
.lk-identity__name {
  font-family: var(--sans) !important; font-weight: 700 !important;
  font-size: clamp(44px, 6.5vw, 104px) !important; line-height: 0.92 !important;
  letter-spacing: -0.025em; color: var(--ink); margin: 0 !important;
}
.lk-identity__name span { color: var(--red); }
.lk-identity__meta {
  font-family: var(--mono) !important; text-transform: uppercase; letter-spacing: 0.04em;
  font-size: 0.72rem !important; color: var(--mute); margin-top: 24px; word-break: break-word;
}
.lk-identity__kicker { font-family: var(--mono) !important; font-size: 0.72rem !important; }
.lk-identity__edit { margin-top: 20px; }
.lk-identity__progress { display: flex; }
.lk-identity__progress .lk-overall { margin: 0; flex: 1; }

/* Real-data extras injected by profile-enhance.js (overall %, part numbers) */
.lk-overall {
  border: 1px solid var(--ink);
  padding: 28px;
  margin: 24px 0 8px;
  display: grid;
  gap: 18px;
}
.lk-overall__kicker {
  font-family: var(--mono) !important; text-transform: uppercase;
  letter-spacing: 0.06em; font-size: 0.78rem !important; color: var(--red);
}
.lk-overall__num {
  font-family: var(--mono) !important; font-weight: 700 !important;
  font-size: clamp(64px, 9vw, 120px) !important; line-height: 0.86 !important;
  letter-spacing: -0.04em; color: var(--ink); margin: 18px 0 28px;
}
.lk-overall__num span { font-size: 0.4em !important; color: var(--mute); font-weight: 700; }
.lk-overall__bar { height: 8px; background: var(--mute-2); position: relative; }
.lk-overall__bar > span { position: absolute; inset: 0; width: 0; background: var(--green); transition: width 600ms ease-out; }
.lk-overall__meta {
  font-family: var(--mono) !important; text-transform: uppercase; letter-spacing: 0.05em;
  font-size: 0.72rem !important; color: var(--mute); margin-top: 10px;
  display: flex; justify-content: space-between;
}
.lk-course-no {
  font-family: var(--mono); font-weight: 700;
  font-size: clamp(22px, 5vw, 32px); letter-spacing: -0.02em;
  color: var(--ink); margin-right: 16px; display: inline-block; min-width: 1.6em;
  vertical-align: baseline;
}

/* Bare submit/button inputs (comment/search) → ink neutral. Audio-player
   buttons excluded (handled as SVG below). Resume re-asserted blue after. */
input[type="submit"]:not(.myButton_play):not(.myButton_stop),
button[type="submit"]:not(.myButton_play):not(.myButton_stop) {
  background: var(--ink);
  color: var(--paper);
  border: 1px solid var(--ink);
  border-radius: 0;
}
.learndash-resume-button input[type="submit"] { background: var(--blue) !important; }

/* ----------------------------------------------------------------------------
   Sidebar navigation widgets — course nav / lessons list / login-logout.
   These are navigation, not accent links, so they read BLACK (not red),
   with a blue hover affordance. Overrides the global red link colour and the
   ldx/legacy course-nav colours.
   -------------------------------------------------------------------------- */
.sidebar a,
.widget_ldcoursenavigation a,
.widget_login_logout a,
.course_navigation a,
.lessons_list a,
.learndash_navigation_lesson_topics_list a {
  color: var(--ink) !important;
}
.sidebar a:hover, .sidebar a:focus,
.widget_ldcoursenavigation a:hover,
.widget_login_logout a:hover { color: var(--blue) !important; }

/* Sticky course-nav sidebar (desktop). The lesson/topic content is long, so
   pin the nav in view while scrolling. Conditions check out: #single-post is
   the containing block (max-width + clearfix, no overflow), html/body set no
   overflow, and the header isn't fixed — so plain sticky with a small top gap
   works. max-height + overflow-y guard a nav taller than the viewport (it then
   scrolls internally instead of pinning off-screen). Desktop only (≥64em);
   below that the columns stack and a sticky aside would be pointless. */
@media screen and (min-width: 64em) {
  #single-post .sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 2rem;
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
  }
  /* Logged-in: clear the fixed 32px WP admin bar (shown on the front end at
     ≥782px) so the pinned nav isn't tucked under it. */
  .admin-bar #single-post .sidebar {
    top: calc(2rem + 32px);
    max-height: calc(100vh - 3rem - 32px);
  }
}

/* ----------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
footer#footer-container, .footer-container, #footer {
  background: var(--ink);
  color: var(--paper);
}
#footer a, .footer-container a { color: var(--paper); }
#footer a:hover { color: var(--red); }

/* ----------------------------------------------------------------------------
   Inline lesson icon swaps (see icon-swap.js): the modern SVG replacing the
   dated raster markers (e.g. HandGestureFingerPng). Coloured blue, inline.
   -------------------------------------------------------------------------- */
.lk-ico {
  display: inline-block;
  vertical-align: -0.18em;
  color: var(--blue);
  fill: currentColor;
}
.lk-ico svg { display: block; width: 100%; height: 100%; fill: currentColor; }

/* ----------------------------------------------------------------------------
   Compact WP Audio Player — replace the parent theme's play.jpg / pause.jpg
   with crisp inline SVG. (Bridge converts these to .lk-player when JS runs;
   this is the no-JS / pre-conversion fallback.) Ink at rest, blue on hover.
   -------------------------------------------------------------------------- */
[class*="sc_player_container"] .myButton_play {
  background: transparent center / contain no-repeat
    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2050%2050'%3E%3Ccircle%20cx='25'%20cy='25'%20r='24'%20fill='%230a0a0a'/%3E%3Cpath%20d='M20%2015L37%2025L20%2035Z'%20fill='%23ffffff'/%3E%3C/svg%3E") !important;
  width: 50px !important;
  height: 50px !important;
  border: 0 !important;
  transition: filter 120ms;
}
[class*="sc_player_container"] .myButton_stop {
  background: transparent center / contain no-repeat
    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2050%2050'%3E%3Ccircle%20cx='25'%20cy='25'%20r='24'%20fill='%230a0a0a'/%3E%3Crect%20x='18'%20y='16'%20width='5'%20height='18'%20fill='%23ffffff'/%3E%3Crect%20x='27'%20y='16'%20width='5'%20height='18'%20fill='%23ffffff'/%3E%3C/svg%3E") !important;
  width: 50px !important;
  height: 50px !important;
  border: 0 !important;
}
/* Hover → blue */
[class*="sc_player_container"] .myButton_play:hover {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2050%2050'%3E%3Ccircle%20cx='25'%20cy='25'%20r='24'%20fill='%230060a8'/%3E%3Cpath%20d='M20%2015L37%2025L20%2035Z'%20fill='%23ffffff'/%3E%3C/svg%3E") !important;
}
[class*="sc_player_container"] .myButton_stop:hover {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2050%2050'%3E%3Ccircle%20cx='25'%20cy='25'%20r='24'%20fill='%230060a8'/%3E%3Crect%20x='18'%20y='16'%20width='5'%20height='18'%20fill='%23ffffff'/%3E%3Crect%20x='27'%20y='16'%20width='5'%20height='18'%20fill='%23ffffff'/%3E%3C/svg%3E") !important;
}

/* ----------------------------------------------------------------------------
   Audio player component (lk-player): play state uses blue (control), not red.
   -------------------------------------------------------------------------- */
.lk-player.is-playing .lk-player__btn { background: var(--blue); }
.lk-player.is-playing .lk-player__wave-bar.is-head { background: var(--blue); }
.lk-player__btn:focus-visible { outline-color: var(--blue); }

/* ----------------------------------------------------------------------------
   Inline course-part SVG banners — "Mina kurser" (#1670) + profile (#2129).
   White-on-white art needs a frame; the course cards are links, so they also
   get a hover/press affordance (blue = interactive, per the palette roles).
   -------------------------------------------------------------------------- */
.page-id-1670 .columns > a > svg,
.page-id-2129 .cntr > svg {
  border: 1px solid #d8d5cd;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
/* Clickable course banners only (the profile banner is not a link). */
.page-id-1670 .columns > a { display: block; }
@media (hover: hover) {
  .page-id-1670 .columns > a:hover > svg {
    border: 2px solid var(--blue);
    box-shadow: 0 6px 22px rgba(10, 10, 10, .12);
    transform: translateY(-3px);
  }
}
.page-id-1670 .columns > a:active > svg,
.page-id-1670 .columns > a:focus-visible > svg {
  border: 2px solid var(--blue);
  box-shadow: 0 3px 10px rgba(10, 10, 10, .14);
  transform: translateY(-1px);
}

/* Same banners reused as course featured images (single course header +
   LearnDash course grids), injected inline by the course-svg-featured-images
   mu-plugin and tagged .course-svg-banner. Frame everywhere; hover/press cue
   only where the grid wraps the banner in a link. */
.course-svg-banner {
  border: 1px solid #d8d5cd;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
@media (hover: hover) {
  a:hover .course-svg-banner {
    border: 2px solid var(--blue);
    box-shadow: 0 6px 22px rgba(10, 10, 10, .12);
    transform: translateY(-3px);
  }
}
a:active .course-svg-banner,
a:focus-visible .course-svg-banner {
  border: 2px solid var(--blue);
  box-shadow: 0 3px 10px rgba(10, 10, 10, .14);
  transform: translateY(-1px);
}

/* ----------------------------------------------------------------------------
   Protected — kept functional, not repainted:
   .edge-modern-wrapper Adobe Edge compositions, WPBakery .vc_row layouts.
   -------------------------------------------------------------------------- */
.edge-modern-wrapper, .vc_row, .wpb_wrapper { max-width: 100%; }
