/* Generated from pulpo/web/dashboard.html by scripts/reuse_pulpo_components.py. Do not edit. */
:root{
  --c-ink:#0F2233; --c-ink2:#112637; --c-coral:#FF6B5B; --c-coralD:#E8503F;
  --c-aqua:#2FCFC2; --c-aquaD:#1E9E94; --c-paper:#E5EFF0; --c-paper2:#F3F8F8;
  --c-haze:#8FB0C4; --c-amber:#F4B740; --c-violet:#9A93C8; --c-violetD:#6F68A0;
  --c-jade:#2BD3AE; --c-jadeD:#0B7A66; --c-sand:#F3D9A4; --c-sandD:#F5DFAE;
}
body[data-theme="light"]{
  --bg:var(--c-paper); --bg2:var(--c-paper2); --panel:#FFFFFF; --panel2:var(--c-paper2); --line:rgba(15,34,51,.13);
  --ink:var(--c-ink); --dim:#547080; --accent:var(--c-jadeD); --accent2:#0F6E8C;
  --on-accent:#fff; --on-accent2:#fff;
  --signal:#D9503E; --on-signal:#fff; --me:var(--c-sandD); --on-me:var(--c-ink);
  --ok:var(--c-jadeD); --warn:var(--c-amber); --danger:var(--c-coralD); --review:var(--c-violetD);
  --glass:#ffffff;
  --board:linear-gradient(165deg,var(--c-paper2) 0%, var(--c-paper) 100%);
}
body{ --rail:color-mix(in srgb, var(--ink) 20%, transparent); }
body[data-vibe="boring"]{ --r:16px; --r2:12px; --shadow:0 12px 32px -18px rgba(20,18,42,.30); --glow:0 0 0 1px var(--line); }
html,body{ margin:0; height:100%; overflow-x:clip; }
body{
  --font:'Hanken Grotesk',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
  --display:'Bricolage Grotesque','Hanken Grotesk',system-ui,sans-serif;
  --pixel:'Silkscreen',ui-monospace,monospace;
  background:var(--board); color:var(--ink); font-family:var(--font);
  font-size:15px; line-height:1.45; transition:background .25s,color .25s;
  -webkit-font-smoothing:antialiased; overscroll-behavior:none;
}
.ghost{ background:var(--panel); border:1px solid var(--line); border-radius:999px; padding:6px 11px; font-size:12.5px; font-weight:700; color:var(--dim); }
.ui-status{ font-size:11px; font-weight:600; padding:3px 8px; border-radius:6px; white-space:nowrap;
  color:var(--ok); background:color-mix(in srgb,var(--accent2) 14%, transparent); }
.ico{ display:block; margin:auto; width:18px; height:18px; }
.ico-in{ width:15px; height:15px; vertical-align:middle; flex:none; }
body{ overflow-wrap:anywhere; }
.msg{ max-width:88%; padding:11px 13px; border-radius:18px; font-size:14.5px; white-space:pre-wrap; word-break:break-word; overflow-wrap:anywhere; }
.msg.me{ align-self:flex-end; background:var(--me); color:var(--on-me); border-bottom-right-radius:5px; }
.msg.ag{ align-self:flex-start; background:var(--panel); border:1px solid var(--line); border-bottom-left-radius:5px; box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
#send{ width:44px; height:44px; flex-shrink:0; border-radius:50%; background:var(--accent); color:var(--on-accent); font-size:18px; display:grid; place-items:center; }
.fld input,.fld textarea{ width:100%; padding:11px 13px; border-radius:var(--r2); background:var(--panel); border:1px solid var(--line); color:var(--ink); outline:none; }
.fld input:focus,.fld textarea:focus{ border-color:var(--accent); }
.sheet .acts, .req .acts, .pjbulk .acts{ display:flex; gap:9px; margin-top:6px; }
.sheet .acts button, .req .acts button, .pjbulk .acts button{ flex:1; padding:13px; border-radius:var(--r2); font-weight:800; font-size:15px; }
.req .acts button, #tablero .req .acts button{ justify-content:center; text-align:center; }
@media(min-width:760px){
.req .acts button{ flex:0 1 auto; min-width:132px; }
}
.sheet .acts .pri, .req .acts .pri, .pjbulk .acts .pri{ background:var(--accent); color:var(--on-accent); }
.sheet .acts .sec, .req .acts .sec, .pjbulk .acts .sec{ background:var(--panel); border:1px solid var(--line); color:var(--dim); }
.req{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r2); padding:12px 13px; box-shadow:inset 0 1px 0 rgba(255,255,255,.08); }
.req .rtop{ display:flex; align-items:flex-start; gap:9px; cursor:pointer; width:100%; background:transparent; padding:0; text-align:left; min-height:40px; }
.req .rsum{ font-weight:700; font-size:14px; line-height:1.3; }
.req .rwho{ font-size:11.5px; color:var(--dim); font-weight:600; margin-top:2px; display:flex; align-items:center; gap:6px; }
.req .rbody{ margin-top:12px; display:flex; flex-direction:column; gap:12px; min-width:0; white-space:normal; }
.req .rprop, .req .rsteps, .req .ropt, .req .rconn, .req .rout, .req .rdetail code, .req .rwho{ overflow-wrap:anywhere; }
.req .rsum, .req .rmsg{ overflow-wrap:anywhere; }
.rlbl{ font-size:10px; text-transform:uppercase; letter-spacing:.4px; color:var(--dim); font-weight:800; margin-bottom:5px; }
.pjgroup{ --pjr:var(--r); --pjbd:1px; margin:0 0 12px; background:var(--panel); border:var(--pjbd) solid var(--line); border-radius:var(--pjr); }
.pjghead{ display:flex; align-items:flex-start; gap:12px; padding:14px 16px 12px; }
.pjgmain{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.pjgtop{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; }
.pjgstate, .pjgwho{ font-size:13px; color:var(--dim); }
.pjgwho{ font-weight:700; color:var(--ink); }
.pjgttl{ font-family:var(--display); font-weight:700; font-size:17px; line-height:1.3; margin:0; color:var(--ink); text-wrap:balance; }
.pjgmeta{ font-size:13px; line-height:1.4; color:var(--dim); margin:0; font-variant-numeric:tabular-nums; }
.pjgcount{ flex:none; padding:4px 11px; border-radius:999px; font-size:12.5px; font-weight:800; line-height:1.3; white-space:nowrap; font-variant-numeric:tabular-nums; color:color-mix(in srgb, var(--signal) 78%, var(--ink)); background:color-mix(in srgb, var(--signal) 12%, transparent); border:1px solid color-mix(in srgb, var(--signal) 30%, transparent); }
.pjglate{ color:color-mix(in srgb, var(--warn) 42%, var(--ink)); font-weight:600; }
.pjglist{ display:flex; flex-direction:column; border-top:1px solid var(--line); }
.pjgfoot{ display:flex; flex-direction:column; gap:2px; padding:8px 16px 6px; border-top:1px solid var(--line); background:color-mix(in srgb, var(--bg2) 60%, var(--panel)); border-radius:0 0 calc(var(--pjr) - var(--pjbd)) calc(var(--pjr) - var(--pjbd)); }
.pjgwhen{ margin:4px 0 0; font-size:13px; line-height:1.45; color:var(--dim); font-variant-numeric:tabular-nums; }
.pjgacts{ display:flex; flex-wrap:wrap; align-items:center; gap:0 2px; }
.pjbtn{ min-height:44px; padding:0 10px; border:0; border-radius:var(--r2); background:transparent; color:var(--accent); font:inherit; font-weight:700; font-size:14px; display:inline-flex; align-items:center; gap:7px; cursor:pointer; }
.pjbtn:disabled{ opacity:.5; cursor:default; }
.pjbtn:focus-visible, .pjgsel:focus-visible{ outline:2px solid var(--accent2); outline-offset:1px; }
@media (hover:hover){
.pjbtn:hover:not(:disabled){ background:color-mix(in srgb, var(--accent) 10%, transparent); }
}
.pjgsel{ -webkit-appearance:none; appearance:none; min-height:44px; max-width:100%; min-width:0; padding:0 34px 0 14px; border-radius:999px; border:1px solid var(--line); background-color:var(--panel); color:var(--ink); font:inherit; font-size:14px; font-weight:600; cursor:pointer; background-image:linear-gradient(45deg, transparent 50%, var(--dim) 50%), linear-gradient(135deg, var(--dim) 50%, transparent 50%); background-position:calc(100% - 19px) 50%, calc(100% - 14px) 50%; background-size:5px 5px; background-repeat:no-repeat; }
@media (pointer:coarse){
.pjgsel{ font-size:16px; }
}
@media(min-width:1024px){
.msg{ font-size:15.5px; }
}
#viewswitch{display:flex;flex:none;gap:2px;padding:3px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r2);margin-left:16px;}
#viewswitch button{display:flex;align-items:center;gap:7px;min-height:40px;padding:8px 13px;border:0;border-radius:8px;background:transparent;color:var(--dim);font:600 14px var(--font);}
#viewswitch button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent);}
#viewswitch button:hover:not([aria-pressed="true"]){background:var(--bg2);color:var(--ink);}
#viewswitch .ico{width:18px;height:18px;}
@media(max-width:1000px){
#viewswitch{margin-left:8px;}
#viewswitch button{padding:8px 10px;}
#viewswitch .ico{display:none;}
}