/*
 * Tailwind Utilities — Extracted for Production
 * @package Zamanpour_Excoin_Theme
 * Version: 3.0.0
 *
 * Contains ONLY the Tailwind utility classes used in header.php, footer.php,
 * and theme.js ticker generation. Replaces CDN dependency.
 */

/* ═══════════════════════════════════════════
   CUSTOM PROPERTIES — Aliases to --zpex-* master system
   ═══════════════════════════════════════════ */

:root {
  --tw-color-obsidian: var(--zpex-primary, #0A0A0F);
  --tw-color-charcoal: var(--zpex-surface, #131318);
  --tw-color-champagne: var(--zpex-accent-2, #A68B5C);
  --tw-color-gold: var(--zpex-accent, #C9A84C);
  --tw-color-cream: var(--zpex-text, #EDEDEF);
  --tw-shadow-gold: var(--zpex-shadow-gold, 0 0 32px -8px rgba(201,168,76,0.3));
}

[data-theme="light"] {
  --tw-color-obsidian: var(--zpex-primary, #FAF9F6);
  --tw-color-charcoal: var(--zpex-surface, #F0EDE8);
  --tw-color-champagne: var(--zpex-accent-2, #7A6B3D);
  --tw-color-gold: var(--zpex-accent, #9A7B2F);
  --tw-color-cream: var(--zpex-text, #1A1A1E);
  --tw-shadow-gold: var(--zpex-shadow-gold, 0 0 32px -8px rgba(154,123,47,0.2));
}
@media (prefers-color-scheme: light) {
  html[data-theme="system"] {
    --tw-color-obsidian: var(--zpex-primary, #FAF9F6);
    --tw-color-charcoal: var(--zpex-surface, #F0EDE8);
    --tw-color-champagne: var(--zpex-accent-2, #7A6B3D);
    --tw-color-gold: var(--zpex-accent, #9A7B2F);
    --tw-color-cream: var(--zpex-text, #1A1A1E);
    --tw-shadow-gold: var(--zpex-shadow-gold, 0 0 32px -8px rgba(154,123,47,0.2));
  }
}

[data-theme="light"] {
  --tw-color-obsidian: #FAF9F6;
  --tw-color-charcoal: #F0EDE8;
  --tw-color-champagne: #7A6B3D;
  --tw-color-gold: #9A7B2F;
  --tw-color-cream: #1A1A1E;
  --tw-shadow-gold: 0 0 32px -8px rgba(154,123,47,0.2);
}
@media (prefers-color-scheme: light) {
  html[data-theme="system"] {
    --tw-color-obsidian: #FAF9F6;
    --tw-color-charcoal: #F0EDE8;
    --tw-color-champagne: #7A6B3D;
    --tw-color-gold: #9A7B2F;
    --tw-color-cream: #1A1A1E;
    --tw-shadow-gold: 0 0 32px -8px rgba(154,123,47,0.2);
  }
}

/* ═══════════════════════════════════════════
   SELECTION
   ═══════════════════════════════════════════ */

::selection {
  background-color: var(--tw-color-gold);
  color: var(--tw-color-obsidian);
}

/* ═══════════════════════════════════════════
   ANTI-ALIASED
   ═══════════════════════════════════════════ */

.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ═══════════════════════════════════════════
   DISPLAY
   ═══════════════════════════════════════════ */

.flex { display: flex; }
.block { display: block; }

/* ═══════════════════════════════════════════
   FLEXBOX
   ═══════════════════════════════════════════ */

.flex-1 { flex: 1 1 0%; }
.shrink-0 { flex-shrink: 0; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }

/* ═══════════════════════════════════════════
   SIZING
   ═══════════════════════════════════════════ */

.w-full { width: 100%; }
.w-max { width: max-content; }
.w-1\.5 { width: 6px; }
.w-5 { width: 20px; }
.w-12 { width: 48px; }
.h-full { height: 100%; }
.h-1\.5 { height: 6px; }
.h-9 { height: 36px; }
.h-5 { height: 20px; }
.h-12 { height: 48px; }

/* ═══════════════════════════════════════════
   SPACING
   ═══════════════════════════════════════════ */

.gap-1\.5 { gap: 6px; }
.gap-10 { gap: 40px; }
.px-4 { padding-inline: 16px; }
.pt-9 { padding-top: 36px; }
.pl-10 { padding-inline-start: 40px; }
.bottom-6 { bottom: 24px; }
.right-6 { right: 24px; }

/* ═══════════════════════════════════════════
   POSITION
   ═══════════════════════════════════════════ */

.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.inset-0 { inset: 0; }
.inset-x-0 { left: 0; right: 0; }
.inset-y-0 { top: 0; bottom: 0; }
.top-0 { top: 0; }
.z-10 { z-index: 10; }
.z-40 { z-index: 40; }
.z-50 { z-index: 50; }
.z-\[60\] { z-index: 60; }
.-z-10 { z-index: -10; }

/* ═══════════════════════════════════════════
   TYPOGRAPHY
   ═══════════════════════════════════════════ */

.uppercase { text-transform: uppercase; }
.whitespace-nowrap { white-space: nowrap; }
.text-\[10px\] { font-size: 10px; }
.tracking-\[0\.2em\] { letter-spacing: 0.2em; }

/* ═══════════════════════════════════════════
   COLORS — Theme palette
   ═══════════════════════════════════════════ */

.bg-obsidian { background-color: var(--tw-color-obsidian); }
.bg-obsidian\/90 { background-color: rgba(11,12,16,0.9); }
.bg-charcoal\/70 { background-color: rgba(31,40,51,0.7); }
.bg-gold { background-color: var(--tw-color-gold); }
.text-cream { color: var(--tw-color-cream); }
.text-gold { color: var(--tw-color-gold); }
.text-champagne\/80 { color: rgba(197,168,128,0.8); }
.text-obsidian { color: var(--tw-color-obsidian); }
.text-cream\/70 { color: rgba(244,244,246,0.7); }
.text-cream\/60 { color: rgba(244,244,246,0.6); }
.text-cream\/50 { color: rgba(244,244,246,0.5); }
.text-cream\/40 { color: rgba(244,244,246,0.4); }
.text-cream\/30 { color: rgba(244,244,246,0.3); }
.text-champagne\/40 { color: rgba(197,168,128,0.4); }
.text-champagne\/70 { color: rgba(197,168,128,0.7); }

/* Ticker dynamic classes */
.ticker-up { color: var(--zpex-ticker-up, #7BA668); }
.ticker-down { color: var(--zpex-ticker-down, #B87A68); }

/* Additional ticker utilities */
.bg-obsidian\/80 { background-color: rgba(11,12,16,0.8); }
.bg-gold\/8 { background-color: rgba(201,168,76,0.08); }
.border-gold\/10 { border-color: rgba(201,168,76,0.1); }
.text-champagne\/70 { color: rgba(197,168,128,0.7); }
.backdrop-blur-md { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }

/* ═══════════════════════════════════════════
   BORDERS
   ═══════════════════════════════════════════ */

.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-r { border-inline-end-width: 1px; border-inline-end-style: solid; }
.border-gold\/15 { border-color: rgba(229,193,88,0.15); }
.rounded-full { border-radius: 9999px; }

/* ═══════════════════════════════════════════
   EFFECTS
   ═══════════════════════════════════════════ */

.opacity-0 { opacity: 0; }
.opacity-60 { opacity: 0.6; }
.opacity-90 { opacity: 0.9; }
.backdrop-blur { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.mix-blend-overlay { mix-blend-mode: overlay; }
.pointer-events-none { pointer-events: none; }
.overflow-hidden { overflow: hidden; }
.will-change-transform { will-change: transform; }
.shadow-gold { box-shadow: var(--tw-shadow-gold); }

/* ═══════════════════════════════════════════
   GLASS-STRONG (Custom utility)
   ═══════════════════════════════════════════ */

.glass-strong {
  background: rgba(11,12,16,0.6);
  backdrop-filter: blur(24px) saturate(160%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  border: 1px solid rgba(229,193,88,0.18);
}

/* ═══════════════════════════════════════════
   NOISE BACKGROUND (Custom utility)
   ═══════════════════════════════════════════ */

.bg-noise {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
}

/* ═══════════════════════════════════════════
   RTL SUPPORT
   ═══════════════════════════════════════════ */

[dir="rtl"] .rtl\:right-auto { right: auto; }
[dir="rtl"] .rtl\:left-6 { left: 24px; }
[dir="ltr"] .ltr\:hidden { display: none; }

/* Logical property utilities — auto-flip in RTL */
.ms-auto { margin-inline-start: auto; }
.me-auto { margin-inline-end: auto; }
.pe-4 { padding-inline-end: 16px; }
.ps-4 { padding-inline-start: 16px; }
.border-s { border-inline-start-width: 1px; border-inline-start-style: solid; }
.border-e { border-inline-end-width: 1px; border-inline-end-style: solid; }
.border-bs { border-block-start-width: 1px; border-block-start-style: solid; }
.border-be { border-block-end-width: 1px; border-block-end-style: solid; }

/* ═══════════════════════════════════════════
   TICKER-SPECIFIC
   ═══════════════════════════════════════════ */

.inline-flex { display: inline-flex; }
.gap-2 { gap: 8px; }
.text-xs { font-size: 12px; line-height: 16px; }
.font-semibold { font-weight: 600; }
.tracking-wide { letter-spacing: 0.025em; }
.text-\[11px\] { font-size: 11px; }

/* ═══════════════════════════════════════════
   RESPONSIVE (sm breakpoint = 640px)
   ═══════════════════════════════════════════ */

@media (min-width: 640px) {
  .sm\:text-\[13px\] { font-size: 13px; }
}

/* ═══════════════════════════════════════════
   BODY CLASSES
   ═══════════════════════════════════════════ */

body.rtl,
body.ltr {
  background-color: var(--tw-color-obsidian);
  color: var(--tw-color-cream);
}

/* ═══════════════════════════════════════════
   LIGHT THEME — Use custom properties instead of hardcoded colors
   ═══════════════════════════════════════════ */

[data-theme="light"] .bg-obsidian\/90 { background-color: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 90%, transparent); }
[data-theme="light"] .bg-obsidian\/85 { background-color: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 85%, transparent); }
[data-theme="light"] .bg-charcoal\/70 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 70%, transparent); }
[data-theme="light"] .bg-charcoal\/40 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 40%, transparent); }
[data-theme="light"] .bg-charcoal\/30 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 30%, transparent); }
[data-theme="light"] .bg-charcoal\/10 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 10%, transparent); }
[data-theme="light"] .border-gold\/15 { border-color: var(--zpex-border, rgba(154,123,47,0.15)); }
[data-theme="light"] .border-gold\/40 { border-color: var(--zpex-border-strong, rgba(154,123,47,0.4)); }
[data-theme="light"] .text-champagne\/80 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 80%, transparent); }
[data-theme="light"] .text-champagne\/50 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 50%, transparent); }
[data-theme="light"] .text-gold { color: var(--zpex-accent, #9A7B2F); }
[data-theme="light"] .text-gold\/80 { color: color-mix(in srgb, var(--zpex-accent, #9A7B2F) 80%, transparent); }
[data-theme="light"] .text-gold\/40 { color: color-mix(in srgb, var(--zpex-accent, #9A7B2F) 40%, transparent); }
[data-theme="light"] .bg-gold { background-color: var(--zpex-accent, #9A7B2F); }
[data-theme="light"] .text-cream { color: var(--zpex-text, #1A1A1E); }
[data-theme="light"] .text-cream\/70 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 70%, transparent); }
[data-theme="light"] .text-cream\/60 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 60%, transparent); }
[data-theme="light"] .text-cream\/55 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 55%, transparent); }
[data-theme="light"] .text-cream\/50 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 50%, transparent); }
[data-theme="light"] .text-cream\/40 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 40%, transparent); }
[data-theme="light"] .text-cream\/30 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 30%, transparent); }
[data-theme="light"] .text-champagne\/70 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 70%, transparent); }
[data-theme="light"] .text-champagne\/40 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 40%, transparent); }
[data-theme="light"] .border-gold\/20 { border-color: var(--zpex-border, rgba(154,123,47,0.2)); }
[data-theme="light"] .from-obsidian\/70 { --tw-gradient-from: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 70%, transparent); }
[data-theme="light"] .from-obsidian\/50 { --tw-gradient-from: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 50%, transparent); }
[data-theme="light"] .to-obsidian\/20 { --tw-gradient-to: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 20%, transparent); }
[data-theme="light"] .to-obsidian\/10 { --tw-gradient-to: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 10%, transparent); }

@media (prefers-color-scheme: light) {
  html[data-theme="system"] .bg-obsidian\/90 { background-color: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 90%, transparent); }
  html[data-theme="system"] .bg-obsidian\/85 { background-color: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 85%, transparent); }
  html[data-theme="system"] .bg-charcoal\/70 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 70%, transparent); }
  html[data-theme="system"] .bg-charcoal\/40 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 40%, transparent); }
  html[data-theme="system"] .bg-charcoal\/30 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 30%, transparent); }
  html[data-theme="system"] .bg-charcoal\/10 { background-color: color-mix(in srgb, var(--zpex-surface, #F0EDE8) 10%, transparent); }
  html[data-theme="system"] .border-gold\/15 { border-color: var(--zpex-border, rgba(154,123,47,0.15)); }
  html[data-theme="system"] .border-gold\/40 { border-color: var(--zpex-border-strong, rgba(154,123,47,0.4)); }
  html[data-theme="system"] .text-champagne\/80 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 80%, transparent); }
  html[data-theme="system"] .text-champagne\/50 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 50%, transparent); }
  html[data-theme="system"] .text-gold { color: var(--zpex-accent, #9A7B2F); }
  html[data-theme="system"] .text-gold\/80 { color: color-mix(in srgb, var(--zpex-accent, #9A7B2F) 80%, transparent); }
  html[data-theme="system"] .text-gold\/40 { color: color-mix(in srgb, var(--zpex-accent, #9A7B2F) 40%, transparent); }
  html[data-theme="system"] .bg-gold { background-color: var(--zpex-accent, #9A7B2F); }
  html[data-theme="system"] .text-cream { color: var(--zpex-text, #1A1A1E); }
  html[data-theme="system"] .text-cream\/70 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 70%, transparent); }
  html[data-theme="system"] .text-cream\/60 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 60%, transparent); }
  html[data-theme="system"] .text-cream\/55 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 55%, transparent); }
  html[data-theme="system"] .text-cream\/50 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 50%, transparent); }
  html[data-theme="system"] .text-cream\/40 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 40%, transparent); }
  html[data-theme="system"] .text-cream\/30 { color: color-mix(in srgb, var(--zpex-text, #1A1A1E) 30%, transparent); }
  html[data-theme="system"] .text-champagne\/70 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 70%, transparent); }
  html[data-theme="system"] .text-champagne\/40 { color: color-mix(in srgb, var(--zpex-accent-2, #7A6B3D) 40%, transparent); }
  html[data-theme="system"] .border-gold\/20 { border-color: var(--zpex-border, rgba(154,123,47,0.2)); }
  html[data-theme="system"] .from-obsidian\/70 { --tw-gradient-from: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 70%, transparent); }
  html[data-theme="system"] .from-obsidian\/50 { --tw-gradient-from: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 50%, transparent); }
  html[data-theme="system"] .to-obsidian\/20 { --tw-gradient-to: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 20%, transparent); }
  html[data-theme="system"] .to-obsidian\/10 { --tw-gradient-to: color-mix(in srgb, var(--zpex-primary, #FAF9F6) 10%, transparent); }
}
