/* =========================================================
   برچسب‌ساز دانش‌آموز — استایل پایه (تبدیل از TypeScript/React)
   فایل اصلی: src/index.css
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&family=Changa:wght@600;700&family=Harmattan:wght@600;700&family=Katibeh&family=Lalezar&family=Marhey:wght@600;700&family=Reem+Kufi+Fun:wght@600;700&family=Vazirmatn:wght@300;400;500;600;700;800;900&family=Zeyada&display=swap');

:root {
  --font-vazir: 'Vazirmatn', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-lalezar: 'Lalezar', cursive, system-ui;
  --font-dastnevis: 'Katibeh', 'Marhey', 'Reem Kufi Fun', cursive, sans-serif;
  --font-marhey: 'Marhey', cursive, sans-serif;
  --font-harmattan: 'Harmattan', serif, sans-serif;
  --color-slate-50: #f8fafc;
  --color-slate-100: #f1f5f9;
  --color-slate-200: #e2e8f0;
  --color-slate-300: #cbd5e1;
  --color-slate-400: #94a3b8;
  --color-slate-500: #64748b;
  --color-slate-600: #475569;
  --color-slate-700: #334155;
  --color-slate-800: #1e293b;
  --color-slate-900: #0f172a;
  --color-blue-50: #eff6ff;
  --color-blue-100: #dbeafe;
  --color-blue-200: #bfdbfe;
  --color-blue-500: #3b82f6;
  --color-blue-600: #2563eb;
  --color-blue-700: #1d4ed8;
  --color-indigo-600: #4f46e5;
  --color-purple-600: #9333ea;
  --radius-xl: 0.75rem;
  --radius-2xl: 1rem;
  --radius-3xl: 1.5rem;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  direction: rtl;
  scroll-behavior: smooth;
}

html, body {
  margin: 0;
  padding: 0;
  min-height: 100%;
}

body {
  font-family: var(--font-vazir);
  background: #f1f5f9;
  color: #0f172a;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.selection-brand ::selection {
  background: #3b82f6;
  color: #fff;
}

img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: 0.5; }
input, select, textarea { font-family: inherit; }

.font-lalezar { font-family: var(--font-lalezar); }
.font-vazir { font-family: var(--font-vazir); }
.font-dastnevis { font-family: var(--font-dastnevis); }
.font-marhey { font-family: var(--font-marhey); }
.font-harmattan { font-family: var(--font-harmattan); }

.no-print {}
.print-only { display: none; }

/* Custom scrollbars — مطابق src/index.css */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.scrollbar-none::-webkit-scrollbar { display: none; }
.scrollbar-none { -ms-overflow-style: none; scrollbar-width: none; }

@keyframes fade-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes scale-up {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes scaleUp {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}

.animate-fade-in,
.animate-fadeIn { animation: fade-in 0.18s ease-out; }
.animate-scale-up,
.animate-scaleUp { animation: scale-up 0.22s ease-out; }

/* A4 print — مطابق src/index.css */
@page {
  size: A4 portrait;
  margin: 0mm;
}

@media print {
  *, *::before, *::after {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    text-rendering: optimizeLegibility !important;
  }
  svg {
    shape-rendering: geometricPrecision !important;
    text-rendering: geometricPrecision !important;
    image-rendering: high-quality !important;
  }
  img {
    image-rendering: high-quality !important;
    image-rendering: -webkit-optimize-contrast !important;
  }
  html, body {
    width: 210mm !important;
    height: 297mm !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  .no-print { display: none !important; }
  .print-only { display: block !important; }
  .a4-sheet-container {
    box-shadow: none !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 210mm !important;
    min-height: 297mm !important;
    max-height: 297mm !important;
    page-break-after: always;
    page-break-inside: avoid;
  }
}