/* ══════════════════════════════════════════════
   style_desktop.css — Solo se carga en desktop
   media="(hover: hover)" — ignorado en móvil
   ══════════════════════════════════════════════ */

/* ══ RAIL HOVERS ══ */
.rail-btn:hover{background:var(--s2);color:var(--text)}
.rail-btn:hover .fe-rail{transform:scale(1.18) rotate(-5deg)}
.rail-btn:hover img.rail-fluent,.rail-btn:hover .hsl-fluent{transform:scale(1.25) rotate(-8deg)}
.rail-btn:hover .lucide{transform:scale(1.18) rotate(-4deg)}
.rail-btn:hover img.emoji{transform:scale(1.3) rotate(-8deg)}
.rail-btn:hover .cat-svg{color:var(--red);transform:scale(1.25) rotate(-8deg)}

/* ══ TAB HOVERS ══ */
.sp-tab:hover{background:var(--s2);color:var(--text)}
.sp-tab:hover .fe-tab{transform:scale(1.2) rotate(-6deg)}

/* ══ CARD HOVERS ══ */
.home-card:hover{box-shadow:0 8px 24px rgba(0,0,0,.12)}
.menu-card:hover{box-shadow:0 6px 18px rgba(0,0,0,.1)}
.sl-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.12)}
.stat-card:hover{transform:translateY(-3px)}
.anim-card:hover{background:var(--red-soft)}
.acc-header:hover{background:var(--s2)}
.acc-header:hover .acc-fluent{transform:scale(1.25) rotate(-8deg)}

/* ══ BUTTON HOVERS ══ */
.rail-btn:hover .anim-icon{transform:scale(1.18) rotate(-5deg)}
.sp-tab:hover .anim-icon{transform:scale(1.2) rotate(-5deg)}
.qty-btn:hover .anim-icon{transform:scale(1.4) rotate(90deg);stroke:var(--red)}
.ci-btn:hover .anim-icon{transform:scale(1.35);stroke:var(--red)}
.hc-add:hover{transform:scale(1.2)!important}
.mc-add-btn:hover{transform:scale(1.2)!important}
.home-logo:hover .fe-logo{transform:scale(1.1) rotate(-8deg)}
.chat-fab:hover .fe-chat-fab{transform:scale(1.2) rotate(-8deg)}
.del-icon:hover .fe-modal-icon{transform:scale(1.1) rotate(-6deg)}

/* ══ SECTION LABEL HOVERS ══ */
.home-section-label:hover{color:var(--red)}
.home-section-label:hover .hsl-fluent{transform:scale(1.3) rotate(-8deg)}
.home-section-label:hover .hsl-lucide{color:var(--red);transform:scale(1.2) rotate(-12deg)}
.home-section-label:hover .cat-svg{color:var(--red);transform:scale(1.3) rotate(-10deg)}

/* ══ CHIP / TAG HOVERS ══ */
.chip:hover{border-color:var(--red);color:var(--red);transform:translateY(-2px);box-shadow:var(--sh)}
.sl-tag:hover{border-color:var(--red);color:var(--red)}

/* ══ SEND BTN HOVER ══ */
.send-btn:hover:not(:disabled){background:var(--red2);transform:scale(1.08)}

/* ══ ANIMACIONES DE ICONOS (solo desktop) ══ */
.rail-btn:hover .ai-lens{animation:lensPulse .5s cubic-bezier(.34,1.56,.64,1) both;stroke:var(--red)}
.rail-btn:hover .ai-handle{animation:handleExtend .35s ease both .1s;stroke:var(--red)}
.rail-btn:hover .ai-basket,.sp-tab:hover .ai-basket{animation:cartRock .5s cubic-bezier(.34,1.56,.64,1) both}
.rail-btn:hover .ai-wheel,.sp-tab:hover .ai-wheel{animation:wheelSpin .5s ease both}
.rail-btn:hover .ai-check1,.sp-tab:hover .ai-check1{animation:lineReveal .3s ease both;stroke:var(--red)}
.rail-btn:hover .ai-check2,.sp-tab:hover .ai-check2{animation:lineReveal .3s ease both .12s;stroke:var(--red)}
.send-btn:hover:not(:disabled) .send-svg{animation:sendLaunch .4s cubic-bezier(.34,1.56,.64,1) both}
.send-btn:hover .send-trail{animation:trailFade .4s ease both}
.hc-add:hover .add-ring,.mc-add-btn:hover .add-ring{animation:ringPulse .6s cubic-bezier(.34,1.56,.64,1) both}
.hc-add:hover .add-v,.mc-add-btn:hover .add-v{animation:lineSpin .35s cubic-bezier(.34,1.56,.64,1) both}
.hc-add:hover .add-h,.mc-add-btn:hover .add-h{animation:lineSpin .35s cubic-bezier(.34,1.56,.64,1) both .06s}
.rail-btn:hover .cs-1{animation:catPath1 .5s cubic-bezier(.34,1.56,.64,1) both}
.rail-btn:hover .cs-2{animation:catPath2 .5s cubic-bezier(.34,1.56,.64,1) both .08s}
.rail-btn:hover .cs-3{animation:catPath3 .5s cubic-bezier(.34,1.56,.64,1) both .16s}
.home-section-label:hover .cs-1{animation:catPath1 .45s cubic-bezier(.34,1.56,.64,1) both}
.home-section-label:hover .cs-2{animation:catPath2 .45s cubic-bezier(.34,1.56,.64,1) both .06s}
.home-section-label:hover .cs-3{animation:catPath3 .45s cubic-bezier(.34,1.56,.64,1) both .12s}

/* ══ CARD ANIMATIONS (solo desktop) ══ */
.home-card{transition:box-shadow .22s}
@keyframes cardJump{
  0%{transform:scale(1) translateY(0)}
  20%{transform:scale(1.08) translateY(-8px) rotate(-2deg)}
  40%{transform:scale(1.08) translateY(-8px) rotate(2deg)}
  60%{transform:scale(1.05) translateY(-4px) rotate(-1deg)}
  80%{transform:scale(1.02) translateY(-2px) rotate(.5deg)}
  100%{transform:scale(1) translateY(0) rotate(0)}
}
.home-card.selected-first{order:-1;animation:cardJump .5s cubic-bezier(.34,1.56,.64,1) both;outline:2px solid var(--red);outline-offset:2px}
@keyframes jiggle{
  0%,100%{transform:rotate(0) scale(1)}
  20%{transform:rotate(-3deg) scale(1.05)}
  40%{transform:rotate(3deg) scale(1.05)}
  60%{transform:rotate(-2deg) scale(1.02)}
  80%{transform:rotate(1deg) scale(1.01)}
}
.home-card.jiggle{animation:jiggle .4s cubic-bezier(.34,1.56,.64,1) both}
@keyframes megaShake{
  0%,100%{transform:rotate(0) scale(1)}
  10%{transform:rotate(-4deg) scale(1.06)}
  25%{transform:rotate(4deg) scale(1.08)}
  40%{transform:rotate(-3deg) scale(1.06)}
  55%{transform:rotate(3deg) scale(1.04)}
  70%{transform:rotate(-2deg) scale(1.02)}
  85%{transform:rotate(1deg) scale(1.01)}
}
.home-card.mega-shake{animation:megaShake .5s cubic-bezier(.34,1.56,.64,1) both}