/* IUDEX MG · CRISTAL — vidrio translúcido sobre aurora animada, en TODA la app.
   Para quitarlo: borra la línea <link ... tema-impacto.css> del index.html */
@keyframes iuUp{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
@keyframes iuDrift1{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(8vw,6vh,0) scale(1.2)}}
@keyframes iuDrift2{0%,100%{transform:translate3d(0,0,0) scale(1.1)}50%{transform:translate3d(-10vw,-5vh,0) scale(.9)}}
@keyframes iuShine{0%{transform:translateX(-120%)}60%,100%{transform:translateX(220%)}}
@keyframes iuPulse{0%,100%{box-shadow:0 0 0 0 rgba(17,173,4,.5)}50%{box-shadow:0 0 0 12px rgba(17,173,4,0)}}
@keyframes iuRipple{to{transform:scale(3.2);opacity:0}}

/* ── Fondo: aurora viva detrás del cristal ── */
body{background:radial-gradient(60vw 50vh at 0% 0%,rgba(17,173,4,.09),transparent 70%),radial-gradient(55vw 45vh at 100% 100%,rgba(27,43,51,.08),transparent 70%),#EEF1F2!important;background-attachment:fixed!important}
body::before,body::after{display:none!important}
.app{position:relative;z-index:1}
.main,.content,[id^="mod-"]{background:transparent!important}
#mod-dashboard{background:transparent!important}

/* ── Cristal: receta común ── */
.tw,.dc,.pn-card,.pn-tile,.mo,.topbar,.login-box,.d30-glass,.d30-kpi{
  background:rgba(255,255,255,.82)!important;
  
  border:1px solid rgba(255,255,255,.75)!important;
  box-shadow:0 18px 44px -18px rgba(27,43,51,.35),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.25)!important}
.dc,.pn-card,.pn-tile{position:relative;overflow:hidden}
/* reflejo que cruza el cristal al pasar el cursor */
.dc::after,.pn-tile::after,.pn-card::after{content:"";position:absolute;inset:0;width:45%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:translateX(-120%);pointer-events:none}
.dc:hover::after,.pn-tile:hover::after{animation:iuShine .9s ease}
.dc,.pn-tile{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.dc:hover,.pn-tile:hover{transform:translateY(-6px) scale(1.012);box-shadow:0 30px 60px -20px rgba(17,173,4,.45),inset 0 1px 0 #fff!important}
.dc.gv{background:rgba(232,245,229,.85)!important}
.dc.rv{background:rgba(254,236,234,.85)!important}
.mb{background:rgba(14,26,32,.45)!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.mo{background:rgba(255,255,255,.96)!important}
.topbar{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:0!important;box-shadow:none!important;border-radius:0;margin:0;padding:18px 30px 6px;min-height:60px}
th{background:rgba(255,255,255,.35)!important;}
td{background:transparent!important;border-bottom:1px solid rgba(27,43,51,.07)}
tbody tr{transition:background .15s,transform .15s}
.pr:hover,tbody tr:hover{background:rgba(17,173,4,.12)!important}

/* ── Menú lateral: cristal oscuro ── */
.sidebar{background:rgba(27,43,51,.96)!important;margin:14px 0 14px 14px;border-radius:30px;border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 60px -20px rgba(14,26,32,.7),inset 0 1px 0 rgba(255,255,255,.2);height:calc(100vh - 28px);position:relative;z-index:3}
.main{width:calc(100% - 242px)}
.ni{transition:transform .18s,background .18s,box-shadow .18s}
.ni:hover{background:rgba(255,255,255,.1);transform:translateX(4px)}
.ni.active{background:#11AD04!important;box-shadow:0 10px 26px -8px rgba(17,173,4,.9),inset 0 1px 0 rgba(255,255,255,.4)}

/* ── Botones, campos ── */
.btn{position:relative;overflow:hidden;background:rgba(255,255,255,.65);border:1px solid rgba(255,255,255,.9);box-shadow:0 4px 12px -6px rgba(27,43,51,.3),inset 0 1px 0 #fff;transition:transform .15s,box-shadow .15s,background .15s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px -8px rgba(17,173,4,.5),inset 0 1px 0 #fff}
.btn:active{transform:translateY(0) scale(.97)}
.bp{background:#11AD04!important;border:1px solid rgba(255,255,255,.35)!important;box-shadow:0 12px 26px -10px rgba(17,173,4,.9),inset 0 1px 0 rgba(255,255,255,.45)!important}
.sb,.fi,select,input[type=text],input[type=search],input[type=date],input[type=number],input[type=email],input[type=tel],textarea{background:rgba(255,255,255,.6)!important;border:1px solid rgba(255,255,255,.9)!important;box-shadow:inset 0 1px 3px rgba(27,43,51,.08)}
.iu-rip{position:absolute;border-radius:50%;background:rgba(255,255,255,.7);width:40px;height:40px;margin:-20px 0 0 -20px;pointer-events:none;animation:iuRipple .6s ease-out forwards}
.bp .iu-rip{background:rgba(255,255,255,.5)}

/* sin animaciones de entrada: evitan que las secciones parpadeen al repintar */
/* ── Dashboard: titular épico ── */
#mod-dashboard .content{padding:30px 34px 40px!important}
#mod-dashboard .topbar-title{color:#464646;font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.pn{max-width:1600px;gap:26px}
.pn-fecha{color:#0C8103;font-family:'EB Garamond',serif;font-style:italic;font-size:19px;letter-spacing:0;text-transform:none;font-weight:400}
.pn h1{font-size:clamp(38px,5vw,66px);font-weight:800;line-height:1;letter-spacing:-.045em;margin-top:8px;color:#1B2B33}
.pn-sub{color:#464646;font-size:15px;margin-top:10px;font-weight:500}
.pn-tiles{gap:18px}
.pn-tile{min-height:150px;border-radius:28px;padding:22px 24px;color:#111!important}
.pn-tile span{color:#464646!important;font-size:11px;letter-spacing:.12em;opacity:1}
.pn-tile strong{font-size:clamp(26px,2.9vw,46px);white-space:nowrap;font-weight:800;letter-spacing:-.04em;line-height:1.05;margin:8px 0;color:#1B2B33}
.pn-tile em{color:#464646!important;opacity:1;font-weight:600}
.pn-tile.verde{background:rgba(232,245,229,.85)!important}.pn-tile.verde strong{color:#0C8103}
.pn-tile.rojo{background:rgba(254,236,234,.85)!important}.pn-tile.rojo strong{color:#B42318}
.pn-tile.naranja{background:rgba(255,240,222,.85)!important}.pn-tile.naranja strong{color:#9A5B00}
.pn-tile.amarillo{background:rgba(255,247,214,.85)!important}
.pn-card{border-radius:28px}.pn-card>header{border-bottom:1px solid rgba(27,43,51,.08)}
.pn th{background:rgba(255,255,255,.3)!important}
.pn-acts button{background:rgba(255,255,255,.65)!important;border:1px solid #fff!important;border-radius:999px;font-weight:700;transition:all .2s;box-shadow:inset 0 1px 0 #fff}
.pn-acts button:hover{background:#11AD04!important;color:#fff!important;transform:translateY(-2px);box-shadow:0 12px 26px -10px rgba(17,173,4,.8)}
.pn-link{background:rgba(255,255,255,.65);border-radius:999px;border:1px solid #fff}
.pn-link:hover{background:#11AD04;color:#fff}
.dc .v{font-size:clamp(17px,1.65vw,25px);white-space:nowrap}
.tw{overflow-x:auto}td,th{padding-left:14px!important;padding-right:14px!important}

/* ── Login ── */
.login-overlay{background:#1B2B33!important;overflow:hidden}
.login-box{background:rgba(255,255,255,.1)!important;border:1px solid rgba(255,255,255,.28)!important;border-radius:34px;padding:46px 40px;max-width:400px}
.login-logo img{height:72px;opacity:1;filter:none}
.login-title{font-size:24px;font-weight:800;letter-spacing:-.03em}
.login-input{border-radius:999px;padding:13px 18px;background:rgba(255,255,255,.12)}
.login-input:focus{border-color:#11AD04;box-shadow:0 0 0 4px rgba(17,173,4,.3)}
.login-btn{border-radius:999px;padding:14px;font-size:15px;font-weight:800;background:#11AD04;box-shadow:0 14px 30px -10px rgba(17,173,4,.8)}

/* ── Botón de sonido ── */
#iu-snd{position:fixed;left:196px;bottom:24px;z-index:50;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.12);color:#fff;font-size:15px;cursor:pointer;}
#iu-snd:hover{background:rgba(17,173,4,.8)}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:700px){.pn-tile strong{font-size:clamp(24px,8vw,34px)}.sidebar{margin:0;border-radius:0}.topbar{margin:0}}

/* ═══ MENÚ ARRIBA, EN LÍNEA (escritorio y tablet) ═══ */
@media(min-width:701px){
  .app{flex-direction:column!important}
  .sidebar{width:auto!important;min-width:0!important;height:auto!important;margin:12px 16px 0!important;border-radius:999px!important;flex-direction:row!important;align-items:center;gap:10px;padding:8px 14px 8px 18px!important;flex-shrink:0;position:relative;z-index:30}
  .sidebar .logo{padding:0!important;margin:0;border:0!important;flex:none}.sidebar .logo img{height:30px!important}
  .sidebar>div[style*="padding:8px 12px"]{padding:0!important;border:0!important;flex:none;width:170px}
  .sidebar div[onclick="abrirBusquedaGlobal()"]{padding:7px 12px!important}
  .esp-sw{padding:0!important;flex:none;gap:4px}.esp-btn{padding:7px 14px!important;font-size:10.5px}
  .nav{display:flex!important;flex-direction:row!important;align-items:center;flex:1 1 auto;min-width:0;overflow-x:auto;overflow-y:hidden;gap:2px;scrollbar-width:none;padding:0 4px}
  .nav::-webkit-scrollbar{display:none}
  .nav-sec{display:none!important}
  .ni{margin:0!important;padding:8px 13px!important;flex:none;white-space:nowrap}
  .ni:hover{transform:translateY(-1px)}
  .sf{border:0!important;padding:0!important;flex:none;font-size:10px;line-height:1.3;max-width:150px;color:rgba(255,255,255,.55)}
  .sf br{display:none}.sf #sync-txt{display:none}
  .main{width:100%!important;flex:1;min-height:0}
  #iu-snd{left:auto;right:30px;bottom:auto;top:84px;width:30px;height:30px;font-size:13px;background:rgba(27,43,51,.12);color:#1B2B33}
}

/* ═══ FICHA DE CLIENTE = FOLDER VERDE DE OFICINA ═══ */
#modal-ficha-cliente .mo{background:#11AD04!important;border:0!important;border-radius:0 30px 30px 30px!important;overflow:visible!important;max-height:none!important;margin-top:46px;padding:20px 20px 18px!important;position:relative;box-shadow:0 30px 70px -24px rgba(27,43,51,.6),inset 0 2px 0 rgba(255,255,255,.28)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
#modal-ficha-cliente .mo::before{content:"FICHA DEL CLIENTE";position:absolute;left:0;top:-38px;height:40px;min-width:210px;padding:0 26px;display:flex;align-items:center;background:#11AD04;color:#fff;font-size:11px;font-weight:800;letter-spacing:.16em;border-radius:20px 26px 0 0;box-shadow:inset 0 2px 0 rgba(255,255,255,.28)}
#modal-ficha-cliente .mt{color:#fff!important;font-size:20px;padding:2px 6px 12px!important}
#modal-ficha-cliente #ficha-cli-body{background:#fff;border-radius:20px 20px 24px 24px;padding:20px 22px;max-height:60vh;overflow-y:auto;box-shadow:0 8px 22px -10px rgba(0,0,0,.35)}
#modal-ficha-cliente .ma{padding-top:12px;margin:0}
#modal-ficha-cliente .ma .btn{background:#fff!important;color:#0C6B03!important;border:0!important;font-weight:800}
#modal-ficha-cliente .ma .btn:hover{background:#E8F5E5!important}
@media(min-width:701px){.sf{display:flex!important;flex-direction:column;align-items:flex-end;gap:2px}.sf #user-name-display{margin:0;color:#fff!important;font-size:11px!important;font-weight:600}}
