/* ============================================================
   Yose Enterprise — Equipos: estilos EMBEBIDOS en el dashboard.
   Scopeados bajo .ent (para no chocar con el dashboard ni con .ctb).
   Usa las MISMAS fuentes/paleta que el dashboard (ya cargadas ahí).
   El submenú del sidebar (.nav-parent/.nav-sub) ya lo define
   contable-embed.css — NO se redefine aquí para no duplicarlo.
   ============================================================ */

:root{
  --ent-forest:#125440; --ent-muted:rgba(26,24,20,.55);
  --ent-line:rgba(26,24,20,.10); --ent-line-soft:rgba(26,24,20,.06);
  --ent-green:#125440; --ent-green-bg:#E8E4DE;
  --ent-amber:#1A1814; --ent-amber-bg:#FDE1A7;
  --ent-red:#E64646; --ent-red-bg:#FCC9C3;
  --ent-display:'Cormorant Garamond','Times New Roman',serif;
  --ent-body:'Jost',system-ui,-apple-system,sans-serif;
  --ent-mono:'DM Mono','IBM Plex Mono',ui-monospace,monospace;
  --ent-shadow:0 1px 2px rgba(26,24,20,.03),0 16px 40px -28px rgba(26,24,20,.28);
}

/* ── Fix de overflow en móvil (NO borrar sin leer) ──────────────────────────
   `body` del dashboard es `display:flex` y `.main` es un flex item con el
   `min-width:auto` por default → NO puede encogerse por debajo del min-content
   de su contenido. Cualquier tabla nuestra (celdas con nombres/correos) empuja
   ese min-content y estira `.main` a ~850px en un viewport de 390 → el BODY
   entero scrollea lateral. Medido: 853px de ancho a 390 de viewport.
   `min-width:0` en `.main` lo arregla, pero `.main` es una clase COMPARTIDA con
   el contable y todas las vistas nativas — tocarla globalmente es arriesgado.
   Por eso se scopea con :has() a cuando una vista de Enterprise está activa.
   Verificado: e-equipo/e-dominios/e-baul quedan en 390 sin scroll del body, y
   `memories` + `c-inicio` no se ven afectados. */
body:has(.view.ent.active) .main{min-width:0}

.ent{font-family:var(--ent-body);color:var(--ink);padding:2rem;max-width:1100px}
.ent h2{font-family:var(--ent-display);font-size:1.9rem;font-weight:600;letter-spacing:-.01em}
.ent h3{font-family:var(--ent-display);font-size:1.35rem;font-weight:600;margin-bottom:.35rem}
.ent .ent-sub{color:var(--ent-muted);font-size:.92rem;line-height:1.55;margin:.35rem 0 1rem}
.ent .ent-hint{color:var(--ent-muted);font-size:.82rem;line-height:1.5;margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--ent-line-soft)}

/* ---------- tarjetas ---------- */
.ent-card{background:var(--white);border:1px solid var(--ent-line);border-radius:14px;padding:1.6rem;margin-bottom:1.25rem;box-shadow:var(--ent-shadow)}
.ent-card.ent-narrow{max-width:560px}
.ent-card.ent-center{max-width:560px;margin-left:auto;margin-right:auto;text-align:center}
.ent-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.5rem;flex-wrap:wrap}

/* ---------- barra de perfil activo ---------- */
.ent-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  background:var(--ent-green-bg);border:1px solid var(--ent-line);border-radius:12px;padding:.85rem 1.1rem;margin-bottom:1.25rem}
.ent-bar-l{display:flex;align-items:center;gap:.75rem;min-width:0}
.ent-bar-l strong{display:block;font-size:.98rem;line-height:1.25}
.ent-bar-l small{display:block;color:var(--ent-muted);font-size:.8rem}
.ent-bar-r{display:flex;align-items:center;gap:.6rem;flex-shrink:0}
.ent-chip{background:var(--white);border:1px solid var(--ent-line);border-radius:999px;padding:.3rem .7rem;font-size:.78rem;color:var(--ent-muted);white-space:nowrap}

/* ---------- avatar ---------- */
.ent-ava{width:38px;height:38px;border-radius:10px;background:var(--deep-forest,#125440);color:var(--pale,#D2EEBC);
  display:inline-flex;align-items:center;justify-content:center;font-size:.82rem;font-weight:600;letter-spacing:.03em;flex-shrink:0}
.ent-ava.sm{width:30px;height:30px;border-radius:8px;font-size:.7rem}

/* ---------- selector de perfil ---------- */
.ent-perfiles{display:flex;flex-direction:column;gap:.6rem;margin-top:1.25rem}
.ent-perfil{display:flex;align-items:center;gap:.85rem;width:100%;text-align:left;cursor:pointer;
  background:var(--white);border:1px solid var(--ent-line);border-radius:12px;padding:.8rem 1rem;font-family:inherit;transition:all .18s}
.ent-perfil:hover:not(:disabled){border-color:var(--mint,#8BC695);transform:translateY(-1px);box-shadow:var(--ent-shadow)}
.ent-perfil:disabled{opacity:.5;cursor:not-allowed}
.ent-perfil-txt strong{display:block;font-size:.95rem}
.ent-perfil-txt small{display:block;color:var(--ent-muted);font-size:.78rem;text-transform:capitalize}

/* ---------- tabla ---------- */
.ent-table{width:100%;border-collapse:collapse;margin-top:1rem;font-size:.9rem}
.ent-table th{text-align:left;font-weight:500;font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;
  color:var(--ent-muted);padding:.6rem .7rem;border-bottom:1px solid var(--ent-line)}
.ent-table td{padding:.75rem .7rem;border-bottom:1px solid var(--ent-line-soft);vertical-align:middle}
.ent-table tr:last-child td{border-bottom:none}

/* ---------- picker de personas (checkboxes, reemplaza al select multiple) ---------- */
.ent-picker{position:relative;margin-bottom:.2rem}
.ent-picker-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  background:var(--white);border:1px solid var(--ent-line);border-radius:9px;padding:.7rem .85rem;
  font:inherit;font-size:.92rem;color:inherit;cursor:pointer;text-align:left}
.ent-picker-btn:hover{border-color:var(--ent-mint,#8BC695)}
.ent-picker-caret{color:var(--ent-muted);flex-shrink:0}
.ent-picker-menu{position:absolute;z-index:20;left:0;right:0;margin-top:.3rem;max-height:260px;overflow-y:auto;
  background:var(--white);border:1px solid var(--ent-line);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.10);padding:.25rem}
/* Van prefijadas con `.ent` a propósito: `.ent label{display:block}` y
   `.ent input{width:100%}` (más abajo en este archivo) le ganaban por orden y
   tiraban el checkbox arriba, centrado y a lo ancho. */
.ent .ent-picker-item{display:flex;align-items:center;gap:.6rem;padding:.55rem .6rem;
  border-radius:7px;cursor:pointer;margin:0;font-weight:400}
.ent .ent-picker-item:hover{background:var(--ent-bg,#F8F7F2)}
.ent .ent-picker-item input[type=checkbox]{margin:0;flex-shrink:0;width:16px;height:16px;cursor:pointer;padding:0}
.ent .ent-picker-item strong{display:block;font-size:.9rem;line-height:1.3}
.ent .ent-picker-item small{display:block;font-size:.76rem;line-height:1.35;color:var(--ent-muted)}

/* ---------- hilo de una tarea (flechita "Lo que repartiste") ---------- */
.ent-hist-toggle{width:1.6rem;padding-right:0!important}
.ent-hist-toggle .ent-btn{padding:.2rem .5rem;line-height:1}
.ent-hist-row td{background:var(--ent-bg,#F8F7F2);border-bottom:1px solid var(--ent-line-soft)}
.ent-hist-body{padding:.2rem .3rem}
.ent-hist-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem}
.ent-hist-list li{font-size:.83rem;line-height:1.5;color:var(--ent-text,#1A1814)}
.ent-hist-fecha{color:var(--ent-muted);font-size:.76rem;margin-right:.3rem}

/* ---------- historial de completadas (details/summary) ---------- */
details.ent-card>summary{cursor:pointer;list-style:none}
details.ent-card>summary::-webkit-details-marker{display:none}
details.ent-card>summary::before{content:'▸ ';color:var(--ent-muted)}
details.ent-card[open]>summary::before{content:'▾ '}
.ent-person{display:flex;align-items:center;gap:.6rem;min-width:0}
.ent-person strong{display:block;font-size:.9rem;line-height:1.3}
.ent-person small{display:block;color:var(--ent-muted);font-size:.76rem}
/* El contexto puede ser largo: se trunca con el texto completo en el title. */
.ent-ctx{max-width:260px}
.ent-ctx span{display:block;color:var(--ent-muted);font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ent-ctx-propio{display:block;color:var(--ent-muted);font-size:.75rem;font-style:italic;opacity:.85;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ent-acts{text-align:right;white-space:nowrap}
.ent-acts .ent-btn{margin-left:.35rem}
.ent-txt code{font-family:var(--ent-mono);font-size:.74rem;background:var(--ent-line-soft);padding:.25rem .45rem;border-radius:5px;word-break:break-all}

/* ---------- tags (dos ejes: rol funcional + admin) ---------- */
.ent-tag{display:inline-block;border-radius:999px;padding:.2rem .55rem;font-size:.7rem;font-weight:500;
  letter-spacing:.02em;margin-right:.3rem;text-transform:lowercase}
.ent-tag.eje{background:var(--ent-green-bg);color:var(--ent-green)}
.ent-tag.emp{background:var(--ent-line-soft);color:var(--ent-muted)}
.ent-tag.adm{background:#DFEAFA;color:#1C50A1}
.ent-tag.susp{background:var(--ent-amber-bg);color:var(--ent-amber)}
.ent-tag.mute{background:transparent;color:var(--ent-muted);border:1px solid var(--ent-line)}
.ent-tag.ok{background:var(--ent-green-bg);color:var(--ent-green)}
.ent-tag.warn{background:var(--ent-amber-bg);color:var(--ent-amber)}

/* ---------- botones ---------- */
.ent-btn{background:var(--forest-green,#125440);color:var(--white);border:none;border-radius:999px;
  padding:.6rem 1.15rem;font-family:inherit;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .18s;white-space:nowrap}
.ent-btn:hover{background:var(--deep-forest,#125440)}
.ent-btn.ghost{background:transparent;color:var(--ent-muted);border:1px solid var(--ent-line)}
.ent-btn.ghost:hover{background:var(--ent-line-soft);color:var(--ink)}
.ent-btn.danger{background:transparent;color:var(--ent-red);border:1px solid var(--ent-red-bg)}
.ent-btn.danger:hover{background:var(--ent-red-bg)}
.ent-btn.sm{padding:.35rem .7rem;font-size:.78rem}

/* ---------- formularios ---------- */
.ent label{display:block;margin-bottom:1rem;font-size:.85rem;font-weight:500}
.ent input,.ent select,.ent textarea{width:100%;margin-top:.4rem;padding:.65rem .8rem;border:1px solid var(--ent-line);
  border-radius:9px;font-family:inherit;font-size:.9rem;color:var(--ink);background:var(--white);transition:border-color .18s}
.ent input:focus,.ent select:focus,.ent textarea:focus{outline:none;border-color:var(--mint,#8BC695)}
.ent textarea{resize:vertical;line-height:1.5}
.ent-check{display:flex;align-items:flex-start;gap:.6rem;font-weight:400}
.ent-check input{width:auto;margin-top:.15rem;flex-shrink:0}
.ent-check small{display:block;color:var(--ent-muted);font-size:.78rem;line-height:1.45;margin-top:.15rem}
.ent-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}
.ent-row.end{justify-content:flex-end;margin-bottom:0;margin-top:1.25rem}
.ent-row input,.ent-row select{margin-top:0;flex:1;min-width:140px}
.ent-row .ent-btn{flex-shrink:0}
.ent-arrow{color:var(--ent-muted);font-size:1.1rem;flex-shrink:0}
.ent-emo-in{max-width:70px;flex:0 0 auto;text-align:center}

/* ---------- pendientes ---------- */
.ent-tasks{display:flex;flex-direction:column;gap:.7rem;margin-top:1rem}
.ent-task{border:1px solid var(--ent-line);border-radius:11px;padding:.9rem 1rem;background:var(--white)}
.ent-task-h{display:flex;align-items:flex-start;justify-content:space-between;gap:.7rem}
.ent-task-h strong{font-size:.95rem;line-height:1.35}
.ent-task-h .ent-tag{flex-shrink:0;margin-right:0}
.ent-task-r{color:var(--ent-muted);font-size:.85rem;line-height:1.5;margin-top:.35rem}
.ent-task-de{display:block;color:var(--ent-muted);font-size:.76rem;margin-top:.45rem}
.ent-task-acts{display:flex;gap:.4rem;margin-top:.75rem;flex-wrap:wrap}
/* Reconocer el avance, no castigar el retraso (decisión de producto). */
.ent-celebra{background:var(--ent-green-bg);color:var(--ent-green);border-radius:10px;padding:.7rem .9rem;font-size:.88rem;margin-top:.75rem}
/* El motivo del rechazo va COMPLETO: es lo que el emisor necesita para decidir. */
.ent-motivo{display:block;color:var(--ent-muted);font-size:.8rem;font-style:italic;margin-top:.3rem;line-height:1.45}

/* ---------- baúl ---------- */
.ent-storage{margin:1rem 0 1.25rem}
.ent-bar-bg{height:6px;background:var(--ent-line-soft);border-radius:999px;overflow:hidden}
.ent-bar-fill{height:100%;background:var(--mint,#8BC695);border-radius:999px;transition:width .3s}
.ent-storage small{display:block;margin-top:.4rem;color:var(--ent-muted);font-size:.78rem}
.ent-folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.7rem}
.ent-folder{display:flex;align-items:center;gap:.7rem;background:var(--white);border:1px solid var(--ent-line);
  border-radius:11px;padding:.85rem 1rem;cursor:pointer;transition:all .18s}
.ent-folder:hover:not(.locked){border-color:var(--mint,#8BC695);transform:translateY(-1px);box-shadow:var(--ent-shadow)}
/* Sin permiso: se ve que EXISTE pero no se entra (ni el admin). */
.ent-folder.locked{opacity:.5;cursor:default;background:var(--ent-line-soft)}
.ent-f-emo{font-size:1.3rem;flex-shrink:0}
.ent-f-txt{min-width:0;flex:1}
.ent-f-txt strong{display:block;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ent-f-txt small{display:block;color:var(--ent-muted);font-size:.75rem}
.ent-files{list-style:none;margin-top:.75rem}
.ent-files li{display:flex;align-items:center;gap:.7rem;padding:.6rem 0;border-bottom:1px solid var(--ent-line-soft)}
.ent-files li:last-child{border-bottom:none}
.ent-files strong{display:block;font-size:.88rem;font-weight:400}
.ent-files small{display:block;color:var(--ent-muted);font-size:.74rem}

/* ---------- vacío / spinner ---------- */
.ent-empty{text-align:center;padding:4rem 2rem;color:var(--ent-muted)}
.ent-spin{width:26px;height:26px;margin:0 auto 1rem;border:2px solid var(--ent-line);
  border-top-color:var(--forest-green,#125440);border-radius:50%;animation:ent-spin .7s linear infinite}
@keyframes ent-spin{to{transform:rotate(360deg)}}

/* ---------- responsive ---------- */
@media (max-width:768px){
  .ent{padding:1.1rem}
  .ent-card{padding:1.15rem}
  .ent-bar{flex-direction:column;align-items:flex-start}
  .ent-bar-r{width:100%;justify-content:space-between}

  /* Lo que no cabe scrollea DENTRO de su card — el body nunca (ver el fix de
     :has() arriba, que es lo que permite que .main sí encoja). */
  .ent-card{overflow-x:auto}
  /* Además se oculta "Contexto": es la columna más ancha y la menos útil en una
     pantalla chica (su texto completo vive en el title del <span>). Mismo
     criterio que el contable, que en móvil colapsa columnas
     (ver .recon-head/.row en contable-embed.css). */
  .ent-table th:nth-child(3),.ent-ctx{display:none}
  .ent-acts{white-space:normal;text-align:left}
  .ent-acts .ent-btn{margin:.2rem .25rem 0 0}
  .ent-person small{overflow:hidden;text-overflow:ellipsis}

  .ent-folders{grid-template-columns:1fr}
}