/* =========================================================
   Rabbit Workspace OS v124 — Colored Sidebars
   Gradiente coordinato al pulsante “Apri Mail Desk”:
   blu #2f7df0 → verde acqua #18b99c.
   Intervento esclusivamente visuale.
   ========================================================= */

:root{
  --rabbit-sidebar-blue:#2f7df0;
  --rabbit-sidebar-teal:#18b99c;
  --rabbit-sidebar-gradient:linear-gradient(155deg,var(--rabbit-sidebar-blue) 0%,#278bdc 46%,var(--rabbit-sidebar-teal) 100%);
  --rabbit-sidebar-ink:#10243e;
  --rabbit-sidebar-panel:rgba(255,255,255,.91);
  --rabbit-sidebar-panel-strong:rgba(255,255,255,.97);
  --rabbit-sidebar-border:rgba(255,255,255,.58);
  --rabbit-sidebar-shadow:0 22px 52px rgba(15,63,107,.22);
}

/* ---------- Shell laterali desktop ---------- */
@media (min-width:1181px){
  .sidebar,
  aside.sidebar,
  .rabbit-pro-sidebar,
  .rightbar,
  aside.rightbar,
  .app > .rightbar{
    position:relative!important;
    background:var(--rabbit-sidebar-gradient)!important;
    border-color:rgba(255,255,255,.38)!important;
    box-shadow:var(--rabbit-sidebar-shadow)!important;
    isolation:isolate!important;
  }

  .sidebar::before,
  .rightbar::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:-1!important;
    pointer-events:none!important;
    border-radius:inherit!important;
    background:
      radial-gradient(circle at 12% 7%,rgba(255,255,255,.24),transparent 26%),
      radial-gradient(circle at 88% 94%,rgba(255,255,255,.14),transparent 31%)!important;
  }

  /* Mantiene visibile il gradiente anche sotto lo scroll. */
  .sidebar,
  .rightbar{
    background-attachment:local!important;
  }
}

/* ---------- Sidebar sinistra ---------- */
.sidebar .brand,
.sidebar .rabbit-pro-brand{
  background:var(--rabbit-sidebar-panel-strong)!important;
  border:1px solid var(--rabbit-sidebar-border)!important;
  box-shadow:0 14px 30px rgba(16,54,92,.16),inset 0 1px 0 rgba(255,255,255,.9)!important;
}

.sidebar .rabbit-nav-group > summary,
.sidebar .rabbit-nav-group > summary span,
.sidebar .nav-section-title,
.sidebar .nav-label,
.sidebar .rabbit-v106-nav > b{
  color:#fff!important;
  text-shadow:0 1px 2px rgba(9,48,82,.22)!important;
}

.sidebar .rabbit-nav-group > summary i{
  color:#15527a!important;
  background:rgba(255,255,255,.82)!important;
  border-color:rgba(255,255,255,.72)!important;
  box-shadow:0 5px 12px rgba(16,65,105,.14)!important;
}

.sidebar .rabbit-v106-nav button,
.sidebar .nav button,
.sidebar #signupRequestsMenuItem,
.sidebar .rabbit-sidebar-logout{
  color:var(--rabbit-sidebar-ink)!important;
  background:var(--rabbit-sidebar-panel)!important;
  border:1px solid rgba(255,255,255,.66)!important;
  box-shadow:0 9px 20px rgba(13,67,108,.14),inset 0 1px 0 rgba(255,255,255,.84)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}

.sidebar .rabbit-v106-nav button:hover,
.sidebar .nav button:hover,
.sidebar #signupRequestsMenuItem:hover,
.sidebar .rabbit-sidebar-logout:hover{
  background:#fff!important;
  border-color:rgba(255,255,255,.94)!important;
  transform:translateY(-1px)!important;
  box-shadow:0 13px 26px rgba(10,59,99,.21),inset 0 1px 0 #fff!important;
}

.sidebar .rabbit-v106-nav button.active,
.sidebar .nav button.active{
  color:#0e4770!important;
  background:linear-gradient(135deg,rgba(255,255,255,.99),rgba(236,255,251,.96))!important;
  border-color:rgba(255,255,255,.98)!important;
  box-shadow:inset 3px 3px 7px rgba(46,126,157,.13),inset -3px -3px 7px #fff,0 10px 24px rgba(11,66,105,.18)!important;
}

.sidebar .rabbit-side-ico,
.sidebar .rabbit-nav-badge,
.sidebar .signup-nav-badge{
  color:#17619a!important;
  background:linear-gradient(145deg,#f7fcff,#dffaf4)!important;
  border-color:rgba(47,125,240,.18)!important;
  box-shadow:inset 2px 2px 4px rgba(87,139,163,.12),inset -2px -2px 4px #fff!important;
}

.sidebar .rabbit-sidebar-logout{
  color:#a82232!important;
  background:rgba(255,247,248,.94)!important;
}

/* ---------- Rightbar ---------- */
.rightbar .rabbit-rightbar-head,
.rightbar .rabbit-rightbar-hero,
.rightbar .rabbit-right-card,
.rightbar > .card{
  background:var(--rabbit-sidebar-panel)!important;
  border:1px solid var(--rabbit-sidebar-border)!important;
  box-shadow:0 13px 28px rgba(12,66,106,.16),inset 0 1px 0 rgba(255,255,255,.92)!important;
  backdrop-filter:blur(9px)!important;
  -webkit-backdrop-filter:blur(9px)!important;
}

.rightbar .rabbit-rightbar-hero{
  background:
    radial-gradient(circle at 10% 10%,rgba(47,125,240,.13),transparent 42%),
    radial-gradient(circle at 92% 90%,rgba(24,185,156,.15),transparent 40%),
    rgba(255,255,255,.93)!important;
}

.rightbar .rabbit-right-card:hover,
.rightbar > .card:hover{
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 17px 34px rgba(10,60,99,.20),inset 0 1px 0 #fff!important;
}

.rightbar .rabbit-right-shortcuts button,
.rightbar .rabbit-right-kpis button,
.rightbar .rabbit-right-person,
.rightbar .rabbit-right-actions button,
.rightbar .rabbit-rightbar-head > button{
  background:rgba(255,255,255,.84)!important;
  border-color:rgba(255,255,255,.80)!important;
  box-shadow:0 7px 16px rgba(13,67,108,.11),inset 0 1px 0 rgba(255,255,255,.92)!important;
}

.rightbar .rabbit-right-shortcuts button:hover,
.rightbar .rabbit-right-kpis button:hover,
.rightbar .rabbit-right-actions button:hover,
.rightbar .rabbit-rightbar-head > button:hover{
  background:#fff!important;
  transform:translateY(-1px)!important;
}

/* Il dock resta chiaramente separato dal fondo colorato della rightbar. */
#rabbitUnifiedHub{
  border-color:rgba(255,255,255,.72)!important;
  box-shadow:0 18px 46px rgba(12,65,105,.24)!important;
}

/* ---------- Drawer responsive ---------- */
@media (max-width:1180px){
  .mobile-drawer-panel{
    background:var(--rabbit-sidebar-gradient)!important;
    border-right:1px solid rgba(255,255,255,.48)!important;
    box-shadow:22px 0 55px rgba(10,57,96,.28)!important;
  }

  .mobile-drawer-panel::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    pointer-events:none!important;
    background:
      radial-gradient(circle at 10% 4%,rgba(255,255,255,.24),transparent 25%),
      radial-gradient(circle at 90% 94%,rgba(255,255,255,.14),transparent 30%)!important;
  }

  .mobile-drawer-head,
  .mobile-drawer-nav,
  .mobile-safe-spacer{
    position:relative!important;
    z-index:1!important;
  }

  .mobile-drawer-head{
    border-bottom-color:rgba(255,255,255,.28)!important;
  }

  .mobile-drawer-head > button,
  .mobile-drawer-nav button{
    color:var(--rabbit-sidebar-ink)!important;
    background:rgba(255,255,255,.92)!important;
    border-color:rgba(255,255,255,.72)!important;
    box-shadow:0 9px 20px rgba(12,65,105,.15),inset 0 1px 0 rgba(255,255,255,.92)!important;
  }

  .mobile-drawer-nav button.active{
    color:#0d527d!important;
    background:linear-gradient(135deg,#fff,#e8fffa)!important;
    box-shadow:inset 3px 3px 7px rgba(46,126,157,.13),inset -3px -3px 7px #fff!important;
  }

  .rabbit-mobile-nav-group > b{
    color:#fff!important;
    text-shadow:0 1px 2px rgba(9,48,82,.24)!important;
  }

  .mobile-drawer-nav hr{
    border-top-color:rgba(255,255,255,.32)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .sidebar .rabbit-v106-nav button,
  .rightbar button{
    transform:none!important;
  }
}
