/*
 * Button-Effekte: .glow-border, .pfeil-button, .pfeil-button-klein, .kt-blocks-post-readmore und Kadence-Morph-Pfeile. ButtonEffects erzeugt SVG-Struktur/Farbvariable. MobileFocusEffects registriert diese Elemente bei Telemetry. Zustände ändern nur die Darstellung, niemals das Klickverhalten.
 */

.glow-border {
    position: relative;
    z-index: 1;
    background-color: inherit; 
    border-radius: 5px; 
    border: none; 
    transition: box-shadow 0.3s ease-in-out;
  }

/* Klassische Textpfeile teilen ihre Basis; nur Abstand, Größe und Hub variieren. */
.pfeil-button, .pfeil-button-klein, .kt-blocks-post-readmore {
    display: inline-flex;
    align-items: center;
    padding: 10px 20px;
    font-size: 16px;
    border: none;
    background-color: #007bff;
    color: white;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

.pfeil-button { margin-right: 40px; }
.pfeil-button-klein { margin-right: 20px; }

.pfeil-button::after, .pfeil-button-klein::after, .kt-blocks-post-readmore::after {
    content: '⟶'; 
    font-size: 40px;
    display: inline-block;
    margin-left: 10px;
    position: relative;
    top: -3px; 
    transition: transform 0.3s ease;
}

.pfeil-button-klein::after {
    font-size: 30px;
    top: -1px; 
}

.pfeil-button:is(:hover, :focus-visible, .mobile-active)::after,
.pfeil-button-klein:is(:hover, :focus-visible, .mobile-active)::after {
    transform: translateX(10px); 
}

.pfeil-button:is(:hover, :focus-visible, .mobile-active){
    box-shadow: none !important;
}

.kt-blocks-post-readmore:is(:hover, :focus-visible, .mobile-active)::after {
    transform: translateX(15px); 
}

.kt-blocks-post-readmore::after {
    top: 7px; 
}

/* Dieselbe Hintergrundfarbe leuchtet bei Maus, Tastatur oder mobilem Fokus. */
.glow-border:is(:hover, :focus-visible, .mobile-active) {
    box-shadow: 0 0 18px 2px var(--button-glow-color, currentColor);
}

/* Morph-Pfeil: ButtonEffects erzeugt den Wrapper und die drei SVG-Segmente.
 * Pfeilspitze verschieben, beide Schäfte um ihren gemeinsamen Anker ausklappen.
 * Alle Eingabearten teilen die Regeln; Secondary-Pfeile bleiben ohne Glow. */
.kb-button.kt-button.kb-btn-global-inherit {
    display: inline-flex !important;
    position: relative !important;
    padding-right: 0.0em !important;    
    overflow: visible !important;
}

.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap {
    display: inline-flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    
    width: calc(1.555em + 33px) !important;   
    height: calc(1.0em + 20px) !important; 
    
    margin-left: 0.5em !important;      
    margin-right: -1.2em !important;    
    pointer-events: none;
    overflow: visible !important;
    
    position: relative !important;
    top: -0.125em !important; 
    left: -0.5em !important; 
}

.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap svg {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    overflow: visible !important;
}

.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap .arrow-tip,
.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap .shaft-left,
.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap .shaft-right {
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap .arrow-tip {
    transform: translateX(0px);
}

.kb-button.kt-button.kb-btn-global-inherit:is(:hover, :focus-visible, .mobile-active) .arrow-tip { 
    transform: translateX(30px); 
}

.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap .shaft-right,
.kb-button.kt-button.kb-btn-global-inherit .kb-morph-arrow-wrap .shaft-left {
    transform: scaleX(0);
    transform-origin: 38px 30px;
}

.kb-button.kt-button.kb-btn-global-inherit:is(:hover, :focus-visible, .mobile-active) .shaft-right,
.kb-button.kt-button.kb-btn-global-inherit:is(:hover, :focus-visible, .mobile-active) .shaft-left {
    transform: scaleX(1); 
}

.kb-button.kt-button.kb-btn-global-inherit::before,
.kb-button.kt-button.kb-btn-global-inherit::after,
.kb-button.kt-button.kb-btn-global-inherit .kb-svg-icon-wrap {
    display: none !important;
    content: none !important;
}

.kb-button.kt-button.kb-btn-global-inherit.button-style-secondary .kb-morph-arrow-wrap path,
.kb-button.kt-button.kb-btn-global-inherit.button-style-secondary .kb-morph-arrow-wrap line {
    stroke: #ffffff !important;
}

.kb-button.kt-button.kb-btn-global-inherit.button-style-secondary .kb-morph-arrow-wrap g {
    filter: none !important;
}

.kb-button.kt-button.kb-btn-global-inherit.button-style-secondary .kb-morph-arrow-wrap {
    transform: scale(0.85) !important;
    transform-origin: bottom !important;
}

.kb-button.kt-button.kb-btn-global-inherit.button-style-secondary .kb-morph-arrow-wrap svg g[filter] {
    display: none !important;
}

.single-content .wp-block-kadence-advancedbtn:has(.kb-btn-global-outline) {
  margin-bottom: 15px !important;
}
