/* =========================================================
   Panel de Mando — tema "Papel"
   Claro, sin brillos ni degradados. El color de cada persona
   queda como acento pequeño para que mande el texto.
   Se activa con <html data-tema="papel">.
   ========================================================= */

html[data-tema="papel"]{
  --bg:#F6F5F2; --bg-2:#FFFFFF; --bg-soft:#FFFFFF; --surface:#FFFFFF; --surface-2:#F1F0EC; --surface-3:#E7E5E0;
  --border:rgba(23,23,28,.12); --border-strong:rgba(23,23,28,.22);
  --text:#17171C; --muted:#56565F; --faint:#7C7C87;
  --accent:#4A5BD4; --accent-strong:#3140AC; --accent-soft:rgba(74,91,212,.10); --accent-ink:#FFFFFF;
  --ink-on-light:#17171C;
  --alta:#C8372F; --media:#B07A06; --baja:#6E7E96;
  --alta-soft:rgba(200,55,47,.10); --alta-strong:#B32E27;
  --pend:#7C7C87; --curso:#4A5BD4; --fin:#0E8A63; --fin-soft:rgba(14,138,99,.10); --fin-strong:#0B6E4F;
  --late:#C8372F; --soon:#A06C05;
  --display:"Geist", system-ui, sans-serif;
  color-scheme:light;
}

/* fondo y superficies planas */
html[data-tema="papel"] body{ background:var(--bg); }
html[data-tema="papel"] .aura{ display:none; }
html[data-tema="papel"] .appbar{ background:rgba(246,245,242,.92); }
html[data-tema="papel"] .brand{ font-weight:700; letter-spacing:-.02em; }
html[data-tema="papel"] .brand-mark{ background:var(--accent); box-shadow:none; }
html[data-tema="papel"] .brand-mark::after{ background:#fff; opacity:1; }
html[data-tema="papel"] .sync{ box-shadow:none; }
html[data-tema="papel"] .admin-tag{ border-color:rgba(74,91,212,.35); }
html[data-tema="papel"] .badge{ box-shadow:none; color:#fff; }
html[data-tema="papel"] .icon-btn:hover{ background:var(--surface-2); }

/* saludo sin degradado de color */
html[data-tema="papel"] .hello h2{ font-weight:700; letter-spacing:-.025em; }
html[data-tema="papel"] .hello h2 .name{ background:none; -webkit-text-fill-color:currentColor; color:var(--text); }

/* controles */
html[data-tema="papel"] .seg{ background:var(--surface-2); border-color:var(--border); }
html[data-tema="papel"] .seg button[aria-pressed="true"]{ background:#fff; color:var(--text); box-shadow:0 1px 2px rgba(23,23,28,.12); }
html[data-tema="papel"] .seg[data-kind="crit"] button[data-v="alta"][aria-pressed="true"],
html[data-tema="papel"] .seg[data-kind="crit"] button[data-v="media"][aria-pressed="true"],
html[data-tema="papel"] .seg[data-kind="crit"] button[data-v="baja"][aria-pressed="true"],
html[data-tema="papel"] .seg[data-kind="estado"] button[data-v="en_curso"][aria-pressed="true"],
html[data-tema="papel"] .seg[data-kind="estado"] button[data-v="finalizado"][aria-pressed="true"]{ background:#fff; box-shadow:0 1px 2px rgba(23,23,28,.12); }
html[data-tema="papel"] .seg[data-kind="crit"] button[data-v="alta"][aria-pressed="true"]{ color:var(--alta); }
html[data-tema="papel"] .seg[data-kind="crit"] button[data-v="media"][aria-pressed="true"]{ color:var(--media); }
html[data-tema="papel"] .seg[data-kind="crit"] button[data-v="baja"][aria-pressed="true"]{ color:var(--baja); }
html[data-tema="papel"] .seg[data-kind="estado"] button[data-v="en_curso"][aria-pressed="true"]{ color:var(--accent); }
html[data-tema="papel"] .seg[data-kind="estado"] button[data-v="finalizado"][aria-pressed="true"]{ color:var(--fin); }
html[data-tema="papel"] .colnav button[aria-selected="true"]{ background:#fff; box-shadow:0 1px 2px rgba(23,23,28,.12); }

html[data-tema="papel"] input[type=text], html[data-tema="papel"] input[type=password],
html[data-tema="papel"] input[type=email], html[data-tema="papel"] input[type=date],
html[data-tema="papel"] select, html[data-tema="papel"] textarea{ background-color:#fff; }
html[data-tema="papel"] input:focus, html[data-tema="papel"] select:focus, html[data-tema="papel"] textarea:focus{ box-shadow:0 0 0 3px rgba(74,91,212,.18); }
html[data-tema="papel"] select{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2356565F' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
html[data-tema="papel"] .composer-bar{ background:#fff; }
html[data-tema="papel"] .composer-bar:focus-within{ box-shadow:0 0 0 1px var(--accent), 0 0 0 4px rgba(74,91,212,.15); }
html[data-tema="papel"] .mic-btn{ background:var(--surface-2); }
html[data-tema="papel"] .capture-full{ background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }

html[data-tema="papel"] .btn{ background:#fff; }
html[data-tema="papel"] .btn:hover{ background:var(--surface-2); }
html[data-tema="papel"] .btn-primary{ background:var(--accent); color:#fff; box-shadow:none; }
html[data-tema="papel"] .btn-primary:hover{ background:var(--accent-strong); box-shadow:none; }
html[data-tema="papel"] .btn-ghost{ background:transparent; }
html[data-tema="papel"] .switch input:checked + .track{ background:var(--accent); border-color:var(--accent); box-shadow:none; }
html[data-tema="papel"] .switch input:checked + .track::after{ background:#fff; }
html[data-tema="papel"] .tchip{ background:#fff; }
html[data-tema="papel"] .tchip[aria-pressed="true"]{ box-shadow:none; background:var(--surface-2); border-color:var(--border-strong); color:var(--text); }
html[data-tema="papel"] .tchip.person .pnombre{ color:var(--pc-text, var(--pc)); }
html[data-tema="papel"] .avatar{ background:var(--pc); color:#fff; }
html[data-tema="papel"] .avs .avatar{ box-shadow:0 0 0 2px #fff; }
html[data-tema="papel"] .avs .more{ background:var(--surface-2); box-shadow:0 0 0 2px #fff; }

/* equipo */
html[data-tema="papel"] .tm{ background:#fff; }
html[data-tema="papel"] .tm[aria-pressed="true"]{ background:#fff; border-color:var(--pc); box-shadow:0 0 0 1px var(--pc); }
html[data-tema="papel"] .tm .ring .avatar{ box-shadow:0 0 0 3px #fff; }

/* tarjetas: planas, con una franja de color y mucho contraste */
html[data-tema="papel"] .card{
  background:#fff; border-color:var(--border);
  box-shadow:0 1px 2px rgba(23,23,28,.06);
}
html[data-tema="papel"] .card::before{ box-shadow:none; width:3px; }
html[data-tema="papel"] .card::after{ display:none; }
html[data-tema="papel"] .card:hover{ box-shadow:0 4px 14px rgba(23,23,28,.10); border-color:var(--border-strong); }
html[data-tema="papel"] .card.done{ filter:none; opacity:1; background:#FAFAF8; }
html[data-tema="papel"] .card-tema{ color:var(--text); font-weight:600; }
html[data-tema="papel"] .card-cliente{ color:var(--muted); opacity:1; font-weight:600; }
html[data-tema="papel"] .card-desc{ color:var(--muted); }
html[data-tema="papel"] .due{ background:var(--surface-2); border-color:transparent; }
html[data-tema="papel"] .due.soon{ color:var(--soon); background:rgba(176,122,5,.10); }
html[data-tema="papel"] .due.late{ color:var(--late); background:rgba(200,55,47,.10); border-color:transparent; }
html[data-tema="papel"] .due.late::before{ box-shadow:none; animation:none; }
html[data-tema="papel"] .next-btn{ background:#fff; }
html[data-tema="papel"] .next-btn:hover{ border-color:var(--text); box-shadow:none; color:var(--text); }
html[data-tema="papel"] .next-btn[data-a="Finalizar"]{ background:var(--fin-soft); border-color:rgba(14,138,99,.35); color:var(--fin-strong); }
html[data-tema="papel"] .card-nota{ background:var(--surface-2); border-color:transparent; }
html[data-tema="papel"] .card-nota.cierre{ background:var(--fin-soft); color:var(--fin-strong); border-color:transparent; }
html[data-tema="papel"] .star{ color:var(--media); filter:none; }
html[data-tema="papel"] .lvl i b{ background:rgba(23,23,28,.16); }
html[data-tema="papel"] .card.is-new{ animation:none; box-shadow:0 0 0 2px var(--c1); }
html[data-tema="papel"] .empty-col{ background:#fff; border-style:dashed; }
html[data-tema="papel"] .skeleton{ background:linear-gradient(100deg, #F1F0EC 20%, #FAFAF8 45%, #F1F0EC 70%); background-size:250% 100%; }
html[data-tema="papel"] .column{ background:#fff; -webkit-backdrop-filter:none; backdrop-filter:none; }
html[data-tema="papel"] .column.drag-over{ background:var(--accent-soft); box-shadow:none; }
html[data-tema="papel"] .dot[data-e="en_curso"]{ box-shadow:none; }

/* hojas, avisos y botón flotante */
html[data-tema="papel"] .fab{ background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(23,23,28,.18); }
html[data-tema="papel"] .fab::before{ display:none; }
html[data-tema="papel"] .scrim{ background:rgba(23,23,28,.32); }
html[data-tema="papel"] .sheet:not(.composer):not(.filtros){ background:#fff; box-shadow:0 -10px 40px rgba(23,23,28,.18); }
/* en celular la captura y los filtros sí son hojas blancas */
@media (max-width: 899px){
  html[data-tema="papel"] .sheet.composer, html[data-tema="papel"] .sheet.filtros{ background:#fff; box-shadow:0 -10px 40px rgba(23,23,28,.18); }
}
html[data-tema="papel"] .sheet-head h2{ font-weight:700; letter-spacing:-.02em; }
html[data-tema="papel"] .sheet-foot, html[data-tema="papel"] .composer-foot{ background:#fff; }
html[data-tema="papel"] .sheet.detalle::before, html[data-tema="papel"] .sheet.cierre::before{ opacity:.9; }
html[data-tema="papel"] .toast{ background:#17171C; color:#fff; box-shadow:0 10px 30px rgba(23,23,28,.25); }
html[data-tema="papel"] .toast.error{ background:var(--alta); }
html[data-tema="papel"] .toast button{ background:#fff; color:#17171C; }
html[data-tema="papel"] .notice.offline{ border-color:rgba(200,55,47,.3); }
html[data-tema="papel"] .notice.archive{ background:#fff; }
html[data-tema="papel"] .active-filters{ background:#fff; }
html[data-tema="papel"] .push-nudge{ background:var(--accent-soft); border-color:rgba(74,91,212,.3); }
html[data-tema="papel"] .push-nudge .bell{ background:#fff; color:var(--accent); }
html[data-tema="papel"] .push-nudge .bell svg{ animation:none; }
html[data-tema="papel"] .push-ok{ color:var(--fin-strong); }
html[data-tema="papel"] .push-ok::before{ box-shadow:none; }
html[data-tema="papel"] ::selection{ background:rgba(74,91,212,.2); }

/* interruptor: perilla clara con relieve, no un círculo oscuro */
html[data-tema="papel"] .switch .track{ background:#E4E2DD; border-color:transparent; }
html[data-tema="papel"] .switch .track::after{ background:#fff; box-shadow:0 1px 3px rgba(23,23,28,.25); }

/* en escritorio, la captura y los filtros son parte de la página, no tarjetas */
@media (min-width: 900px){
  html[data-tema="papel"] .sheet.composer, html[data-tema="papel"] .sheet.filtros{
    background:transparent; box-shadow:none; border:0;
  }
  html[data-tema="papel"] .composer .composer-bar{ box-shadow:0 1px 2px rgba(23,23,28,.06); }
  html[data-tema="papel"] .capture-full{ box-shadow:0 1px 2px rgba(23,23,28,.06); }
  html[data-tema="papel"] .filtros .sheet-body{ border-color:var(--border); }
  /* columnas apenas hundidas para que las tarjetas blancas se despeguen */
  html[data-tema="papel"] .column{ background:rgba(23,23,28,.035); border-color:transparent; }
  html[data-tema="papel"] .column.drag-over{ background:var(--accent-soft); border-color:var(--accent); }
  html[data-tema="papel"] .sheet.menu, html[data-tema="papel"] .sheet.detalle, html[data-tema="papel"] .sheet.cierre{
    box-shadow:0 20px 50px rgba(23,23,28,.20);
  }
}

/* páginas secundarias (usuarios, sonido, entrar, cuenta) */
html[data-tema="papel"] .ucard{ background:#fff !important; }
html[data-tema="papel"] .sw-lbl{ color:var(--faint); }
html[data-tema="papel"] .op{ background:#fff; }
html[data-tema="papel"] .op.activa{ background:var(--accent-soft); box-shadow:0 0 0 1px var(--accent); }
html[data-tema="papel"] .caja{ background:#fff; }
html[data-tema="papel"] .aviso.ok{ background:var(--fin-soft); color:var(--fin-strong); border-color:rgba(14,138,99,.3); }
html[data-tema="papel"] .aviso.mal{ background:var(--alta-soft); color:var(--alta-strong); border-color:rgba(200,55,47,.3); }
/* Solo el formulario de entrar/cambiar clave, que es hijo directo de <main>.
   Ojo: en el tablero la captura de tareas también es un <form> dentro de
   <main>, pero va anidada, así que el selector con ">" no la alcanza. */
html[data-tema="papel"] main > form{ background:#fff; box-shadow:0 2px 10px rgba(23,23,28,.06); }
html[data-tema="papel"] .mark{ background:var(--accent) !important; box-shadow:none !important; }
html[data-tema="papel"] .mark::after{ background:#fff !important; opacity:1 !important; }
html[data-tema="papel"] .entrar{ background:var(--accent) !important; color:#fff !important; box-shadow:none !important; }
html[data-tema="papel"] .entrar:hover{ background:var(--accent-strong) !important; }
html[data-tema="papel"] .error{ background:var(--alta-soft) !important; color:var(--alta-strong) !important; border-color:rgba(200,55,47,.3) !important; }