/* OOVIQ PWA — Estilos de marca "Vibrant Intelligence" */
.material-symbols-outlined { font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24; }
.fill-icon { font-variation-settings:'FILL' 1,'wght' 400; }

.brand-gradient { background: linear-gradient(135deg, #2c40e6 0%, #fe4c8c 100%); }
.brand-gradient-text { background: linear-gradient(135deg,#2c40e6 0%,#fe4c8c 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.glass-panel { background: rgba(255,255,255,0.7); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border:1px solid rgba(255,255,255,0.3); }

/* Blobs atmosféricos */
.animated-blob { position:absolute; width:300px; height:300px; background:radial-gradient(circle, rgba(44,64,230,0.15) 0%, rgba(254,76,140,0.15) 100%); filter:blur(60px); border-radius:50%; z-index:-1; animation:move 20s infinite alternate ease-in-out; }
@keyframes move { from{transform:translate(-10%,-10%);} to{transform:translate(20%,20%);} }
@keyframes float { 0%{transform:translateY(0);} 50%{transform:translateY(-10px);} 100%{transform:translateY(0);} }
.animate-float { animation: float 6s ease-in-out infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.animate-spin { animation: spin 1s linear infinite; }

/* Gauge */
.gauge-track { stroke:#eaedff; }
.gauge-progress { stroke:url(#ooviqGrad); stroke-linecap:round; transition:stroke-dashoffset 1s cubic-bezier(0.4,0,0.2,1); }

input:focus { outline:none; box-shadow:0 0 0 2px rgba(44,64,230,0.2); }

/* Transiciones de vista — solo opacity para no romper position:fixed de hijos */
.view-enter { animation: viewIn 0.3s ease forwards; }
@keyframes viewIn { from{opacity:0;} to{opacity:1;} }
/* Header y nav fijos: anclados SIEMPRE al viewport, nunca al contenedor */
header.app-fixed, nav.app-fixed { position: fixed !important; left: 0; right: 0; }
header.app-fixed { top: 0; }
nav.app-fixed { bottom: 0; }

/* Task swipe/complete animation */
.task-done-anim { animation: taskDone 0.4s ease forwards; }
@keyframes taskDone { to { opacity:0; transform:translateX(40px); height:0; margin:0; padding:0; } }

/* Safe areas (notch) */
.pt-safe { padding-top: env(safe-area-inset-top); }
.pb-safe { padding-bottom: calc(env(safe-area-inset-bottom) + 12px); }

/* Bottom nav */
.nav-active { color:#2c40e6; }
.nav-active .nav-icon { font-variation-settings:'FILL' 1,'wght' 600; }

/* Checkbox circular completar */
.check-btn { transition: all 0.2s ease; }
.check-btn:active { transform: scale(0.88); }

/* Scrollbar oculto en móvil */
::-webkit-scrollbar { width:0; height:0; }
* { -webkit-tap-highlight-color: transparent; }