/* App theme (dark-first) - use app-specific variables and utility classes
   This file replaces usage of Telegram-specific utility classes like
   bg-telegram-bg / bg-telegram-secondary / bg-telegram-blue
   with app-specific equivalents: bg-app-bg, bg-app-secondary, bg-app-blue, text-app-blue, etc.
*/
 :root {
    --app-bg-color: #0b1220; /* page background */
    --app-surface-color: #111827; /* cards / surfaces */
    --app-secondary-bg-color: #191f2a; /* slightly lighter surface */
    --app-blue: #2b6cb0; /* primary action color */
    --app-accent: #16a34a; /* success / accents */
    --app-muted: #9aa5b1; /* hint / subdued text */
    --app-text: #e6eef6; /* primary text */
    --app-on-primary: #ffffff; /* text on primary buttons */
 }

/* Strong, broad selectors to ensure Telegram in-app browser (and other webviews)
   which may ignore stylesheet rules still receive the correct background.
   Use substring class selectors to catch variations like "bg-app-secondary/30".
*/

/*[class*="bg-app-secondary"] {
   background-color: var(--app-secondary-bg-color) !important;
}*/

/*[class*="bg-app-bg"] {
   background-color: var(--app-bg-color) !important;
}

[class*="bg-app-blue"] {
   background-color: var(--app-blue) !important;
}

[class*="bg-app-accent"] {
   background-color: var(--app-accent) !important;
}*/

/* Explicit utility classes (kept for non-Tailwind fallback) */
/*.bg-app-bg { background-color: var(--app-bg-color) !important; }
.bg-app-surface { background-color: var(--app-surface-color) !important; }
.bg-app-secondary { background-color: var(--app-secondary-bg-color) !important; }
.bg-app-blue { background-color: var(--app-blue) !important; }
.bg-app-accent { background-color: var(--app-accent) !important; }*/

/* Text utilities */
.text-app { color: var(--app-text) !important; }
.text-app-muted { color: var(--app-muted) !important; }
.text-app-blue { color: var(--app-blue) !important; }

/* Button helpers */
.btn-app { background-color: var(--app-blue) !important; color: var(--app-on-primary) !important; }
.btn-app:hover { filter: brightness(0.95); }

/* Extra: make sure important surfaces also render properly in strict webviews */
section, article, .card, .panel { background-color: transparent; }

/* Coin utilities */
.coin-gold { background: linear-gradient(45deg, #ffd700, #ffed4e) !important; }
.coin-silver { background: linear-gradient(45deg, #c0c0c0, #e8e8e8) !important; }

