/* ==========================================================================
   THEME PALETTES & ATMOSPHERIC GRADIENTS (10 PRESETS)
   Each theme sets rich, subtle, premium unisex gradients & colors.
   ========================================================================== */

/* 1. Original Deep Plum & Rose Velvet (Текущий) */
:root, html[data-theme="1"], body[data-theme="1"] {
  --theme-id: "1";
  --theme-name: "Deep Plum & Velvet Rose";

  --brand-primary: #4F2049;
  --brand-primary-rgb: 79, 32, 73;
  --brand-hover: #67265F;
  --brand-pastel: #A86F9C;
  --brand-light: #F4EBF2;
  --brand-border: rgba(79, 32, 73, 0.16);

  --btn-gradient-primary: linear-gradient(135deg, #74256F 0%, #4F2049 100%);
  --btn-gradient-hover: linear-gradient(135deg, #8A3084 0%, #5E1756 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(79, 32, 73, 0.38), 0 4px 10px rgba(79, 32, 73, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(228, 208, 238, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(243, 218, 235, 0.8) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(253, 222, 237, 0.7) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(230, 212, 240, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #E8DCF3 0%, #F5ECF6 30%, #FDE7F2 70%, #F5E5F2 100%);

  --ink-primary: #231622;
  --ink-secondary: #5E4E5D;
  --ink-muted: #8C6F89;
  --ink-light: #BCA3B9;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(79, 32, 73, 0.12);
  --shadow-card: 0 10px 28px -4px rgba(79, 32, 73, 0.08), 0 3px 10px rgba(79, 32, 73, 0.04);
}

/* 2. Aurora Mindfulness (Точная реплика cabinet-variant2-aurora) */
html[data-theme="2"], body[data-theme="2"] {
  --theme-id: "2";
  --theme-name: "Aurora Royal Blue & Lavender";

  --brand-primary: #387AF6;
  --brand-primary-rgb: 56, 122, 246;
  --brand-hover: #2566E2;
  --brand-pastel: #7C6AF6;
  --brand-light: #EFF4FE;
  --brand-border: rgba(56, 122, 246, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #4485FD 0%, #2A6CF5 100%);
  --btn-gradient-hover: linear-gradient(135deg, #5492FE 0%, #3575F6 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(56, 122, 246, 0.45), 0 4px 10px rgba(56, 122, 246, 0.25);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(215, 226, 255, 0.75) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(240, 222, 255, 0.75) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(254, 235, 245, 0.7) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(225, 218, 255, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #EBE6FA 0%, #F5F1FD 32%, #FDF4F8 70%, #FDEBF4 100%);

  --ink-primary: #171725;
  --ink-secondary: #575775;
  --ink-muted: #8E8EA8;
  --ink-light: #B8B9CB;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(56, 122, 246, 0.12);
  --shadow-card: 0 14px 34px -4px rgba(67, 56, 120, 0.08), 0 4px 12px rgba(67, 56, 120, 0.04);
}

/* 3. Nordic Calm Slate / Steel Blue (Точно как на фото референса 1 + градиент Aurora) */
html[data-theme="3"], body[data-theme="3"] {
  --theme-id: "3";
  --theme-name: "Nordic Slate & Ice Haze";

  --brand-primary: #3E5A73;
  --brand-primary-rgb: 62, 90, 115;
  --brand-hover: #31495E;
  --brand-pastel: #728FA6;
  --brand-light: #EBF1F6;
  --brand-border: rgba(62, 90, 115, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #4A6E8C 0%, #354E64 100%);
  --btn-gradient-hover: linear-gradient(135deg, #577E9E 0%, #3C5770 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(62, 90, 115, 0.36), 0 4px 10px rgba(62, 90, 115, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(206, 222, 237, 0.75) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(225, 236, 246, 0.8) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(235, 243, 250, 0.75) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(215, 228, 240, 0.7) 0px, transparent 50%),
                   linear-gradient(180deg, #E2ECF5 0%, #EEF4F9 35%, #F4F8FB 70%, #E9F1F7 100%);

  --ink-primary: #1C2833;
  --ink-secondary: #4A5B6B;
  --ink-muted: #7E90A0;
  --ink-light: #B4C4D2;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(62, 90, 115, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(45, 68, 90, 0.08), 0 4px 12px rgba(45, 68, 90, 0.04);
}

/* 4. Sage Eucalyptus & Forest Mist (Природный премиальный эвкалипт / чай) */
html[data-theme="4"], body[data-theme="4"] {
  --theme-id: "4";
  --theme-name: "Sage Eucalyptus & Forest Mist";

  --brand-primary: #2C5E4A;
  --brand-primary-rgb: 44, 94, 74;
  --brand-hover: #224B3B;
  --brand-pastel: #5F917C;
  --brand-light: #EBF4F0;
  --brand-border: rgba(44, 94, 74, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #37735B 0%, #24503E 100%);
  --btn-gradient-hover: linear-gradient(135deg, #42856A 0%, #2A5D49 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(44, 94, 74, 0.36), 0 4px 10px rgba(44, 94, 74, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(212, 235, 224, 0.75) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(230, 244, 237, 0.8) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(240, 248, 244, 0.75) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(220, 238, 230, 0.7) 0px, transparent 50%),
                   linear-gradient(180deg, #E5F1EB 0%, #F1F7F4 35%, #F7FAF8 70%, #E8F3EE 100%);

  --ink-primary: #192C23;
  --ink-secondary: #425B50;
  --ink-muted: #738F84;
  --ink-light: #AEC5BB;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(44, 94, 74, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(35, 75, 60, 0.08), 0 4px 12px rgba(35, 75, 60, 0.04);
}

/* 5. Cashmere Sand & Silk Warmth (Теплый кашемир, песок и шампань) */
html[data-theme="5"], body[data-theme="5"] {
  --theme-id: "5";
  --theme-name: "Cashmere Sand & Warm Silk";

  --brand-primary: #6D4C3D;
  --brand-primary-rgb: 109, 76, 61;
  --brand-hover: #583C2F;
  --brand-pastel: #A58273;
  --brand-light: #F7EFEA;
  --brand-border: rgba(109, 76, 61, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #87604F 0%, #5E4032 100%);
  --btn-gradient-hover: linear-gradient(135deg, #996D5A 0%, #6D4A3A 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(109, 76, 61, 0.35), 0 4px 10px rgba(109, 76, 61, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(247, 234, 224, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(252, 242, 235, 0.85) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(255, 248, 242, 0.8) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(245, 232, 222, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #F3E7DC 0%, #FAF3ED 35%, #FDF9F5 70%, #F5EAE1 100%);

  --ink-primary: #2C211B;
  --ink-secondary: #5D4D44;
  --ink-muted: #8E7B71;
  --ink-light: #C4B5AC;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(109, 76, 61, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(95, 65, 52, 0.08), 0 4px 12px rgba(95, 65, 52, 0.04);
}

/* 6. Deep Ocean Indigo & Sea Salt (Спокойный глубокий морской индиго) */
html[data-theme="6"], body[data-theme="6"] {
  --theme-id: "6";
  --theme-name: "Deep Ocean & Crystal Salt";

  --brand-primary: #1E3A5F;
  --brand-primary-rgb: 30, 58, 95;
  --brand-hover: #162C4A;
  --brand-pastel: #4F709C;
  --brand-light: #EBF2FA;
  --brand-border: rgba(30, 58, 95, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #274D7E 0%, #173356 100%);
  --btn-gradient-hover: linear-gradient(135deg, #305B92 0%, #1D3D65 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(30, 58, 95, 0.38), 0 4px 10px rgba(30, 58, 95, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(208, 225, 247, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(228, 239, 252, 0.85) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(240, 247, 255, 0.8) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(215, 230, 248, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #E3EEFB 0%, #EFF5FD 35%, #F7FAFE 70%, #E8F1FC 100%);

  --ink-primary: #122135;
  --ink-secondary: #3C4F67;
  --ink-muted: #6F849F;
  --ink-light: #ABBDD3;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(30, 58, 95, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(25, 48, 80, 0.08), 0 4px 12px rgba(25, 48, 80, 0.04);
}

/* 7. Mineral Graphite & Pearl White (Премиальный швейцарский минимализм графит/жемчуг) */
html[data-theme="7"], body[data-theme="7"] {
  --theme-id: "7";
  --theme-name: "Graphite Minimalist & Pearl";

  --brand-primary: #2B2D33;
  --brand-primary-rgb: 43, 45, 51;
  --brand-hover: #1E1F24;
  --brand-pastel: #686B75;
  --brand-light: #F0F1F4;
  --brand-border: rgba(43, 45, 51, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #3F424B 0%, #202227 100%);
  --btn-gradient-hover: linear-gradient(135deg, #4C505A 0%, #282A30 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(43, 45, 51, 0.35), 0 4px 10px rgba(43, 45, 51, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(226, 229, 235, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(238, 240, 244, 0.85) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(246, 247, 250, 0.8) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(230, 233, 238, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #E6E8ED 0%, #F1F3F6 35%, #F8F9FA 70%, #EBEDF2 100%);

  --ink-primary: #15161A;
  --ink-secondary: #454750;
  --ink-muted: #797C87;
  --ink-light: #B4B7C2;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(43, 45, 51, 0.12);
  --shadow-card: 0 12px 30px -4px rgba(35, 37, 42, 0.08), 0 4px 12px rgba(35, 37, 42, 0.04);
}

/* 8. Terracotta Dusk & Amber Glow (Терракотовый закат, благородная охра) */
html[data-theme="8"], body[data-theme="8"] {
  --theme-id: "8";
  --theme-name: "Terracotta Dusk & Amber";

  --brand-primary: #753B2F;
  --brand-primary-rgb: 117, 59, 47;
  --brand-hover: #5F2F25;
  --brand-pastel: #B26E60;
  --brand-light: #F8EEEB;
  --brand-border: rgba(117, 59, 47, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #914B3D 0%, #683025 100%);
  --btn-gradient-hover: linear-gradient(135deg, #A45546 0%, #76372B 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(117, 59, 47, 0.36), 0 4px 10px rgba(117, 59, 47, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(250, 230, 224, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(253, 239, 234, 0.85) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(255, 246, 243, 0.8) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(248, 228, 222, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #F6E2DB 0%, #FAF0EB 35%, #FDF7F5 70%, #F7E7E1 100%);

  --ink-primary: #301712;
  --ink-secondary: #62423B;
  --ink-muted: #957068;
  --ink-light: #C8ACA5;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(117, 59, 47, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(105, 52, 41, 0.08), 0 4px 12px rgba(105, 52, 41, 0.04);
}

/* 9. Lavender Mist & Amethyst Serenity (Нежная аметистовая лаванда) */
html[data-theme="9"], body[data-theme="9"] {
  --theme-id: "9";
  --theme-name: "Amethyst Serenity & Lavender";

  --brand-primary: #52386E;
  --brand-primary-rgb: 82, 56, 110;
  --brand-hover: #402B57;
  --brand-pastel: #8467A6;
  --brand-light: #F2ECF7;
  --brand-border: rgba(82, 56, 110, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #6B4C8F 0%, #473060 100%);
  --btn-gradient-hover: linear-gradient(135deg, #7C5AA4 0%, #51376D 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(82, 56, 110, 0.36), 0 4px 10px rgba(82, 56, 110, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(234, 222, 247, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(244, 235, 252, 0.85) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(251, 245, 255, 0.8) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(232, 219, 245, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #EBE0F6 0%, #F5EDFA 35%, #FAF5FD 70%, #EFE4F8 100%);

  --ink-primary: #211530;
  --ink-secondary: #514065;
  --ink-muted: #826E97;
  --ink-light: #B8A8CC;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(82, 56, 110, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(72, 48, 98, 0.08), 0 4px 12px rgba(72, 48, 98, 0.04);
}

/* 10. Matcha Jade & Morning Dew (Мягкий матча-жадеит, умиротворение и спа) */
html[data-theme="10"], body[data-theme="10"] {
  --theme-id: "10";
  --theme-name: "Matcha Jade & Morning Dew";

  --brand-primary: #3B543F;
  --brand-primary-rgb: 59, 84, 63;
  --brand-hover: #2D4231;
  --brand-pastel: #6D8E73;
  --brand-light: #EDF3EE;
  --brand-border: rgba(59, 84, 63, 0.18);

  --btn-gradient-primary: linear-gradient(135deg, #4B6B50 0%, #304634 100%);
  --btn-gradient-hover: linear-gradient(135deg, #597D5F 0%, #3A543E 100%);
  --shadow-btn-primary: 0 10px 24px -2px rgba(59, 84, 63, 0.35), 0 4px 10px rgba(59, 84, 63, 0.2);

  --bg-mesh-full: radial-gradient(at 0% 0%, rgba(222, 236, 224, 0.8) 0px, transparent 55%),
                   radial-gradient(at 100% 0%, rgba(235, 245, 237, 0.85) 0px, transparent 50%),
                   radial-gradient(at 100% 100%, rgba(245, 251, 246, 0.8) 0px, transparent 55%),
                   radial-gradient(at 0% 100%, rgba(220, 235, 223, 0.75) 0px, transparent 50%),
                   linear-gradient(180deg, #E2EEE4 0%, #EEF6F0 35%, #F6FAF7 70%, #E6F1E9 100%);

  --ink-primary: #18261B;
  --ink-secondary: #455648;
  --ink-muted: #748877;
  --ink-light: #ABC0AF;

  --surface-card: #FFFFFF;
  --border-subtle: rgba(59, 84, 63, 0.13);
  --shadow-card: 0 12px 30px -4px rgba(48, 70, 52, 0.08), 0 4px 12px rgba(48, 70, 52, 0.04);
}