/* ============================================================
   views.css — استایل‌های view-specific که با کلاس literal/inline در JSX
   آمده‌اند (کارت‌های خاص، گرادیانت‌ها، بج‌ها، پلیر و…)
   تمام مقادیر از source/compiled CSS استخراج شده‌اند.
   ============================================================ */

/* ---------- سایه‌های literal از مودال‌ها (LoginModal / MenuDemoModal) ---------- */
.shadow-login-modal { box-shadow: 0 25px 70px rgba(0, 0, 0, 0.95), 0 0 40px rgba(212, 255, 0, 0.15); }
.shadow-login-icon { box-shadow: 0 0 20px rgba(212, 255, 0, 0.15); }
.shadow-login-cta { box-shadow: 0 0 20px rgba(212, 255, 0, 0.25); }
.shadow-demo-modal { box-shadow: 0 25px 70px rgba(0, 0, 0, 0.95), 0 0 50px rgba(212, 255, 0, 0.15); }
.shadow-music-icon { box-shadow: 0 0 25px rgba(212, 255, 0, 0.15); }
.shadow-wheel-cta { box-shadow: 0 0 20px rgba(212, 255, 0, 0.3); }

/* ---------- گرادیانت‌های literal ---------- */
.grad-rose-pink { background-image: linear-gradient(to right, #e11d48, #db2777); }
.grad-emerald-teal { background-image: linear-gradient(to right, #059669, #0d9488); }
.grad-emerald-teal-hover:hover { background-image: linear-gradient(to right, #10b981, #14b8a6); }
.grad-neutral-950 { background-image: linear-gradient(to right, #171717, #0a0a0a); }

/* ---------- hover bg های literal ---------- */
.hover\:bg-\#caf300:hover { background-color: #caf300; }
.hover\:bg-\#bce000:hover { background-color: #bce000; }
.hover\:bg-\#bde800:hover { background-color: #bde800; }
.hover\:bg-\#c4eb00:hover { background-color: #c4eb00; }
.hover\:bg-\[caf300\]:hover { background-color: #caf300; }

/* ---------- shadowهای نئون lime (literal) ---------- */
.shadow-lime-20 { box-shadow: 0 0 20px rgba(212, 255, 0, 0.2); }
.shadow-lime-25 { box-shadow: 0 0 20px rgba(212, 255, 0, 0.25); }
.shadow-lime-30 { box-shadow: 0 0 30px rgba(212, 255, 0, 0.3); }
.shadow-lime-40 { box-shadow: 0 0 20px rgba(212, 255, 0, 0.4); }
.shadow-lime-15 { box-shadow: 0 0 15px rgba(212, 255, 0, 0.2); }
.shadow-lime-35 { box-shadow: 0 10px 30px rgba(212, 255, 0, 0.35); }
.shadow-lime-banner { box-shadow: 0 0 40px rgba(212, 255, 0, 0.1); }
.shadow-lime-progress { box-shadow: 0 0 12px rgba(212, 255, 0, 0.8); }
.shadow-modal-login { box-shadow: 0 25px 70px rgba(0, 0, 0, 0.95), 0 0 40px rgba(212, 255, 0, 0.15); }
.shadow-modal-demo { box-shadow: 0 25px 70px rgba(0, 0, 0, 0.95), 0 0 50px rgba(212, 255, 0, 0.15); }
.shadow-hero-mockup { box-shadow: 0 25px 60px rgba(0, 0, 0, 0.9), 0 0 40px rgba(212, 255, 0, 0.15); }
.shadow-cart-bar { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35); }
.shadow-fcb { box-shadow: 0 10px 30px rgba(212, 255, 0, 0.35); }
.shadow-call-float { box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6); }
.shadow-bottom-nav { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); }
.shadow-bottom-nav-waiter { box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6); }
.shadow-cart-lime { box-shadow: 0 10px 30px rgba(212, 255, 0, 0.35); }
.shadow-admin-active { box-shadow: 0 0 20px rgba(212, 255, 0, 0.25); }
.shadow-badge-glow { box-shadow: 0 0 15px rgba(212, 255, 0, 0.2); }
.shadow-avatar-glow { box-shadow: 0 0 10px rgba(212, 255, 0, 0.3); }
.shadow-icon-box { box-shadow: 0 0 20px rgba(212, 255, 0, 0.15); }
.shadow-block-icon { box-shadow: 0 0 30px rgba(245, 158, 11, 0.15); }
.shadow-site-btn { box-shadow: 0 0 15px rgba(212, 255, 0, 0.25); }

/* ---------- بوم خاطرات (Memory Canvas) ---------- */
.memory-board {
  background-color: #090909;
  background-image: radial-gradient(circle, #2a2a2a 1.5px, transparent 1.5px);
  background-size: 24px 24px;
}
.sticky-card {
  position: absolute;
  width: 256px; /* w-64 */
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.45);
  user-select: none;
}
.sticky-card .sticky-pin {
  width: 14px; height: 14px; border-radius: 9999px;
  background: radial-gradient(circle at 35% 35%, #e5e5e5, #737373);
  box-shadow: 0 2px 4px rgba(0,0,0,0.5);
  margin: 0 auto 6px;
}

/* ---------- پلیر ---------- */
.audio-range { accent-color: #d4ff00; width: 100%; }
.audio-range-sm { accent-color: #d4ff00; }
.vinyl-spin { animation: spin 12s linear infinite; }
.disc-spin { animation: spin 4s linear infinite; }

/* ---------- range inputs ---------- */
input[type="range"].plain-range {
  -webkit-appearance: none; appearance: none;
  height: 4px; border-radius: 9999px; background: #262626;
  cursor: pointer;
}
input[type="range"].plain-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 14px; height: 14px; border-radius: 9999px; background: #d4ff00;
}

/* ---------- scrollbar hidden برای pills (compiled [&::-webkit-scrollbar]:hidden) ---------- */
.scrollbar-webkit-hidden::-webkit-scrollbar { display: none; }

/* ---------- wheel/prize گارد ---------- */
.pointer-none { pointer-events: none; }

/* ---------- Invoice ---------- */
#invoice-print-area { background: #ffffff; color: #000000; }

/* ---------- helpers حرکتی (motion خلاصه‌شده با CSS) ---------- */
.fade-in-view { opacity: 1; transform: none; }
.anim-fade-in { animation: animFadeIn 0.4s ease both; }
@keyframes animFadeIn { from { opacity: 0; } to { opacity: 1; } }

/* ---------- اسکرول میزهای گارسون ---------- */
.table-scroll { scrollbar-width: none; }
.table-scroll::-webkit-scrollbar { display: none; }

/* ---------- برچسب‌های ریپانسیو نمودار تحلیل ۲۴ساعته (پنل مجموعه) ---------- */
.anl-md-vis { visibility: hidden; }
.anl-sh { display: inline; }
.anl-lg { display: none; }
@media (min-width: 768px) {
  .anl-md-vis { visibility: visible; }
  .anl-sh { display: none; }
  .anl-lg { display: inline; }
}