/* Wrapper um den Trigger und das Formular */
.meine-anfrage-wrapper {
    margin-bottom: 20px; /* Etwas Abstand nach unten */
    clear: both; /* Verhindert Probleme mit Floats */
}

/* Der klickbare Bereich (Text + Pfeil) */
.meine-anfrage-trigger {
    display: inline-flex; /* Lässt Text und Pfeil nebeneinander erscheinen */
    align-items: center; /* Zentriert Text und Pfeil vertikal */
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease, border-color 0.3s ease;
    background-color: #f9f9f9;
    user-select: none; /* Verhindert Textauswahl beim Klicken */
    color: #333; /* Textfarbe */
    font-size: 1em; /* Standard Schriftgröße */
}

/* Hover-Effekt - passe dies ggf. an dein Theme an */
.meine-anfrage-trigger:hover,
.meine-anfrage-trigger:focus { /* :focus für Tastaturnavigation */
    background-color: #eee;
    border-color: #bbb;
    outline: none; /* Standard-Fokus-Rahmen entfernen, wenn eigener definiert wird */
}

/* Der Text innerhalb des Triggers */
.meine-anfrage-text {
    margin-right: 8px; /* Abstand zwischen Text und Pfeil */
}

/* Der Pfeil */
.meine-anfrage-arrow {
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 6px solid #555; /* Pfeil nach rechts */
    transition: transform 0.3s ease; /* Animation für die Drehung */
    flex-shrink: 0; /* Verhindert, dass der Pfeil schrumpft */
}

/* Zustand, wenn das Formular offen ist (Trigger hat Klasse 'active') */
.meine-anfrage-trigger.active .meine-anfrage-arrow {
    transform: rotate(90deg); /* Dreht den Pfeil nach unten */
}

/* Der Container für das ausklappbare Formular */
.meine-anfrage-form-container {
    margin-top: 15px;
    padding: 20px;
    border: 1px solid #eee;
    background-color: #fff;
    border-radius: 4px;
    /* box-shadow entfernt */
}

/* Styling für Formular-Elemente */
.meine-anfrage-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.meine-anfrage-form input[type="text"],
.meine-anfrage-form input[type="email"],
.meine-anfrage-form textarea {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box; /* Verhindert, dass Padding die Breite beeinflusst */
    max-width: 100%; /* Verhindert Überlaufen */
}

/* Styling für den Senden-Button (ANGEPASST für Theme-Styles) */
.meine-anfrage-form button[type="submit"] {
    padding: 10px 15px; /* Beispiel - anpassen oder entfernen, falls Theme übernimmt */
    border: 1px solid transparent; /* Beispiel - anpassen oder entfernen */
    border-radius: 3px; /* Beispiel - anpassen oder entfernen */
    cursor: pointer;
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease, opacity 0.3s ease; /* Übergänge beibehalten/anpassen */
    font-size: 1em; /* Schriftgröße beibehalten oder entfernen */
    /* background-color und color entfernt */
}

/* Hover-Zustand des Buttons (ANGEPASST für Theme-Styles) */
.meine-anfrage-form button[type="submit"]:hover:not(:disabled) {
    /* Theme soll Hover übernehmen */
}

/* Deaktivierter Button */
.meine-anfrage-form button[type="submit"]:disabled {
    cursor: not-allowed;
    opacity: 0.7; /* Standard-Trübung beibehalten oder anpassen */
}

/* Styling für den Meldungsbereich */
.meine-anfrage-meldung {
    margin-top: 15px; /* Abstand zur Überschrift */
    margin-bottom: 15px; /* Abstand zum Formular */
    padding: 0;
    border-radius: 4px; /* Abrundung für alle Meldungen */
    /* Display: none wird per JS gesteuert */
}

/* Allgemeine Notice-Styles im Meldungsbereich anpassen */
.meine-anfrage-meldung .notice {
    margin: 0;
    padding: 12px 18px; /* Etwas mehr Padding */
    border: none; /* Standard-Border entfernen */
    border-radius: 4px; /* Abrundung sicherstellen */
}
.meine-anfrage-meldung .notice p {
     margin: 0;
     padding: 0;
     line-height: 1.5; /* Bessere Lesbarkeit */
}
.meine-anfrage-meldung .notice ul {
    margin-top: 8px;
    margin-bottom: 0;
    padding-left: 20px;
    list-style: disc;
}
.meine-anfrage-meldung .notice li {
    font-size: 0.95em;
    margin-bottom: 4px;
}

/* Erfolgsmeldung (ANGEPASST) */
.meine-anfrage-meldung .notice-success {
    color: white; /* NEU */
    /* Versucht, die Akzentfarbe vom Theme zu nutzen (--accent), mit Fallback */
    background-color: #0073aa; /* Fallback-Farbe (WordPress Blau) */
    background-color: var(--accent, #0073aa); /* NEU */
    border-radius: 4px; /* Sicherstellen, dass die Rundung angewendet wird */
}

/* Fehlermeldung (Styling bleibt wie vorher) */
.meine-anfrage-meldung .notice-error {
     background-color: #fff5f5;
     color: #c92a2a;
     border: 1px solid #f7d7d7; /* Optional: Leichter Rand für Fehler */
     border-radius: 4px; /* Sicherstellen, dass die Rundung angewendet wird */
}

/* Warnmeldung (Validierung) (Styling bleibt wie vorher) */
.meine-anfrage-meldung .notice-warning {
     background-color: #fff9db;
     color: #c46a00;
     border: 1px solid #ffe8a0; /* Optional: Leichter Rand für Warnung */
     border-radius: 4px; /* Sicherstellen, dass die Rundung angewendet wird */
}


/* Styling für den Lade-Spinner (bleibt gleich) */
.meine-anfrage-spinner {
    display: inline-block;
    animation: spin 1s linear infinite;
    font-size: 1.2em;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}