/* Tema Primavera de Wessel Asistencia — noviembre 2026 (minimalista, solo la app del personal).
   Solo actúa cuando <html> tiene la clase "primavera". Un script en la página la pone sola del 1 al 30 de noviembre de 2026
   (hora de Perú) y en diciembre el diseño vuelve al normal sin hacer nada. Administración puede forzarlo o apagarlo en
   Configuración (settings/general.temaPrimavera = auto | on | off). Respeta el modo claro u oscuro que elija cada persona.
   Íconos: flor, margarita, tulipán, mariposa, hoja, abeja y sol dibujados planos (SVG inline), sin imágenes externas. */
html.primavera:root{
  --papel:#FBFDF6; --tarjeta:#F0F7E8; --tarjeta-2:#E3F0D8; --control:#F8FCF1;
  --tinta:#1B2A1D; --tinta-suave:#4F6350; --tinta-tenue:#5F735F;
  --linea:rgba(46,110,60,.16); --linea-fuerte:rgba(46,110,60,.32);
  --burdeos:#B8325F; --burdeos-texto:#A82B56; --sobre-color:#FFFFFF;
  --sello:#2B7D49; --sobre-sello:#FFFFFF; --tardanza:#8A5A15; --falta:#A83232;
  --tinta-sel:rgba(242,121,159,.26);
}
@media (prefers-color-scheme: dark){
  html.primavera:root:not([data-theme="light"]){
    --papel:#0E1811; --tarjeta:#15231A; --tarjeta-2:#1D3023; --control:#0A130D;
    --tinta:#F0F7EC; --tinta-suave:#A9BEA9; --tinta-tenue:#8FA68F;
    --linea:rgba(190,235,190,.15); --linea-fuerte:rgba(190,235,190,.3);
    --burdeos:#BE3F6B; --burdeos-texto:#F28FB1; --sobre-color:#FFFFFF;
    --sello:#7BD99A; --sobre-sello:#082412; --tardanza:#E8BC62; --falta:#F09090;
    --tinta-sel:rgba(242,121,159,.3);
  }
}
html.primavera:root[data-theme="dark"]{
  --papel:#0E1811; --tarjeta:#15231A; --tarjeta-2:#1D3023; --control:#0A130D;
  --tinta:#F0F7EC; --tinta-suave:#A9BEA9; --tinta-tenue:#8FA68F;
  --linea:rgba(190,235,190,.15); --linea-fuerte:rgba(190,235,190,.3);
  --burdeos:#BE3F6B; --burdeos-texto:#F28FB1; --sobre-color:#FFFFFF;
  --sello:#7BD99A; --sobre-sello:#082412; --tardanza:#E8BC62; --falta:#F09090;
  --tinta-sel:rgba(242,121,159,.3);
}
html.primavera:root, html.primavera:root[data-theme]{
  --pv-flor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cellipse cx='20' cy='11' rx='6.2' ry='8.4' fill='%23F2799F'  transform='rotate(0.0 20 20)'/%3E%3Cellipse cx='20' cy='11' rx='6.2' ry='8.4' fill='%23F2799F'  transform='rotate(72.0 20 20)'/%3E%3Cellipse cx='20' cy='11' rx='6.2' ry='8.4' fill='%23F2799F'  transform='rotate(144.0 20 20)'/%3E%3Cellipse cx='20' cy='11' rx='6.2' ry='8.4' fill='%23F2799F'  transform='rotate(216.0 20 20)'/%3E%3Cellipse cx='20' cy='11' rx='6.2' ry='8.4' fill='%23F2799F'  transform='rotate(288.0 20 20)'/%3E%3Ccircle cx='20' cy='20' r='4.6' fill='%23FFD54A'/%3E%3C/svg%3E");
  --pv-margarita:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(0.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(45.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(90.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(135.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(180.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(225.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(270.0 20 20)'/%3E%3Cellipse cx='20' cy='10' rx='3.4' ry='8.6' fill='%23FFFFFF' stroke='%23E3D9C8' stroke-width='.8' transform='rotate(315.0 20 20)'/%3E%3Ccircle cx='20' cy='20' r='5.6' fill='%23F6C21C'/%3E%3C/svg%3E");
  --pv-tulipan:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M20 37V22' stroke='%234FA95D' stroke-width='2.6' stroke-linecap='round' fill='none'/%3E%3Cpath d='M20 32q-9-2-12-8M20 29q8-2 11-7' stroke='%234FA95D' stroke-width='2.2' stroke-linecap='round' fill='none'/%3E%3Cpath d='M10 8c0 9 3 15 10 15s10-6 10-15l-5 4-5-6-5 6z' fill='%23F0556F'/%3E%3Cpath d='M20 6l-5 6M20 6l5 6' stroke='%23C93A56' stroke-width='1.2' fill='none'/%3E%3C/svg%3E");
  --pv-mariposa:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cellipse cx='12' cy='15' rx='9.5' ry='7' transform='rotate(-28 12 15)' fill='%23B58CF0'/%3E%3Cellipse cx='28' cy='15' rx='9.5' ry='7' transform='rotate(28 28 15)' fill='%23B58CF0'/%3E%3Cellipse cx='14' cy='26' rx='6.5' ry='5' transform='rotate(18 14 26)' fill='%23F7A8C8'/%3E%3Cellipse cx='26' cy='26' rx='6.5' ry='5' transform='rotate(-18 26 26)' fill='%23F7A8C8'/%3E%3Ccircle cx='11' cy='14' r='2.3' fill='%23FFF3C4'/%3E%3Ccircle cx='29' cy='14' r='2.3' fill='%23FFF3C4'/%3E%3Crect x='18.6' y='11' width='2.8' height='19' rx='1.4' fill='%233B2A4A'/%3E%3Cpath d='M19 11q-3-6-6-6M21 11q3-6 6-6' stroke='%233B2A4A' stroke-width='1.2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  --pv-hoja:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cpath d='M6 33C5 17 15 6 33 6c1 18-9 28-27 27z' fill='%235DBB63'/%3E%3Cpath d='M6 33C15 24 22 17 30 9' stroke='%232F7D3A' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  --pv-abeja:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cellipse cx='15' cy='12' rx='7' ry='5' transform='rotate(-30 15 12)' fill='%23CFE9FF' fill-opacity='.9'/%3E%3Cellipse cx='25' cy='12' rx='7' ry='5' transform='rotate(30 25 12)' fill='%23CFE9FF' fill-opacity='.9'/%3E%3Cellipse cx='20' cy='24' rx='10' ry='9' fill='%23FFC928'/%3E%3Cpath d='M13 22q7 3 14 0M12 28q8 4 16 0' stroke='%232B2118' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3Ccircle cx='26' cy='20' r='1.5' fill='%232B2118'/%3E%3C/svg%3E");
  --pv-sol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(0 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(45 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(90 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(135 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(180 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(225 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(270 20 20)'/%3E%3Crect x='18.6' y='2' width='2.8' height='7' rx='1.4' fill='%23FFB81F' transform='rotate(315 20 20)'/%3E%3Ccircle cx='20' cy='20' r='8.5' fill='%23FFCE3A'/%3E%3C/svg%3E");
  --pv-enredadera:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 150' fill='none' stroke-linecap='round'%3E%3Cpath d='M-4 14Q36 10 62 36T104 92 118 146' stroke='%234C9A5A' stroke-width='3'/%3E%3Cpath d='M14 12q3 14 15 16' stroke='%234C9A5A' stroke-width='2'/%3E%3Cg fill='%236CC57A'%3E%3Cellipse cx='24' cy='28' rx='11' ry='5.5' transform='rotate(35 24 28)'/%3E%3Cellipse cx='50' cy='28' rx='11' ry='5.5' transform='rotate(-35 50 28)'/%3E%3Cellipse cx='74' cy='60' rx='11' ry='5.5' transform='rotate(40 74 60)'/%3E%3Cellipse cx='94' cy='72' rx='11' ry='5.5' transform='rotate(-30 94 72)'/%3E%3Cellipse cx='112' cy='108' rx='10' ry='5' transform='rotate(35 112 108)'/%3E%3Cellipse cx='126' cy='126' rx='10' ry='5' transform='rotate(-35 126 126)'/%3E%3C/g%3E%3Cg%3E%3Ccircle cx='38' cy='16' r='5.6' fill='%23F2799F'/%3E%3Ccircle cx='38' cy='16' r='2.2' fill='%23FFD54A'/%3E%3Ccircle cx='84' cy='46' r='5' fill='%23FFFFFF'/%3E%3Ccircle cx='84' cy='46' r='2' fill='%23F6C21C'/%3E%3Ccircle cx='103' cy='94' r='5.4' fill='%23F2799F'/%3E%3Ccircle cx='103' cy='94' r='2.1' fill='%23FFD54A'/%3E%3C/g%3E%3C/svg%3E");
}
/* detalles de color */
html.primavera .btn-principal{ box-shadow:0 4px 16px rgba(184,50,95,.2); }
html.primavera .btn-marcar{ box-shadow:0 6px 20px rgba(43,125,73,.16); }
html.primavera .btn-marcar.salida{ box-shadow:0 6px 20px rgba(184,50,95,.22); }
html.primavera .btn-marcar.btn-extra{ background:#F6C21C; color:#2A2200; border-color:#2A2200; box-shadow:0 3px 0 #2A2200; }
html.primavera .btn-marcar.btn-extra.en-curso{ background:var(--burdeos); color:#fff; border-color:#fff; }
html.primavera .rotulo-seccion{ color:var(--burdeos-texto); }
html.primavera .tarjeta, html.primavera .casilla{ border-color:var(--linea-fuerte); }

/* ---- decoración minimalista ---- */
/* franja fina arriba: rosa → verde → amarillo */
html.primavera body{ border-top:3px solid transparent; border-image:linear-gradient(90deg,#F2799F,#7BD99A,#FFCE3A) 1; overflow-x:hidden; }
/* flor junto al saludo */
html.primavera #saludo{ position:relative; }
html.primavera #saludo::after{ content:''; margin-left:auto; width:34px; height:34px; flex:none; background:var(--pv-flor) center / contain no-repeat; }
/* fila de íconos bajo el reloj: flor · mariposa · margarita · abeja · tulipán · hoja */
html.primavera .reloj::after{ content:''; display:block; height:28px; margin:10px auto 0; max-width:300px;
  background:var(--pv-flor) 3% center / 24px no-repeat, var(--pv-mariposa) 21% center / 26px no-repeat, var(--pv-margarita) 39% center / 24px no-repeat,
             var(--pv-abeja) 57% center / 24px no-repeat, var(--pv-tulipan) 75% center / 26px no-repeat, var(--pv-hoja) 96% center / 24px no-repeat; opacity:.97; }
/* enredaderas floridas bajo la barra de arriba, en las dos esquinas (la derecha va en espejo) */
html.primavera::before, html.primavera::after{ content:''; position:fixed; top:72px; width:84px; height:84px; pointer-events:none; z-index:1; opacity:.5; background:var(--pv-enredadera) top left / contain no-repeat; }
html.primavera::before{ left:0; }
html.primavera::after{ right:0; transform:scaleX(-1); }
/* sol arriba a la derecha de la tarjeta del reloj y tulipán/flor fijos abajo */
html.primavera body::before{ content:''; position:fixed; inset:0; pointer-events:none; z-index:2;
  background:var(--pv-tulipan) left 10px bottom 12px / 34px no-repeat; opacity:.95; }
html.primavera body.tm-nav::before{ background:var(--pv-tulipan) left 10px bottom 82px / 34px no-repeat; }
/* mariposa que flota abajo a la derecha */
html.primavera body::after{ content:''; position:fixed; right:10px; bottom:12px; width:38px; height:38px; pointer-events:none; z-index:2; background:var(--pv-mariposa) center / contain no-repeat; opacity:.97; }
html.primavera body.tm-nav::after{ bottom:82px; }
/* sol junto al reloj */
html.primavera .reloj{ position:relative; }
html.primavera .reloj::before{ content:''; position:absolute; top:-2px; right:16px; width:30px; height:30px; pointer-events:none; background:var(--pv-sol) center / contain no-repeat; }
/* mariposa que cruza la pantalla cerca del saludo */
html.primavera #saludo::before{ content:''; position:absolute; top:-4px; left:-40px; width:26px; height:26px; pointer-events:none; background:var(--pv-mariposa) center / contain no-repeat; }
@media (prefers-reduced-motion: no-preference){
  html.primavera body::after{ animation:pv-flota 5s ease-in-out infinite; }
  @keyframes pv-flota{ 0%,100%{ transform:translate(0,0) rotate(-6deg); } 50%{ transform:translate(-6px,-10px) rotate(6deg); } }
  html.primavera .reloj::before{ animation:pv-gira 24s linear infinite; }
  @keyframes pv-gira{ to{ transform:rotate(360deg); } }
  html.primavera #saludo::before{ animation:pv-vuela 18s linear infinite; }
  @keyframes pv-vuela{ 0%{ transform:translate(0,0) rotate(-8deg); } 25%{ transform:translate(26vw,14px) rotate(8deg); } 50%{ transform:translate(52vw,-4px) rotate(-6deg); } 75%{ transform:translate(78vw,16px) rotate(8deg); } 100%{ transform:translate(112vw,2px) rotate(-8deg); } }
  html.primavera .btn-marcar:not(:disabled):not(.btn-extra){ animation:pv-late 3.8s ease-in-out infinite; }
  @keyframes pv-late{ 0%,100%{ box-shadow:0 6px 20px rgba(43,125,73,.14); } 50%{ box-shadow:0 6px 28px rgba(43,125,73,.32); } }
}
/* en pantallas grandes: adornos más pequeños, sin sol girando ni mariposa cruzando */
@media (min-width:900px){
  html.primavera body::before{ background:var(--pv-tulipan) left 12px bottom 12px / 30px no-repeat; }
  html.primavera body::after{ bottom:12px; right:14px; width:30px; height:30px; }
  html.primavera .reloj::before, html.primavera #saludo::before{ display:none; }
}
/* impresión y reportes: sin decoración */
@media print{ html.primavera::before, html.primavera::after, html.primavera body::before, html.primavera body::after, html.primavera #saludo::after, html.primavera #saludo::before, html.primavera .reloj::before, html.primavera .reloj::after{ display:none !important; } }
