/* LUM360 · Cursos interactivos · capa premium compartida (Ciberseguridad, GA4, Google Business Profile, SEO local)
   Se carga DESPUÉS de theme.css y del CSS propio de cada curso.
   Doble propósito: (1) contraste correcto en modo claro y estándar dorado (sin café oscuro como relleno);
   (2) lectura y respuesta más agradables: paneles, checklist, quiz, barra lateral y componentes especiales.
   FUENTE: lum360-private-runtime/development/course-premium/src/ → compilar con build.cjs (no editar el archivo publicado a mano).
   Marcadores del fuente: selector sin prefijo = ambos temas · «L » = solo claro · «D » = solo oscuro. */

/* ================= Tokens ================= */
body:has(.course-frame) {
  --cp-radius: 16px;
  --cp-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --cp-gold-fill: linear-gradient(135deg, #ecca66 0%, #d9ab34 55%, #c9971f 100%);
  --cp-gold-fill-hover: linear-gradient(135deg, #f4d77f 0%, #e3b845 55%, #d3a128 100%);
  --cp-gold-ink: #2b1f08;
  --cp-gold-line: #b98a1d;
  --cp-gold-glow: 0 10px 26px -10px rgba(185, 138, 29, 0.6);
  --cp-paper-label: #7a5517;
  --cp-dark-label: #e3d0a2;
  --cp-page-label: #c8a96a;
  --cp-text: #f5f1e8;
  --cp-text-2: #d8d2c4;
  --cp-panel-ink: #f5f1e8;
  --cp-panel-ink-soft: #d8d2c4;
  --cp-panel-label: #e3d0a2;
  --cp-panel-line: rgba(200, 169, 106, 0.24);
  --cp-panel-bg: linear-gradient(160deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.025));
  --cp-panel-shadow: 0 22px 50px -26px rgba(0, 0, 0, 0.7);
  --cp-field: rgba(255, 255, 255, 0.045);
  --cp-field-line: rgba(255, 255, 255, 0.12);
  --cp-field-hover-bg: rgba(200, 169, 106, 0.13);
  --cp-field-hover-line: rgba(200, 169, 106, 0.55);
  --cp-track: rgba(255, 255, 255, 0.11);
  --cp-chip-bg: rgba(255, 255, 255, 0.05);
  --cp-hl-bg: #e3d0a2;
  --cp-notice-bg: rgba(200, 169, 106, 0.1);
  --cp-notice-ink: #e3d0a2;
  --cp-ok: #86d6a5;
  --cp-ok-solid: #2f9d63;
  --cp-ok-bg: rgba(95, 168, 120, 0.16);
  --cp-ok-line: rgba(95, 168, 120, 0.55);
  --cp-err: #f1a6a6;
  --cp-err-solid: #c25555;
  --cp-err-bg: rgba(182, 106, 106, 0.16);
  --cp-err-line: rgba(182, 106, 106, 0.55);
  --cp-side-bg: #1b1e25;
  --cp-rail: rgba(200, 169, 106, 0.28);
  --cp-blue-label: #8fc0f2;
}
html[data-theme="light"] body:has(.course-frame) {
  --cp-paper-label: #7a5517;
  --cp-page-label: #7a5517;
  --cp-text: #1a1d24;
  --cp-text-2: #3f3a34;
  --cp-panel-ink: #1a1d24;
  --cp-panel-ink-soft: #3f3a34;
  --cp-panel-label: #7a5517;
  --cp-panel-line: rgba(138, 100, 33, 0.30);
  --cp-panel-bg: linear-gradient(165deg, #fffdf8, #f6eedc);
  --cp-panel-shadow: 0 22px 44px -28px rgba(90, 61, 8, 0.38);
  --cp-field: #fbf7ee;
  --cp-field-line: rgba(138, 100, 33, 0.22);
  --cp-field-hover-bg: #fff4d3;
  --cp-field-hover-line: #b98a1d;
  --cp-track: rgba(23, 23, 23, 0.1);
  --cp-chip-bg: rgba(255, 250, 240, 0.92);
  --cp-hl-bg: #f6e4a6;
  --cp-notice-bg: rgba(217, 171, 52, 0.16);
  --cp-notice-ink: #4a3206;
  --cp-ok: #17633d;
  --cp-ok-bg: rgba(31, 122, 77, 0.1);
  --cp-ok-line: rgba(31, 122, 77, 0.48);
  --cp-err: #8f2a2a;
  --cp-err-bg: rgba(162, 59, 59, 0.09);
  --cp-err-line: rgba(162, 59, 59, 0.42);
  --cp-side-bg: #fbf5e8;
  --cp-rail: rgba(138, 100, 33, 0.32);
  --cp-blue-label: #2b5f96;
}

/* ================= Etiquetas y cabeceras ================= */
body:has(.course-frame) .sidebar-kicker,
body:has(.course-frame) .section-label,
body:has(.course-frame) .eyebrow { color: var(--cp-page-label); }
body:has(.course-frame) .intro-panel .section-label,
body:has(.course-frame) .intro-panel .eyebrow { color: var(--cp-paper-label); }
body:has(.course-frame) .hero-stats span { color: var(--cp-text-2); }
html:not([data-theme="light"]) body:has(.course-frame) .ghost-button.danger,
html:not([data-theme="light"]) body:has(.course-frame) #reset-progress { color: #eaa3a3; border-color: rgba(234, 163, 163, 0.4); }
body:has(.course-frame) .module-header { position: relative; padding-bottom: 1.4rem; margin-bottom: 1.6rem; }
body:has(.course-frame) .module-header::after { content: ""; position: absolute; left: 0; bottom: 0; width: 72px; height: 2px; border-radius: 2px; background: var(--cp-gold-fill); }
body:has(.course-frame) .module-header .section-label { display: inline-flex; align-items: center; gap: 0.6rem; }
body:has(.course-frame) .module-header .section-label::before { content: ""; width: 22px; height: 1px; background: currentColor; opacity: 0.7; }
body:has(.course-frame) .cp-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.15rem; }
body:has(.course-frame) .cp-meta span { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.32rem 0.8rem; color: var(--cp-text-2); background: var(--cp-chip-bg); border: 1px solid var(--cp-panel-line); border-radius: 999px; font-size: 0.78rem; font-weight: 550; letter-spacing: 0.01em; }
body:has(.course-frame) .cp-meta span::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--cp-gold-line); }
body:has(.course-frame) .cp-readbar { position: fixed; z-index: 99; left: 0; right: 0; top: var(--header-h, 72px); height: 3px; background: transparent; pointer-events: none; opacity: 0; transition: opacity 240ms var(--cp-ease); }
body:has(.course-frame) .cp-readbar.is-on { opacity: 1; }
body:has(.course-frame) .cp-readbar i { display: block; height: 100%; width: 100%; transform: scaleX(0); transform-origin: 0 50%; background: var(--cp-gold-fill); box-shadow: 0 0 14px rgba(217, 171, 52, 0.55); }

/* ================= Tarjetas de aprendizaje ================= */
body:has(.course-frame) .learning-card { position: relative; padding: clamp(1.25rem, 2.2vw, 1.7rem); border-radius: var(--cp-radius); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 18px 40px -26px rgba(0, 0, 0, 0.55); transition: transform 260ms var(--cp-ease), box-shadow 260ms var(--cp-ease); }
body:has(.course-frame) .learning-card > span:first-child { display: inline-flex; align-items: center; gap: 0.55rem; margin-bottom: 0.95rem; color: var(--cp-paper-label); }
body:has(.course-frame) .learning-card > span:first-child::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cp-gold-line); box-shadow: 0 0 0 4px rgba(185, 138, 29, 0.16); }
body:has(.course-frame) .learning-card p,
body:has(.course-frame) .learning-card li { font-size: 1.02rem; line-height: 1.75; }
body:has(.course-frame) .learning-card ul,
body:has(.course-frame) .learning-card ol { padding-left: 1.2rem; }
body:has(.course-frame) .learning-card li + li { margin-top: 0.35rem; }
body:has(.course-frame) .learning-card li::marker { color: var(--cp-gold-line); }
body:has(.course-frame) .learning-card.key-card { overflow: hidden; border-color: rgba(227, 208, 162, 0.28); }
body:has(.course-frame) .learning-card.key-card > span:first-child { color: var(--cp-dark-label); }
body:has(.course-frame) .learning-card.key-card > span:first-child::before { background: #e3b845; box-shadow: 0 0 0 4px rgba(227, 184, 69, 0.2); }
body:has(.course-frame) .learning-card.key-card::after { content: "\201C"; position: absolute; right: 1.1rem; top: -0.2rem; color: rgba(227, 208, 162, 0.14); font-family: var(--font-display); font-size: 9rem; line-height: 1; pointer-events: none; }
body:has(.course-frame) .learning-card.key-card p { position: relative; z-index: 1; font-size: clamp(1.5rem, 2.5vw, 2.35rem); line-height: 1.14; }
body:has(.course-frame) .learning-card.example-card > span:first-child::before { background: var(--cp-ok-solid); box-shadow: 0 0 0 4px rgba(47, 157, 99, 0.18); }
body:has(.course-frame) .learning-card.error-card > span:first-child::before { background: var(--cp-err-solid); box-shadow: 0 0 0 4px rgba(194, 85, 85, 0.18); }
body:has(.course-frame) .learning-card.tip-card > span:first-child { color: #2b5f96; }
body:has(.course-frame) .learning-card.tip-card > span:first-child::before { background: #3a7bc0; box-shadow: 0 0 0 4px rgba(58, 123, 192, 0.18); }
@media (hover: hover) { body:has(.course-frame) .learning-card:hover { transform: translateY(-3px); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 28px 54px -28px rgba(0, 0, 0, 0.6); } }
body:has(.course-frame) .module-grid .learning-card { animation: cpRise 520ms var(--cp-ease) both; }
body:has(.course-frame) .module-grid .learning-card:nth-child(2) { animation-delay: 70ms; }
body:has(.course-frame) .module-grid .learning-card:nth-child(3) { animation-delay: 140ms; }
body:has(.course-frame) .module-grid .learning-card:nth-child(4) { animation-delay: 210ms; }
@keyframes cpRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

/* Hero: tarjeta oscura legible en claro y titular con escala de lectura */
html[data-theme="light"] body:has(.course-frame) .decision-card { background: radial-gradient(circle at 90% 0%, rgba(227, 184, 69, 0.2), transparent 14rem), linear-gradient(145deg, #1a1d24, #0f1115); border-color: rgba(227, 208, 162, 0.3); }
html[data-theme="light"] body:has(.course-frame) .signal-grid span { color: var(--cp-text); background: rgba(255, 250, 240, 0.82); border-color: var(--cp-panel-line); }
body:has(.course-frame) .hero-copy h1 { font-size: clamp(2.4rem, 4.6vw, 4.4rem); line-height: 1.04; }
body:has(.course-frame) .learning-card.key-card p + p { font-size: clamp(1.1rem, 1.55vw, 1.32rem); line-height: 1.6; margin-top: 1rem; }

/* ================= Paneles «Aplicación para tu negocio» ================= */
body:has(.course-frame) .business-application,
body:has(.course-frame) .module-extra { position: relative; overflow: hidden; margin-top: 1.15rem; padding: clamp(1.3rem, 2.6vw, 1.9rem) clamp(1.2rem, 2.6vw, 1.9rem) clamp(1.3rem, 2.6vw, 1.7rem) clamp(1.5rem, 3vw, 2.2rem); color: var(--cp-panel-ink); background: var(--cp-panel-bg); border: 1px solid var(--cp-panel-line); border-radius: var(--cp-radius); box-shadow: var(--cp-panel-shadow); }
body:has(.course-frame) .business-application::before,
body:has(.course-frame) .module-extra::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--cp-gold-fill); }
body:has(.course-frame) .business-application h3,
body:has(.course-frame) .module-extra h3 { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1.1rem; color: var(--cp-panel-label); font-size: 0.86rem; letter-spacing: 0.12em; }
body:has(.course-frame) .module-extra p,
body:has(.course-frame) .module-extra li,
body:has(.course-frame) .module-extra ul,
body:has(.course-frame) .module-extra ol,
body:has(.course-frame) .business-application p { color: var(--cp-panel-ink-soft); }
body:has(.course-frame) .price-note,
body:has(.course-frame) .source-note { color: var(--cp-text-2); }
body:has(.course-frame) .intro-panel .source-note { color: #4d4f56; }
body:has(.course-frame) .cp-count { margin-left: auto; padding: 0.18rem 0.65rem; color: var(--cp-panel-label); background: var(--cp-chip-bg); border: 1px solid var(--cp-panel-line); border-radius: 999px; font-size: 0.74rem; font-weight: 700; letter-spacing: 0.06em; white-space: nowrap; }
body:has(.course-frame) .cp-count.is-done { color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-color: var(--cp-gold-line); }
body:has(.course-frame) .cp-checkbar { height: 3px; margin: -0.55rem 0 1rem; overflow: hidden; border-radius: 3px; background: var(--cp-track); }
body:has(.course-frame) .cp-checkbar i { display: block; height: 100%; width: 0; background: var(--cp-gold-fill); transition: width 420ms var(--cp-ease); }

body:has(.course-frame) .pill-list { gap: 0.5rem; }
body:has(.course-frame) .pill-list span { padding: 0.45rem 0.8rem; color: var(--cp-gold-ink); background: var(--cp-gold-fill); border: 1px solid var(--cp-gold-line); border-radius: 999px; box-shadow: 0 6px 16px -10px rgba(185, 138, 29, 0.7); font-weight: 700; }
body:has(.course-frame) .notice-card { margin-top: 1.1rem; padding: 1.05rem 1.2rem; color: var(--cp-panel-ink); background: var(--cp-notice-bg); border: 1px solid var(--cp-panel-line); border-left: 3px solid var(--cp-gold-line); border-radius: 12px; }
body:has(.course-frame) .notice-card strong { color: var(--cp-notice-ink); }

/* Checklist */
body:has(.course-frame) .interactive-checklist { gap: 0.6rem; }
body:has(.course-frame) .interactive-checklist label { align-items: center; min-height: 52px; padding: 0.8rem 1rem; color: var(--cp-panel-ink); background: var(--cp-field); border: 1px solid var(--cp-field-line); border-radius: 12px; line-height: 1.5; transition: background 180ms var(--cp-ease), border-color 180ms var(--cp-ease), transform 180ms var(--cp-ease), box-shadow 180ms var(--cp-ease); }
body:has(.course-frame) .interactive-checklist label:hover { color: var(--cp-panel-ink); background: var(--cp-field-hover-bg); border-color: var(--cp-field-hover-line); }
body:has(.course-frame) .interactive-checklist input { appearance: none; -webkit-appearance: none; position: relative; flex: 0 0 auto; width: 24px; height: 24px; margin: 0; background: transparent; border: 1.5px solid var(--cp-gold-line); border-radius: 8px; cursor: pointer; transition: background 180ms var(--cp-ease), border-color 180ms var(--cp-ease), transform 180ms var(--cp-ease); }
body:has(.course-frame) .interactive-checklist input::after { content: ""; position: absolute; left: 7px; top: 3px; width: 6px; height: 11px; border: solid var(--cp-gold-ink); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg) scale(0); transition: transform 180ms var(--cp-ease); }
body:has(.course-frame) .interactive-checklist input:checked { background: var(--cp-gold-fill); border-color: var(--cp-gold-line); }
body:has(.course-frame) .interactive-checklist input:checked::after { transform: rotate(45deg) scale(1); }
body:has(.course-frame) .interactive-checklist input:focus-visible { outline: 2px solid var(--cp-gold-line); outline-offset: 3px; }
body:has(.course-frame) .interactive-checklist label.is-checked { color: var(--cp-panel-ink); background: var(--cp-field-hover-bg); border-color: var(--cp-field-hover-line); box-shadow: inset 3px 0 0 var(--cp-gold-line); }

/* ================= Tablas ================= */
body:has(.course-frame) .table-wrap { border-radius: var(--cp-radius); border-color: var(--cp-panel-line); }
body:has(.course-frame) .course-table th { padding: 1rem 1.1rem; letter-spacing: 0.14em; }
body:has(.course-frame) .course-table td { padding: 1rem 1.1rem; line-height: 1.6; }
body:has(.course-frame) .course-table tbody tr:hover td { background: #fff7dd; }
body:has(.course-frame) .course-table .highlight-row td,
body:has(.course-frame) .course-table tbody tr.highlight-row:hover td { color: #2b1f08; background: var(--cp-hl-bg); }
body:has(.course-frame) .course-table .highlight-row td strong { color: #2b1f08; }

/* ================= Componentes especiales (GBP / GA4 / SEO) ================= */
body:has(.course-frame) .timeline-year { color: var(--cp-panel-label); }
body:has(.course-frame) .timeline-text { color: var(--cp-panel-ink-soft); }
body:has(.course-frame) .timeline-text strong { color: var(--cp-panel-ink); }
body:has(.course-frame) .timeline::before { background: var(--cp-rail); }
body:has(.course-frame) .timeline-item::before { background: var(--cp-gold-fill); border-color: var(--cp-gold-line); box-shadow: 0 0 0 4px rgba(185, 138, 29, 0.15); }
body:has(.course-frame) .accordion-list details { border-radius: 14px; border-color: var(--cp-field-line); transition: border-color 200ms var(--cp-ease), box-shadow 200ms var(--cp-ease); }
body:has(.course-frame) .accordion-list details[open] { border-color: var(--cp-gold-line); box-shadow: 0 16px 34px -26px rgba(90, 61, 8, 0.5); }
body:has(.course-frame) .accordion-list summary { position: relative; padding-right: 3rem; list-style: none; }
body:has(.course-frame) .accordion-list summary::-webkit-details-marker { display: none; }
body:has(.course-frame) .accordion-list summary::after { content: "+"; position: absolute; right: 1rem; top: 50%; width: 28px; height: 28px; margin-top: -14px; display: grid; place-items: center; color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-radius: 50%; font-size: 1.1rem; font-weight: 800; line-height: 1; transition: transform 240ms var(--cp-ease); }
body:has(.course-frame) .accordion-list details[open] summary::after { transform: rotate(45deg); }
body:has(.course-frame) .accordion-list details[open] summary { border-bottom: 1px solid var(--cp-field-line); margin-bottom: 0.9rem; }
@media (min-width: 761px) { body:has(.course-frame) .seven-day-plan { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); overflow: visible; } }
body:has(.course-frame) .seven-day-plan { scroll-snap-type: x proximity; padding-bottom: 0.8rem; scrollbar-width: thin; scrollbar-color: var(--cp-gold-line) transparent; }
body:has(.course-frame) .seven-day-plan article { position: relative; scroll-snap-align: start; border-radius: 14px; border-top: 3px solid var(--cp-gold-line); }
body:has(.course-frame) .seven-day-plan span,
body:has(.course-frame) .media-principles strong,
body:has(.course-frame) .factor-row span { color: var(--cp-paper-label); }
body:has(.course-frame) .media-principles article,
body:has(.course-frame) .factor-row article { border-radius: 14px; transition: transform 240ms var(--cp-ease), box-shadow 240ms var(--cp-ease); }
@media (hover: hover) { body:has(.course-frame) .media-principles article:hover,
body:has(.course-frame) .factor-row article:hover,
body:has(.course-frame) .seven-day-plan article:hover { transform: translateY(-3px); box-shadow: 0 22px 40px -28px rgba(90, 61, 8, 0.55); } }
body:has(.course-frame) .soft-cta a { text-decoration-color: currentColor; }

/* ================= Quiz ================= */
body:has(.course-frame) .quiz-shell { position: relative; overflow: hidden; margin-top: 1.5rem; padding: clamp(1.3rem, 2.8vw, 2.1rem); border-radius: 20px; box-shadow: var(--cp-panel-shadow); }
body:has(.course-frame) .quiz-shell::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: var(--cp-gold-fill); }
html[data-theme="light"] body:has(.course-frame) .quiz-shell { background: linear-gradient(180deg, #ffffff, #fffaf0); border: 1px solid var(--cp-panel-line); }
body:has(.course-frame) .quiz-head { align-items: flex-start; margin-bottom: 0.6rem; padding-bottom: 0.9rem; border-bottom: 0; }
body:has(.course-frame) .quiz-head h3 { letter-spacing: 0.14em; }
body:has(.course-frame) .quiz-head p { color: var(--cp-text-2); }
body:has(.course-frame) .quiz-status { padding: 0.4rem 0.85rem; color: var(--cp-panel-label); background: var(--cp-chip-bg); border: 1px solid var(--cp-panel-line); border-radius: 999px; }
body:has(.course-frame) .cp-quizbar { height: 4px; margin: 0 0 0.4rem; overflow: hidden; border-radius: 4px; background: var(--cp-track); }
body:has(.course-frame) .cp-quizbar i { display: block; height: 100%; width: 0; background: var(--cp-gold-fill); transition: width 420ms var(--cp-ease); }
body:has(.course-frame) .quiz-question { padding: 1.35rem 0; border-bottom-color: var(--cp-field-line); }
body:has(.course-frame) .question-title { font-size: 1.1rem; line-height: 1.5; }
body:has(.course-frame) .question-title small { display: flex; width: fit-content; margin-bottom: 0.7rem; padding: 0.22rem 0.7rem; color: var(--cp-panel-label); background: var(--cp-chip-bg); border: 1px solid var(--cp-panel-line); border-radius: 999px; letter-spacing: 0.14em; }
body:has(.course-frame) .quiz-options { gap: 0.6rem; margin-top: 1rem; }
body:has(.course-frame) .quiz-option { align-items: center; min-height: 56px; padding: 0.8rem 1rem; color: var(--cp-text-2); background: var(--cp-field); border: 1px solid var(--cp-field-line); border-radius: 14px; line-height: 1.5; transition: background 180ms var(--cp-ease), border-color 180ms var(--cp-ease), color 180ms var(--cp-ease), transform 180ms var(--cp-ease), box-shadow 180ms var(--cp-ease); }
body:has(.course-frame) .quiz-option:hover:not(:disabled),
body:has(.course-frame) .quiz-option.is-selected { color: var(--cp-text); background: var(--cp-field-hover-bg); border-color: var(--cp-field-hover-line); }
@media (hover: hover) { body:has(.course-frame) .quiz-option:hover:not(:disabled) { transform: translateX(3px); box-shadow: 0 12px 24px -20px rgba(90, 61, 8, 0.6); } }
body:has(.course-frame) .quiz-option:active:not(:disabled) { transform: scale(0.992); }
body:has(.course-frame) .quiz-option:focus-visible { outline: 2px solid var(--cp-gold-line); outline-offset: 2px; }
body:has(.course-frame) .option-letter { width: 30px; height: 30px; font-size: 0.78rem; border-width: 1.5px; transition: background 180ms var(--cp-ease), color 180ms var(--cp-ease), border-color 180ms var(--cp-ease); }
body:has(.course-frame) .quiz-option:hover:not(:disabled) .option-letter,
body:has(.course-frame) .quiz-option.is-selected .option-letter { color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-color: var(--cp-gold-line); }
body:has(.course-frame) .quiz-option.is-correct,
body:has(.course-frame) .quiz-option.is-wrong { color: var(--cp-text); }
body:has(.course-frame) .quiz-option.is-correct { background: var(--cp-ok-bg); border-color: var(--cp-ok-line); }
body:has(.course-frame) .quiz-option.is-wrong { background: var(--cp-err-bg); border-color: var(--cp-err-line); }
body:has(.course-frame) .quiz-option.is-correct .option-letter { color: #fff; background: var(--cp-ok-solid); border-color: var(--cp-ok-solid); }
body:has(.course-frame) .quiz-option.is-wrong .option-letter { color: #fff; background: var(--cp-err-solid); border-color: var(--cp-err-solid); }
body:has(.course-frame) .quiz-option.is-correct::after,
body:has(.course-frame) .quiz-option.is-wrong::after { margin-left: auto; padding-left: 0.75rem; font-size: 1.05rem; font-weight: 800; }
body:has(.course-frame) .quiz-option.is-correct::after { content: "\2713"; color: var(--cp-ok); }
body:has(.course-frame) .quiz-option.is-wrong::after { content: "\2715"; color: var(--cp-err); }
body:has(.course-frame) .question-feedback { margin-top: 0.9rem; padding: 1rem 1.1rem; color: var(--cp-text-2); border-radius: 12px; line-height: 1.65; animation: cpRise 360ms var(--cp-ease) both; }
body:has(.course-frame) .question-feedback.is-success { background: var(--cp-ok-bg); border-left-color: var(--cp-ok-solid); }
body:has(.course-frame) .question-feedback.is-error { background: var(--cp-err-bg); border-left-color: var(--cp-err-solid); }
body:has(.course-frame) .question-feedback strong { color: var(--cp-text); }
body:has(.course-frame) .quiz-actions { gap: 0.8rem; margin-top: 1.4rem; }
body:has(.course-frame) .quiz-result { margin-top: 1.2rem; padding: 1.15rem 1.3rem; color: var(--cp-text); background: var(--cp-notice-bg); border: 1px solid var(--cp-panel-line); border-left: 3px solid var(--cp-gold-line); border-radius: 14px; font-size: 1.02rem; animation: cpRise 360ms var(--cp-ease) both; }
body:has(.course-frame) .quiz-result strong { color: var(--cp-panel-label); font-size: 1.12rem; }

/* ================= Barra lateral ================= */
body:has(.course-frame) .sidebar-panel { border-radius: var(--cp-radius); }
body:has(.course-frame) .module-nav { position: relative; gap: 0.2rem; }
body:has(.course-frame) .module-nav::before { content: ""; position: absolute; left: calc(0.85rem + 1.075rem); top: 1.4rem; bottom: 1.4rem; width: 1px; background: var(--cp-rail); }
body:has(.course-frame) .module-link { position: relative; z-index: 1; border-radius: 12px; }
body:has(.course-frame) .module-link span { background: var(--cp-side-bg); color: var(--cp-panel-label); }
body:has(.course-frame) .module-link.is-active { color: var(--cp-text); background: var(--cp-field-hover-bg); border-color: var(--cp-panel-line); box-shadow: inset 3px 0 0 var(--cp-gold-line); }
body:has(.course-frame) .module-link.is-active span { color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-color: var(--cp-gold-line); }
body:has(.course-frame) .module-link.is-completed span { font-size: 0; color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-color: var(--cp-gold-line); }
body:has(.course-frame) .module-link.is-completed span::after { content: "\2713"; font-size: 0.85rem; font-weight: 800; }
body:has(.course-frame) .progress-fill { background: var(--cp-gold-fill); box-shadow: 0 0 12px rgba(217, 171, 52, 0.5); }
html[data-theme="light"] body:has(.course-frame) .progress-track { background: var(--cp-track); }
body:has(.course-frame) .sidebar-score strong,
body:has(.course-frame) .top-progress { color: var(--cp-panel-label); }

/* ================= Botones (modo claro = estándar dorado) ================= */
html[data-theme="light"] body:has(.course-frame) .primary-button { color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-color: var(--cp-gold-line); box-shadow: var(--cp-gold-glow); }
html[data-theme="light"] body:has(.course-frame) .primary-button:hover:not(:disabled),
html[data-theme="light"] body:has(.course-frame) .primary-button:focus-visible { background: var(--cp-gold-fill-hover); border-color: #a77a14; }
html[data-theme="light"] body:has(.course-frame) .secondary-button { color: #5a3d08; background: #fffaf0; border-color: var(--cp-gold-line); }
html[data-theme="light"] body:has(.course-frame) .secondary-button:hover,
html[data-theme="light"] body:has(.course-frame) .secondary-button:focus-visible { color: var(--cp-gold-ink); background: var(--cp-gold-fill); border-color: #a77a14; box-shadow: var(--cp-gold-glow); }
html[data-theme="light"] body:has(.course-frame) .ghost-button,
html[data-theme="light"] body:has(.course-frame) .icon-button { color: var(--cp-text); border-color: rgba(23, 23, 23, 0.2); background: rgba(255, 255, 255, 0.55); }
html[data-theme="light"] body:has(.course-frame) .ghost-button:hover,
html[data-theme="light"] body:has(.course-frame) .icon-button:hover { border-color: var(--cp-gold-line); background: #fff4d3; }
html[data-theme="light"] body:has(.course-frame) .skip-link { color: var(--cp-gold-ink); background: var(--cp-gold-fill); }
html[data-theme="light"] body:has(.course-frame) .lock-mark,
html[data-theme="light"] body:has(.course-frame) .lock-mark::before,
html[data-theme="light"] body:has(.course-frame) .map-pin { border-color: var(--cp-gold-line); }
html[data-theme="light"] body:has(.course-frame) .lock-mark::after { background: var(--cp-gold-line); }
html[data-theme="light"] body:has(.course-frame) .hero-stats span { color: var(--cp-text-2); }
html[data-theme="light"] body:has(.course-frame) .hero-stats strong { color: #7a5517; }
html[data-theme="light"] body:has(.course-frame) .hero-lead,
html[data-theme="light"] body:has(.course-frame) .module-header > p:not(.section-label) { color: var(--cp-text-2); }
html[data-theme="light"] body:has(.course-frame) .certificate-card,
html[data-theme="light"] body:has(.course-frame) .soft-cta { color: var(--cp-gold-ink); }
html[data-theme="light"] body:has(.course-frame) .certificate-card { background: var(--cp-gold-fill); box-shadow: var(--cp-gold-glow); }
html[data-theme="light"] body:has(.course-frame) .certificate-card h3,
html[data-theme="light"] body:has(.course-frame) .certificate-card p { color: var(--cp-gold-ink); }
html[data-theme="light"] body:has(.course-frame) .certificate-card span { color: #4a3206; }
html[data-theme="light"] body:has(.course-frame) .soft-cta { background: linear-gradient(135deg, #fff4d1, #f6e2a0); border: 1px solid var(--cp-gold-line); }
html[data-theme="light"] body:has(.course-frame) .soft-cta p,
html[data-theme="light"] body:has(.course-frame) .soft-cta a { color: var(--cp-gold-ink); }
html[data-theme="light"] body:has(.course-frame) .summary-grid strong { color: #7a5517; }
html[data-theme="light"] body:has(.course-frame) .biblio-list a { color: #6f4d10; }

body:has(.course-frame) .course-controls [hidden] { display: none !important; }

/* ================= Glosario y resumen ================= */
body:has(.course-frame) .glossary-grid article { border-radius: 14px; border-color: var(--cp-field-line); }
body:has(.course-frame) .glossary-grid h3 { color: var(--cp-panel-label); }
body:has(.course-frame) .glossary-grid p { color: var(--cp-text-2); }
@media screen {
  body:has(.course-frame) .summary-grid article { border-radius: 14px; box-shadow: 0 18px 36px -28px rgba(0, 0, 0, 0.6); }
  body:has(.course-frame) .summary-block { border-radius: var(--cp-radius); }
  body:has(.course-frame) .answer-row { border-radius: 10px; }
}

/* ================= Responsive y preferencias ================= */
@media (max-width: 760px) {
  body:has(.course-frame) .module-header h2 { font-size: clamp(1.9rem, 9vw, 2.6rem); }
  body:has(.course-frame) .learning-card.key-card::after { font-size: 6rem; }
  body:has(.course-frame) .business-application,
body:has(.course-frame) .module-extra { padding-left: 1.4rem; }
  body:has(.course-frame) .quiz-option { padding: 0.75rem 0.85rem; }
  body:has(.course-frame) .cp-meta span { font-size: 0.74rem; }
  body:has(.course-frame) .interactive-checklist label { padding: 0.75rem 0.85rem; }
}
@media (prefers-reduced-motion: reduce) {
  body:has(.course-frame) .learning-card,
body:has(.course-frame) .module-grid .learning-card,
body:has(.course-frame) .question-feedback,
body:has(.course-frame) .quiz-result,
body:has(.course-frame) .quiz-option,
body:has(.course-frame) .interactive-checklist label { animation: none !important; transition: none !important; transform: none !important; }
  body:has(.course-frame) .cp-readbar,
body:has(.course-frame) .cp-readbar i,
body:has(.course-frame) .cp-checkbar i,
body:has(.course-frame) .cp-quizbar i { transition: none !important; }
}
@media print { body:has(.course-frame) .cp-readbar,
body:has(.course-frame) .cp-meta,
body:has(.course-frame) .cp-count,
body:has(.course-frame) .cp-checkbar,
body:has(.course-frame) .cp-quizbar { display: none !important; } }
