/* ladocencIA — Espacio docente con la marca "La chispa"
   Capa visual que unifica la app (antes violeta) con el azul marino y el cempasúchil
   del logo. No cambia estructura, botones ni funciones: solo apariencia. */
:root{
  /* Variables que ya usa platform.css */
  --ld-ink:#1C2B4B;
  --ld-primary:#1C2B4B;
  --ld-primary-2:#2B3E66;
  --ld-primary-soft:#EAF0F7;
  --ld-coral:#F29F2B;
  --ld-coral-soft:#FEF4E4;
  --ld-mint:#2F8A6B;
  --ld-blue:#4E6E9A;
  --ld-bg:#F4F7FB;
  --ld-card:#FFFFFF;
  --ld-line:#E1E7EF;
  --ld-muted:#5A6A85;
  --ld-cream:#FFF9F0;
  /* Variables que usan identity-refresh.css / modern-ui.css */
  --verde-pizarron:#1C2B4B;
  --verde-pizarron-deep:#152240;
  --papel:#FAFBFC;
  --papel-borde:#E1E7EF;
  --tinta:#1C2B4B;
  --gis-dorado:#F29F2B;
  --terracota:#C4553F;
  --gris-texto:#5A6A85;
  --ui-bg:#F4F7FB;
  --ui-border:rgba(28,43,75,.12);
  --ui-border-strong:rgba(28,43,75,.24);
  --ui-ink:#1C2B4B;
  --ui-muted:#5A6A85;
  --ui-green:#1C2B4B;
  --ui-green-2:#2B3E66;
  --ui-green-soft:#EAF0F7;
  --ui-gold:#F29F2B;
  --ui-gold-soft:#FEF4E4;
  --ui-shadow-sm:0 1px 2px rgba(20,32,60,.05),0 8px 22px rgba(20,32,60,.06);
  --ui-shadow:0 2px 4px rgba(20,32,60,.05),0 22px 56px rgba(20,32,60,.12);
  --ui-focus:0 0 0 4px rgba(242,159,43,.28);
}

body{background:#F4F7FB}
body.app-session{background:#EEF2F7}

/* ---------- Contenedor ---------- */
.platform-shell{border-color:#DCE3EC;border-radius:22px;box-shadow:0 2px 6px rgba(20,32,60,.05),0 30px 80px rgba(20,32,60,.12)}
.app-session .platform-wrap{padding:14px}
.app-session .platform-shell{min-height:calc(100vh - 28px);max-height:calc(100vh - 28px)}

/* ---------- Barra lateral ---------- */
.platform-nav{background:linear-gradient(180deg,#1C2B4B 0%,#162341 100%);border-right:0;padding:20px 12px;color:#fff}
.platform-brand--logo{padding:4px 10px 22px}
.platform-brand-logo{height:28px}
.platform-brand--logo small,.platform-brand small{color:rgba(255,255,255,.55);font-size:.7rem;letter-spacing:.01em}
.platform-nav-title{color:rgba(159,182,204,.75);font-weight:700;font-size:.66rem;letter-spacing:.12em;padding:10px 12px 8px}
.platform-nav-title.secondary{margin-top:14px;padding-top:16px;border-top:1px solid rgba(255,255,255,.07)}
.platform-nav button{position:relative;color:rgba(255,255,255,.72);font-weight:500;font-size:.9rem;border-radius:11px;padding:10px 12px;gap:12px;transition:background-color .18s ease,color .18s ease}
.platform-nav button > span{width:20px;display:inline-grid;place-items:center;color:rgba(159,182,204,.9);font-weight:600}
.platform-nav button > span svg{width:18px;height:18px}
.platform-nav button:hover{background:rgba(255,255,255,.06);color:#fff;font-weight:500}
.platform-nav button:hover > span{color:#fff}
.platform-nav button.active{background:rgba(255,255,255,.1);color:#fff;font-weight:650}
.platform-nav button.active > span{color:#F29F2B}
.platform-nav button.active::before{content:"";position:absolute;left:-12px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:#F29F2B}
.platform-nav button:focus-visible{outline:2px solid #F29F2B;outline-offset:1px}
.platform-nav button em{background:rgba(242,159,43,.16);color:#F7B962;font-weight:700;letter-spacing:.04em}
.platform-free-mini{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:14px;margin:18px 2px 2px;padding:14px}
.platform-free-mini strong{color:#fff;font-size:.8rem}
.platform-free-mini span{color:rgba(255,255,255,.6);font-size:.7rem}
.platform-nav .platform-free-mini button{width:auto;margin:0;padding:0;border-radius:0;color:#F29F2B;font-size:.74rem;font-weight:700}
.platform-nav .platform-free-mini button:hover{background:transparent;color:#F7B962}
.app-session .platform-nav{scrollbar-color:rgba(255,255,255,.18) transparent}

/* ---------- Barra superior ---------- */
.platform-content{background:#F4F7FB}
.app-topbar{height:68px;padding:0 28px;border-bottom:1px solid #E1E7EF;background:rgba(255,255,255,.9)}
.topbar-kicker{color:#8A98AE;font-weight:700}
.app-topbar strong{color:#1C2B4B;font-size:1.02rem;font-weight:650}
.platform-level-badge{padding:6px 10px;border-radius:999px;background:#EAF0F7;color:#2B3E66;font-size:.7rem;font-weight:700}
.platform-plan.free{background:#E7F4EE;color:#236B53}
.platform-plan.pago{background:#FDF0DC;color:#9A5A0A}
.topbar-secondary{border:1px solid #DCE3EC;background:#fff;color:#1C2B4B;border-radius:10px;padding:8px 12px;font:inherit;font-size:.78rem;font-weight:600;cursor:pointer}
.topbar-secondary:hover{border-color:#B9C6D6;background:#F8FAFC}
.topbar-primary{display:inline-flex;align-items:center;gap:6px;background:#F29F2B;color:#0F1830;border-radius:10px;padding:9px 14px;font-weight:700;box-shadow:0 6px 16px rgba(242,159,43,.28);transition:background-color .18s,box-shadow .18s}
.topbar-primary:hover{background:#F6AE47;box-shadow:0 8px 20px rgba(242,159,43,.34)}
.topbar-primary svg{width:16px;height:16px}

/* ---------- Inicio del espacio docente ---------- */
.platform-main,.platform-workspace,.platform-plans{padding:30px 32px}
.welcome-kicker{color:#DB8716;font-weight:700;letter-spacing:.12em}
.platform-welcome h2,.workspace-head h2{color:#1C2B4B;font-weight:500;letter-spacing:-.01em}
.platform-welcome p{color:#5A6A85}
.quick-start{gap:14px;margin-bottom:22px}
.quick-start button{border-color:#E1E7EF;border-radius:16px;padding:16px 14px;box-shadow:0 1px 2px rgba(20,32,60,.04);transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s,border-color .2s}
.quick-start button:hover{transform:translateY(-2px);border-color:#C9D5E3;box-shadow:0 12px 28px rgba(20,32,60,.09)}
.quick-start strong{color:#1C2B4B;font-weight:650}
.quick-start small{color:#6B7A93}
.quick-start b,.compact-tools b{display:inline-grid;place-items:center;color:#9AA8BD;transition:color .18s,transform .18s}
.quick-start b svg,.compact-tools b svg{width:16px;height:16px}
.quick-start button:hover b,.compact-tools button:hover b{color:#DB8716;transform:translateX(2px)}
.quick-icon{width:40px;height:40px;flex-basis:40px;border-radius:12px;background:#EAF0F7;color:#1C2B4B}
.quick-icon svg{width:20px;height:20px}
.quick-icon.primary{background:#1C2B4B;color:#fff}
.quick-icon.coral{background:#FEF4E4;color:#C47512}
.quick-icon.blue{background:#EAF0F7;color:#2B3E66}
.quick-icon.mint{background:#E7F4EE;color:#236B53}
.home-panel{border-color:#E1E7EF;border-radius:18px;padding:20px;box-shadow:0 1px 2px rgba(20,32,60,.04)}
.panel-heading h3{color:#1C2B4B;font-weight:650}
.panel-heading > span{color:#8A98AE}
.compact-tools{gap:10px}
.compact-tools button{border-color:#EAEFF5;background:#FAFBFD;border-radius:13px;padding:12px;transition:background-color .18s,border-color .18s}
.compact-tools button:hover{background:#F3F6FA;border-color:#D5DFEA}
.compact-tools button > span{background:#fff;color:#1C2B4B;border:1px solid #E1E7EF;width:34px;height:34px;flex-basis:34px}
.compact-tools button > span svg{width:18px;height:18px}
.compact-tools strong{color:#1C2B4B;font-weight:600}
.compact-tools small{color:#7A889F}
.getting-started > button:hover{background:#F6F8FB}
.getting-started > button > span{background:#1C2B4B;color:#fff}
.getting-started strong{color:#1C2B4B}
.getting-started small{color:#7A889F}
.free-value{background:#FFF9F0;border-color:#F6E3C4}
.free-value strong{color:#7A4F12}
.free-value p{color:#8F7552}
.workspace-back{border-color:#DCE3EC;color:#1C2B4B;font-weight:600}
.workspace-back:hover{background:#F6F8FB}
.package-intro{background:#EAF0F7;border-color:#D3DEEB;color:#3B4D6B}
.package-intro strong{color:#1C2B4B}

/* Planes dentro de la app */
.plan-card{border-color:#E1E7EF;border-radius:20px}
.plan-card.plus-plan{background:linear-gradient(160deg,#FFF9F0,#fff);border-color:#F3DDB9}
.plan-name{color:#1C2B4B}
.plan-price{color:#1C2B4B}
.plan-card button{background:#F29F2B;color:#0F1830}
.plus-plan button{background:#F3F6FA;color:#7B89A1}
.plan-badge{background:#FEF4E4;color:#94590B}

/* ---------- Generador (panel de trabajo) ---------- */
.btn-principal{background:#1C2B4B;box-shadow:0 10px 24px rgba(28,43,75,.2);border-radius:12px}
.btn-principal:hover{background:#152240;box-shadow:0 12px 28px rgba(28,43,75,.26)}
.btn-ghost{border-color:#C9D5E3;color:#1C2B4B;border-radius:10px}
.btn-ghost:hover{background:#F3F6FA}
.campo-libre{border-color:#E1E7EF;background:linear-gradient(180deg,#F8FAFC,#F3F6FA)}
input:focus,select:focus,textarea:focus{border-color:#1C2B4B;outline:none;box-shadow:0 0 0 4px rgba(242,159,43,.22)}
input:hover,select:hover,textarea:hover{border-color:#B9C6D6}
.btn-nivel.activo{background:#1C2B4B;border-color:#1C2B4B}
.documento h2{color:#1C2B4B}
.documento h1{border-bottom-color:#F29F2B}
.documento-vacio{background:
  linear-gradient(90deg,transparent 49.85%,rgba(28,43,75,.04) 50%,transparent 50.15%),
  linear-gradient(transparent 49.85%,rgba(28,43,75,.04) 50%,transparent 50.15%);background-size:36px 36px}
.documento-vacio p{border-color:rgba(28,43,75,.18)}
.modal-fondo{background:rgba(15,24,48,.6)}
.btn-cerrar:hover{background:#F3F6FA}

/* ---------- Ventana de acceso ---------- */
.ld-auth-overlay{background:rgba(15,24,48,.55)}
.ld-auth-dialog{border-color:#E1E7EF;border-radius:24px}
.ld-auth-dialog h2{color:#1C2B4B}
.ld-level-choice button{border-color:#DCE3EC;background:#FAFBFD;color:#1C2B4B}
.ld-level-choice button:hover{border-color:#9FB6CC;background:#F3F6FA}
.ld-level-choice button[aria-pressed="true"]{border-color:#1C2B4B;background:#EAF0F7;box-shadow:0 0 0 3px rgba(28,43,75,.12)}
.ld-level-choice button[aria-pressed="true"]::after{color:#1C2B4B}
.ld-email-row input:focus{border-color:#1C2B4B;box-shadow:0 0 0 4px rgba(242,159,43,.22)}
.ld-email-row button{background:#1C2B4B}
.ld-email-row button:hover{background:#152240}
.ld-auth-benefits span::before{color:#2F8A6B}

/* ---------- Móvil ---------- */
@media (max-width:850px){
  .platform-nav{background:#1C2B4B;padding:8px}
  .platform-nav button{padding:9px 12px}
  .platform-nav button.active::before{left:12px;right:12px;top:auto;bottom:2px;width:auto;height:2px;border-radius:2px}
  .app-session .platform-wrap{padding:8px}
  .app-topbar{height:auto;min-height:60px;padding:10px 16px;flex-wrap:wrap;gap:10px}
  .topbar-actions{flex-wrap:wrap;gap:6px}
  .topbar-actions button{white-space:nowrap;font-size:.76rem;padding:8px 11px}
  .platform-main,.platform-workspace,.platform-plans{padding:20px 16px}
}
