/* v714 · Primera página llevada de verdad al patrón visual de Cola de trabajos. */
:root{
  --eg714-surface:linear-gradient(180deg,#111417 0%,#0b0e10 100%);
  --eg714-surface-2:linear-gradient(180deg,#13171a 0%,#0d1012 100%);
  --eg714-line:rgba(229,231,235,.14);
  --eg714-muted:#9aa1a6;
  --eg714-orange:#ff8a18;
}

/* v2.020: la marca/cabecera se define solo en base.html. */
/* El lateral deja de usar puntitos: todos los enlaces tienen icono SVG. */
.eg-side-item{gap:10px!important}
.eg-side-icon{width:22px;height:22px;flex:0 0 22px;display:inline-flex;align-items:center;justify-content:center;color:#899197}
.eg-side-icon svg{display:block;width:20px;height:20px}
.eg-side-item:hover .eg-side-icon{color:#d8dcdf}
.eg-side-item.activo .eg-side-icon{color:var(--eg714-orange);filter:drop-shadow(0 0 6px rgba(255,138,24,.28))}

/* AJUSTES: la maqueta de Cola de trabajos pasa de inspiración a composición real. */
.eg-ajustes-v714{max-width:none!important;width:100%;padding-top:16px}
.eg-ajustes-v714>h1{display:none!important}
.eg-ajustes-v714 .eg-ajustes-hero{
  display:flex;align-items:center;justify-content:space-between;gap:28px;
  margin:0 0 18px;padding:26px 28px;box-sizing:border-box;
  background:var(--eg714-surface);border:1px solid var(--eg714-line);border-radius:15px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 14px 30px rgba(0,0,0,.28)
}
.eg-ajustes-hero-copy{min-width:0;flex:1}
.eg-ajustes-kicker{font-size:11px;line-height:1.2;font-weight:900;letter-spacing:.12em;color:var(--eg714-orange);text-transform:uppercase}
.eg-ajustes-kicker span{padding:0 7px;color:#bd6a18}
.eg-ajustes-hero h1{margin:12px 0 8px!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;font-size:clamp(40px,4vw,62px)!important;line-height:1!important;letter-spacing:-.045em!important}
.eg-ajustes-hero p{margin:0;color:#aeb4b8;font-size:15px;max-width:760px}
.eg-ajustes-hero-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
.eg-ajustes-hero-actions a{text-decoration:none}

.eg-ajustes-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 18px}
.eg-ajustes-kpi{display:flex;align-items:center;gap:14px;min-width:0;padding:18px 18px;background:var(--eg714-surface);border:1px solid var(--eg714-line);border-radius:14px;box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 24px rgba(0,0,0,.2)}
.eg-ajustes-kpi-icon{width:42px;height:42px;flex:0 0 42px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#b8bec2;border:1px solid #31373b;background:#0b0e10}
.eg-ajustes-kpi-icon.naranja{color:var(--eg714-orange);border-color:#71410d;background:rgba(107,58,6,.12)}
.eg-ajustes-kpi-icon.rojo{color:#ef5b55;border-color:#6f2825;background:rgba(111,40,37,.12)}
.eg-ajustes-kpi-icon svg{width:25px;height:25px}
.eg-ajustes-kpi>div{display:flex;flex-direction:column;min-width:0}
.eg-ajustes-kpi-label{font-size:10px;line-height:1.2;color:#9ca3a8;font-weight:850;letter-spacing:.06em}
.eg-ajustes-kpi strong{font-size:29px;line-height:1.05;color:#f3f5f6;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.eg-ajustes-kpi small{margin-top:5px;color:#858d92;font-size:12px}

.eg-ajustes-action-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;margin:0 0 18px;padding:20px;background:var(--eg714-surface);border:1px solid var(--eg714-line);border-radius:15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 12px 28px rgba(0,0,0,.24)}
.eg-ajustes-action-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #7c470b;border-radius:13px;color:var(--eg714-orange);background:rgba(137,74,5,.12)}
.eg-ajustes-action-icon svg{width:28px;height:28px}
.eg-ajustes-action-copy h2{margin:7px 0 4px!important;font-size:22px!important;line-height:1.15!important}
.eg-ajustes-action-copy p{margin:0 0 8px;color:#9fa6ab;max-width:850px}
.eg-ajustes-action-buttons{display:flex;align-items:center;justify-content:flex-end}
.eg-ajustes-action-log{grid-column:2/-1;width:100%;box-sizing:border-box;padding-top:8px}

.eg-ajustes-tech{margin:0 0 18px;border:1px solid var(--eg714-line);border-radius:15px;background:var(--eg714-surface);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 24px rgba(0,0,0,.2)}
.eg-ajustes-tech>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;color:#eef0f1}
.eg-ajustes-tech>summary::-webkit-details-marker{display:none}
.eg-ajustes-tech>summary span{display:flex;flex-direction:column;gap:4px}
.eg-ajustes-tech>summary b{font-size:18px}
.eg-ajustes-tech>summary small{font-size:12px;color:#8f979c;font-weight:500}
.eg-ajustes-tech>summary svg{width:22px;height:22px;transition:transform .18s ease}
.eg-ajustes-tech[open]>summary svg{transform:rotate(90deg)}
.eg-ajustes-tech-body{border-top:1px solid var(--eg714-line);padding:20px 22px;background:#0a0d0f}
.eg-ajustes-tech-body>h2{margin:0 0 8px!important;font-size:21px!important}
.eg-ajustes-tech-body>p{margin-top:0}
.eg-ajustes-tech-body table{width:100%;border-collapse:collapse;background:#080a0b;border:1px solid #242a2e;border-radius:10px;overflow:hidden}
.eg-ajustes-tech-body td{padding:12px 14px;border-bottom:1px solid #252a2d;vertical-align:top}
.eg-ajustes-tech-body tr:last-child td{border-bottom:0}
.eg-ajustes-tech-body td:first-child{width:220px;color:#c8cdd0;font-weight:700}

/* El formulario enorme deja de empezar como una caja genérica sin jerarquía. */
.eg-ajustes-config-panel{padding:0!important;overflow:hidden}
.eg-ajustes-config-head{padding:22px 24px 18px;border-bottom:1px solid var(--eg714-line);background:var(--eg714-surface-2)}
.eg-ajustes-config-head h2{margin:7px 0 4px!important;font-size:25px!important}
.eg-ajustes-config-head p{margin:0!important}
.eg-ajustes-config-panel>h2,.eg-ajustes-config-panel>h3,.eg-ajustes-config-panel>p,.eg-ajustes-config-panel>label,.eg-ajustes-config-panel>.filtros,.eg-ajustes-config-panel>details,.eg-ajustes-config-panel>#sesionYoutubeGlobal,.eg-ajustes-config-panel>hr,.eg-ajustes-config-panel>input{margin-left:22px!important;margin-right:22px!important}
.eg-ajustes-config-panel>h2{margin-top:22px!important;padding-top:18px;border-top:1px solid rgba(255,255,255,.07)}
.eg-ajustes-config-panel>.eg-ajustes-config-head+h2{border-top:0;padding-top:0}
.eg-ajustes-config-panel>button[type="submit"]{margin:20px 22px 24px!important}

/* El estilo antiguo v713 no debe volver a dibujar un H1 suelto sobre el vídeo en Ajustes. */
body.eg-pagina-ajustes .eg-workspace .eg-ajustes-v714>h1{display:none!important}
body.eg-pagina-ajustes .eg-workspace .eg-ajustes-hero h1{background:none!important;border:0!important;box-shadow:none!important}

@media(max-width:1220px){
  .eg-ajustes-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  .eg-ajustes-v714{padding-top:12px}.eg-ajustes-hero{align-items:flex-start;flex-direction:column;padding:20px!important}.eg-ajustes-hero-actions{justify-content:flex-start}.eg-ajustes-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.eg-ajustes-action-card{grid-template-columns:auto minmax(0,1fr)}.eg-ajustes-action-buttons{grid-column:2;justify-content:flex-start}.eg-ajustes-action-log{grid-column:1/-1}
}
@media(max-width:560px){
  .eg-ajustes-hero h1{font-size:34px!important}.eg-ajustes-kpis{grid-template-columns:1fr}.eg-ajustes-action-card{grid-template-columns:1fr}.eg-ajustes-action-icon{width:42px;height:42px}.eg-ajustes-action-buttons,.eg-ajustes-action-log{grid-column:1}.eg-ajustes-action-buttons button{width:100%}.eg-ajustes-tech-body td{display:block;width:auto!important}.eg-ajustes-tech-body td:first-child{padding-bottom:4px;border-bottom:0}.eg-ajustes-tech-body td+td{padding-top:4px}.eg-ajustes-config-panel>h2,.eg-ajustes-config-panel>h3,.eg-ajustes-config-panel>p,.eg-ajustes-config-panel>label,.eg-ajustes-config-panel>.filtros,.eg-ajustes-config-panel>details,.eg-ajustes-config-panel>#sesionYoutubeGlobal,.eg-ajustes-config-panel>hr,.eg-ajustes-config-panel>input{margin-left:16px!important;margin-right:16px!important}
}
