/**
 * Claude Master — Estilos del template de curso
 * Prefijo: cm-  (Claude Master)
 *
 * Requiere: Bootstrap Grid 5.x, Font Awesome 6.5.x
 * Fuentes:  Nexa (encolada por el child theme), Archivo (Google Fonts)
 *
 * Pegar en: Fragmentos de código → CSS global
 * O encolar desde functions.php como wp_enqueue_style()
 */

/* ══════════════════════════════════════
   0. TOKENS DE DISEÑO
   ══════════════════════════════════════ */
:root {
  --cm-black:       #0A0A0F;
  --cm-navy:        #0F1226;
  --cm-yellow:      #FFE500;
  --cm-yellow-h:    #E6CF00;
  --cm-green:       #2BD67B;
  --cm-bg-hero:     #F3F3FF;
  --cm-bg-page:     #F4F3F1;
  --cm-bg-white:    #FFFFFF;
  --cm-border:      #DDDDD6;
  --cm-border-dark: #C8C8C0;
  --cm-text-muted:  #888884;
  --cm-text-body:   #555552;
  --cm-nav-h:       56px;     /* altura del nav sticky del tema */
  --cm-ease:        200ms ease;
  --cm-font-d:      'Nexa', 'Archivo', sans-serif;   /* display */
  --cm-font-b:      'Archivo', sans-serif;            /* body */
}

/* ══════════════════════════════════════
   1. RESET PUNTUAL
   ══════════════════════════════════════ */
.cm-page-wrap *,
.cm-mobile-bar * {
  box-sizing: border-box;
}
.cm-page-wrap img { display: block; max-width: 100%; }
.cm-page-wrap a   { color: inherit; text-decoration: none; }
.cm-page-wrap ul  { list-style: none; margin: 0; padding: 0; }

/* ══════════════════════════════════════
   2. BARRA STICKY MÓVIL
   ══════════════════════════════════════ */
.cm-mobile-bar {
  display: none;           /* desktop: oculta */
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 300;
  background: var(--cm-bg-white);
  border-top: 0.5px solid var(--cm-border);
  padding: 12px 20px;
  box-shadow: 0 -4px 20px rgba(0,0,0,0.10);
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.cm-mobile-bar__price {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}
.cm-mobile-bar__price strong {
  font-family: var(--cm-font-d);
  font-weight: 900;
  font-size: 22px;
  letter-spacing: -0.03em;
  color: var(--cm-black);
}
.cm-mobile-bar__price span {
  font-size: 11px;
  color: var(--cm-text-muted);
}
.cm-mobile-bar__btn {
  flex: 1;
  background: var(--cm-yellow);
  color: var(--cm-black);
  font-family: var(--cm-font-d);
  font-weight: 900;
  font-size: 15px;
  padding: 13px 20px;
  border-radius: 999px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  cursor: pointer;
  transition: background var(--cm-ease);
}
.cm-mobile-bar__btn:hover { background: var(--cm-yellow-h); }

/* ══════════════════════════════════════
   3. PAGE WRAP & GRID
   ══════════════════════════════════════ */
.cm-page-wrap {
  position: relative;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 32px;
}

/* Fondo gris del hero — full-width, altura medida por JS */
.cm-hero-bg {
  position: absolute;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  top: 0;
  background: var(--cm-bg-hero);
  border-bottom: 1.5px solid #D8D8F0;
  z-index: 0;
  pointer-events: none;
}

/* El row va sobre el bg */
.cm-page-wrap > .row { position: relative; z-index: 1; }
.cm-row { position: relative; z-index: 1; }

/* ══════════════════════════════════════
   4. COLUMNA IZQUIERDA
   ══════════════════════════════════════ */

/* Hero band */
.cm-hero-band { padding: 22px 0 40px; }

/* Content main (tabs + secciones) */
.cm-content-main { padding: 36px 0 64px; }

/* ══════════════════════════════════════
   5. COLUMNA DERECHA — SIDEBAR
   ══════════════════════════════════════ */
.cm-sidebar-col { padding-top: 22px; }

.cm-sidebar-sticky {
  position: sticky;
  top: calc(var(--cm-nav-h) + 16px);
}

/* ── Card de la sidebar ── */
.cm-sidebar-card {
  background: var(--cm-bg-white);
  border-radius: 14px;
  border: 0.5px solid var(--cm-border);
  overflow: hidden;
  box-shadow: 0 6px 36px rgba(0,0,0,0.09), 0 1px 4px rgba(0,0,0,0.04);
}

/* ── Thumbnail ── */
.cm-sidebar-thumb {
  position: relative;
  background: var(--cm-navy);
  aspect-ratio: 16/9;
  overflow: hidden;
  cursor: pointer;
}
.cm-sidebar-thumb__img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.cm-sidebar-thumb__fallback {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 8px; padding: 16px; text-align: center;
}
.cm-sidebar-thumb__logo { height: 26px; width: auto; }
.cm-sidebar-thumb__course-name {
  font-family: var(--cm-font-d);
  font-weight: 900;
  font-size: 16px;
  color: var(--cm-bg-white);
  line-height: 1.15;
  letter-spacing: -0.02em;
}
.cm-sidebar-thumb__preview-tag {
  position: absolute; bottom: 10px; left: 10px;
  background: rgba(0,0,0,0.55); color: #fff;
  font-size: 10px; font-weight: 700; letter-spacing: 0.04em;
  padding: 3px 8px; border-radius: 4px;
}

/* ── Cuerpo sidebar ── */
.cm-sidebar-body { padding: 20px 20px 18px; }

/* Precio */
.cm-price-row {
  display: flex; align-items: baseline; gap: 4px; margin-bottom: 2px;
}
.cm-price-sym {
  font-family: var(--cm-font-d); font-weight: 900;
  font-size: 17px; color: var(--cm-black);
  align-self: flex-start; margin-top: 7px;
}
.cm-price-num {
  font-family: var(--cm-font-d); font-weight: 900;
  font-size: 38px; color: var(--cm-black);
  letter-spacing: -0.04em; line-height: 1;
}
.cm-price-code {
  font-size: 14px; color: var(--cm-text-muted);
  font-weight: 400; align-self: flex-end; margin-bottom: 3px;
}
.cm-price-free {
  font-family: var(--cm-font-d); font-weight: 900;
  font-size: 38px; color: var(--cm-black);
  letter-spacing: -0.04em; line-height: 1;
}
.cm-price-note {
  display: flex; align-items: center; gap: 5px;
  font-size: 13px; color: var(--cm-green);
  font-weight: 700; margin-bottom: 16px;
}
.cm-price-note i { font-size: 13px; }

.cm-free-note {
  font-size: 13px; color: var(--cm-text-muted);
  text-align: center; margin-top: 8px;
}

/* ── Botones ── */
.cm-btn {
  width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 999px; border: none; cursor: pointer;
  font-family: var(--cm-font-d); font-weight: 900;
  transition: background var(--cm-ease), transform var(--cm-ease), box-shadow var(--cm-ease);
}

.cm-btn--primary {
  background: var(--cm-yellow);
  color: var(--cm-black);
  font-size: 16px; letter-spacing: -0.01em;
  padding: 15px 20px;
  margin-bottom: 10px;
}
.cm-btn--primary:hover {
  background: var(--cm-yellow-h);
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(255,229,0,0.4);
}
.cm-btn--primary:active { transform: none; box-shadow: none; }
.cm-btn--primary i { font-size: 15px; }

.cm-btn--ghost {
  background: transparent;
  color: var(--cm-black);
  font-size: 13px; font-weight: 600;
  padding: 11px;
  border: 1.5px solid var(--cm-border);
  margin-bottom: 14px;
}
.cm-btn--ghost:hover {
  border-color: var(--cm-border-dark);
  background: var(--cm-bg-page);
}

/* ── Progreso (usuario enrollado) ── */
.cm-progress-wrap { margin-bottom: 16px; }
.cm-progress-labels {
  display: flex; justify-content: space-between;
  font-size: 13px; color: var(--cm-text-muted); margin-bottom: 6px;
}
.cm-progress-bar {
  height: 6px; border-radius: 999px;
  background: #EAEAE4; overflow: hidden;
}
.cm-progress-bar__fill {
  height: 100%; border-radius: 999px;
  background: var(--cm-yellow);
  transition: width 0.4s ease;
}

/* ── Fecha de inscripción ── */
.cm-enrolled-date {
  font-size: 13px; color: var(--cm-text-muted);
  display: flex; align-items: center; gap: 6px; margin-top: 10px;
}
.cm-enrolled-date i { color: var(--cm-green); }

/* ── Alerta (curso lleno) ── */
.cm-alert {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 13px; color: var(--cm-text-body);
  background: #FFF7E6; border: 0.5px solid #FFD580;
  border-radius: 8px; padding: 12px 14px; margin-bottom: 12px;
}
.cm-alert i { color: #B97A00; margin-top: 1px; flex-shrink: 0; }

/* ── Garantía ── */
.cm-sidebar-guarantee {
  background: var(--cm-bg-page); border-radius: 8px;
  padding: 11px 14px; font-size: 13px; color: var(--cm-text-muted);
  text-align: center; display: flex; align-items: center;
  justify-content: center; gap: 6px;
  margin-top: 14px;
}
.cm-sidebar-guarantee i { font-size: 13px; color: var(--cm-green); }

/* ── Garantía — estado activo (usuario inscrito) ── */
.cm-sidebar-guarantee--active {
  background: rgba(43, 214, 123, 0.08);
  border: 1px solid rgba(43, 214, 123, 0.25);
  color: var(--cm-green);
  font-weight: 600;
}
.cm-sidebar-guarantee--active i { font-size: 15px; color: var(--cm-green); }

/* ── Meta del curso ── */
.cm-sidebar-meta { padding: 16px 20px 20px; border-top: 0.5px solid var(--cm-border); }
.cm-sidebar-meta__label {
  font-size: 11px; font-weight: 800; color: var(--cm-text-muted);
  text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px;
}
.cm-sidebar-meta__list { margin: 0; padding: 0; }
.cm-sidebar-meta__item {
  display: flex; align-items: center; gap: 9px;
  font-size: 14px; color: var(--cm-text-body); margin-bottom: 8px;
}
.cm-sidebar-meta__item:last-child { margin-bottom: 0; }
.cm-sidebar-meta__item i {
  font-size: 15px; color: #FF7800;
  width: 16px; text-align: center; flex-shrink: 0;
}

/* ══════════════════════════════════════
   6. HERO COPY (lead-info)
   ══════════════════════════════════════ */
.cm-breadcrumb {
  font-size: 12px; color: var(--cm-text-muted); margin-bottom: 20px;
}
.cm-breadcrumb a { color: var(--cm-text-muted); }
.cm-breadcrumb a:hover { color: var(--cm-black); }
.cm-breadcrumb span { color: var(--cm-black); }

.cm-hero-tag {
  display: inline-flex; align-items: center; gap: 6px;
  background: #FFF7CC; color: #7A6800;
  font-size: 10px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 4px 12px; border-radius: 999px; margin-bottom: 16px;
}
.cm-hero-tag-dot {
  width: 6px; height: 6px; background: var(--cm-yellow);
  border-radius: 50%; flex-shrink: 0;
}

.cm-hero-title {
  font-family: var(--cm-font-d); font-weight: 900;
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 1.06; letter-spacing: -0.03em;
  color: var(--cm-black); margin-bottom: 14px;
}
.cm-hero-subtitle {
  font-size: 14px; color: var(--cm-text-body);
  line-height: 1.65; max-width: 420px; margin-bottom: 22px;
}
.cm-hero-meta {
  display: flex; align-items: center; gap: 16px;
  flex-wrap: wrap; margin-bottom: 18px;
}
.cm-hero-rating { display: flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 700; }
.cm-stars { color: var(--cm-yellow); font-size: 14px; }
.cm-rating-count { font-size: 13px; color: var(--cm-text-muted); font-weight: 400; }
.cm-hero-stat { display: flex; align-items: center; gap: 5px; font-size: 14px; color: var(--cm-text-body); }
.cm-hero-stat i { font-size: 14px; color: var(--cm-text-muted); }

.cm-hero-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.cm-badge {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--cm-text-body);
  background: var(--cm-bg-white); border: 0.5px solid var(--cm-border);
  border-radius: 999px; padding: 5px 12px;
}
.cm-badge i { font-size: 13px; color: var(--cm-green); }

.cm-badge--wishlist { text-decoration: none; }
.cm-badge--wishlist:hover { background: var(--cm-bg-page); border-color: var(--cm-border-dark); }

.cm-author-link { color: var(--cm-text-body); text-decoration: underline; text-underline-offset: 2px; }
.cm-author-link:hover { color: var(--cm-black); }

/* ══════════════════════════════════════
   7. TABS DE NAVEGACIÓN
   ══════════════════════════════════════ */
.cm-tabs-wrap { margin-bottom: 0; }

/* Override de los tabs de Tutor LMS */
.tutor-course-single-tab-wrapper,
.cm-tabs-wrap .tutor-nav {
  display: flex;
  border-bottom: 1.5px solid var(--cm-border);
  margin-bottom: 32px;
  overflow-x: auto;
  scrollbar-width: none;
}
.tutor-course-single-tab-wrapper::-webkit-scrollbar { display: none; }

.tutor-nav-link,
.cm-tabs-wrap .tutor-nav li a {
  font-size: 13px; font-weight: 600; color: var(--cm-text-muted);
  padding: 10px 16px; cursor: pointer; white-space: nowrap;
  border-bottom: 2px solid transparent; margin-bottom: -1.5px;
  transition: color var(--cm-ease); background: transparent; border-top: none;
  border-left: none; border-right: none; text-decoration: none;
}
.tutor-nav-link:hover,
.cm-tabs-wrap .tutor-nav li a:hover { color: var(--cm-black); }
.tutor-nav-link.is-active,
.cm-tabs-wrap .tutor-nav li.is-active a {
  color: var(--cm-black);
  border-bottom-color: var(--cm-black);
}

/* ══════════════════════════════════════
   8. SECCIONES DEL CONTENIDO
   ══════════════════════════════════════ */
.cm-section { margin-bottom: 36px; }

.cm-eyebrow {
  font-size: 10px; font-weight: 800; color: var(--cm-text-muted);
  text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 10px;
}
.cm-section-title {
  font-family: var(--cm-font-d); font-weight: 900; font-size: 21px;
  color: var(--cm-black); line-height: 1.15;
  letter-spacing: -0.025em; margin-bottom: 12px;
}
.cm-section-body { font-size: 15px; color: var(--cm-text-body); line-height: 1.7; }

/* Grid "Lo que vas a aprender" */
.cm-learn-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.cm-learn-item {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: 15px; color: #444; line-height: 1.5;
  background: var(--cm-bg-white); border: 0.5px solid var(--cm-border);
  border-radius: 9px; padding: 10px 12px;
}
.cm-learn-item i { font-size: 15px; color: var(--cm-green); margin-top: 2px; flex-shrink: 0; }

/* ══════════════════════════════════════
   9. CURRICULUM / ACORDEÓN
   ══════════════════════════════════════ */
.cm-curriculum-top {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px;
}
.cm-curriculum-stats { font-size: 14px; color: var(--cm-text-muted); }

.cm-module {
  border: 0.5px solid var(--cm-border); border-radius: 10px;
  overflow: hidden; margin-bottom: 7px; background: var(--cm-bg-white);
  transition: border-color var(--cm-ease);
}
.cm-module:hover { border-color: var(--cm-border-dark); }

.cm-module-hd {
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px 15px; cursor: pointer; user-select: none;
}
.cm-module-hd-left { display: flex; align-items: center; gap: 11px; }

.cm-mod-num {
  width: 26px; height: 26px; border-radius: 6px;
  background: #F0F0EA; font-size: 11px; font-weight: 800;
  font-family: var(--cm-font-d); color: var(--cm-black);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  transition: background var(--cm-ease);
}
.cm-mod-num.is-open { background: var(--cm-yellow); }
.cm-module.is-open .cm-mod-num { background: var(--cm-yellow); }

.cm-mod-name { font-size: 15px; font-weight: 700; color: var(--cm-black); font-family: var(--cm-font-d); }
.cm-mod-dur { font-size: 13px; color: var(--cm-text-muted); margin-top: 2px; }
.cm-mod-chev { font-size: 14px; color: var(--cm-border-dark); transition: transform var(--cm-ease); }
.cm-module.is-open .cm-mod-chev { transform: rotate(180deg); }

.cm-lesson-list { border-top: 0.5px solid #F0F0EA; }
.cm-lesson-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 15px 9px 52px; border-bottom: 0.5px solid #F7F7F5;
  transition: background var(--cm-ease);
}
.cm-lesson-item:last-child { border-bottom: none; }
.cm-lesson-item:hover { background: #FAFAF8; }
.cm-lesson-left { display: flex; align-items: center; gap: 8px; }
.cm-lesson-left i { font-size: 14px; color: var(--cm-border-dark); }
.cm-lesson-name { font-size: 15px; color: #555; }
.cm-preview-chip {
  font-size: 12px; color: var(--cm-green); font-weight: 700;
  background: #E6FAF2; padding: 2px 7px; border-radius: 4px;
}
.cm-lesson-time { font-size: 13px; color: var(--cm-border-dark); }

/* Módulos restantes (colapso) */
.cm-mod-more {
  background: #F9F9F7; border: 0.5px dashed var(--cm-border);
  border-radius: 10px; padding: 13px 15px;
  display: flex; align-items: center; gap: 11px;
  font-size: 14px; color: var(--cm-text-muted);
}
.cm-mod-more-num {
  width: 26px; height: 26px; border-radius: 6px;
  background: #EAEAE4; font-size: 11px; font-weight: 800;
  color: var(--cm-text-muted);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}

/* ══════════════════════════════════════
   10. INSTRUCTOR
   ══════════════════════════════════════ */
.cm-instructor-card {
  background: var(--cm-bg-white); border: 0.5px solid var(--cm-border);
  border-radius: 13px; padding: 22px;
  display: flex; gap: 18px; align-items: flex-start;
}
.cm-instructor-avatar {
  width: 60px; height: 60px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
  background: var(--cm-yellow);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--cm-font-d); font-weight: 900; font-size: 20px; color: var(--cm-black);
}
.cm-instructor-avatar img { width: 100%; height: 100%; object-fit: cover; }
.cm-inst-name {
  font-family: var(--cm-font-d); font-weight: 900; font-size: 15px;
  color: var(--cm-black); letter-spacing: -0.02em; margin-bottom: 2px;
}
.cm-inst-role { font-size: 13px; color: var(--cm-text-muted); margin-bottom: 10px; }
.cm-inst-stats { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 10px; }
.cm-inst-stat { display: flex; align-items: center; gap: 4px; font-size: 14px; color: var(--cm-text-body); }
.cm-inst-stat i { font-size: 14px; color: var(--cm-text-muted); }
.cm-inst-bio { font-size: 15px; color: var(--cm-text-body); line-height: 1.65; }

/* ══════════════════════════════════════
   11. RESPONSIVE — MÓVIL
   ══════════════════════════════════════ */
@media (max-width: 991px) {
  /* Mostrar barra sticky */
  .cm-mobile-bar { display: flex; }
  /* Espacio para que el contenido no quede bajo la barra */
  body { padding-bottom: 80px; }

  .cm-page-wrap { padding: 0 16px; }
  .cm-hero-band { padding: 16px 0 28px; }
  .cm-sidebar-col { padding-top: 0; margin-bottom: 8px; }
  .cm-content-main { padding-top: 24px; }

  /* Sidebar encima del contenido en mobile (Bootstrap: order) */
  .cm-sidebar-col { order: -1; }

  /* La sidebar no es sticky en móvil */
  .cm-sidebar-sticky { position: static; }

  .cm-learn-grid { grid-template-columns: 1fr; }
  .cm-instructor-card { flex-direction: column; }
}

@media (max-width: 575px) {
  .cm-hero-title { font-size: 26px; }
  .cm-lesson-item { padding-left: 36px; }
}

/* ══════════════════════════════════════
   12. INSTRUCTOR NATIVO DE TUTOR LMS
   ══════════════════════════════════════ */

/* Estrella — amarilla */
.tutor-course-instructor .tutor-ratings-average i,
.tutor-course-instructor .tutor-icon-star-bold,
.tutor-course-instructor .tutor-star-rating-group i,
.tutor-single-instructor-bottom .tutor-icon-star-bold {
  color: #FFE500 !important;
}

/* YouTube — rojo */
.tutor-course-instructor .tutor-icon-brand-youtube-bold,
.tutor-single-instructor-bottom .tutor-icon-brand-youtube-bold {
  color: #FF0000 !important;
}

/* Estudiantes — azul */
.tutor-course-instructor .tutor-icon-user-bold,
.tutor-course-instructor .tutor-icon-mortarboard-bold,
.tutor-single-instructor-bottom .tutor-icon-user-bold {
  color: #3B82F6 !important;
}

/* Enlace del nombre del instructor — azul */
.tutor-course-instructor a,
.tutor-single-instructor-bottom a {
  color: #3B82F6 !important;
}
.tutor-course-instructor a:hover,
.tutor-single-instructor-bottom a:hover {
  color: #2563EB !important;
  text-decoration: underline;
}

/* ══════════════════════════════════════
   13. OVERRIDES DE TUTOR LMS
   ══════════════════════════════════════ */

/* Eliminar estilos por defecto de la sidebar de Tutor */
.tutor-course-sidebar { display: none !important; }

/* Asegurarse de que el fondo del body no rompa el hero */
.tutor-page .site-content,
.tutor-page #primary {
  background: transparent;
}

/* Rating stars nativos de Tutor */
.cm-hero-band .tutor-ratings-average { color: var(--cm-black); font-weight: 700; font-size: 13px; }
.cm-hero-band .tutor-ratings-count   { font-size: 12px; color: var(--cm-text-muted); }

/* Login wrapper que Tutor agrega */
.cm-course-entry-box-login { width: 100%; }
.cm-requires-login button { width: 100%; }

/* ══════════════════════════════════════
   MODAL AUTH — TABS LOGIN / REGISTRO
   ══════════════════════════════════════ */

/* Contenedor de pestañas */
.cm-auth-tabs {
  display: flex;
  border-bottom: 2px solid #EBEBEB;
  margin-bottom: 24px;
  gap: 0;
}

/* Pestaña individual */
.cm-auth-tab {
  flex: 1;
  background: none;
  border: none;
  padding: 12px 8px;
  font-family: var(--cm-font-d);
  font-size: 15px;
  font-weight: 700;
  color: #888;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: color 150ms ease, border-color 150ms ease;
}
.cm-auth-tab:hover {
  color: #333;
}
.cm-auth-tab--active {
  color: var(--cm-black);
  border-bottom-color: var(--cm-yellow);
}

/* Paneles */
.cm-auth-panel { display: none; }
.cm-auth-panel--active { display: block; }

/* ── Botón "Regístrate ahora" en el modal de Tutor — más prominente ── */
.tutor-login-modal .tutor-btn-link {
  display: block !important;
  width: 100% !important;
  margin-top: 8px !important;
  padding: 12px 20px !important;
  background: transparent !important;
  border: 2px solid var(--cm-black) !important;
  border-radius: 999px !important;
  font-family: var(--cm-font-d) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  color: var(--cm-black) !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: background 150ms ease, color 150ms ease !important;
}
.tutor-login-modal .tutor-btn-link:hover {
  background: var(--cm-black) !important;
  color: #fff !important;
}
/* Ocultar el texto "¿No tienes una cuenta?" que queda suelto */
.tutor-login-modal .tutor-text-center.tutor-fs-6 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

/* ══════════════════════════════════════
   PÁGINA DE REGISTRO (shortcode)
   ══════════════════════════════════════ */

/* Card principal */
#tutor-registration-wrap {
  max-width: 600px !important;
  margin: 40px auto 60px !important;
  background: #fff !important;
  border: 1px solid #E4E4E4 !important;
  border-radius: 20px !important;
  padding: 40px 44px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.08) !important;
}

/* Grid de columnas */
#tutor-registration-form .tutor-form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  margin-bottom: 0 !important;
}
#tutor-registration-form .tutor-form-col-6 {
  width: 100% !important;
  padding: 0 !important;
}

/* Grupos */
#tutor-registration-form .tutor-form-group {
  margin-bottom: 16px !important;
}
#tutor-registration-form .tutor-form-group label {
  font-family: var(--cm-font-d) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  color: #666 !important;
  margin-bottom: 6px !important;
  display: block !important;
}

/* Inputs */
#tutor-registration-form input[type="text"],
#tutor-registration-form input[type="email"],
#tutor-registration-form input[type="password"] {
  width: 100% !important;
  border: 1.5px solid #DDDDD6 !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  font-family: var(--cm-font-b) !important;
  color: var(--cm-black) !important;
  background: #FAFAFA !important;
  transition: border-color 150ms ease, box-shadow 150ms ease !important;
  margin-bottom: 0 !important;
}
#tutor-registration-form input:focus {
  border-color: var(--cm-yellow) !important;
  background: #fff !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255,229,0,.2) !important;
}

/* Botón submit */
#tutor-registration-form button[type="submit"] {
  display: block !important;
  width: 100% !important;
  margin-top: 24px !important;
  padding: 15px 24px !important;
  background: var(--cm-yellow) !important;
  color: var(--cm-black) !important;
  font-family: var(--cm-font-d) !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  border: none !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background 150ms ease, transform 150ms ease !important;
}
#tutor-registration-form button[type="submit"]:hover {
  background: var(--cm-yellow-h) !important;
  transform: translateY(-1px) !important;
}

/* Responsive */
@media (max-width: 560px) {
  #tutor-registration-wrap { padding: 28px 20px !important; }
  #tutor-registration-form .tutor-form-row { grid-template-columns: 1fr !important; }
}

/* Botón de WooCommerce dentro de la sidebar — espaciado y estilo consistente */
.cm-sidebar-body .woocommerce,
.cm-sidebar-body .woocommerce-variation-add-to-cart,
.cm-sidebar-body form.cart { margin: 0; }

.cm-sidebar-body .single_add_to_cart_button,
.cm-sidebar-body .button.alt,
.cm-sidebar-body input.button {
  width: 100% !important;
  background: var(--cm-yellow) !important;
  color: var(--cm-black) !important;
  font-family: var(--cm-font-d) !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  padding: 15px 20px !important;
  border-radius: 999px !important;
  border: none !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
  transition: background var(--cm-ease), transform var(--cm-ease) !important;
}
.cm-sidebar-body .single_add_to_cart_button:hover,
.cm-sidebar-body .button.alt:hover {
  background: var(--cm-yellow-h) !important;
  transform: translateY(-1px) !important;
}