/* ═══════════════════════════════════════════════════════════
   SUNSET JUSTICE — GLOBAL COMPONENTS
   Custom Cursor + Royal Loader + Shared Styles
   Include این فایل در همه صفحات
   ═══════════════════════════════════════════════════════════ */

/* ────────────────────────────────
   CUSTOM CURSOR
──────────────────────────────── */
.cursor-outer {
  position: fixed;
  z-index: 99999;
  pointer-events: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid #c8a84b;
  transform: translate(-50%, -50%);
  transition: width 0.3s, height 0.3s, border-color 0.3s, opacity 0.3s;
  mix-blend-mode: difference;
}

.cursor-inner {
  position: fixed;
  z-index: 99999;
  pointer-events: none;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f5d878;
  transform: translate(-50%, -50%);
  transition: transform 0.1s;
}

body:hover .cursor-outer {
  opacity: 1;
}

/* Hide on mobile */
@media (max-width: 768px) {
  .cursor-outer,
  .cursor-inner {
    display: none;
  }
}

/* ────────────────────────────────
   ROYAL LOADER
──────────────────────────────── */
#globalLoader {
  position: fixed;
  inset: 0;
  z-index: 99998;
  background: linear-gradient(135deg, #0a0e27 0%, #050810 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.8s;
}

#globalLoader.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.loader-inner {
  text-align: center;
  position: relative;
}

.loader-seal {
  width: 140px;
  height: 140px;
  margin: 0 auto 2rem;
  position: relative;
  animation: sealRotate 12s linear infinite;
}

.loader-seal svg {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 0 20px rgba(200, 168, 75, 0.4));
}

.loader-seal-center {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: sealRotate 12s linear infinite reverse;
}

.loader-seal-center i {
  font-size: 2.5rem;
  color: #f5d878;
  filter: drop-shadow(0 0 12px rgba(200, 168, 75, 0.5));
}

@keyframes sealRotate {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

.loader-title {
  font-family: 'Vazirmatn', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 4px;
  color: #c8a84b;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.loader-subtitle {
  font-size: 0.85rem;
  color: #606880;
  letter-spacing: 1px;
  margin-bottom: 2rem;
}

.loader-bar-wrap {
  width: 240px;
  height: 3px;
  background: rgba(200, 168, 75, 0.15);
  border-radius: 9999px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}

.loader-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #8a6820, #f5d878, #8a6820);
  background-size: 200% 100%;
  border-radius: 9999px;
  animation: loaderFill 1.8s cubic-bezier(0.16, 1, 0.3, 1) forwards,
             goldShimmer 1.5s linear infinite;
}

@keyframes loaderFill {
  from { width: 0%; }
  to   { width: 100%; }
}

@keyframes goldShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ────────────────────────────────
   GRAIN OVERLAY (optional)
──────────────────────────────── */
.grain-overlay {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 180px 180px;
}