/* Base helpers (بدون @apply تا با CDN سازگار باشه) */
  .nav-link{position:relative;border-radius:1rem;padding:.625rem 1rem;font-size:.875rem;font-weight:600;color:rgba(255,255,255,.9);transition:color .2s}
  .nav-link:hover{color:#fff}
  .nav-link::after{content:"";position:absolute;left:.75rem;right:.75rem;bottom:-2px;height:1px;transform:scaleX(0);transform-origin:center;transition:transform .2s;background:linear-gradient(90deg,rgba(96,165,250,.7),rgba(232,121,249,.7),rgba(244,114,182,.7))}
  .nav-link:hover::after{transform:scaleX(1)}
  .menu-item{display:flex;align-items:center;gap:.5rem;border-radius:.75rem;padding:.625rem .75rem;font-size:.875rem;color:rgba(255,255,255,.9);transition:background-color .2s,color .2s}
  .menu-item:hover{background:rgba(255,255,255,.10);color:#fff}
  .menu-item + .menu-item{margin-top:.375rem}
  .icon-btn{display:inline-flex;align-items:center;justify-content:center;height:2.5rem;width:2.5rem;border-radius:.75rem;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.10);color:#fff;transition:background .2s}
  .icon-btn:hover{background:rgba(255,255,255,.15)}
  .icon-btn:focus{outline:2px solid rgba(255,255,255,.3);outline-offset:2px}
  .mobile-item{display:flex;align-items:center;gap:.75rem;border-radius:.75rem;padding:.5rem .75rem;color:rgba(255,255,255,.9);transition:background .2s}
  .mobile-item:hover{background:rgba(255,255,255,.10)}
  .mobile-sub{display:block;border-radius:.5rem;padding:.5rem .75rem;font-size:.875rem;color:rgba(255,255,255,.8)}
  .mobile-sub:hover{background:rgba(255,255,255,.10)}

  /* حتماً منوی موبایل روی دسکتاپ مخفی */
  @media (min-width:768px){
    #mobile-drawer,#mobile-backdrop,#menu-toggle{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}
  }


/* Sidebar cards driven by body theme variables */
.sidebar-card{
  background: var(--card);
  border: 1px solid var(--card-border);
  color: var(--fg);
  border-radius: .75rem;         /* ~ rounded-lg */
  box-shadow: 0 1px 0 rgba(255,255,255,.06), 0 12px 28px -20px rgba(0,0,0,.45);
}

.sidebar-title{
  font-size: 1.25rem;            /* text-xl */
  font-weight: 700;              /* font-bold */
  margin-bottom: 1rem;           /* mb-4 */
  color: var(--accent);          /* به‌جای text-blue-300 */
}

.sidebar-link{
  color: var(--fg);
  transition: color .2s ease, transform .2s ease;
}
.sidebar-link:hover{
  color: var(--accent);
  transform: translateX(2px);
}

/* Ad box inside sidebars */
.sidebar-ad{
  background: color-mix(in oklab, var(--card) 70%, transparent);
  border: 1px dashed var(--card-border);
  border-radius: .75rem;
  color: var(--muted);
}

/* اگر hover-scale قبلاً داری، همونه؛ اگر نه: */
.hover-scale{ transition: transform .25s ease; }
.hover-scale:hover{ transform: translateY(-2px) scale(1.01); }

/* ===== Footer (theme-aware) ===== */
.footer-shell{
  background: color-mix(in oklab, var(--card) 92%, transparent);
  border-top: 1px solid var(--card-border);
  backdrop-filter: blur(12px);
  box-shadow: 0 -1px 0 rgba(0,0,0,.04) inset;
}
.footer-inner{
  max-width: 80rem; /* ~ max-w-7xl */
  margin-inline: auto;
  padding: 1rem; /* p-4 */
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 768px){
  .footer-inner{ flex-direction: row; align-items: center; justify-content: space-between; }
}
.footer-copy{
  color: var(--fg);
  opacity: .9;
  text-align: center;
}
@media (min-width: 768px){
  .footer-copy{ text-align: left; }
}
.footer-links{
  display: flex;
  gap: 1.5rem; /* space-x-6 */
  justify-content: center;
}
.footer-link{
  color: var(--fg);
  opacity: .95;
  text-decoration: none;
  position: relative;
  transition: color .2s ease, opacity .2s ease, transform .2s ease;
}
.footer-link::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -3px; height: 1px;
  transform: scaleX(0); transform-origin: center; transition: transform .2s ease;
  background: linear-gradient(90deg, rgba(37,99,235,.6), rgba(219,39,119,.6), rgba(37,99,235,.6));
}
.footer-link:hover{
  color: var(--accent);
  opacity: 1;
  transform: translateY(-1px);
}
.footer-link:hover::after{ transform: scaleX(1); }


  /* === Light Mode (body.theme-light) === */
  body.theme-light #nav-shell{
    background: rgba(255,255,255,0.92) !important;
    border-color: rgba(0,0,0,0.08) !important;
    box-shadow: 0 1px 0 rgba(0,0,0,0.06), 0 20px 40px -20px rgba(0,0,0,0.25) !important;
  }
  body.theme-light #nav-shell .nav-link,
  body.theme-light #nav-shell a,
  body.theme-light #nav-shell button{ color:#0f172a !important; }
  body.theme-light #nav-shell .nav-link:hover{ color:#0b1320 !important; }
  body.theme-light #nav-shell .nav-link::after{ background:linear-gradient(90deg,#2563eb66,#db277766,#2563eb66)!important; }
  body.theme-light #nav-shell .panel-btn{
    color:#0f172a !important; background:rgba(0,0,0,0.05)!important; border-color:rgba(0,0,0,0.08)!important;
  }
  body.theme-light #nav-shell .panel-btn:hover{ background:rgba(0,0,0,0.08)!important; }
  body.theme-light #nav-shell .group>div{
    background: rgba(255,255,255,0.96) !important; border-color: rgba(0,0,0,0.08) !important;
  }
  body.theme-light #nav-shell .menu-item{ color:#0f172a !important; }
  body.theme-light #nav-shell .menu-item:hover{ background:rgba(0,0,0,0.06)!important; color:#0b1320!important; }
  body.theme-light #nav-shell input[type="text"]{
    background: rgba(0,0,0,0.06) !important; color:#0f172a !important; border-color: rgba(0,0,0,0.08) !important;
  }
  body.theme-light #nav-shell input[type="text"]::placeholder{ color: rgba(15,23,42,.6)!important; }
  body.theme-light #nav-shell kbd{
    background: rgba(0,0,0,0.06)!important; color: rgba(15,23,42,.7)!important; border-color: rgba(0,0,0,0.10)!important;
  }

  /* Mobile drawer روشن */
  body.theme-light #mobile-drawer{
    background: rgba(255,255,255,0.98) !important;
    color:#0f172a !important; border-color: rgba(0,0,0,0.08) !important;
    box-shadow: 0 20px 60px -20px rgba(0,0,0,.25) !important;
  }
  body.theme-light #mobile-drawer i{ color:#0f172a !important; }
  body.theme-light #mobile-drawer .mobile-item,
  body.theme-light #mobile-drawer .mobile-sub{ color:#0f172a !important; }
  body.theme-light #mobile-drawer .mobile-item:hover,
  body.theme-light #mobile-drawer .mobile-sub:hover{ background: rgba(0,0,0,0.06) !important; }
  body.theme-light #mobile-drawer input[type="text"]{
    background: rgba(0,0,0,0.06) !important; color:#0f172a !important; border-color: rgba(0,0,0,0.10) !important;
  }
  body.theme-light #mobile-drawer input::placeholder{ color: rgba(15,23,42,.6) !important; }
  body.theme-light #drawer-close{ background: rgba(0,0,0,0.06) !important; border-color: rgba(0,0,0,0.10) !important; color:#0f172a !important; }
  body.theme-light #mobile-drawer .text-white\/90{ color:#0f172a !important; }