/* ============================================================
   dotia-motion.css (.dotIA) — camada de animacao ADITIVA
   Nao altera o estilo/cores/layout existente. So adiciona:
   - boot overlay (momento orquestrado de entrada)
   - reveal on scroll (motion que sussurra)
   - hover micro-interacoes (glow/lift)
   - spinners de loading animados (terminal/hack)
   - scanline + grid ambient (subtil)
   - glitch no logo
   Respeita prefers-reduced-motion (desliga tudo).
   ============================================================ */

/* ===== BOOT OVERLAY (momento orquestrado) ===== */
#dotia-boot{position:fixed;inset:0;z-index:99999;background:#05060a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;font-family:var(--font,'Courier New',monospace);color:#67e8f9;transition:opacity .6s ease,visibility .6s;}
#dotia-boot.done{opacity:0;visibility:hidden;pointer-events:none;}
#dotia-boot .boot-logo{font-size:clamp(28px,6vw,54px);font-weight:800;letter-spacing:-.04em;color:#e6e6f0;text-shadow:0 0 22px rgba(103,232,249,.35);}
#dotia-boot .boot-logo .a{color:#67e8f9;}
#dotia-boot .boot-term{font-size:12px;min-height:18px;opacity:.85;letter-spacing:.5px;}
#dotia-boot .boot-term .cur{display:inline-block;width:8px;height:14px;background:#67e8f9;vertical-align:-2px;animation:dotia-blink 1s steps(1) infinite;}
#dotia-boot .boot-bar{width:min(280px,60vw);height:3px;background:rgba(103,232,249,.15);border-radius:3px;overflow:hidden;}
#dotia-boot .boot-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#67e8f9,#a78bfa);animation:dotia-bootfill 1.6s ease forwards;}
@keyframes dotia-bootfill{to{width:100%;}}
@keyframes dotia-blink{50%{opacity:.15;}}

/* ===== GLITCH NO LOGO ===== */
.dotia-glitch{position:relative;}
.dotia-glitch:hover::before,.dotia-glitch:hover::after{content:attr(data-text);position:absolute;left:0;top:0;width:100%;overflow:hidden;clip-path:inset(0);}
.dotia-glitch:hover::before{color:#67e8f9;transform:translate(-2px,0);animation:dotia-gl1 .4s steps(2) infinite;}
.dotia-glitch:hover::after{color:#f472b6;transform:translate(2px,0);animation:dotia-gl2 .4s steps(2) infinite;}
@keyframes dotia-gl1{0%,100%{clip-path:inset(0 0 70% 0);}50%{clip-path:inset(60% 0 0 0);}}
@keyframes dotia-gl2{0%,100%{clip-path:inset(60% 0 0 0);}50%{clip-path:inset(0 0 70% 0);}}

/* ===== REVEAL ON SCROLL (whisper) ===== */
.dotia-reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1);}
.dotia-reveal.dotia-in{opacity:1;transform:none;}
.dotia-reveal.d1{transition-delay:.05s;}.dotia-reveal.d2{transition-delay:.1s;}.dotia-reveal.d3{transition-delay:.16s;}.dotia-reveal.d4{transition-delay:.22s;}.dotia-reveal.d5{transition-delay:.28s;}

/* ===== ENTRADA DA SIDEBAR / CONTENT ===== */
.dotia-enter-sidebar{animation:dotia-slideL .5s cubic-bezier(.2,.7,.2,1) both;}
.dotia-enter-main{animation:dotia-fade .6s ease both;}
@keyframes dotia-slideL{from{transform:translateX(-18px);opacity:0;}to{transform:none;opacity:1;}}
@keyframes dotia-fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ===== HOVER MICRO-INTERACOES (additivo, so intensifica) ===== */
.nav-item{transition:transform .18s ease,background .18s ease,box-shadow .18s ease,color .18s ease;}
.nav-item:hover{transform:translateX(3px);}
.btn,.btn-primary,.btn-secondary,.btn-sm,.pay-btn{transition:transform .15s ease,box-shadow .2s ease,filter .15s ease;}
.btn:hover,.btn-primary:hover,.pay-btn:hover{transform:translateY(-2px);filter:brightness(1.08);}
.btn:active,.btn-primary:active{transform:translateY(0) scale(.97);}
.card,.stat-card,.mcard,.plan-card,.data-table tbody tr{transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease;}
.card:hover,.stat-card:hover,.mcard:hover,.plan-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(0,0,0,.35);}
.user-card{transition:box-shadow .2s ease,transform .18s ease;}
.user-card:hover{transform:translateX(2px);}

/* ===== PULSE NOS STATUS DOTS ===== */
.status-dot,.pulse{animation:dotia-pulse 2.2s ease-in-out infinite;}
@keyframes dotia-pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.4;transform:scale(.8);}}

/* ===== SPINNER DE LOADING (terminal/hack) ===== */
.dotia-loader{display:inline-flex;align-items:center;gap:9px;font-family:var(--font,'Courier New',monospace);font-size:12px;color:var(--text-muted,#888);}
.dotia-loader .sp{width:14px;height:14px;border:2px solid rgba(103,232,249,.25);border-top-color:#67e8f9;border-radius:50%;animation:dotia-spin .8s linear infinite;}
@keyframes dotia-spin{to{transform:rotate(360deg);}}
.dotia-loader .bars{display:inline-flex;gap:2px;height:14px;align-items:flex-end;}
.dotia-loader .bars i{width:3px;background:#67e8f9;animation:dotia-bar 1s ease-in-out infinite;}
.dotia-loader .bars i:nth-child(2){animation-delay:.15s;}.dotia-loader .bars i:nth-child(3){animation-delay:.3s;}.dotia-loader .bars i:nth-child(4){animation-delay:.45s;}
@keyframes dotia-bar{0%,100%{height:4px;opacity:.4;}50%{height:14px;opacity:1;}}

/* ===== SCANLINE + GRID AMBIENT (muito subtil) ===== */
.dotia-ambient{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;}
.dotia-ambient::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(103,232,249,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(103,232,249,.04) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000,transparent 80%);animation:dotia-grid 18s linear infinite;}
.dotia-ambient::after{content:'';position:absolute;left:0;right:0;height:120px;top:-120px;background:linear-gradient(transparent,rgba(103,232,249,.06),transparent);animation:dotia-scan 7s linear infinite;}
@keyframes dotia-grid{to{background-position:38px 38px;}}
@keyframes dotia-scan{to{transform:translateY(calc(100vh + 120px));}}

/* ===== SHIMMER EM LOADINGS DE TEXTO ===== */
.dotia-shimmer{background:linear-gradient(90deg,transparent,rgba(103,232,249,.12),transparent);background-size:200% 100%;animation:dotia-shim 1.4s linear infinite;}
@keyframes dotia-shim{to{background-position:-200% 0;}}

/* ===== REDUCED MOTION (acessibilidade) ===== */
@media (prefers-reduced-motion:reduce){
  #dotia-boot,.dotia-reveal,.dotia-enter-sidebar,.dotia-enter-main,.dotia-ambient::before,.dotia-ambient::after,.status-dot,.pulse,.dotia-loader .sp,.dotia-loader .bars i,.dotia-glitch:hover::before,.dotia-glitch:hover::after{animation:none!important;}
  .dotia-reveal{opacity:1;transform:none;transition:none;}
  .nav-item:hover,.btn:hover,.card:hover,.stat-card:hover,.mcard:hover,.plan-card:hover,.user-card:hover{transform:none;}
}