/* eSIM48 Custom Styles */

/* RTL support */
[dir="rtl"] .rtl\:text-right { text-align: right; }
[dir="rtl"] .rtl\:left-0 { left: 0; }
[dir="rtl"] .rtl\:right-auto { right: auto; }
[dir="rtl"] .rtl\:ml-auto { margin-left: auto; margin-right: 0; }
[dir="rtl"] .rtl\:mr-auto { margin-right: auto; margin-left: 0; }
[dir="rtl"] .rtl\:flex-row-reverse { flex-direction: row-reverse; }

/* Smooth scrolling */
html { scroll-behavior: smooth; }

/* Hero gradient */
.hero-gradient {
  background: linear-gradient(135deg, #1e3a5f 0%, #2563eb 50%, #3b82f6 100%);
}

/* Card hover */
.package-card {
  transition: transform 0.2s, box-shadow 0.2s;
}
.package-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

/* Country card */
.country-card {
  transition: transform 0.15s, box-shadow 0.15s;
}
.country-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

/* Search results dropdown */
.search-results {
  max-height: 400px;
  overflow-y: auto;
}

/* Toast notification */
.cart-toast {
  transition: opacity 0.3s ease;
}

/* Skeleton loader */
.skeleton {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 8px;
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* Usage bar animation */
.usage-bar {
  transition: width 0.5s ease;
}

/* Footer */
footer a:hover {
  text-decoration: underline;
}

/* Mobile menu */
.mobile-menu {
  transition: max-height 0.3s ease, opacity 0.3s ease;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
}
.mobile-menu.open {
  max-height: 400px;
  opacity: 1;
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #a1a1a1; }

/* Print QR code */
@media print {
  .no-print { display: none !important; }
  .print-only { display: block !important; }
}