/* ----- Elegant style (Settings → Appearance) -----
   A calm look: soft colours, flat cards with hairline borders, one quiet accent colour, serif headings
   and no glows, sheens or shadows. settings.js sets body[data-style="elegant"]; the colour mode picks
   the light version (warm cream and deep green) or the dark one (charcoal green and sage). */

body[data-mode="light"][data-style="elegant"] {
    --accent: #1f3d2c;
    --accent-ink: #ffffff;
    --page-bg: #f5f3ee;
    --panel-bg: #fffefb;
    --soft-bg: #f0ede6;
    --muted-bg: #ebe7df;
    --border: #e2ddd3;
    --text: #1d2420;
    --muted-text: #6d716b;
    --elegant-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
}
/* Dark Elegant: deep charcoal green with soft sage, for colour mode Dark (or System at night). */
body[data-mode="dark"][data-style="elegant"] {
    --accent: #a9c49f;
    --accent-ink: #16201a;
    --page-bg: #151a16;
    --panel-bg: #1a201b;
    --soft-bg: #222923;
    --muted-bg: #1e251f;
    --border: #2b332c;
    --text: #e8ebe4;
    --muted-text: #8d968b;
    --elegant-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
}
body[data-mode="dark"][data-style="elegant"][data-theme="purple"] { --accent: #b9aacb; }
body[data-mode="dark"][data-style="elegant"][data-theme="blue"] { --accent: #a3bacb; }
body[data-mode="dark"][data-style="elegant"][data-theme="orange"] { --accent: #d0ad86; }
body[data-mode="dark"][data-style="elegant"][data-theme="red"] { --accent: #cf9d97; }
body[data-mode="dark"][data-style="elegant"][data-theme="yellow"] { --accent: #d2c08f; }
body[data-mode="dark"][data-style="elegant"][data-theme="grey"] { --accent: #b9beb8; }

/* Light Elegant themes: the accent themes become quiet versions of themselves: greens, browns, slate and plum. */
body[data-mode="light"][data-style="elegant"][data-theme="purple"] { --accent: #4a3a5e; }
body[data-mode="light"][data-style="elegant"][data-theme="blue"] { --accent: #24394f; }
body[data-mode="light"][data-style="elegant"][data-theme="orange"] { --accent: #6b4429; }
body[data-mode="light"][data-style="elegant"][data-theme="red"] { --accent: #6e3030; }
body[data-mode="light"][data-style="elegant"][data-theme="yellow"] { --accent: #5e4a22; }
body[data-mode="light"][data-style="elegant"][data-theme="grey"] { --accent: #3f4549; }

/* No glows or shadows anywhere. The :not(#elegant) counts as an ID in CSS priority, so this beats the
   page-specific light-mode shadows (like body[data-mode="light"].dashboard-page .stat-card). */
body[data-style="elegant"]:not(#elegant) *,
body[data-style="elegant"]:not(#elegant) *::before,
body[data-style="elegant"]:not(#elegant) *::after { text-shadow: none !important; box-shadow: none !important; }
body[data-style="elegant"] :is(.nav-link-coach, .nav-link-premium) .nav-icon svg,
body[data-style="elegant"] .social-like-button.is-liked .social-like-icon,
body[data-style="elegant"] :is(.emote, .level-road-emote, .social-emote-option-image) { filter: none; }

/* The Elegant version of the logo. Chrome and Safari swap it here before anything is drawn; settings.js
   also swaps the image file itself, which covers the other browsers. */
body[data-style="elegant"] .brand-logo { content: url("../images/zevrik-elegant.png"); }

/* Decorative lights, sheens and the page-wide aura are switched off. */
body[data-style="elegant"] :is(.performance-light-lines, .profile-page-aura),
body[data-style="elegant"] :is(.premium-surface, .nav-link-coach, .nav-link-premium, .social-post.is-premium-post)::after { display: none; }

/* Flat cards on the page, with a hairline border. */
body[data-style="elegant"] :is(
    .stat-card:not(.stat-card-highlight), .performance-metric, .performance-panel, .coach-panel, .profile-card,
    .profile-identity, .social-post, .settings-section, .saved-split, .workout-card, .premium-card, .premium-hero,
    .premium-feature, .information-intro, .information-guide-card, .information-policy, .train-today,
    .workout-overview > div
) {
    background: var(--panel-bg) !important;
    border-color: var(--border) !important;
}
body[data-style="elegant"] .profile-cover-accent { background: color-mix(in srgb, var(--accent) 6%, var(--panel-bg)); border-bottom-color: var(--border); }

/* Serif for headings and the big numbers, like a printed training log. */
body[data-style="elegant"] :is(h1, h2),
body[data-style="elegant"] :is(
    .stat-card p, .performance-metric-value, .profile-hero-stat strong, .workout-summary-stats strong,
    .workout-detail-stats strong, .split-stat strong, .coach-race-tile strong, .coach-weight-stat strong,
    .social-post-stats strong, .coach-review-metric strong, .coach-progress-metric strong
) {
    font-family: var(--elegant-serif);
    font-weight: 600;
    letter-spacing: -0.01em;
}
body[data-style="elegant"] h1 { font-weight: 600; }
/* Small labels that happen to be headings stay in the normal font. */
body[data-style="elegant"] .stat-card h2 { font-family: inherit; font-weight: 700; letter-spacing: normal; }