:root{
  --ecp-green:#5C8A35;
  --ecp-yellow:#ffde59;
  --ecp-bg:#f5faf1;
  --ecp-card:#ffffff;
  --ecp-border:rgba(17,24,39,.10);
  --ecp-shadow: 0 14px 40px rgba(17,24,39,.10);
}

/* 1) Layout general: más aire */
.tutor-dashboard{
  background: var(--ecp-bg) !important;
}

/* El contenedor principal del dashboard (para que no quede pegado) */
.tutor-dashboard .tutor-dashboard-container,
.tutor-dashboard .tutor-dashboard-content{
  padding: 24px !important;
}

/* 2) Sidebar como "app panel" */
.tutor-dashboard-left-menu{
  background: var(--ecp-card) !important;
  border: 1px solid var(--ecp-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--ecp-shadow) !important;
  padding: 14px !important;
  position: sticky;
  top: 110px; /* ajusta si tu header es más alto */
}

/* Items sidebar */
.tutor-dashboard-left-menu a{
  border-radius: 12px !important;
  padding: 10px 12px !important;
  margin: 3px 0 !important;
  color: #1f2d16 !important;
}
.tutor-dashboard-left-menu a:hover{
  background: rgba(92,138,53,.08) !important;
}
.tutor-dashboard-left-menu .active a,
.tutor-dashboard-left-menu a.is-active{
  background: rgba(92,138,53,.14) !important;
  border: 1px solid rgba(92,138,53,.20) !important;
  color: #0f1a0b !important;
}

/* 3) Área de contenido: tarjeta grande */
.tutor-dashboard-content{
  background: transparent !important;
  padding: 0 !important;
}
.tutor-dashboard-content-inner{
 /* background: var(--ecp-card) !important;
  border: 1px solid var(--ecp-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--ecp-shadow) !important;  */
  padding: 22px !important; /* el padding que te falta */
}

/* 4) Encabezado "Dashboard" más clean */
.tutor-dashboard-title{
  margin-bottom: 14px !important;
  font-size: 18px !important;
  color: #0f1a0b !important;
}

/* 5) Grid de métricas: separación real */
.tutor-dashboard-content-inner .tutor-row{
  --tutor-gutter-x: 18px;
  --tutor-gutter-y: 18px;
}
.tutor-dashboard-content-inner .tutor-card{
  border-radius: 16px !important;
  border: 1px solid var(--ecp-border) !important;
  box-shadow: 0 10px 26px rgba(17,24,39,.08) !important;
  background: #fff !important;
}

/* Compacta el contenido dentro de las tarjetas */
.tutor-dashboard-content-inner .tutor-card > div{
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

/* Icono circular + acento */
.tutor-dashboard-content-inner .tutor-round-box{
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(92,138,53,.10) !important;
  border: 1px solid rgba(92,138,53,.18) !important;
  color: var(--ecp-green) !important;
}

/* 6) Tabla Mis cursos: como módulo moderno */
.tutor-dashboard-content-inner .tutor-table-responsive{
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid var(--ecp-border) !important;
  box-shadow: 0 10px 26px rgba(17,24,39,.08) !important;
}
.tutor-dashboard-content-inner .tutor-table{
  margin: 0 !important;
  background: #fff !important;
}
.tutor-dashboard-content-inner .tutor-table thead th{
  background: #fbfdf9 !important;
  border-bottom: 1px solid var(--ecp-border) !important;
}
.tutor-dashboard-content-inner .tutor-table tbody tr:hover td{
  background: rgba(92,138,53,.05) !important;
}

/* 7) Botón "Ver todo" / "View all" */
.tutor-dashboard-content-inner a.tutor-btn.tutor-btn-ghost{
  border: 1px solid rgba(92,138,53,.25) !important;
  border-radius: 999px !important;
  color: var(--ecp-green) !important;
  background: rgba(92,138,53,.06) !important;
  padding: 8px 12px !important;
}

/* === Colores oficiales en botones e iconos (Paso 4) === */

/* Botones principales del dashboard (incluye New Bundle / New Course) */
.tutor-dashboard a.tutor-btn,
.tutor-dashboard button.tutor-btn,
.tutor-dashboard .tutor-btn{
  background: var(--ecp-green) !important;
  border-color: var(--ecp-green) !important;
  color: #fff !important;
}

/* Botón secundario/ghost (si aparece) */
.tutor-dashboard .tutor-btn.tutor-btn-ghost{
  background: rgba(92,138,53,.08) !important;
  border: 1px solid rgba(92,138,53,.28) !important;
  color: var(--ecp-green) !important;
}

/* Hover botones */
.tutor-dashboard .tutor-btn:hover{
  filter: brightness(0.98);
}

/* Iconos (menú + tarjetas + elementos sueltos) */
/* Iconos SOLO dentro del dashboard (sidebar + contenido), NO footer */
.tutor-dashboard .tutor-dashboard-left-menu i,
.tutor-dashboard .tutor-dashboard-left-menu [class*="tutor-icon-"],
.tutor-dashboard .tutor-dashboard-content i,
.tutor-dashboard .tutor-dashboard-content [class*="tutor-icon-"]{
  color: var(--ecp-green) !important;
}

/* Blindaje extra: footer no hereda nada raro */
.tutor-dashboard .elementor-location-footer i,
.tutor-dashboard .elementor-location-footer svg{
  color: inherit !important;
  font-size: inherit !important;
  width: auto !important;
  height: auto !important;
  line-height: inherit !important;
}


/* Iconos dentro de círculos (round-box) */
.tutor-dashboard .tutor-round-box,
.tutor-dashboard .tutor-round-box i{
  color: var(--ecp-green) !important;
}

/* Campanas / badges / pequeños círculos */
.tutor-dashboard .tutor-notification-icon,
.tutor-dashboard .tutor-badge,
.tutor-dashboard .tutor-badge i{
  color: var(--ecp-green) !important;
}

/* Estrellas del rating en amarillo oficial */
.tutor-dashboard .tutor-ratings i,
.tutor-dashboard .tutor-star-rating i{
  color: var(--ecp-yellow) !important;
}

/* Links subrayados/acciones (ej: completar perfil) */
.tutor-dashboard a{
  text-decoration-color: rgba(92,138,53,.35);
}
.tutor-dashboard a:hover{
  color: var(--ecp-green);
}

/* === Botones outline (New Bundle / New Course) === */
.tutor-dashboard .tutor-btn.tutor-btn-primary,
.tutor-dashboard .tutor-btn.tutor-btn-success{
  background: transparent !important;
  color: var(--ecp-green) !important;
  border: 2px solid var(--ecp-green) !important;
  box-shadow: none !important;
}

/* Hover */
.tutor-dashboard .tutor-btn.tutor-btn-primary:hover,
.tutor-dashboard .tutor-btn.tutor-btn-success:hover{
  background: var(--ecp-green) !important;
  color: #fff !important;
}

/* Icono dentro del botón */
.tutor-dashboard .tutor-btn i{
  color: inherit !important;
}

.tutor-iconic-btn-secondary {
  background-color: transparent !important;
  border: 2px solid var(--ecp-green) !important;
  color: var(--ecp-green);
}

/* Quitar línea vertical derecha del sidebar */
.tutor-dashboard-left-menu{
  border-right: none !important;
}

/* Tutor a veces agrega un separador extra */
.tutor-dashboard .tutor-dashboard-left-menu::after,
.tutor-dashboard .tutor-dashboard-left-menu::before{
  display: none !important;
}

/* Por si el borde viene del grid/columna */
.tutor-dashboard .tutor-col-md-3,
.tutor-dashboard .tutor-col-lg-3{
  border-right: none !important;
}
/* === Mantener separadores horizontales === */
.tutor-dashboard .tutor-hr{
  display: block !important;
  opacity: .25;
}

/* === Quitar SOLO el separador vertical === */
.tutor-dashboard .tutor-vr{
  display: none !important;
  width: 0 !important;
}

/* Quitar SOLO la línea vertical entre sidebar y contenido */
.tutor-dashboard .tutor-dashboard-left-menu{
  border-right: 0 !important;
}

.tutor-dashboard .tutor-dashboard-content{
  border-left: 0 !important;
}

/* Por si la línea viene del wrapper de columnas */
.tutor-dashboard .tutor-row > [class*="tutor-col"]{
  border-left: 0 !important;
  border-right: 0 !important;
}

/* Pseudo-elemento que a veces dibuja el divider */
.tutor-dashboard .tutor-dashboard-left-menu::after,
.tutor-dashboard .tutor-dashboard-left-menu::before,
.tutor-dashboard .tutor-dashboard-content::after,
.tutor-dashboard .tutor-dashboard-content::before{
  display: none !important;
  content: none !important;
}


/* Sidebar más compacto */
.tutor-dashboard-left-menu a{
  padding: 9px 10px !important;
  font-size: 14px !important;
}

/* Iconos del sidebar un poco más pequeños y alineados */
.tutor-dashboard-left-menu i,
.tutor-dashboard-left-menu [class*="tutor-icon-"]{
  font-size: 16px !important;
  width: 18px;
  text-align: center;
}


/* Perfil: más compacto y limpio */
.tutor-profile-completion.tutor-card{
  border-radius: 18px !important;
  border: 1px solid rgba(17,24,39,.10) !important;
  box-shadow: 0 10px 26px rgba(17,24,39,.08) !important;
}

/* Links dentro del checklist */
.tutor-profile-completion a.tutor-btn.tutor-btn-ghost{
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ecp-green) !important;
}


.ecp-dash-toolbar{
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;
}

/* Header de sección: "Escritorio" + acciones a la derecha */
.tutor-dashboard-title{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.ecp-dash-toolbar{
  margin: 0 !important;
}


/* Compactar bloque "Completa tu perfil" */
.tutor-profile-completion{
  padding: 14px 16px !important;
}

.tutor-profile-completion .tutor-px-32{ padding-left: 16px !important; padding-right: 16px !important; }
.tutor-profile-completion .tutor-py-24{ padding-top: 14px !important; padding-bottom: 14px !important; }

/* Reduce separaciones internas */
.tutor-profile-completion .tutor-mb-40{ margin-bottom: 18px !important; }
.tutor-profile-completion .tutor-mt-20{ margin-top: 10px !important; }
.tutor-profile-completion .tutor-mt-12{ margin-top: 8px !important; }

/* Checklist a la derecha más compacto */
.tutor-profile-completion a.tutor-btn.tutor-btn-ghost{
  font-size: 13px !important;
  line-height: 1.25 !important;
}

/* Dashboard-only (porque este CSS solo carga ahí): quitar bullets del footer Elementor */
.elementor-location-footer ul,
.elementor-location-footer ol{
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* Por si el bullet viene como ::marker (muy común) */
.elementor-location-footer li::marker{
  content: "" !important;
}

/* FIX: Footer Elementor nav menu no debe comportarse como lista gigante */
.elementor-location-footer .elementor-nav-menu,
.elementor-location-footer .elementor-nav-menu ul{
  display: block !important;
  width: auto !important;
}

.elementor-location-footer .elementor-nav-menu li{
  display: block !important;
  width: auto !important;
  margin: 0 0 10px 0 !important;
}

.elementor-location-footer .elementor-nav-menu a.elementor-item{
  display: inline-flex !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* Por si algún CSS del dashboard está forzando links a 100% */
.elementor-location-footer a{
  width: auto !important;
}
/* FIX: Elementor Icon List en footer */
.elementor-location-footer .elementor-icon-list-item{
  display: block !important;
}

.elementor-location-footer .elementor-icon-list-item a{
  display: inline-flex !important;
  width: auto !important;
  align-items: center !important;
}

.elementor-location-footer .elementor-icon-list-icon{
  flex: 0 0 auto !important;
  width: auto !important;
  margin-right: 10px !important;
}

.elementor-location-footer .elementor-icon-list-icon i,
.elementor-location-footer .elementor-icon-list-icon svg{
  font-size: 16px !important;
  width: 16px !important;
  height: 16px !important;
}

/* Solo la tabla de "Mis cursos" */
.tutor-dashboard .table-popular-courses{
  border: none !important;
}

.tutor-dashboard .table-popular-courses th,
.tutor-dashboard .table-popular-courses td{
  border-bottom: none !important;
}
/* Quitar borde gris del bloque "Mis cursos" */
.tutor-dashboard .tutor-table,
.tutor-dashboard .tutor-table th,
.tutor-dashboard .tutor-table td,
.tutor-dashboard .tutor-card{
  border: none !important;
}

/* Quitar SOLO la línea vertical derecha del menú del dashboard */
.tutor-frontend-dashboard-maincontent 
ul.tutor-dashboard-permalinks::before{
  display: none !important;
  content: none !important;
}

/* Quitar la línea horizontal superior del dashboard */

.tutor-dashboard .tutor-frontend-dashboard-header:after {
    display: none !important;
  content: none !important;
}

/* Ajuste fino del sidebar */
.tutor-dashboard-left-menu{
  padding-right: 0 !important;
}

.tutor-dashboard-left-menu ul.tutor-dashboard-permalinks{
  padding-left: 16px !important;
  padding-right: 8px !important;
}

/* =========================
   TUTOR LOGIN (NO LOGGED IN)
   ========================= */

body.tutor-frontend:not(.logged-in) .tutor-dashboard,
body.tutor-frontend:not(.logged-in) .tutor-frontend-dashboard {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 80px 20px;
}

/* contenedor del formulario */
body.tutor-frontend:not(.logged-in) .tutor-login-wrap,
body.tutor-frontend:not(.logged-in) .tutor-login-form-wrap {
  max-width: 580px;
  margin-top: 50px;
  margin-bottom: 50px;
  width: 100%;
  background: #ffffff;
  padding: 32px;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0,0,0,.08);
}

/* inputs */
body.tutor-frontend:not(.logged-in) .tutor-form-control {
  border-radius: 10px;
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
}

/* botón principal */
body.tutor-frontend:not(.logged-in) .tutor-btn-primary {
  background: #5C8A35;
  border-radius: 12px;
  font-weight: 600;
}

body.tutor-frontend:not(.logged-in) .tutor-btn-primary:hover {
  background: #4e762d;
}

/* links */
body.tutor-frontend:not(.logged-in) a {
  color: #5C8A35;
}

/* Fondo login igual al escritorio */
body.tutor-frontend:not(.logged-in) {
  background: #f3f8ee;
}

/* Botón login igual al dashboard */
body.tutor-frontend:not(.logged-in) .tutor-btn-primary,
body.tutor-frontend:not(.logged-in) button[type="submit"] {
  background: #5C8A35;
  border: none;
  border-radius: 12px;
  padding: 14px 18px;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  transition: background .2s ease;
}

body.tutor-frontend:not(.logged-in) .tutor-btn-primary:hover,
body.tutor-frontend:not(.logged-in) button[type="submit"]:hover {
  background: #4e762d;
}

body.tutor-frontend:not(.logged-in) .tutor-login-form-wrap {
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
}
/* Ocultar "Forgot Password?" de WooCommerce en login Tutor */
body.tutor-frontend:not(.logged-in) a[href*="my-account"],
body.tutor-frontend:not(.logged-in) a[href*="mi-cuenta"],
body.tutor-frontend:not(.logged-in) .woocommerce-LostPassword {
  display: none !important;
}


/* =========================
   TUTOR AUTH (LOGIN/REGISTER/RESET)
   ========================= */

body.tutor-frontend:not(.logged-in) { 
  background: #f3f8ee;
}

/* Centrado y padding igual al dashboard */
body.tutor-frontend:not(.logged-in) .tutor-dashboard,
body.tutor-frontend:not(.logged-in) .tutor-frontend-dashboard{
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 80px 20px;
}

/* Card para login + registro + reset */
body.tutor-frontend:not(.logged-in) .tutor-login-wrap,
body.tutor-frontend:not(.logged-in) .tutor-login-form-wrap,
body.tutor-frontend:not(.logged-in) .tutor-register-wrap,
body.tutor-frontend:not(.logged-in) .tutor-register-form-wrap,
body.tutor-frontend:not(.logged-in) .tutor-reset-password-wrap,
body.tutor-frontend:not(.logged-in) .tutor-reset-password-form-wrap,
body.tutor-frontend:not(.logged-in) form.tutor-register-form,
body.tutor-frontend:not(.logged-in) form.tutor-login-form{
  max-width: 620px;
  width: 100%;
  background: #fff;
  padding: 32px;
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(0,0,0,.08);
}

/* Inputs */
body.tutor-frontend:not(.logged-in) .tutor-form-control,
body.tutor-frontend:not(.logged-in) input[type="text"],
body.tutor-frontend:not(.logged-in) input[type="email"],
body.tutor-frontend:not(.logged-in) input[type="password"]{
  border-radius: 10px;
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
}

/* Botones: mismo verde del dashboard */
body.tutor-frontend:not(.logged-in) .tutor-btn-primary,
body.tutor-frontend:not(.logged-in) button[type="submit"],
body.tutor-frontend:not(.logged-in) input[type="submit"]{
  background: #5C8A35 !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  color: #fff !important;
}

body.tutor-frontend:not(.logged-in) .tutor-btn-primary:hover,
body.tutor-frontend:not(.logged-in) button[type="submit"]:hover,
body.tutor-frontend:not(.logged-in) input[type="submit"]:hover{
  background: #4e762d !important;
}

/* Links del registro/login */
body.tutor-frontend:not(.logged-in) a{
  color: #5C8A35;
}

/* Fondo suave como dashboard */
body.tutor-page .site-content,
body.tutor-page .site,
body.tutor-page {
  background: #f3f8ee !important; /* ajusta si tu tono exacto es otro */
}

/* Centrar y “card” igual al login */
#tutor-registration-wrap {
  max-width: 720px;
  margin: 60px auto !important;
  padding: 28px !important;
  background: #fff !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.08) !important;
}

/* Inputs */
#tutor-registration-wrap input[type="text"],
#tutor-registration-wrap input[type="password"],
#tutor-registration-wrap input[type="email"]{
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  padding: 4px 6px !important;
  height: auto !important;
}

/* Botón igual al dashboard (verde) */
#tutor-registration-wrap .tutor-btn.tutor-btn-primary,
#tutor-registration-wrap button.tutor-btn-primary{
  background: #5C8A35 !important;
  border-color: #5C8A35 !important;
  color: #fff !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  font-weight: 700 !important;
}

/* Grid a una columna para que no se “rompa” visualmente */
#tutor-registration-wrap .tutor-form-row{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
}
#tutor-registration-wrap .tutor-form-col-6,
#tutor-registration-wrap .tutor-form-col-12{
  width: 100% !important;
}


/* Reducir espacio entre campos en login/registro Tutor */
#tutor-registration-wrap .tutor-form-group,
#tutor-login-wrap .tutor-form-group {
  margin-bottom: 14px; /* antes suele ser 24px */
}

/* Ajustar separación del label */
#tutor-registration-wrap .tutor-form-group label,
#tutor-login-wrap .tutor-form-group label {
  margin-bottom: 6px;
  display: inline-block;
}

/* Opcional: inputs un poco más compactos */
#tutor-registration-wrap input,
#tutor-login-wrap input {
  padding-top: 10px;
  padding-bottom: 10px;
}


body.page-template-elementor_canvas {
  background: #f4f9ef !important;
}
body.page-template-elementor_canvas * {
  background-color: transparent;
}
#tutor-registration-wrap form {
  background: #fff; /* para que el card siga blanco */
}


/* Registro Tutor: usar ancho completo aunque Astra ponga contenedor */
body.tutor-page .site-content,
body.tutor-page #content,
body.tutor-page .ast-container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.tutor-page .ast-container {
  width: 100% !important;
}

/* Centrar el formulario y darle un ancho decente */
body.tutor-page #tutor-registration-wrap {
  max-width: 620px;
  margin: 0 auto;
  padding: 40px 20px;
}


.ecp-reg-title{
  text-align:center;
  font-size:32px;
  margin:0 0 22px;
  font-weight:700;
  
}
/* El wrap del registro */
#tutor-registration-wrap{
  position: relative;
  padding-top: 40px; /* deja espacio arriba para el título */
}

/* Título inyectado */
#tutor-registration-wrap .ecp-reg-title{
  position: absolute;
  top: -70px;         /* ajusta a gusto */
  left: 0;
  width: 100%;
  text-align: center;
  margin: 0;
}

/* Más espacio entre header y el bloque del registro */
body.page-id-12 .site-content,
body.page-id-12 #content {
  padding-top: 80px;
}

/* Si tu título está "absoluto", bájalo un poco también */
#tutor-registration-wrap{
  position: relative;
  padding-top: 60px; /* espacio interno para que no choque */
}

#tutor-registration-wrap .ecp-reg-title{
  position: absolute;
  top: -90px; /* antes estaba -70px, subía mucho; ahora lo bajas */
  left: 0;
  width: 100%;
  text-align: center;
  margin: 0;
}
/* Separación real entre título y formulario */
#tutor-registration-wrap form {
  margin-top: 0px;
}

/* ========== FIX: restaurar fondos en dashboard (avatar + complete profile) ========== */
body.tutor-frontend .tutor-dashboard,
body.tutor-frontend .tutor-wrap {
  /* aseguramos que el dashboard siga con su look */
}

/* Avatar (círculo) */
body.tutor-frontend .tutor-dashboard .tutor-dashboard-header .tutor-avatar,
body.tutor-frontend .tutor-dashboard .tutor-dashboard-header .tutor-avatar img,
body.tutor-frontend .tutor-dashboard .tutor-dashboard-header .tutor-avatar span {
  background: #fff !important;
}

/* Bloque "Completa tu perfil" (puede variar por versión, por eso cubro varios) */
body.tutor-frontend .tutor-dashboard .tutor-dashboard-profile-completion,
body.tutor-frontend .tutor-dashboard .tutor-dashboard-profile-completion-wrapper,
body.tutor-frontend .tutor-dashboard .tutor-dashboard-profile-completion-content,
body.tutor-frontend .tutor-dashboard .tutor-card,
body.tutor-frontend .tutor-dashboard .tutor-card-body {
  background: #fff !important;
}

/* Si tu skin usa tarjetas con un tono muy leve, puedes usar este en vez de blanco puro:
background: rgba(255,255,255,.92) !important;
*/