/*
Theme Name:   Hello Elementor Child
Description:  Child theme for the Hello Elementor theme
Author:       Dein Name
Template:     hello-elementor
Version:      1.0.0
*/

#comments {
    display: none !important;
}

#comments.show {
    display: block !important;
}

/* Stil für den Button */
#toggle-comment-form {
    display: block;
    padding: 10px 20px;
    background-color: #D5D5FF!important; /* Deine Farbe */
    color: black !important;
    text-decoration: none;
    border: 1px solid #000000 !important; /* Rahmen */
    border-radius: 4px;
    font-size: 14px !important; /* Schriftgröße */
    font-family: Play, sans-serif !important; /* Schriftart */
    cursor: pointer;
    text-align: center;
    margin: 15px auto; /* Zentriert den Button */
    width: fit-content; /* Passt die Breite an den Text an */
}

#toggle-comment-form:hover {
    background-color: #d0d0e0 !important; /* Dunklere Farbe für Hover */
}

/* Stil für die Kommentarnavigation */
.navigation.comment-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 15px 0;
    width: 100%;
}

.navigation.comment-navigation .nav-links {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.navigation.comment-navigation .nav-previous,
.navigation.comment-navigation .nav-next {
    flex: 1;
}

.navigation.comment-navigation .nav-previous {
    text-align: left; /* Links ausgerichtet */
}

.navigation.comment-navigation .nav-next {
    text-align: right; /* Rechts ausgerichtet */
}

/* Stil für Navigations-Links als Buttons mit festem Style */
.navigation.comment-navigation .nav-previous a,
.navigation.comment-navigation .nav-next a {
    background-color: #D5D5FF!important; /* Deine Farbe */
    color: black !important;
    padding: 10px 20px !important; /* Abstand */
    border: 1px solid #000000 !important; /* Rahmen */
    border-radius: 4px !important; /* Ecken */
    font-size: 14px !important; /* Schriftgröße */
    font-family: Play, sans-serif !important; /* Schriftart */
    text-decoration: none !important;
    display: inline-block !important;
    cursor: pointer !important;
    text-align: center !important;
    line-height: 1.4 !important;
}

.navigation.comment-navigation .nav-previous a:hover,
.navigation.comment-navigation .nav-next a:hover {
    background-color: #d0d0e0 !important; /* Dunklere Farbe für Hover */
}

/* Dein Custom CSS aus Elementor */
.comments-area {
    max-width: 1580px; /* Ihre gewünschte Breite anpassen */
    margin: 0 auto; /* Zentriert die Seite */
    padding: 0 15px; /* 15 Pixel Abstand zu den Seiten */
}

.comment-form-comment textarea {
    height: 85px !important;
}

iframe {
    max-width: 98%;
    max-height: 350px;
}

.tag-links {
    display: flex;
    justify-content: center;
    align-items: center;
}

.tag-links {
    display: none;
}

.post-password-form {
    display: block; /* Oder falls nicht schon block */
    margin: 0 auto; /* Horizontal zentriert */
    width: 50%; /* Optional, um die Breite des Formulars zu begrenzen */
}