/* Estilos del paquete P2 (Caja y Liquidación): Roles y permisos, solo lo mío, subconceptos, historial de liquidaciones. Prototipos de Romi en docs\prototipos-f3\app-f3-p2.css. */
.roles-x{display:grid;grid-template-columns:240px minmax(0,1fr);gap:16px;align-items:start}
.rol-lista{display:grid;gap:6px;margin:0 0 12px;padding:0;list-style:none}
.rol-item{all:unset;box-sizing:border-box;cursor:pointer;min-height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--surface);color:var(--ink);font:500 15px var(--fb);width:100%}
.rol-item[aria-current=true]{background:var(--accent-soft);border-color:var(--ink);font-weight:700}
.rol-item:focus-visible,.rad:focus-within,.perm .chk:focus-within{outline:3px solid #2F2A24;outline-offset:2px}
.rol-item small{color:var(--muted);font-weight:500;font-size:12px}
.rol-nuevo{display:grid;gap:6px}
.perm-g{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:0 0 10px;padding:0;min-width:0}
.perm-g>summary{list-style:none;cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;font:700 16px var(--fb);color:var(--ink)}
.perm-g>summary::-webkit-details-marker{display:none}
.perm-g>summary:focus-visible{outline:3px solid #2F2A24;outline-offset:-3px;border-radius:12px}
.perm-g>summary .cuenta{font:500 13px var(--fb);color:var(--muted);margin-left:auto}
.perm-g>summary::after{content:"\25BE";margin-left:8px;color:var(--muted)}
.perm-g[open]>summary::after{content:"\25B4"}
.perm-lista{display:grid;border-top:1px solid var(--line);padding:4px 8px 8px}
.perm{display:grid;gap:2px;padding:2px 6px;border-radius:8px}
.perm label.chk{display:flex;gap:10px;align-items:center;font:500 15px var(--fb);min-height:44px;cursor:pointer}
.perm label.chk input{width:22px;height:22px;accent-color:#2F2A24;flex:none}
.perm .ayuda{margin:-6px 0 4px 32px;font-size:13px;color:var(--muted)}
.perm .nuevo{font:700 11px var(--fb);background:var(--accent);color:#2F2A24;border-radius:6px;padding:2px 6px;margin-left:6px}
.perm.bloq label.chk{cursor:default;color:var(--muted)}
.alc{margin:0 0 4px 32px;padding:0;border:0;display:grid;gap:2px;min-width:0}
.alc legend{font-size:12px;color:var(--muted);padding:0}
.rad{display:flex;gap:10px;align-items:center;cursor:pointer;font:15px var(--fb);color:var(--ink);border-radius:8px;padding:0 6px;min-height:44px}
.rad input{width:20px;height:20px;accent-color:#2F2A24;flex:none}
.alc[disabled]{opacity:.6}
.alc[disabled] .rad{cursor:not-allowed}
.aviso-p{margin:4px 0 6px}
.aviso-p:empty{display:none}
.menu-res{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 12px}
.menu-res .pill{font-size:13px}
@media(max-width:700px){
 .roles-x{grid-template-columns:minmax(0,1fr)}
 .rol-lista{grid-auto-flow:column;grid-auto-columns:max-content;overflow-x:auto;padding-bottom:4px}
 .rol-item{width:auto;white-space:nowrap}
}

/* ---------- Subconceptos ---------- */
.sub-fila{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.sub-b{box-sizing:border-box;cursor:pointer;border:2px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;font:500 15px var(--fb);padding:4px 14px;display:inline-flex;align-items:center;min-height:44px}
.sub-b[aria-pressed=true]{background:#2F2A24;border-color:#2F2A24;color:#fff;font-weight:700}
.sub-b[aria-pressed=true]::before{content:"\2713 ";margin-right:4px}
.sub-b:focus-visible{outline:3px solid #2F2A24;outline-offset:2px}
.sub-b.ninguno{border-style:dashed;color:var(--muted)}
.sub-b.ninguno[aria-pressed=true]{color:#fff}
.cs{color:var(--muted)}
.cfg-con{border:1px solid var(--line);border-radius:12px;background:var(--surface);margin:4px 0 8px}
.cfg-con>summary{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;gap:10px;padding:0 12px;font-weight:700}
.cfg-con>summary::-webkit-details-marker{display:none}
.cfg-con>summary:focus-visible{outline:3px solid #2F2A24;outline-offset:-3px;border-radius:12px}
.cfg-con>summary .n-sub{margin-left:auto;font-size:13px;color:var(--muted);font-weight:500}
.cfg-con>summary::after{content:"\25BE";color:var(--muted)}
.cfg-con[open]>summary::after{content:"\25B4"}
.cfg-subs{border-top:1px solid var(--line);padding:8px 12px 12px;display:grid;gap:8px}
.cfg-sub{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center}
.cfg-sub input[type=text]{min-height:44px}
.cfg-sub.off input[type=text]{color:var(--muted);text-decoration:line-through}
.cfg-sub .mini{min-width:44px;min-height:44px}
.tabla-ind .sub td{color:var(--muted)}
.tabla-ind td.ind{padding-left:26px}

/* ---------- Caja: modo «solo lo que cobré yo» ---------- */
.modo-tag{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid var(--accent);border-radius:999px;padding:3px 12px;font-size:13px;font-weight:700;color:var(--ink)}
.ciego{border:1px dashed var(--muted);border-radius:10px;padding:10px 12px;color:var(--ink);background:var(--idle)}

/* ---------- Liquidación ---------- */
.tag-demo{display:inline-flex;align-items:center;font:700 11px var(--fb);letter-spacing:.04em;text-transform:uppercase;color:var(--amb);background:var(--amb-soft);border:1px solid #C9A25A;border-radius:6px;padding:1px 6px;margin-left:6px}
.pac-tabla td.pac{font-weight:700}
.cuenta-liq{font-size:14px;color:var(--muted);margin:0 0 10px}
.sin-permiso{border:1px solid var(--line);background:var(--idle);border-radius:12px;padding:12px 14px}
@media(max-width:700px){
 .cfg-sub{grid-template-columns:minmax(0,1fr) auto}
 .cfg-sub .mini.b{grid-column:2}
}