/*
 * bears-colors.css
 * Zentrale Farb- und Debug-Variablen (Design Tokens)
 * ------------------------------------------------------------
 * 
 * Wird als erstes geladen und stellt Farbwerte für alle
 * weiteren CSS-Dateien bereit (Layout, Overrides, Gutenberg).
 * 
 * c.schmidt@skatingbears.de
 */

/* ------------------------------------------------------------
   1. DESIGN-FARBEN (Deckungsgleich zu Gutenbergeditor,
      siehe auch bears-gutenberg-colors.php)
------------------------------------------------------------ */

:root {
    --bears-color-black: #000000;
    --bears-color-gray: #abb8c3;
    --bears-color-white: #ffffff;
    --bears-color-pale-pink: #f78da7;
    --bears-color-red: #cf2e2e;
    --bears-color-orange: #ff6900;
    --bears-color-amber: #fcb900;
    --bears-color-light-green: #7bdcb5;
    --bears-color-green: #00d084;
    --bears-color-light-blue: #8ed1fc;
    --bears-color-blue: #0a51a1;
    --bears-color-purple: #9b51e0;
}

/* ------------------------------------------------------------
   1a. DEBUG-FARBEN (nur für Layout-Analyse bei Bedarf!)
   Hinweis: Nur gezielt in Debug-Phasen einsetzen.
------------------------------------------------------------ */

:root {
    --debug-red:        #CD0000;  /* content */
    --debug-magenta:    #FF00FF;  /* Gutenberg wrapper */
    --debug-yellow:     #FFFF00;  /* WPBakery wrapper */
    --debug-ivory:      #FFFFF0;  /* container */
    --debug-green:      #00FF00;  /* Gutenberg Gruppen */
    --debug-blue:       #0099FF;  /* Post wrapper */
}

.bears-marker {
    font-size: 24px;
    font-weight: bold;
    color: var(--bears-color-light-blue);
    line-height: 1;
    display: inline-flex;
    align-items: center;
    position: relative;
    top: -3px; /* oder -0.5px, je nach Auge */
}