* {
  font-family: 'Vazirmatn', sans-serif !important;
}
/* ==========================================================================
   ۱. فونت الماس (اختصاصی)
   ========================================================================== */
@font-face {
  font-family: 'Almas';
  src: local('Almas'), local('almas'); 
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   ۲. متغیرهای مک‌بوک و iOS (تم شیشه‌ای خیره‌کننده با گرادیانت مدرن)
   ========================================================================== */
:root {
  --primary-color: #0ea5e9; 
  --primary-gradient: linear-gradient(135deg, #0ea5e9, #3b82f6);
  
  --bg-gradient: linear-gradient(135deg, #e0f2fe 0%, #c7d2fe 100%);
  --card-bg: rgba(255, 255, 255, 0.45); 
  --input-bg: rgba(255, 255, 255, 0.65);
  --text-main: #0f172a; 
  --text-muted: #334155;
  
  --border-color: rgba(255, 255, 255, 0.7); 
  --inset-highlight: rgba(255, 255, 255, 0.9);
  --glass-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  
  --bottom-nav-height: calc(70px + env(safe-area-inset-bottom));
}

[data-theme="dark"] {
  --primary-color: #38bdf8; 
  --primary-gradient: linear-gradient(135deg, #0284c7, #3b82f6);
  
  --bg-gradient: linear-gradient(135deg, #0f172a 0%, #312e81 100%);
  --card-bg: rgba(15, 23, 42, 0.55); 
  --input-bg: rgba(0, 0, 0, 0.45);
  --text-main: #f8fafc; 
  --text-muted: #cbd5e1; 
  
  --border-color: rgba(255, 255, 255, 0.15); 
  --inset-highlight: rgba(255, 255, 255, 0.05);
  --glass-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}

/* ==========================================================================
   ۲.۵. تم انجین (Theme Engine Overrides) - پالت‌های رنگی هوشمند
   ========================================================================== */
.text-primary { color: var(--primary-color) !important; }
.border-primary { border-color: var(--primary-color) !important; }
.bg-primary { background: var(--primary-gradient) !important; }
.btn-outline-primary { color: var(--primary-color) !important; border-color: var(--primary-color) !important; }
.btn-outline-primary:hover { background: var(--primary-gradient) !important; color: #fff !important; }

/* 🟢 Emerald Finance (سبز مالی) */
[data-color="emerald"] { --primary-color: #10b981; --primary-gradient: linear-gradient(135deg, #10b981, #059669); }
[data-theme="dark"][data-color="emerald"] { --primary-color: #34d399; --primary-gradient: linear-gradient(135deg, #059669, #047857); }

/* 🟣 Purple Glass (بنفش مدرن) */
[data-color="purple"] { --primary-color: #8b5cf6; --primary-gradient: linear-gradient(135deg, #8b5cf6, #6d28d9); }
[data-theme="dark"][data-color="purple"] { --primary-color: #a78bfa; --primary-gradient: linear-gradient(135deg, #7c3aed, #5b21b6); }

/* 🟠 Warm Professional (نارنجی/مسی) */
[data-color="warm"] { --primary-color: #f97316; --primary-gradient: linear-gradient(135deg, #f97316, #ea580c); }
[data-theme="dark"][data-color="warm"] { --primary-color: #fb923c; --primary-gradient: linear-gradient(135deg, #ea580c, #c2410c); }

/* 🌌 Cyber Tech (فیروزه‌ای/سایبری) */
[data-color="cyber"] { --primary-color: #06b6d4; --primary-gradient: linear-gradient(135deg, #06b6d4, #0891b2); }
[data-theme="dark"][data-color="cyber"] { --primary-color: #22d3ee; --primary-gradient: linear-gradient(135deg, #0891b2, #164e63); }

/* دکمه‌های انتخاب رنگ در تنظیمات */
.theme-swatch { width: 45px; height: 45px; border-radius: 50%; cursor: pointer; border: 3px solid var(--card-bg); box-shadow: 0 4px 10px rgba(0,0,0,0.2); transition: transform 0.2s; position: relative; }
.theme-swatch:hover { transform: scale(1.15); z-index: 10; }

/* ==========================================================================
   ۳. بدنه نرم‌افزار و بهینه‌سازی وضوح متن (Anti-aliasing)
   ========================================================================== */
body {
  font-family: 'Almas', 'Vazirmatn', Tahoma, sans-serif; 
  background: var(--bg-gradient) !important;
  background-attachment: fixed !important;
  color: var(--text-main);
  transition: background 0.6s ease, color 0.4s ease; 
  overflow-x: hidden;
  line-height: 1.8;
  margin: 0;
  min-height: 100vh;
  
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

.text-dark { 
  color: var(--text-main) !important; 
  text-shadow: 0px 0px 3px rgba(255,255,255,0.8), 0px 1px 1px rgba(255,255,255,1) !important; 
  font-weight: 800 !important;
}

[data-theme="dark"] .text-dark { 
  text-shadow: 0px 0px 4px rgba(0,0,0,0.9), 0px 1px 2px rgba(0,0,0,1) !important; 
}

.text-muted { font-weight: 700 !important; }
.fw-bold { font-weight: 800 !important; }

.bi::before, [class^="bi-"]::before, [class*=" bi-"]::before {
  font-family: bootstrap-icons !important;
}

/* ==========================================================================
   ۴. کلاس کلیدی Glassmorphism
   ========================================================================== */
.glass-panel {
  background: var(--card-bg) !important;
  backdrop-filter: blur(25px) saturate(180%);
  -webkit-backdrop-filter: blur(25px) saturate(180%);
  border: 1px solid var(--border-color) !important;
  box-shadow: var(--glass-shadow), inset 0 1px 1px var(--inset-highlight) !important;
  border-radius: 1.5rem;
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease;
}

.glass-btn {
  background: var(--input-bg) !important;
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  font-weight: 800 !important;
}
.glass-btn:hover { 
  background: var(--card-bg) !important; 
  color: var(--text-main) !important;
}

.form-control, .form-select, .glass-input-group .input-group-text { 
  background-color: var(--input-bg) !important; 
  color: var(--text-main) !important; 
  border: 1px solid var(--border-color) !important; 
  border-radius: 0.75rem; 
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  font-weight: 700;
  transition: all 0.3s ease;
}

.form-control:focus, .form-select:focus {
  border-color: var(--primary-color) !important;
  background-color: var(--card-bg) !important;
  box-shadow: 0 0 0 4px rgba(14, 165, 233, 0.25) !important;
  transform: translateY(-2px);
}

/* ==========================================================================
   ۵. انیمیشن ورود سینمایی
   ========================================================================== */
.form-container { display: none; margin-bottom: 2rem; padding: 2rem; }
.form-container.active-form { display: block; animation: fadeUp 0.5s ease forwards; }

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

.hero-widget { animation: cinematicFadeIn 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.1s forwards; opacity: 0; }
.profit-card { animation: cinematicFadeIn 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.2s forwards; opacity: 0; }

@keyframes cinematicFadeIn {
  0% { opacity: 0; transform: translateY(30px) scale(0.98); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* ==========================================================================
   ۶. جداول شیشه‌ای
   ========================================================================== */
.glass-table-container { background: transparent !important; border: none !important; overflow: hidden; }
.glass-table th { background-color: rgba(0,0,0,0.05) !important; backdrop-filter: blur(10px); border-bottom: 2px solid var(--border-color) !important; color: var(--text-main) !important; }
.glass-table td { background-color: rgba(255,255,255,0.1) !important; border-bottom: 1px solid var(--border-color) !important; color: var(--text-main) !important; }
[data-theme="dark"] .glass-table td { background-color: rgba(0,0,0,0.15) !important; }
.table-hover tbody tr:hover td { background-color: rgba(14, 165, 233, 0.15) !important; }

/* ==========================================================================
   ۷. استایل‌های منوی بالای صفحه (Top Navbar) و دراپ‌داون‌های شیشه‌ای
   ========================================================================== */
.navbar {
  padding: 10px 20px;
  backdrop-filter: blur(25px) saturate(180%);
  -webkit-backdrop-filter: blur(25px) saturate(180%);
}
.nav-item .nav-link {
  color: var(--text-main) !important;
  font-weight: 800;
  padding: 10px 15px;
  border-radius: 12px;
  transition: all 0.3s ease;
  font-size: 0.95rem;
}
.nav-item .nav-link:hover {
  background: rgba(14, 165, 233, 0.15);
  color: var(--primary-color) !important;
}
.dropdown-menu {
  background: var(--card-bg) !important;
  backdrop-filter: blur(25px) saturate(180%);
  -webkit-backdrop-filter: blur(25px) saturate(180%);
  border: 1px solid var(--border-color) !important;
  box-shadow: var(--glass-shadow);
  border-radius: 1rem;
  padding: 10px;
  min-width: 220px;
  animation: fadeUp 0.3s ease;
}
.dropdown-item {
  color: var(--text-main);
  font-weight: 700;
  padding: 10px 15px;
  border-radius: 8px;
  transition: all 0.2s ease;
  font-size: 0.9rem;
}
.dropdown-item i {
  color: var(--primary-color);
  margin-left: 8px;
  font-size: 1.1rem;
}
.dropdown-item:hover {
  background: rgba(14, 165, 233, 0.1);
  color: var(--primary-color);
  transform: translateX(-5px);
}
.navbar-toggler {
  border-color: var(--border-color) !important;
}
.navbar-toggler:focus {
  box-shadow: none;
}

/* ==========================================================================
   ۸. دکمه‌ها و عناصر اختصاصی فرم
   ========================================================================== */
.btn-primary { background: var(--primary-gradient) !important; border: none !important; box-shadow: 0 6px 20px rgba(14, 165, 233, 0.4) !important; }
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 10px 25px rgba(14, 165, 233, 0.6) !important; }

.problem-badge { 
  cursor: pointer; 
  transition: all 0.2s; 
  background-color: var(--input-bg);
  color: var(--text-main);
  border: 1px solid var(--border-color);
}
.problem-badge:hover { 
  background-color: var(--primary-color) !important; 
  color: white !important; 
  transform: scale(1.05); 
  border-color: var(--primary-color) !important;
}

.profit-amount, .entry-amount { text-shadow: 0px 2px 8px rgba(0,0,0,0.3); letter-spacing: 1px; }

/* ==========================================================================
   ۹. لایه ورود و لاگین
   ========================================================================== */
.login-overlay { 
  position: fixed; top: 0; left: 0; width: 100%; height: 100%; 
  background: rgba(0,0,0,0.4); backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px);
  z-index: 9999; display: flex; align-items: center; justify-content: center; 
}
.login-card { border: 1px solid var(--border-color) !important; border-radius: 2rem !important; }

/* ==========================================================================
   ۱۰. چاپگر (لیزری)
   ========================================================================== */
@media print {
  @page { size: A5 landscape; margin: 0 !important; } 
  html, body { background: #ffffff !important; color: #000000 !important; overflow: hidden !important; background-image: none !important; } 
  #loginOverlay, header, .navbar, .no-print { display: none !important; } 
  .container { display: block !important; padding: 0 !important; margin: 0 !important; max-width: 100% !important; }
  .form-container:not(#receiptContainer) { display: none !important; }
  
  #receiptContainer { display: block !important; position: absolute !important; left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; background: #fff !important; z-index: 9999 !important; } 
  .receipt-box { box-shadow: none !important; border: none !important; padding: 5px !important; margin: 0 !important; background: none !important; }
  
  h4#dynamicStoreName { font-size: 15px !important; margin-bottom: 2px !important; color: #000 !important; }
  p { margin-bottom: 2px !important; line-height: 1.3 !important; color: #000 !important; }
  
  .table { margin-bottom: 8px !important; border-color: #000 !important; background: #fff !important; }
  .table th, .table td { padding: 3px 5px !important; font-size: 10.5px !important; border: 1px solid #000 !important; color: #000 !important; }
  .qr-code-box { width: 50px !important; height: 50px !important; border: 1px solid #000 !important; padding: 2px !important; }
  .row.g-2 { margin-bottom: 8px !important; }
  .p-2.border { padding: 4px !important; border: 1px solid #000 !important; }
  
  .perforation-line { margin: 10px 0 5px 0 !important; border-top: 1px dashed #000 !important; position: relative; }
  .perforation-line::before { content: '✂️ (محل برش)'; position: absolute; top: -9px; right: 30px; font-size: 10px; background: #fff; padding: 0 5px; color: #000; font-weight: bold; }
  .perforation-box { padding: 6px !important; border: 1px solid #000 !important; background-color: #fff !important; }

  * { text-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  .text-primary, .text-danger, .text-success, .text-info, .text-warning, .text-muted, .text-secondary { color: #000000 !important; }
  .bg-light { background-color: transparent !important; }
}

/* ==========================================================================
   ۱۱. رفع مشکل کلیک و هاور در منوی آبشاری (تضمین کارکرد)
   ========================================================================== */
@media all and (min-width: 992px) {
  .navbar .nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
    opacity: 1;
    visibility: visible;
  }
}

.navbar-nav .dropdown-menu {
  pointer-events: auto !important;
  z-index: 99999 !important;
}

.navbar {
  z-index: 1050 !important;
}