/* assets/css/styles.css */

/* ================== VARIABLES ================== */
:root{
  --bg:#F9E8EA;                /* fondo rosado suave */
  --surface:#FFFFFF;           /* tarjetas */
  --surface-2:#FFF6F8;         /* superficies suaves */
  --text:#1E1718;              /* texto principal */
  --muted:#6B5A66;             /* texto secundario */
  --border:rgba(30,23,24,.10);

  /* Paleta salón (manteniendo el dorado SOLO como referencia del logo, no como acento UI) */
  --gold:#B44B8B;              /* acento principal (malva) */
  --gold-2:#CA599E;            /* acento secundario (fucsia suave) */
  --gold-soft:rgba(180,75,139,.14);
  --gold-soft-2:rgba(202,89,158,.22);

  --ring:rgba(180,75,139,.20);
  --shadow-sm:0 10px 24px rgba(30,23,24,.10);
  --shadow:0 22px 60px rgba(30,23,24,.14);

  --radius: 18px;
}

*{ box-sizing:border-box; }

/* ================== TIPOGRAFÍA GLOBAL ================== */
html{ font-size: 16px; }

@media (max-width: 575.98px){
  html{ font-size: 15px; }
}

body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Títulos responsivos y elegantes */
h1{ font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem); }
h2{ font-size: clamp(1.25rem, 1.05rem + 1.0vw, 1.8rem); }
h3{ font-size: clamp(1.10rem, 0.98rem + 0.6vw, 1.35rem); }
h4{ font-size: 1.05rem; }
h5{ font-size: 1.00rem; }

p, .form-label, .form-text{
  font-size: .95rem;
}
@media (max-width: 575.98px){
  p, .form-label, .form-text{ font-size: .92rem; }
}

/* ================== CONTENEDOR ================== */
main.container{
  max-width: 1140px;
  padding-left: 12px;
  padding-right: 12px;
}

/* ================== NAV (CSS-only, sin JS) ================== */
.ap-navbar{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}

.ap-navwrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 12px 0;
  position: relative; /* para el dropdown mobile */
}

.ap-brand{
  text-decoration:none;
  color: var(--text);
  display:flex;
  align-items:center;
  gap: 10px;
  min-width: 180px;
}

.ap-logo{
  width: 42px;
  height: 42px;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
  padding: 6px;
  border: 1px solid rgba(201,162,39,.35);
  box-shadow: 0 6px 16px rgba(201,162,39,.15);
}

.ap-brand-text{
  font-weight: 800;
  letter-spacing: .4px;
  line-height: 1.1;
  font-size: 1.05rem;
}

/* Menú en escritorio */
.ap-menu{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: nowrap;
}

/* ===== IMPORTANTE: si dejaste <li class="nav-item"><a class="nav-link">Clientes</a></li> ===== */
.ap-menu li{ list-style:none; margin:0; padding:0; }
.ap-menu .nav-link{
  text-decoration:none;
  color: var(--text);
  padding: .45rem .70rem;
  border-radius: 12px;
  border: 1px solid transparent;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.1;
  white-space: nowrap;
  display:inline-flex;
  align-items:center;
}
.ap-menu .nav-link:hover{
  background: var(--gold-soft);
  border-color: rgba(201,162,39,.25);
}

/* Links normales */
.ap-link{
  text-decoration:none;
  color: var(--text);
  padding: .45rem .70rem;
  border-radius: 12px;
  border: 1px solid transparent;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.1;
  white-space: nowrap;
  display:inline-flex;
  align-items:center;
}

.ap-link:hover{
  background: var(--gold-soft);
  border-color:  rgba(180,75,139,.25);
}

.ap-link.active{
  background: var(--gold-soft);
  border-color:rgba(180,75,139,.45);
}

.ap-btn{
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: .45rem .85rem;
  border-radius: 14px;
  font-weight: 800;
  border: 1px solid transparent;
  font-size: .95rem;
  white-space: nowrap;
}

/* Botón dorado */
.ap-btn-gold{
  color: #ffffff !important;
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  box-shadow: 0 10px 24px rgba(180,75,139,.22);
}
.ap-btn-gold:hover{
  filter: brightness(1.03);
  box-shadow: 0 14px 30px rgba(180,75,139,.28);
}

/* Toggle oculto */
.ap-menu-toggle{ display:none; }

/* Hamburguesa */
.ap-hamburger{
  display:none;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: #fff;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  gap: 5px;
  flex-direction: column;
  box-shadow: var(--shadow-sm);
  flex: 0 0 auto;
}
.ap-hamburger span{
  width: 18px;
  height: 2px;
  background: rgba(17,17,17,.75);
  border-radius: 2px;
}

/* ✅ Tablet + móvil: colapsar antes para evitar textos cortados */
@media (max-width: 1199.98px){
  .ap-hamburger{ display:flex; }

  .ap-menu{
    display:none;
    position:absolute;
    top: 70px;
    right: 12px;
    left: 12px;
    flex-direction:column;
    align-items:stretch;
    padding: 12px;
    border-radius: var(--radius);
    background: #fff;
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
  }

  .ap-menu-toggle:checked ~ .ap-menu{ display:flex; }

  .ap-link, .ap-btn, .ap-menu .nav-link{
    width:100%;
    justify-content:center;
  }
}

/* ================== TARJETAS / SECCIONES ================== */
.ap-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  transition: .18s ease;
}

.ap-card--soft{
  background: var(--surface-2);
}

.ap-card-accent{
  position: relative;
  overflow: hidden;
}

.ap-card-accent::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height: 4px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2));
}

.ap-card:hover{
  box-shadow: var(--shadow-hover);
  transform: translateY(-1px);
}

/* Tipografías */
.ap-muted{ color: var(--muted); }
h1,h2,h3,h4,h5{ color: var(--text); }

/* ================== FORMULARIOS ================== */
.form-control, .form-select{
  border-radius: 14px !important;
  border: 1px solid rgba(17,17,17,.14) !important;
  box-shadow: none !important;
  font-size: .95rem;
}

.form-control:focus, .form-select:focus{
  border-color: rgba(180,75,139,.70) !important;
  box-shadow: 0 0 0 .2rem rgba(180,75,139,.16) !important;
}

/* Botones en formularios */
.btn{ border-radius: 14px; }

/* ================== FOOTER ================== */
.ap-footer{
  margin-top: 40px;
  border-top: 1px solid var(--border);
  background: #fff;
}

/* ================== PEQUEÑOS AJUSTES EXTRA ================== */
@media (max-width: 1399.98px){
  .ap-link{ padding: .40rem .60rem; }
  .ap-btn{ padding: .40rem .75rem; }
}

/* Chip usuario del nav (si lo usas) */
.ap-userchip{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: .42rem .70rem;
  border-radius: 12px;
  border: 1px solid  rgba(180,75,139,.25);
  background: var(--gold-soft);
  font-weight: 700;
  font-size: .92rem;
  white-space: nowrap;
}

.ap-userchip-name{
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ap-userchip-role{
  opacity: .7;
  font-weight: 700;
}

/* ================== HOME: COMPONENTES NUEVOS ================== */

/* Pills de valores */
.ap-pill{
  width:100%;
  padding: .65rem .85rem;
  border-radius: 14px;
  border: 1px solid rgba(17,17,17,.10);
  background: #fff;
  box-shadow: var(--shadow-sm);
  display:flex;
  align-items:center;
  gap: 8px;
}

/* Avatar (equipo) */
.ap-avatar{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  box-shadow: 0 10px 22px rgba(201,162,39,.25);
  border: 1px solid rgba(17,17,17,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 auto;
}

/* Card oscura dentro de secciones blancas (contraste dorado) */
.ap-dark-card{
  border-radius: 14px;
  background: #0f0f12;
  border: 1px solid rgba(226,193,90,.20);
  box-shadow: 0 14px 40px rgba(17,17,17,.18);
}

/* Compromiso */
.ap-commitment{
  border-radius: 16px;
  background: #0f0f12;
  border: 1px solid rgba(226,193,90,.22);
  box-shadow: 0 14px 44px rgba(17,17,17,.18);
}

/* Mercado público mini box */
.ap-mp-logo{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(201,162,39,.28);
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: var(--shadow-sm);
}

/* Galería */
.ap-gallery-tile{
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid var(--border);
  background: #fff;
  box-shadow: var(--shadow-sm);

  /* CLAVE: todas las tarjetas con el mismo tamaño */
  aspect-ratio: 3 / 4;   /* cambia a 1 / 1 si las quieres cuadradas */
}

.ap-gallery-img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;      /* recorta parejo */
  object-position: center;
}

/* Fallback (cuando falta imagen) */
.ap-gallery-fallback{
  display: none;
}

.ap-gallery-placeholder .ap-gallery-fallback{
  display: flex;
  position: absolute;
  inset: 0;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: linear-gradient(180deg, #fff, var(--surface-2));
}

/* Banner flotante Admisión 2026 (sin JS) */
.ap-float-toggle{ display:none; }

.ap-float-banner{
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 998;
  max-width: 420px;
  width: calc(100% - 36px);
  border-radius: 18px;
  padding: 14px 14px;
  background: #0f0f12;
  border: 1px solid rgba(226,193,90,.22);
  box-shadow: 0 18px 55px rgba(17,17,17,.22);
}

.ap-float-badge{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  border: 1px solid rgba(17,17,17,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#1a1406;
  flex: 0 0 auto;
  box-shadow: 0 10px 22px rgba(201,162,39,.22);
}

.ap-float-close{
  cursor:pointer;
  width: 36px;
  height: 36px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  flex: 0 0 auto;
}
.ap-float-close:hover{
  background: rgba(255,255,255,.10);
}

.ap-float-toggle:checked ~ .ap-float-banner{ display:none; }

@media (max-width: 576px){
  .ap-float-banner{
    left: 14px;
    bottom: 14px;
    width: calc(100% - 28px);
    border-radius: 16px;
  }
}

/* ===== Mercado Público (solo logo clickeable) ===== */
.ap-mp-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-top: 10px;
}

.ap-mp-link{
  display:flex;
  align-items:center;
  justify-content:center;
  width: 260px;
  max-width: 100%;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid rgba(17,17,17,.10);
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  text-decoration: none;
}

.ap-mp-link:hover{
  transform: translateY(-1px);
  box-shadow: var(--shadow);
  border-color: rgba(201,162,39,.35);
}

.ap-mp-img{
  width: 100%;
  height: auto;
  max-height: 62px;
  object-fit: contain;
  display:block;
}

/* en pantallas chicas, un poco más compacto */
@media (max-width: 576px){
  .ap-mp-link{
    width: 220px;
    padding: 12px 14px;
  }
  .ap-mp-img{
    max-height: 54px;
  }
}

/* ===== WhatsApp flotante ===== */
.ap-wa-float{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: #25D366;
  color: #fff !important;
  box-shadow: 0 14px 35px rgba(0,0,0,.18);
  z-index: 99999;
}
.ap-wa-float:hover{
  filter: brightness(1.03);
  transform: translateY(-1px);
}
.ap-wa-float i{
  font-size: 28px;
  line-height: 1;
}

/* un poco más chico en móvil */
@media (max-width: 480px){
  .ap-wa-float{
    width: 50px;
    height: 50px;
    right: 14px;
    bottom: 14px;
    border-radius: 16px;
  }
  .ap-wa-float i{ font-size: 26px; }
}

/* ===== Tablas (Clientes / Matrículas) ===== */
.ap-table-compact .table{
  font-size: .88rem;
}

.ap-table-compact .table > :not(caption) > * > *{
  padding: .55rem .65rem;
  vertical-align: middle;
}

.ap-table-compact .table thead th{
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap; /* evita encabezados en 2 líneas (disparejos) */
}

.ap-table-compact .table tbody td{
  line-height: 1.25;
}

.ap-table-compact .table td,
.ap-table-compact .table th{
  border-color: rgba(17,17,17,.08);
}

@media (max-width: 576px){
  .ap-table-compact .table{ font-size: .84rem; }
  .ap-table-compact .table thead th{ font-size: .74rem; }
  .ap-table-compact .table > :not(caption) > * > *{ padding: .45rem .5rem; }
}
/* =========================
   Cursos: imagen uniforme
   ========================= */
.ap-course-thumb{
  position: relative;
  width: 100%;
  height: 170px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(201, 162, 39, .18);
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
}

.ap-course-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;      /* clave: todas iguales */
  display: block;
}

.ap-course-thumb-ph{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  background: radial-gradient(circle at 30% 20%, rgba(201,162,39,.14), transparent 55%);
}

.ap-course-thumb--ph .ap-course-thumb-ph{ opacity: 1; }

/* mini thumb admin */
.ap-course-thumb--sm{
  height: 56px;
  width: 88px;
  border-radius: 12px;
}

@media (max-width: 768px){
  .ap-course-thumb{ height: 150px; }
}

.ap-hero-actions{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 780px;
}

.ap-hero-actions .ap-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
  min-height: 56px;
  border-radius: 16px;
  font-weight: 700;
  font-size: 1rem;
  padding: 0.9rem 1.1rem;
}

.ap-btn-light{
  background: #fff;
  border: 1px solid rgba(17,17,17,.14);
  box-shadow: var(--shadow-sm);
  color: var(--text);
}

@media (max-width: 991.98px){
  .ap-hero-actions{
    grid-template-columns: 1fr;
    max-width: 420px;
  }
}

.ap-hero-actions .ap-btn{
  min-height: 52px;
  font-size: .95rem;
  padding: .8rem 1rem;
}

/* =========================================================
   NAV DESKTOP COMPACTO
   Mantiene el diseño original sin desbordamiento
   Pegar AL FINAL de styles.css
   ========================================================= */

/* Evita scroll horizontal global provocado por el nav */
html, body{
  overflow-x: hidden;
}

/* El nav puede usar más ancho que el main sin cambiar su estilo */
.ap-navbar .container.ap-navwrap{
  max-width: 100%;
  width: 100%;
  padding-left: 18px;
  padding-right: 18px;
}

/* Mantener una sola línea y mejor reparto */
.ap-navwrap{
  gap: 10px;
  flex-wrap: nowrap;
  min-width: 0;
}

/* Marca más compacta, pero visualmente igual */
.ap-brand{
  min-width: 0 !important;
  max-width: 245px;
  flex: 0 0 auto;
  gap: 8px;
}

.ap-logo{
  width: 40px;
  height: 40px;
  padding: 5px;
  flex: 0 0 auto;
}

.ap-brand-text{
  font-size: .95rem;
  line-height: .96;
  letter-spacing: .2px;
  max-width: 180px;
  display: block;
  word-break: break-word;
}

/* Menú más eficiente sin cambiar el formato */
.ap-menu{
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end;
  gap: 4px;
  flex-wrap: nowrap;
}

/* Links normales del nav */
.ap-link,
.ap-menu .nav-link{
  padding: .38rem .52rem;
  font-size: .90rem;
  line-height: 1.05;
  border-radius: 12px;
}

/* Íconos más apretados */
.ap-link .me-1,
.ap-menu .nav-link .me-1,
.ap-btn .me-1,
.ap-userchip .me-1{
  margin-right: .26rem !important;
}

/* Botones del nav */
.ap-btn{
  padding: .40rem .74rem;
  font-size: .90rem;
  line-height: 1.05;
  border-radius: 14px;
}

/* Chip del usuario: mismo estilo, más compacto */
.ap-userchip{
  padding: .38rem .58rem;
  font-size: .86rem;
  gap: 5px;
  max-width: 185px;
  flex: 0 1 auto;
}

.ap-userchip-name{
  max-width: 102px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-userchip-role{
  font-size: .76rem;
  white-space: nowrap;
}

/* Ajuste fino para escritorio "normal" (notebooks / 1366px aprox.) */
@media (min-width: 1200px) and (max-width: 1450px){

  .ap-navbar .container.ap-navwrap{
    padding-left: 14px;
    padding-right: 14px;
  }

  .ap-navwrap{
    gap: 8px;
  }

  .ap-brand{
    max-width: 220px;
    gap: 7px;
  }

  .ap-logo{
    width: 38px;
    height: 38px;
    padding: 5px;
  }

  .ap-brand-text{
    font-size: .90rem;
    line-height: .93;
    max-width: 160px;
  }

  .ap-menu{
    gap: 2px;
  }

  .ap-link,
  .ap-menu .nav-link{
    padding: .34rem .44rem;
    font-size: .84rem;
  }

  .ap-btn{
    padding: .36rem .60rem;
    font-size: .84rem;
  }

  .ap-userchip{
    padding: .34rem .50rem;
    font-size: .81rem;
    max-width: 160px;
  }

  .ap-userchip-name{
    max-width: 82px;
  }

  .ap-userchip-role{
    font-size: .72rem;
  }
}

/* Tu comportamiento mobile/tablet se mantiene */
@media (max-width: 1199.98px){
  .ap-navbar .container.ap-navwrap{
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* ================== REPORTES MATRÍCULAS ================== */
.ap-report-table-wrap{
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 16px;
  border: 1px solid rgba(30,23,24,.08);
  background: #fff;
}

.ap-report-table{
  margin-bottom: 0 !important;
  min-width: 1180px;
  table-layout: auto;
}

.ap-report-table th,
.ap-report-table td{
  padding: .72rem .55rem;
  font-size: .84rem;
  vertical-align: middle;
  border-color: rgba(30,23,24,.08) !important;
}

.ap-report-table thead th{
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .01em;
  color: var(--text);
  background: #fff;
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 1;
}

.ap-report-table tbody td{
  color: var(--text);
  white-space: nowrap;
}

.ap-report-table tbody td:first-child{
  white-space: normal;
  min-width: 220px;
  max-width: 260px;
  line-height: 1.35;
}

.ap-report-table tbody td:nth-child(2){
  min-width: 120px;
}

.ap-report-table .badge{
  font-size: .72rem;
  font-weight: 700;
  padding: .42rem .55rem;
  white-space: nowrap;
}

.ap-report-table .btn{
  font-size: .76rem;
  padding: .38rem .62rem;
  white-space: nowrap;
}

.ap-report-table .text-end,
.ap-report-table .text-center{
  white-space: nowrap;
}

.ap-report-table--detalle{
  min-width: 980px;
}

.ap-report-table--detalle tbody td:nth-child(2){
  white-space: normal;
  min-width: 220px;
  max-width: 280px;
}

.ap-report-table--detalle tbody td:nth-child(3){
  min-width: 120px;
}

.ap-report-table--detalle tbody td:last-child .btn{
  font-size: .74rem;
  padding: .34rem .58rem;
}

@media (max-width: 1199.98px){
  .ap-report-table{
    min-width: 1100px;
  }

  .ap-report-table--detalle{
    min-width: 920px;
  }

  .ap-report-table th,
  .ap-report-table td{
    font-size: .80rem;
    padding: .66rem .48rem;
  }

  .ap-report-table thead th{
    font-size: .74rem;
  }

  .ap-report-table .btn{
    font-size: .72rem;
    padding: .32rem .54rem;
  }

  .ap-report-table .badge{
    font-size: .68rem;
  }
}

@media (max-width: 767.98px){
  .ap-report-table{
    min-width: 1020px;
  }

  .ap-report-table--detalle{
    min-width: 860px;
  }

  .ap-report-table th,
  .ap-report-table td{
    font-size: .76rem;
    padding: .58rem .42rem;
  }

  .ap-report-table thead th{
    font-size: .70rem;
  }

  .ap-report-table tbody td:first-child{
    min-width: 190px;
    max-width: 220px;
  }

  .ap-report-table .btn{
    font-size: .68rem;
    padding: .30rem .48rem;
  }
}

/* =========================
   NAV FIJO ARRIBA
   ========================= */

:root{
  --ap-nav-height: 84px;
}

/* Evita que el contenido quede debajo del nav fijo */
body{
  padding-top: var(--ap-nav-height);
}

/* Ajuste fino de altura visual del nav */
.ap-navbar .ap-navwrap{
  min-height: var(--ap-nav-height);
}

/* En móvil el nav suele ocupar un poco menos */
@media (max-width: 1199.98px){
  :root{
    --ap-nav-height: 76px;
  }
}

/* Menú desplegable mobile por encima del contenido */
@media (max-width: 1199.98px){
  .ap-menu{
    z-index: 10000;
  }
}
/* ================== MATRÍCULA: DOCUMENTOS Y PAGOS ================== */
.ap-plan-card{
  position: relative;
  overflow: hidden;
}

.ap-plan-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:4px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2));
}

.ap-kpi-soft{
  border-radius: 18px;
  border: 1px solid rgba(30,23,24,.08);
  background: #fff;
  padding: 16px 18px;
  box-shadow: var(--shadow-sm);
}

.ap-switch-highlight{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(180,75,139,.08);
  border: 1px solid rgba(180,75,139,.12);
}

.ap-switch-highlight .form-check-input{
  margin-top: 0;
}

.ap-doc-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}

.ap-doc-btn{
  min-height: 48px;
  justify-content: center;
}

.ap-doc-btn.is-disabled,
.ap-doc-btn:disabled{
  opacity: .58;
  cursor: not-allowed;
  background: rgba(255,255,255,.72);
  border-color: rgba(30,23,24,.10);
}

.ap-summary-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}

.ap-payments-table-wrap{
  border-radius: 18px;
  border: 1px solid rgba(30,23,24,.08);
  background: #fff;
}

.ap-payments-table{
  min-width: 980px;
}

.ap-payments-table th,
.ap-payments-table td{
  padding: .78rem .7rem;
  border-color: rgba(30,23,24,.08) !important;
  font-size: .9rem;
  vertical-align: middle;
}

.ap-payments-table thead th{
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
}

.ap-payments-table td:last-child{
  min-width: 240px;
}

@media (max-width: 991.98px){
  .ap-summary-badges{
    justify-content:flex-start;
  }
}

@media (max-width: 767.98px){
  .ap-kpi-soft{
    padding: 14px 15px;
  }

  .ap-doc-grid{
    grid-template-columns: 1fr;
  }
}

/* ===== Switch plan de pago ===== */
.ap-switch-box{
  width: 100%;
  padding: .8rem 1rem;
  border-radius: 14px;
  border: 1px solid rgba(180,75,139,.14);
  background: rgba(180,75,139,.06);
  overflow: hidden;
}

.ap-form-switch-inline{
  display: flex;
  align-items: center;
  gap: .7rem;
  padding-left: 0 !important;
  min-height: auto;
}

.ap-form-switch-inline .form-check-input{
  margin-left: 0 !important;
  margin-top: 0 !important;
  flex: 0 0 auto;
}

.ap-form-switch-inline .form-check-label{
  margin: 0;
  line-height: 1.25;
  font-weight: 500;
  color: var(--text);
}

@media (max-width: 576px){
  .ap-switch-box{
    padding: .75rem .85rem;
  }

  .ap-form-switch-inline{
    gap: .55rem;
  }

  .ap-form-switch-inline .form-check-label{
    font-size: .92rem;
  }
}
/* ================== CLIENTES / MATRÍCULAS ================== */
.ap-cliente-page{
  display:flex;
  flex-direction:column;
  gap: 1.5rem;
}

.ap-client-form-card{
  width:100%;
}

.ap-cliente-chip{
  display:inline-flex;
  align-items:center;
  padding:.6rem .9rem;
  border-radius:14px;
  background: var(--gold-soft);
  border:1px solid rgba(180,75,139,.18);
  color: var(--text);
  font-weight:700;
  font-size:.9rem;
  white-space:nowrap;
}

.ap-client-form-grid .form-control,
.ap-client-form-grid .form-select{
  min-height: 46px;
}

.ap-client-submit-btn{
  min-height: 52px;
  font-size: 1rem;
}

.ap-inline-details{
  border:1px solid rgba(30,23,24,.08);
  border-radius:16px;
  padding: 1rem 1rem .95rem;
  background: rgba(255,255,255,.58);
}

.ap-inline-details summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
}

.ap-inline-details summary::-webkit-details-marker{
  display:none;
}

.ap-inline-details[open]{
  background: rgba(180,75,139,.04);
  border-color: rgba(180,75,139,.14);
}

.ap-subsection-head{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:.5rem 1rem;
  align-items:flex-start;
}

.ap-data-accordion .accordion-item{
  border:none;
}

.ap-accordion-trigger{
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,246,248,.96));
  font-weight:800;
  color: var(--text);
  box-shadow:none !important;
}

.ap-accordion-trigger:not(.collapsed){
  background: linear-gradient(180deg, rgba(180,75,139,.10), rgba(255,246,248,.96));
  color: var(--text);
}

.ap-accordion-trigger::after{
  background-size: 1rem;
}

.ap-data-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  align-items:end;
}

.ap-db-table-wrap{
  border-radius: 18px;
  border: 1px solid rgba(30,23,24,.08);
  background:#fff;
  overflow-x:auto;
}

.ap-db-table{
  min-width: 1180px;
}

.ap-db-table--matriculas{
  min-width: 1080px;
}

.ap-db-table th,
.ap-db-table td{
  padding: .72rem .65rem !important;
  border-color: rgba(30,23,24,.08) !important;
  vertical-align: middle;
}

.ap-db-table tbody td{
  white-space: nowrap;
}

.ap-db-table tbody td:nth-child(3),
.ap-db-table--matriculas tbody td:nth-child(2),
.ap-db-table--matriculas tbody td:nth-child(3){
  white-space: normal;
}

.ap-db-table tbody td:last-child,
.ap-db-table--matriculas tbody td:last-child{
  min-width: 190px;
}

.ap-action-wrap form{
  margin:0;
}

.ap-pagination-bar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.9rem;
}

.ap-pagination-bar .pagination{
  --bs-pagination-border-radius: 12px;
  --bs-pagination-color: var(--text);
  --bs-pagination-hover-color: var(--text);
  --bs-pagination-hover-bg: var(--gold-soft);
  --bs-pagination-hover-border-color: rgba(180,75,139,.20);
  --bs-pagination-active-bg: var(--gold);
  --bs-pagination-active-border-color: var(--gold);
  --bs-pagination-active-color: #fff;
}

@media (max-width: 991.98px){
  .ap-inline-details summary,
  .ap-subsection-head,
  .ap-pagination-bar{
    flex-direction:column;
    align-items:flex-start;
  }

  .ap-cliente-chip{
    white-space:normal;
  }
}

@media (max-width: 767.98px){
  .ap-client-form-card{
    padding: 1.25rem !important;
  }

  .ap-inline-details{
    padding: .9rem .9rem .8rem;
  }

  .ap-db-table,
  .ap-db-table--matriculas{
    min-width: 980px;
  }
}



/* ================== ADMIN CURSOS / EMPRENDEDORES ================== */
.ap-admin-page{
  width: 100%;
}

.ap-admin-form-card{
  width: 100%;
}

.ap-admin-inner-card{
  border-radius: 22px;
}

.ap-admin-form-grid .form-control,
.ap-admin-form-grid .form-select{
  min-height: 48px;
}

.ap-admin-hero-thumb{
  width: 100%;
  max-width: 360px;
  height: 190px;
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(30,23,24,.08);
  position: relative;
}

.ap-admin-hero-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.accordion-collapse.collapse:not(.show){
  display:none;
}

.accordion-collapse.collapse.show{
  display:block;
}

@media (max-width: 991.98px){
  .ap-admin-hero-thumb{
    max-width: 100%;
    height: 180px;
  }
}

/* ================== CONTACTO / LEADS ================== */
.ap-contact-page{
  display:flex;
  flex-direction:column;
  gap:1.5rem;
}

.ap-contact-form-card{
  width:100%;
}

.ap-contact-form-card .ap-card,
.ap-contact-info-card .ap-card{
  border-radius: 24px;
}

.ap-contact-head{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem;
}

.ap-contact-badge{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.6rem .9rem;
  border-radius:14px;
  background: var(--gold-soft);
  border:1px solid rgba(180,75,139,.18);
  color:var(--text);
  font-weight:700;
  font-size:.9rem;
  white-space:nowrap;
}

.ap-contact-form-grid .form-control,
.ap-contact-form-grid .form-select{
  min-height:48px;
}

.ap-contact-form-grid textarea.form-control{
  min-height:120px;
  resize:vertical;
}

.ap-contact-submit-btn{
  min-height:54px;
  font-size:1rem;
}

.ap-contact-inline-help{
  display:block;
  margin-top:.45rem;
  color:var(--muted);
  font-size:.88rem;
}

.ap-contact-select-wrap{
  position:relative;
}

.ap-contact-select-note{
  margin-top:.45rem;
  color:var(--muted);
  font-size:.88rem;
  line-height:1.35;
}

.ap-contact-info-card{
  width:100%;
}

.ap-contact-info-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:1rem;
}

.ap-contact-info-box{
  border:1px solid rgba(30,23,24,.08);
  background: rgba(255,255,255,.62);
  border-radius:18px;
  padding:1rem 1rem .95rem;
  box-shadow: var(--shadow-sm);
}

.ap-contact-info-box h5,
.ap-contact-info-box h6{
  margin-bottom:.55rem;
}

.ap-contact-list{
  margin:0;
  padding-left:1.15rem;
  color:var(--muted);
}

.ap-contact-list li + li{
  margin-top:.35rem;
}

.ap-contact-feature{
  display:flex;
  align-items:flex-start;
  gap:.8rem;
}

.ap-contact-feature-icon{
  width:40px;
  height:40px;
  flex:0 0 auto;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: linear-gradient(180deg, var(--gold-2), var(--gold));
  color:#fff;
  box-shadow: 0 10px 22px rgba(180,75,139,.18);
}

.ap-contact-feature-body{
  min-width:0;
}

.ap-contact-feature-body p{
  margin-bottom:0;
}

.ap-contact-section-soft{
  border:1px solid rgba(30,23,24,.08);
  background: rgba(255,255,255,.56);
  border-radius:18px;
  padding:1rem 1rem .95rem;
}

.ap-contact-section-soft + .ap-contact-section-soft{
  margin-top:1rem;
}

.ap-contact-form-card .alert,
.ap-contact-info-card .alert{
  border-radius:16px;
}

.ap-contact-form-card optgroup{
  font-style:normal;
  font-weight:700;
  color:var(--text);
}

@media (max-width: 991.98px){
  .ap-contact-info-grid{
    grid-template-columns:1fr;
  }

  .ap-contact-head{
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width: 767.98px){
  .ap-contact-form-card .ap-card,
  .ap-contact-info-card .ap-card{
    padding:1.25rem !important;
    border-radius:20px;
  }

  .ap-contact-info-box,
  .ap-contact-section-soft{
    padding:.9rem .9rem .85rem;
    border-radius:16px;
  }

  .ap-contact-badge{
    white-space:normal;
  }
}


/* ================== NAV DROPDOWNS / COMPACTACIÓN ================== */
html, body{ overflow-x:hidden; }
.ap-navbar .container.ap-navwrap{ max-width: 100%; width:100%; padding-left:16px; padding-right:16px; }
.ap-navwrap{ gap:10px; flex-wrap:nowrap; min-width:0; }
.ap-brand{ min-width:0; max-width:235px; flex:0 0 auto; }
.ap-brand-text{ font-size:.94rem; line-height:.95; letter-spacing:.15px; max-width:170px; display:block; word-break:break-word; }
.ap-logo{ width:40px; height:40px; padding:5px; }
.ap-menu{ flex:1 1 auto; min-width:0; justify-content:flex-end; gap:4px; }
.ap-link, .ap-menu .nav-link, .ap-dropdown-toggle{ padding:.38rem .52rem; font-size:.89rem; }
.ap-btn{ padding:.40rem .72rem; font-size:.89rem; }
.ap-userchip{ padding:.38rem .56rem; gap:4px; max-width:185px; font-size:.85rem; }
.ap-userchip-name{ max-width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ap-userchip-role{ font-size:.75rem; }

.ap-dropdown{ position:relative; }
.ap-dropdown > summary{ list-style:none; cursor:pointer; }
.ap-dropdown > summary::-webkit-details-marker{ display:none; }
.ap-dropdown-toggle::after{
  content:"";
  width:7px; height:7px;
  border-right:1.8px solid currentColor;
  border-bottom:1.8px solid currentColor;
  transform:rotate(45deg);
  margin-left:.45rem;
  display:inline-block;
  opacity:.7;
}
.ap-dropdown[open] > .ap-dropdown-toggle::after{ transform:rotate(-135deg) translateY(-1px); }
.ap-dropdown-menu{
  position:absolute;
  top:calc(100% + 10px);
  left:0;
  min-width:220px;
  padding:8px;
  display:none;
  flex-direction:column;
  gap:4px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow-sm);
}
.ap-dropdown-menu--right{ right:0; left:auto; }
.ap-dropdown[open] > .ap-dropdown-menu{ display:flex; z-index: 120; }
.ap-dropdown-item{
  text-decoration:none;
  color:var(--text);
  padding:.52rem .74rem;
  border-radius:12px;
  border:1px solid transparent;
  font-weight:600;
  font-size:.92rem;
  line-height:1.1;
  display:flex;
  align-items:center;
  white-space:nowrap;
}
.ap-dropdown-item:hover,
.ap-dropdown-item.active{
  background:var(--gold-soft);
  border-color:rgba(180,75,139,.25);
}

@media (max-width: 1399.98px){
  .ap-brand{ max-width:210px; }
  .ap-brand-text{ max-width:150px; font-size:.88rem; }
  .ap-menu{ gap:2px; }
  .ap-link, .ap-menu .nav-link, .ap-dropdown-toggle{ padding:.34rem .44rem; font-size:.84rem; }
  .ap-btn{ padding:.36rem .60rem; font-size:.84rem; }
  .ap-userchip{ max-width:160px; }
  .ap-userchip-name{ max-width:82px; }
}

@media (max-width: 1199.98px){
  .ap-dropdown{ width:100%; }
  .ap-dropdown-menu,
  .ap-dropdown-menu--right{
    position:static;
    min-width:0;
    width:100%;
    margin-top:8px;
    box-shadow:none;
    border-radius:14px;
    background:var(--surface-2);
  }
  .ap-dropdown > summary{ width:100%; }
  .ap-dropdown-item{ justify-content:center; }
}


/* ================== AJUSTES NAV / INDEX V3.1 ================== */
.ap-dropdown{ position:relative; }
.ap-dropdown[open]{ z-index: 140; }
.ap-dropdown-menu{ z-index: 150; }

.ap-linea-card{ display:flex; flex-direction:column; }
.ap-linea-desc{ min-height: 126px; }
.ap-linea-features{ min-height: 176px; align-content:start; }
.ap-linea-actions{ margin-top:auto; }

@media (max-width: 991.98px){
  .ap-linea-desc, .ap-linea-features{ min-height: auto; }
}



/* ================== NAV BRAND EN UNA SOLA LÍNEA ================== */
.ap-navbar .ap-brand{
  min-width: 0 !important;
  max-width: 420px !important;
  flex: 0 0 auto;
  gap: 8px;
  flex-wrap: nowrap;
}

.ap-navbar .ap-logo{
  flex: 0 0 auto;
}

.ap-navbar .ap-brand-text{
  display: block;
  max-width: 340px !important;
  font-size: .98rem;
  line-height: 1 !important;
  letter-spacing: .08px;
  white-space: nowrap !important;
  word-break: normal !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 1200px) and (max-width: 1450px){
  .ap-navbar .ap-brand{
    max-width: 360px !important;
  }

  .ap-navbar .ap-brand-text{
    max-width: 285px !important;
    font-size: .90rem;
    white-space: nowrap !important;
    word-break: normal !important;
  }
}

@media (max-width: 1199.98px){
  .ap-navbar .ap-brand{
    max-width: 220px !important;
  }

  .ap-navbar .ap-brand-text{
    max-width: 150px !important;
    white-space: normal !important;
    line-height: .95 !important;
  }
}