/* ============================================================
   EL REY NACIÓ 2026 — Sistema de Producción
   Hoja de estilos
   ============================================================ */
:root{
  --azul:#1F3864; --azul-claro:#2E75B6; --dorado:#BF9000;
  --rojo:#C00000; --verde:#375623; --gris:#5B6770;
  --fondo:#F4F6F9; --panel:#FFFFFF; --borde:#E1E6ED;
  --texto:#1B2430; --tenue:#6B7684;
  --sombra:0 1px 3px rgba(16,24,40,.06),0 6px 20px rgba(16,24,40,.05);
  --radio:12px;
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--fondo);color:var(--texto);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:15px;line-height:1.5;
}
a{color:var(--azul-claro);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{margin:0 0 .4em;line-height:1.25}
small{display:block;font-size:12px}

/* ---------- BARRA SUPERIOR ---------- */
.barra{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:12px 24px;background:var(--azul);color:#fff;flex-wrap:wrap;
}
.marca-titulo{display:block;font-weight:700;font-size:17px;letter-spacing:.3px}
.marca-sub{display:block;font-size:11px;opacity:.75}
.barra-derecha{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.contador{background:rgba(255,255,255,.14);padding:5px 12px;border-radius:20px;font-size:12px}
.contador strong{font-size:15px}
.usuario{text-align:right;font-size:13px;line-height:1.2}
.usuario small{opacity:.7;font-size:11px}
.boton-salir{color:#fff;border:1px solid rgba(255,255,255,.35);padding:5px 12px;border-radius:8px;font-size:13px}
.boton-salir:hover{background:rgba(255,255,255,.12);text-decoration:none}

/* ---------- MENÚ ---------- */
.menu{display:flex;gap:2px;background:#fff;padding:0 16px;border-bottom:1px solid var(--borde);overflow-x:auto}
.menu a{
  display:flex;align-items:center;gap:7px;padding:13px 15px;color:var(--tenue);
  font-size:14px;font-weight:500;white-space:nowrap;border-bottom:2.5px solid transparent;
}
.menu a:hover{color:var(--azul);text-decoration:none;background:#FAFBFD}
.menu a.activo{color:var(--azul);border-bottom-color:var(--azul);font-weight:600}
.menu svg{width:17px;height:17px}

.contenido{max-width:1440px;margin:0 auto;padding:24px}
.titulo-pagina{font-size:24px;color:var(--azul)}
.bajada{color:var(--tenue);margin:0 0 20px;font-size:14px}
.pie{text-align:center;padding:24px;color:var(--tenue);font-size:12px;border-top:1px solid var(--borde);margin-top:40px}

/* ---------- TARJETAS ---------- */
.tarjeta{background:var(--panel);border:1px solid var(--borde);border-radius:var(--radio);padding:18px 20px;box-shadow:var(--sombra);margin-bottom:20px}
.tarjeta.sin-relleno{padding:0;overflow:hidden}
.tarjeta h3{font-size:15px;color:var(--azul);margin-bottom:12px}
.tarjeta h4{font-size:13px;color:var(--gris);margin-top:16px;text-transform:uppercase;letter-spacing:.4px}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:20px}
.columnas{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;align-items:start}
.columnas-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.rejilla-tarjetas{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.dos-paneles{display:grid;grid-template-columns:minmax(280px,1fr) minmax(340px,1.4fr);gap:20px;align-items:start}
@media(max-width:900px){.columnas-2,.dos-paneles{grid-template-columns:1fr}}

.metrica{display:flex;flex-direction:column;gap:2px}
.metrica-num{font-size:34px;font-weight:700;color:var(--azul);line-height:1}
.metrica-eti{font-size:13px;color:var(--gris);font-weight:500}
.metrica small{color:var(--tenue);margin-top:4px}
.metrica.peligro .metrica-num{color:var(--rojo)}

.area-tarjeta{border-left:4px solid var(--color,var(--azul))}
.lista-personas{list-style:none;padding:0;margin:12px 0;font-size:13px}
.lista-personas li{padding:3px 0;border-bottom:1px solid #F2F4F7}
.lista-simple{margin:8px 0;padding-left:20px;font-size:14px}

/* ---------- BARRAS DE PROGRESO ---------- */
.barra{height:7px;background:#E9EDF3;border-radius:4px;overflow:hidden;margin:7px 0}
.barra.mini{height:4px;margin:4px 0}
.barra-int{height:100%;background:var(--azul-claro);border-radius:4px;transition:width .3s}

/* ---------- TABLAS ---------- */
.tabla{width:100%;border-collapse:collapse;font-size:14px}
.tabla td,.tabla th{padding:9px 8px;border-bottom:1px solid #EEF1F5;vertical-align:top;text-align:left}
.tabla th{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--tenue);font-weight:600}
.tabla tr:last-child td{border-bottom:none}
.tabla.compacta td{padding:5px 8px;font-size:13px}
.tabla tr.fila-alerta{background:#FFF6F6}
.tabla tr.seleccionada{background:#EEF4FC}
.tabla tr.apagada{opacity:.5}
.derecha{text-align:right}
.nowrap{white-space:nowrap}
.tenue{color:var(--tenue)}
.chico{font-size:12px}
.alerta{color:var(--rojo);font-weight:600;font-size:13px}

/* ---------- ETIQUETAS ---------- */
.chip{display:inline-block;padding:2px 9px;border-radius:20px;background:#EEF1F5;color:var(--gris);font-size:11px;font-weight:600;white-space:nowrap}
.chip.verde{background:#E3F3E1;color:#2C6B27}
.chip.roja{background:#FBE3E3;color:var(--rojo)}
.chip.azul{background:#E4EFFB;color:var(--azul)}
.chip.gris{background:#EEF1F5}
.chip.aviso{background:#FFF3D6;color:#8A6100}
.chip.rol-admin{background:#E8E1F5;color:#4A2E8A}
.chip.rol-lider{background:#E4EFFB;color:var(--azul)}
.chip.rol-miembro{background:#E3F3E1;color:#2C6B27}
.chip.rol-elenco{background:#FCE9E1;color:#9C4A1E}
.chip.tipo-ensayo{background:#E4EFFB;color:var(--azul)}
.chip.tipo-montaje{background:#FFF3D6;color:#8A6100}
.chip.tipo-funcion{background:#FBE3E3;color:var(--rojo)}
.chip.tipo-reunion{background:#EEF1F5}
.chip.tipo-hito{background:#E8E1F5;color:#4A2E8A}
.etiqueta{font-size:12px;color:var(--tenue)}
.etiqueta.roja{color:var(--rojo);font-weight:600}
.punto{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}
.hito-punto{color:var(--dorado);font-size:11px}
.enlace-icono{color:var(--azul-claro);cursor:help;margin-left:4px}
.leyenda{display:flex;gap:8px;margin:-8px 0 20px;flex-wrap:wrap}

/* ---------- AVISOS ---------- */
.aviso-ok,.aviso-error,.aviso-alerta{padding:12px 16px;border-radius:10px;margin-bottom:16px;font-size:14px}
.aviso-ok{background:#E7F5E7;border:1px solid #BEE0BC;color:#2C6B27}
.aviso-error{background:#FDEBEB;border:1px solid #F2C4C4;color:var(--rojo)}
.aviso-alerta{background:#FFF8E6;border:1px solid #F0DFAE;color:#7A5600}
.aviso-alerta h3{color:#7A5600}
.aviso-ok ul,.aviso-alerta ol{margin:8px 0 0;padding-left:20px}

/* ---------- BOTONES Y FORMULARIOS ---------- */
.boton{
  display:inline-block;background:var(--azul);color:#fff;border:none;
  padding:8px 16px;border-radius:9px;font-size:14px;font-weight:500;cursor:pointer;
  font-family:inherit;
}
.boton:hover{background:#16294A;text-decoration:none;color:#fff}
.boton.grande{width:100%;padding:12px;font-size:15px;margin-top:10px}
.boton.mini{padding:4px 10px;font-size:12px;border-radius:7px}
.boton.claro{background:#fff;color:var(--azul);border:1px solid var(--borde)}
.boton.claro:hover{background:#F4F6F9;color:var(--azul)}
.boton.peligro{background:#fff;color:var(--rojo);border:1px solid #F2C4C4}
.boton.peligro:hover{background:var(--rojo);color:#fff}

label{display:block;margin-bottom:12px;font-size:13px;font-weight:600;color:var(--gris)}
input[type=text],input[type=date],input[type=time],input[type=number],input[type=email],
input[type=search],input[type=password],select,textarea{
  width:100%;padding:9px 11px;border:1px solid var(--borde);border-radius:9px;
  font-size:14px;font-family:inherit;margin-top:4px;background:#fff;color:var(--texto);font-weight:400;
}
input:focus,select:focus,textarea:focus{outline:2px solid #C7DBF5;border-color:var(--azul-claro)}
textarea{resize:vertical}
.rejilla-2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:600px){.rejilla-2{grid-template-columns:1fr}}
.check{display:flex;align-items:center;gap:8px;font-weight:500}
.check input{width:auto;margin:0}
.check.en-linea{margin:0}
.multi{height:auto;min-height:150px}
.mini-num{width:64px;padding:4px 7px;font-size:13px;margin:0}
.codigo-input{width:170px;font-family:ui-monospace,Menlo,monospace;font-size:13px;margin:0}
.color-input{width:44px;padding:2px;height:34px;margin:0}
.linea{display:inline-flex;gap:5px;align-items:center;margin:0}
.acciones{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;flex-wrap:wrap}
.filtros{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;align-items:center}
.filtros select,.filtros input{width:auto;min-width:170px;margin:0}
.zona-peligro{margin-top:24px;padding-top:14px;border-top:1px dashed #F2C4C4}
.plegable{margin-top:14px;border-top:1px solid var(--borde);padding-top:12px}
.plegable summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--azul-claro)}
.plegable .formulario{margin-top:12px}
.vacio{text-align:center;padding:50px 20px;color:var(--tenue)}

/* ---------- GANTT ---------- */
.gantt{position:relative;padding:0 0 12px;overflow-x:auto}
.gantt-meses{position:relative;height:30px;border-bottom:1px solid var(--borde);margin-left:270px;background:#FAFBFD}
.gantt-mes{
  position:absolute;top:0;height:30px;line-height:30px;font-size:11px;font-weight:600;
  color:var(--tenue);text-transform:uppercase;letter-spacing:.4px;border-left:1px solid var(--borde);padding-left:6px;
}
.gantt-fila{display:flex;align-items:center;min-height:29px;border-bottom:1px solid #F4F6F9}
.gantt-fila:hover{background:#FAFBFD}
.gantt-eti{
  width:270px;flex:0 0 270px;font-size:12.5px;padding:5px 10px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-right:1px solid var(--borde);
}
.gantt-pista{position:relative;flex:1;height:29px;min-width:400px}
.gantt-barra{
  position:absolute;top:7px;height:15px;border-radius:8px;
  background:var(--color,var(--azul));opacity:.35;overflow:hidden;min-width:5px;
}
.gantt-barra.lista{opacity:.75}
.gantt-barra.atrasada{box-shadow:0 0 0 2px var(--rojo)}
.gantt-avance{height:100%;background:var(--color,var(--azul));opacity:1;border-radius:8px}
.gantt-hoy{position:absolute;top:30px;bottom:0;width:2px;background:var(--rojo);opacity:.55;margin-left:270px;z-index:2}
.gantt-hoy span{
  position:absolute;top:-22px;left:-13px;font-size:10px;color:var(--rojo);
  background:#fff;padding:1px 5px;border-radius:4px;font-weight:700;
}

/* ---------- CALENDARIO ---------- */
.cal-encabezado{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.cal-nav{display:flex;align-items:center;gap:12px}
.cal-nav h2{margin:0;font-size:19px;color:var(--azul);min-width:180px;text-align:center}
.cal-rejilla{display:grid;grid-template-columns:repeat(7,1fr)}
.cal-encab{padding:9px;text-align:center;font-size:11px;font-weight:700;color:var(--tenue);background:#FAFBFD;border-bottom:1px solid var(--borde);text-transform:uppercase}
.cal-celda{min-height:104px;border-right:1px solid #F0F3F7;border-bottom:1px solid #F0F3F7;padding:5px;font-size:12px}
.cal-celda.vacia{background:#FBFCFD}
.cal-celda.hoy{background:#FFFBEF;box-shadow:inset 0 0 0 2px var(--dorado)}
.cal-cabeza{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px;min-height:18px}
.cal-num{font-weight:700;color:var(--gris);font-size:12px}
.cal-mas{
  width:19px;height:19px;border-radius:6px;display:flex;align-items:center;justify-content:center;
  font-size:15px;line-height:1;color:var(--azul-claro);background:#EEF4FC;opacity:0;transition:opacity .12s;
}
.cal-celda:hover .cal-mas{opacity:1}
.cal-mas:hover{background:var(--azul);color:#fff;text-decoration:none}
@media(hover:none){.cal-mas{opacity:.55}}
.cal-evento{
  position:relative;background:#EEF1F5;border-left:3px solid var(--color,var(--gris));
  padding:3px 16px 3px 6px;border-radius:5px;margin-bottom:3px;font-size:11px;line-height:1.3;cursor:default;
}
.cal-evento b{display:block;font-size:10px;color:var(--tenue)}
.cal-evento.tipo-funcion{background:#FBE3E3;border-left-color:var(--rojo);font-weight:600}
.cal-evento.tipo-montaje{background:#FFF3D6;border-left-color:var(--dorado)}
.cal-evento.tipo-hito{background:#E8E1F5;border-left-color:#4A2E8A;font-weight:600}
.cal-borrar{position:absolute;top:1px;right:2px;margin:0}
.cal-borrar button{border:none;background:none;color:var(--tenue);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.cal-borrar button:hover{color:var(--rojo)}

/* ---------- ESCENAS ---------- */
.cinta-escenas{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px;margin-bottom:16px}
.cinta-item{
  flex:0 0 auto;background:#fff;border:1px solid var(--borde);border-radius:10px;
  padding:9px 13px;min-width:150px;color:var(--texto);box-shadow:var(--sombra);
}
.cinta-item:hover{text-decoration:none;border-color:var(--azul-claro)}
.cinta-item.activa{border-color:var(--azul);border-width:2px;background:#F5F9FF}
.cinta-item.completa{border-left:4px solid var(--verde)}
.cinta-num{display:block;font-size:19px;font-weight:700;color:var(--azul);line-height:1}
.cinta-tit{display:block;font-size:11.5px;line-height:1.3;margin:3px 0}
.cinta-cuenta{display:block;font-size:10px;color:var(--tenue);font-weight:600}
.escena-titulo{display:flex;align-items:center;gap:12px;font-size:20px;color:var(--azul)}
.escena-num{
  background:var(--azul);color:#fff;width:34px;height:34px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;font-size:16px;flex:0 0 34px;
}
.escenas-check{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:5px;
  margin:10px 0;max-height:330px;overflow-y:auto;padding:10px;background:#FAFBFD;border-radius:10px;border:1px solid var(--borde);
}
.escena-item{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;font-weight:400;margin:0;padding:5px;border-radius:7px;cursor:pointer}
.escena-item:hover{background:#EEF4FC}
.escena-item input{width:auto;margin:2px 0 0}

/* ---------- MODAL ---------- */
.modal-fondo{position:fixed;inset:0;background:rgba(16,24,40,.55);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal{background:#fff;border-radius:14px;padding:24px;width:100%;max-width:620px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.modal h3{font-size:17px;color:var(--azul);margin-bottom:16px}

/* ---------- PANTALLAS SIMPLES ---------- */
.pantalla-simple{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;background:linear-gradient(160deg,#1F3864,#0D1B33)}
.caja-central{background:#fff;border-radius:16px;padding:36px;max-width:420px;width:100%;box-shadow:0 24px 70px rgba(0,0,0,.35);text-align:center}
.caja-central.ancha{max-width:680px;text-align:left}
.logo-texto{font-size:27px;font-weight:800;letter-spacing:2.5px;color:var(--azul)}
.logo-anio{font-size:12px;letter-spacing:3.5px;color:var(--dorado);font-weight:700;margin-bottom:14px}
.caja-central .sub{color:var(--tenue);font-size:13px;margin-bottom:18px}
.caja-central .formulario{text-align:left;margin-top:18px}
.pastilla{display:inline-block;background:#EEF4FC;color:var(--azul);padding:6px 15px;border-radius:20px;font-size:13px;margin-bottom:6px}
.nota-pie{font-size:12px;color:var(--tenue);margin-top:18px}
code{background:#F0F3F7;padding:2px 6px;border-radius:5px;font-size:13px;font-family:ui-monospace,Menlo,monospace}

/* ---------- PRESUPUESTO ---------- */
.tabla-scroll{overflow-x:auto;margin:0 -20px;padding:0 20px}
.tabla-presupuesto{min-width:1050px;font-size:13px}
.tabla-presupuesto input,.tabla-presupuesto select{margin:0;padding:5px 7px;font-size:13px}
.tabla-presupuesto input[type=text]{min-width:110px}
.num-dinero{width:105px;text-align:right}
.mini-txt{width:80px}
.mini-sel{width:auto;min-width:105px;margin:0;padding:5px 7px;font-size:12px}
.total-fila{background:#F7F9FC}
.fila-total td{background:#EEF4FC;border-top:2px solid var(--azul)}
.cinta-item.excedido{border-left:4px solid var(--rojo)}
.oculto{display:none}

/* ---------- REPARTO ---------- */
.tres-paneles{display:grid;grid-template-columns:minmax(230px,1fr) minmax(260px,1.1fr) minmax(280px,1.2fr);gap:18px;align-items:start}
@media(max-width:1100px){.tres-paneles{grid-template-columns:1fr}}
.lista-personajes{max-height:520px;overflow-y:auto;margin:0 -6px}
.pj-item{
  display:flex;justify-content:space-between;align-items:center;gap:8px;
  padding:8px 10px;border-radius:9px;color:var(--texto);font-size:13.5px;border:1px solid transparent;
}
.pj-item:hover{background:#F4F7FC;text-decoration:none}
.pj-item.activo{background:#EEF4FC;border-color:var(--azul);font-weight:600}
.pj-item.lleno .pj-nombre{color:var(--tenue)}
.pj-cuenta{font-size:11px;font-weight:700;color:var(--tenue);background:#EEF1F5;padding:2px 8px;border-radius:20px;white-space:nowrap}
.pj-cuenta.medio{background:#FFF3D6;color:#8A6100}
.pj-cuenta.ok{background:#E3F3E1;color:#2C6B27}
.lista-candidatos{max-height:460px;overflow-y:auto;margin:0 -6px}
.cand{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 10px;border-bottom:1px solid #F2F4F7}
.cand:hover{background:#FAFBFD}
.cand.ya-esta{opacity:.55}
.cand-info{min-width:0;flex:1}
.cand-info strong{font-size:13.5px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filtros.compactos{gap:6px;margin-bottom:10px}
.filtros.compactos input,.filtros.compactos select{min-width:0;flex:1;font-size:13px;padding:6px 8px}
.filtros.compactos input[type=search]{flex:2 1 130px}

/* ---------- PESTAÑAS ---------- */
.pestanas{display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid var(--borde);flex-wrap:wrap}
.pestanas a{
  padding:9px 16px;color:var(--tenue);font-size:14px;font-weight:500;
  border-bottom:2.5px solid transparent;display:flex;align-items:center;gap:7px;
}
.pestanas a:hover{color:var(--azul);text-decoration:none;background:#FAFBFD}
.pestanas a.activa{color:var(--azul);border-bottom-color:var(--azul);font-weight:600}
.pestanas span{background:#EEF1F5;color:var(--gris);font-size:11px;font-weight:700;padding:1px 8px;border-radius:20px}
.pestanas a.activa span{background:var(--azul);color:#fff}

/* ---------- ENLACE PARA COMPARTIR ---------- */
.caja-enlace{display:flex;gap:8px;align-items:center;margin:12px 0;flex-wrap:wrap}
.caja-enlace input{
  flex:1;min-width:240px;margin:0;font-family:ui-monospace,Menlo,monospace;font-size:13px;
  background:#F7F9FC;border:1px dashed var(--azul-claro);
}
.modal.ancho{max-width:760px}

/* ---------- GESTIÓN DE MIEMBROS ---------- */
.acciones-fila{display:inline-flex;gap:7px;align-items:center;margin-left:6px}
.mini-enlace{font-size:11px;color:var(--azul-claro);background:none;border:none;padding:0;cursor:pointer;font-family:inherit}
.mini-enlace:hover{text-decoration:underline}
.mini-enlace.peligroso{color:var(--rojo)}

@media print{
  .barra,.menu,.filtros,.boton,.pie,.cal-borrar{display:none!important}
  .tarjeta{box-shadow:none;border:1px solid #ccc;break-inside:avoid}
  body{background:#fff}
}
