/*********************************************/
/* Scroll-To-Top-Kreis am oberen Footer-Rand   */
/*                                              */
/* Kreis mit weissem Chevron nach oben, der     */
/* beim Klick die Seite sanft nach oben scrollt */
/* (siehe js/scroll-top.js). Positioniert am    */
/* oberen Rand des Footer-Widgets-Bereichs,     */
/* haelftig ueberlappend in den gruenen Footer  */
/* hineinragend – Referenz: footer.png von      */
/* schaeferhunde.de.                            */
/*                                              */
/* Markup wird in functions.php ueber den Hook  */
/* "generate_before_footer_widgets" ausgegeben  */
/* (og_render_scroll_top).                      */
/*********************************************/

/*
 * Wrapper-Container: volle Breite, zentriert den Kreis per
 * text-align. line-height: 0 verhindert zusaetzlichen vertikalen
 * Raum durch die Baseline. margin-bottom: -15px entspricht der
 * halben Kreishoehe (30px / 2) und zieht den Kreis optisch auf
 * die Oberkante des Footer-Widgets-Containers. z-index sorgt
 * dafuer, dass der Kreis ueber dem Hintergrund liegt.
 */
.og-scroll-top-wrap {
    position:      relative;
    z-index:       1;
    display:       block;
    line-height:   0;
    margin-bottom: -15px;
    text-align:    center;
    pointer-events: none; /* Klicks gehen nur durch den Kreis, nicht den Container */
}

/*
 * Der Kreis selbst.
 *
 * Fixe Groesse 30x30px (laut Vorgabe Desktop und Mobile gleich).
 * display: inline-flex zentriert das SVG per align-items/
 * justify-content. color: #fff wird vom SVG ueber "currentColor"
 * als Strichfarbe uebernommen.
 */
.og-scroll-top {
    display:          inline-flex;
    align-items:      center;
    justify-content:  center;
    width:            30px;
    height:           30px;
    border-radius:    50%;
    background-color: #4a8229;
    color:            #ffffff;
    text-decoration:  none;
    line-height:      1;
    transition:       background-color 0.15s ease;
    pointer-events:   auto; /* Klick wieder aktiv (Wrapper blockiert) */
}

/*
 * Hover / Fokus: dunkleres Gruen.
 */
.og-scroll-top:hover,
.og-scroll-top:focus {
    background-color: #3a6620;
    color:            #ffffff;
}

/*
 * Sichtbarer Tastatur-Fokus fuer Accessibility.
 */
.og-scroll-top:focus-visible {
    outline:        2px solid #3a6620;
    outline-offset: 2px;
}

/*
 * SVG-Icon: 20x20px mittig im Kreis. stroke-Farbe erbt ueber
 * currentColor aus dem umgebenden Link.
 */
.og-scroll-top-icon {
    width:  24px;
    height: 24px;
    display: block;
}