/* ========== CSS VARIABLES ========== */
:root {
  /* Brand Colors */
  --color-1: #deadff;  /* Lavender */
  --color-2: #7e846b;  /* Olive Green */
  --color-3: #d97c5b;  /* Terracotta */
  --color-4: #fffe96;  /* Pale Yellow */
  --color-5: #4b4a48;  /* Charcoal Gray */
  --color-6: #b0c6ff;  /* Light Blue */
  --color-7: #ffaa89;  /* Salmon Pink */

  /* Semantic Colors (mapped to brand colors) */
  --primary-color: var(--color-1);         /* #deadff */
  --primary-color-hover: var(--color-6);   /* #86626e */
  --accent-color: var(--color-3);          /* #d97c5b */
  --button-color-dark: var(--color-5);     /* #4b4a48 */
  --button-color-light: #FFFFFF;

  /* Per-Page Colors (default) */
  --cat1-color: var(--color-3);       /* Default to Terracotta (#d97c5b) */
  --cat1-textcolor: inherit;          /* Page-specific text color */

  /* Badge Colors */
  --badge-new: var(--color-8);    /* #23b5d3 - Sky Blue */
  --badge-live: var(--color-1);   /* #deadff - Lavender */
  --badge-extra: var(--color-7);  /* #fb6107 - Orange */

  /* Message Colors */
  --message-success-bg: #d2f2fd;       /* Light Blue */
  --message-success-text: #20c0f6;     /* Blue */
  --message-success-button: #20c0f6;   /* Blue */

  --message-error-bg: #f0dcdb;         /* Light Red */
  --message-error-text: #941210;       /* Dark Red */
  --message-error-button: #c32830;     /* Red */

  --message-info-bg: #fcfaf6;          /* Light Beige */
  --message-info-text: #a19890;        /* Brown */
  --message-info-button: #605450;      /* Dark Brown */
}
/* ========== PER-PAGE COLOR OVERRIDES ========== */
/* for logo, title, menu, links, bold text & buttons */

/* Stillwissen */
body.page-id-156 {
    --cat1-color: #d97c5b; /* Terracotta */
}
/* Stillberatung individuell */
body.page-id-224 {
    --cat1-color: #ffaa89; /* Salmon Pink */
}
/* Yoga in der Schwangerschaft */
body.page-id-232 {
    --cat1-color: #b0c6ff; /* Light Blue */
}
/* Yoga postnatal / Yoga für Mamis */
body.page-id-234 {
    --cat1-color: #deadff; /* Lavender */
}
/* Wochenbett! Vorbereitung für Paare */
body.page-id-346 {
    --cat1-color: #7e846b; /* Olive Green */
}
/* Rückbildung */
body.page-id-226,
body.page-id-228,
body.page-id-230 {
    --cat1-color: #4b4a48; /* Charcoal Gray */
}


#top form.cart .button {
    background-color: var(--primary-color);
    color: var(--button-color-light);
}
#top form.cart .button:hover {
    background-color: var(--primary-color-hover);
    color: var(--button-color-light);
}

/* ===== BADGES ===== */
.new-badge {
    background-color: var(--badge-new);
    color: #fff;
}
.live-badge {
    background-color: var(--badge-live);
    color: #fff;
}
.extra-badge {
    background-color: var(--badge-extra);
    color: #fff;
}

#top .onsale,
#top .main_color .onsale {
    background-color: var(--primary-color);
}



/* ========== APPLY CUSTOM COLORS TO ELEMENTS ========== */
/* These apply --cat1-color to various elements.
   By default, --cat1-color uses Enfold's standard color.
   On specific pages (156, 224, 232, etc.), --cat1-color is overridden above. */

/* Logo Color */
.logo svg .cls-1,
.logo svg .st0 {
    fill: var(--cat1-color) !important;
}

/* Page Title Color */
.alternate_color.title_container .main-title,
.alternate_color.title_container .main-title a {
    color: var(--cat1-color) !important;
}

/* Menu Active Border */
.header_color .avia-menu-fx {
    background: var(--cat1-color) !important;
}

/* Bold Text */
.main_color strong,
.main_color strong a {
    color: var(--cat1-color) !important;
}

/* Buttons */
#top form.cart .button,
#top .avia-button {
    background-color: var(--cat1-color) !important;
}

.main_color .avia-color-theme-color,
.main_color .avia-color-theme-color:hover {
    border-color: var(--cat1-color) !important;
    background-color: var(--cat1-color) !important;
}

#top form.cart .button:hover {
    background-color: var(--cat1-color) !important;
    filter: brightness(0.9);
}

/* Links */
a {
    color: var(--cat1-color);
}