/* Eva's Log · one of the app's six color families per page (owner,
   2026-10-03: "each page should be a different color used in the app").
   Values copied from EvasLog/Design/ElTheme.swift. On the light theme
   every family shares Daybreak's ivory paper, text and semantic colors
   and changes only the accents, as in the app; at night the page takes
   that family's whole dark palette. A page names its family with
   data-family on <html>: Home moonlit, Features ocean, Privacy and Terms
   midnight, Pricing ember, About rosewood, Support sage. */

:root[data-theme="daybreak"][data-family="moonlit"] {
  --primary: #69579C; --primary-dark: #5E4E8C; --primary-light: #8474B2;
  --secondary: #AD581E; --sleep-accent: #6854AC; --alert-accent: #C14126; --diaper-accent: #316C97; --growth-accent: #367C59;
  --family-wash: 24%;
}

:root[data-theme="daybreak"][data-family="ocean"] {
  --primary: #2F6A65; --primary-dark: #275854; --primary-light: #3F8D87;
  --secondary: #AD581E; --sleep-accent: #416588; --alert-accent: #C14126; --diaper-accent: #25717F; --growth-accent: #347C55;
  --family-wash: 24%;
}

:root[data-theme="daybreak"][data-family="rosewood"] {
  --primary: #944B65; --primary-dark: #834259; --primary-light: #B0627E;
  --secondary: #976432; --sleep-accent: #6D5A82; --alert-accent: #C14126; --diaper-accent: #3C6D87; --growth-accent: #3F7B54;
  --family-wash: 24%;
}

:root[data-theme="daybreak"][data-family="sage"] {
  --primary: #3F6B57; --primary-dark: #2F5344; --primary-light: #5E8A74;
  --secondary: #A85C33; --sleep-accent: #5F5490; --alert-accent: #B0503F; --diaper-accent: #2F6E93; --growth-accent: #2F7D57;
  --family-wash: 24%;
}

:root[data-theme="daybreak"][data-family="midnight"] {
  --primary: #37639C; --primary-dark: #305789; --primary-light: #487BBE;
  --secondary: #976432; --sleep-accent: #595BA3; --alert-accent: #C33E34; --diaper-accent: #2C6F85; --growth-accent: #387C52;
  --family-wash: 24%;
}

:root[data-theme="daybreak"][data-family="ember"] {
  --primary: #845924; --primary-dark: #704B1F; --primary-light: #AC742F;
  --secondary: #A95946; --sleep-accent: #6D5B7F; --alert-accent: #BB4539; --diaper-accent: #3F6F7F; --growth-accent: #417B49;
  --family-wash: 24%;
}

:root[data-family="moonlit"]:not([data-theme="daybreak"]) {
  --bg: #1A1530; --surface: #231E3D; --surface-elevated: #2D2750; --surface-overlay: #382F5E;
  --primary: #9B8EC0; --primary-dark: #7B6DAA; --primary-light: #BEB3D9;
  --secondary: #E8A87C; --sleep-accent: #8B7BBF; --alert-accent: #E89B8B; --diaper-accent: #7BAFD4; --growth-accent: #82C9A5;
  --success: #6DC78A; --error: #E74C5E; --warning: #E8B85C; --info: #7BAFD4;
  --text-primary: #F2EFF8; --text-secondary: #D4CDE4; --text-tertiary: #A49AC0; --text-quaternary: #7B7094;
  --family-wash: 20%;
  --divider: #322B52; --outline: #3D3566;
}

:root[data-family="ocean"]:not([data-theme="daybreak"]) {
  --bg: #0D1B2A; --surface: #152838; --surface-elevated: #1B3348; --surface-overlay: #234058;
  --primary: #5EB8B0; --primary-dark: #449E96; --primary-light: #8AD4CC;
  --secondary: #E8A87C; --sleep-accent: #7B9EC0; --alert-accent: #E89B8B; --diaper-accent: #6BC4D4; --growth-accent: #7EC9A0;
  --success: #6DC78A; --error: #E74C5E; --warning: #E8B85C; --info: #6BC4D4;
  --text-primary: #EDF3F5; --text-secondary: #BFD0DC; --text-tertiary: #8FA5B5; --text-quaternary: #64788C;
  --family-wash: 20%;
  --divider: #1E3A4E; --outline: #28506A;
}

:root[data-family="rosewood"]:not([data-theme="daybreak"]) {
  --bg: #1E1520; --surface: #2A1F2D; --surface-elevated: #362A3A; --surface-overlay: #423548;
  --primary: #C48B9F; --primary-dark: #A87088; --primary-light: #DCA8B8;
  --secondary: #D4A87C; --sleep-accent: #9B8AAE; --alert-accent: #E89B8B; --diaper-accent: #82B0C8; --growth-accent: #8CC4A0;
  --success: #6DC78A; --error: #E05A6B; --warning: #DEB060; --info: #82B0C8;
  --text-primary: #F5EDF0; --text-secondary: #DCC8D0; --text-tertiary: #B09AA4; --text-quaternary: #847078;
  --family-wash: 20%;
  --divider: #3A2D38; --outline: #4A3D48;
}

:root[data-family="sage"]:not([data-theme="daybreak"]) {
  --bg: #0F1923; --surface: #172331; --surface-elevated: #1F2D3D; --surface-overlay: #273847;
  --primary: #7EB8A0; --primary-dark: #5A9A80; --primary-light: #A3D4BC;
  --secondary: #F0B75B; --sleep-accent: #9B8EC0; --alert-accent: #E89B8B; --diaper-accent: #6BBCD4; --growth-accent: #A8D08D;
  --success: #4CAF50; --error: #E74C3C; --warning: #F39C12; --info: #5DADE2;
  --text-primary: #F5F5F7; --text-secondary: #C8D0DE; --text-tertiary: #96A1B4; --text-quaternary: #6A7284;
  --family-wash: 20%;
  --divider: #1F3A5F; --outline: #2A4A72;
}

:root[data-family="midnight"]:not([data-theme="daybreak"]) {
  --bg: #10141C; --surface: #181E2A; --surface-elevated: #212838; --surface-overlay: #2A3346;
  --primary: #7BA0D0; --primary-dark: #5E86B8; --primary-light: #A0BFE0;
  --secondary: #D4A87C; --sleep-accent: #8B8DC0; --alert-accent: #E0908A; --diaper-accent: #70B8D0; --growth-accent: #7CC498;
  --success: #6DC78A; --error: #E05A6B; --warning: #D8B060; --info: #70B8D0;
  --text-primary: #ECF0F5; --text-secondary: #BCC8D8; --text-tertiary: #8D9CB0; --text-quaternary: #677387;
  --family-wash: 20%;
  --divider: #1E2838; --outline: #2A3A52;
}

:root[data-family="ember"]:not([data-theme="daybreak"]) {
  --bg: #1A1410; --surface: #251E18; --surface-elevated: #302820; --surface-overlay: #3C3228;
  --primary: #D4A060; --primary-dark: #B8884A; --primary-light: #E8C08A;
  --secondary: #C48070; --sleep-accent: #A090B0; --alert-accent: #D88880; --diaper-accent: #80B0C0; --growth-accent: #88C090;
  --success: #78C488; --error: #D85858; --warning: #D8A850; --info: #80B0C0;
  --text-primary: #F5F0E8; --text-secondary: #D8C8B4; --text-tertiary: #AC9C88; --text-quaternary: #887866;
  --family-wash: 20%;
  --divider: #352C22; --outline: #453C30;
}