/*
 * betbahai Multi-Skin System (Light Theme)
 * Each skin redefines all color variables on body.skin-{name}
 * Default skin = no class needed (uses :root values from core.css)
 */

/* ========================================
   Skin: Navy Blue
   Light navy-tinted background & gold accent.
   ======================================== */
body.skin-emerald-gold {
  --color-primary: #f0f3f8;
  --color-secondary: #f5c518;
  --color-light: #e0e6ef;
  --color-black: #19325c;
  --color-dark: #19325c;
  --color-accent: #187abf;
  --color-gray: #7a8ba0;
  --color-main: #f0f3f8;
  --color-main-mid: #e0e6ef;
  --color-main-light: #d0d8e5;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #19325c;
  --color-main-card: #f5c518;
  --color-card-dark: #ffffff;
  --color-gradient-start: #e0e6ef;
  --button-gradient: linear-gradient(180deg, #f5c518, #f5c518 55%, #d4a014);
}

/* ========================================
   Skin: Royal Blue
   Light blue background & gold accents.
   ======================================== */
body.skin-royal-blue {
  --color-primary: #eef1fa;
  --color-secondary: #e8b930;
  --color-light: #dde3f2;
  --color-black: #0b1a3e;
  --color-dark: #111827;
  --color-accent: #c49a20;
  --color-gray: #9ca3af;
  --color-main: #eef1fa;
  --color-main-mid: #dde3f2;
  --color-main-light: #ccd5ea;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #0b1a3e;
  --color-main-card: #e8b930;
  --color-card-dark: #ffffff;
  --color-gradient-start: #dde3f2;
  --button-gradient: linear-gradient(180deg, #e8b930, #e8b930 55%, #c49a20);
}

/* ========================================
   Skin: Crimson Night
   Light rose-tinted background with red accents.
   ======================================== */
body.skin-crimson-night {
  --color-primary: #faf3f3;
  --color-secondary: #e63946;
  --color-light: #f0e0e0;
  --color-black: #1a0a0a;
  --color-dark: #2a1010;
  --color-accent: #d42d3a;
  --color-gray: #a8a0a0;
  --color-main: #faf3f3;
  --color-main-mid: #f0e0e0;
  --color-main-light: #e5d0d0;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #1a0a0a;
  --color-main-card: #e63946;
  --color-card-dark: #ffffff;
  --color-gradient-start: #f0e0e0;
  --button-gradient: linear-gradient(180deg, #e63946, #e63946 55%, #c22e3a);
}

/* ========================================
   Skin: Midnight Purple
   Light purple background with cyan highlights.
   ======================================== */
body.skin-midnight-purple {
  --color-primary: #f3f0fa;
  --color-secondary: #00c4d6;
  --color-light: #e2daf2;
  --color-black: #160b2e;
  --color-dark: #1a1229;
  --color-accent: #6b3fd4;
  --color-gray: #9e97ad;
  --color-main: #f3f0fa;
  --color-main-mid: #e2daf2;
  --color-main-light: #d2c8e8;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #160b2e;
  --color-main-card: #00c4d6;
  --color-card-dark: #ffffff;
  --color-gradient-start: #e2daf2;
  --button-gradient: linear-gradient(180deg, #00c4d6, #00c4d6 55%, #00a0b3);
}

/* ========================================
   Skin: Crypto Noir
   Light neutral background & Bitcoin orange.
   ======================================== */
body.skin-crypto-noir {
  --color-primary: #f5f5f5;
  --color-secondary: #fcb92a;
  --color-light: #e8e8e8;
  --color-black: #1a1a1a;
  --color-dark: #2a2a2a;
  --color-accent: #e5a520;
  --color-gray: #757575;
  --color-main: #f5f5f5;
  --color-main-mid: #e8e8e8;
  --color-main-light: #dcdcdc;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #1a1a1a;
  --color-main-card: #fcb92a;
  --color-card-dark: #ffffff;
  --color-gradient-start: #e8e8e8;
  --button-gradient: linear-gradient(180deg, #fcb92a, #fcb92a 55%, #d67a0b);
}

/* ========================================
   Skin: Vegas Luxury
   Light warm background & champagne gold.
   ======================================== */
body.skin-vegas-luxury {
  --color-primary: #faf8f2;
  --color-secondary: #d4af37;
  --color-light: #f0ede2;
  --color-black: #1a1a1a;
  --color-dark: #2a2a2a;
  --color-accent: #c49a20;
  --color-gray: #8c8c8c;
  --color-main: #faf8f2;
  --color-main-mid: #f0ede2;
  --color-main-light: #e5e0d2;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #1a1a1a;
  --color-main-card: #d4af37;
  --color-card-dark: #ffffff;
  --color-gradient-start: #f0ede2;
  --button-gradient: linear-gradient(180deg, #d4af37, #d4af37 55%, #aa8c2c);
}

/* ========================================
   Skin: Neon Cyber
   Light cool background & electric cyan/pink.
   ======================================== */
body.skin-neon-cyber {
  --color-primary: #f2f3f8;
  --color-secondary: #00c8d4;
  --color-light: #e2e4f0;
  --color-black: #0b0c15;
  --color-dark: #141626;
  --color-accent: #cc00cc;
  --color-gray: #7d8296;
  --color-main: #f2f3f8;
  --color-main-mid: #e2e4f0;
  --color-main-light: #d2d5e5;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #0b0c15;
  --color-main-card: #00c8d4;
  --color-card-dark: #ffffff;
  --color-gradient-start: #e2e4f0;
  --button-gradient: linear-gradient(180deg, #cc00cc, #cc00cc 55%, #a800a8);
}

/* ========================================
   Skin: Sports Green
   Light green background & vibrant lime.
   ======================================== */
body.skin-sports-green {
  --color-primary: #f0f8f2;
  --color-secondary: #28cc10;
  --color-light: #e0f0e2;
  --color-black: #0a2615;
  --color-dark: #13331f;
  --color-accent: #5ecc4e;
  --color-gray: #6a8c6a;
  --color-main: #f0f8f2;
  --color-main-mid: #e0f0e2;
  --color-main-light: #d0e5d2;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #0a2615;
  --color-main-card: #28cc10;
  --color-card-dark: #ffffff;
  --color-gradient-start: #e0f0e2;
  --button-gradient: linear-gradient(180deg, #28cc10, #28cc10 55%, #22a80e);
}

/* ========================================
   Skin: Atlantic Blue
   Light blue background & corporate blue.
   ======================================== */
body.skin-atlantic-blue {
  --color-primary: #f0f6fc;
  --color-secondary: #0098c0;
  --color-light: #dfeaf5;
  --color-black: #003366;
  --color-dark: #004e92;
  --color-accent: #3abcdb;
  --color-gray: #7a99b3;
  --color-main: #f0f6fc;
  --color-main-mid: #dfeaf5;
  --color-main-light: #cddded;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #003366;
  --color-main-card: #0098c0;
  --color-card-dark: #ffffff;
  --color-gradient-start: #dfeaf5;
  --button-gradient: linear-gradient(180deg, #0098c0, #0098c0 55%, #007a9c);
}

/* ========================================
   Skin: Slate & Ruby
   Light slate background with yellow accent.
   ======================================== */
body.skin-slate-ruby {
  --color-primary: #f2f3f6;
  --color-secondary: #d4bc0f;
  --color-light: #e2e4ec;
  --color-black: #2b2d42;
  --color-dark: #2b2d42;
  --color-accent: #d4bc0f;
  --color-gray: #8d99ae;
  --color-main: #f2f3f6;
  --color-main-mid: #e2e4ec;
  --color-main-light: #d2d5e0;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #2b2d42;
  --color-main-card: #d4bc0f;
  --color-card-dark: #ffffff;
  --color-gradient-start: #e2e4ec;
  --button-gradient: linear-gradient(180deg, #d4bc0f, #d4bc0f 55%, #b09e0c);
}

/* ========================================
   Skin: Solar Flare
   Light warm background with orange/yellow.
   ======================================== */
body.skin-solar-flare {
  --color-primary: #faf6f0;
  --color-secondary: #ffaa00;
  --color-light: #f0e8d8;
  --color-black: #3d1c02;
  --color-dark: #4d2605;
  --color-accent: #e09500;
  --color-gray: #a68b72;
  --color-main: #faf6f0;
  --color-main-mid: #f0e8d8;
  --color-main-light: #e5dac8;
  --color-header: #ffffff;
  --color-mobile-menu: #ffffff;
  --color-main-title: #3d1c02;
  --color-main-card: #ffaa00;
  --color-card-dark: #ffffff;
  --color-gradient-start: #f0e8d8;
  --button-gradient: linear-gradient(180deg, #ffaa00, #ffaa00 55%, #cc8800);
}