/**
 * Anime Island Shop - Main Pastel Tokyo Pop CSS Stylesheet
 * استایل‌های اختصاصی، متغیرهای رنگی، انیمیشن‌های کیوت و فونت‌ها
 */

:root {
  --color-surface: #fdf8ff;
  --color-surface-dim: #ddd7e8;
  --color-surface-bright: #fdf8ff;
  --color-surface-container-lowest: #ffffff;
  --color-surface-container-low: #f7f1ff;
  --color-surface-container: #f1ebfc;
  --color-surface-container-high: #ebe5f6;
  --color-surface-container-highest: #e6e0f1;
  --color-on-surface: #1c1a26;
  --color-on-surface-variant: #4a454c;
  --color-outline: #7c757d;
  --color-outline-variant: #ccc4cc;
  --color-primary: #180a22;
  --color-primary-container: #2e1f38;
  --color-primary-fixed: #f2dafc;
  --color-primary-fixed-dim: #d5bfe0;
  --color-secondary: #b90e4f;
  --color-secondary-container: #ff4d80;
  --color-secondary-fixed: #ffd9de;
  --color-secondary-fixed-dim: #ffb2bf;
  --color-tertiary: #1d0c00;
  --color-tertiary-fixed: #ffdcc1;
  --color-tertiary-fixed-dim: #ffb778;
}

/* عمومی و فونت */
body {
  font-family: 'Vazirmatn', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, sans-serif;
  background-color: var(--color-surface);
  color: var(--color-on-surface);
  direction: rtl;
  text-align: right;
  overflow-x: hidden;
}

/* اسکرول بار نرم و شیک */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f7f1ff;
}
::-webkit-scrollbar-thumb {
  background: #d5bfe0;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #ff4d80;
}

/* انیمیشن‌های اختصاصی */
@keyframes float {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-8px) rotate(1.5deg); }
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 15px rgba(255, 77, 128, 0.2); }
  50% { box-shadow: 0 0 25px rgba(255, 77, 128, 0.45); }
}

@keyframes heartbeat {
  0%, 100% { transform: scale(1); }
  25% { transform: scale(1.18); }
  50% { transform: scale(0.95); }
  75% { transform: scale(1.12); }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes sparkle {
  0%, 100% { opacity: 0.3; transform: scale(0.8) rotate(0deg); }
  50% { opacity: 1; transform: scale(1.2) rotate(180deg); }
}

.animate-float {
  animation: float 4s ease-in-out infinite;
}

.animate-pulse-glow {
  animation: pulseGlow 2.5s infinite;
}

.animate-heartbeat {
  animation: heartbeat 0.8s ease-in-out;
}

.animate-fade-in {
  animation: fadeIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-sparkle {
  animation: sparkle 3s ease-in-out infinite;
}

/* کارت‌های اسکویرکل انیمه‌ای */
.kawaii-card {
  background: #ffffff;
  border: 1px solid rgba(46, 31, 56, 0.08);
  border-radius: 1.25rem;
  box-shadow: 0 4px 16px rgba(46, 31, 56, 0.04);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.kawaii-card:hover {
  transform: translateY(-4px);
  border-color: rgba(255, 77, 128, 0.25);
  box-shadow: 0 12px 28px rgba(255, 77, 128, 0.12), 0 2px 6px rgba(46, 31, 56, 0.04);
}

/* گلس مورفیسم */
.glassmorphism {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.5);
}

/* توست نوتیفیکیشن اختصاصی */
#toast-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  gap: 12px;
  pointer-events: none;
}

.kawaii-toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  background: #ffffff;
  border-radius: 9999px;
  box-shadow: 0 10px 30px rgba(46, 31, 56, 0.15);
  border: 1px solid rgba(255, 77, 128, 0.25);
  animation: fadeIn 0.3s ease-out;
  max-width: 380px;
}

.kawaii-toast.success {
  border-left: 4px solid #10b981;
}

.kawaii-toast.error {
  border-left: 4px solid #f43f5e;
}

/* استایل فاکتور برای چاپ */
@media print {
  body { background: #fff !important; }
  header, footer, nav, .no-print { display: none !important; }
  .print-only { display: block !important; }
}