@import url(https://fonts.googleapis.com/css?family=Quicksand);

body{
    background-color: #f7d045;
    font-family: "Quicksand", sans-serif;
}


.login-form {
    margin-top: 100px;
    padding: 20px;
    border: 0px solid #ccc;
    border-radius: 0px;
    background-color: white;
    
    font-family: "Quicksand", sans-serif;
    
}

.meinknopf{
    background-color: #114232;
    border-color: #114232;
    color:#F7F6BB;
}

.meinknopf:hover{
    background-color: #FCDC2A;
    border-color: #FCDC2A;
    color: #114232;
}

.meinknopf:focus{
    outline: none; /* Entfernt den Standard-Fokusrahmen */
    box-shadow: 0 0 0 0.1rem #114232; /* Fügt einen eigenen Leuchteffekt hinzu */
    border-color: #114232; /* Optional: Ändert die Rahmenfarbe im Fokus */
}

.form-control {
    background-color: #F7F6BB;
}

/* Optional: Fokus-Stil anpassen, falls der blaue Rand stört */
.form-control:focus {
    border-color: #87A922;
    box-shadow: 0 0 0 0.2rem rgba(#FCDC2A, 0.25);
  }

/* Verhindert die gelbe Hintergrundfarbe (oder andere Browser-Standardfarbe) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #F7F6BB inset !important;
  -webkit-text-fill-color: #000 !important; /* Optional: Textfarbe anpassen */
}

/*   MENÜ    */

/* Hintergrundfarbe der Navbar */
.navbar-light {
    background-color: #114232 !important; /* Deine gewünschte Hintergrundfarbe */
}

/* Schriftfarbe der Navbar-Links */
.navbar-light .navbar-nav .nav-link {
    color: #F7F6BB; /* Deine gewünschte Schriftfarbe */
}

/* Schriftfarbe der Navbar-Links beim Hover und Fokus */
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
    color: #FCDC2A; /* Deine gewünschte Hover-Farbe */
}

/* Schriftfarbe des Navbar-Brand (falls vorhanden) */
.navbar-brand {
    color: #F7F6BB !important; /* Passende Schriftfarbe für den Brand */
}

.navbar-brand:hover,
.navbar-brand:focus {
    color: #FCDC2A !important; /* Hover-Farbe für den Brand */
}

/* Optional: Stil für das Dropdown-Menü (Hintergrund und Schrift) */
.dropdown-menu {
    background-color: #114232; /* Hintergrundfarbe des Dropdowns */
    border: 1px solid #114232; /* Rahmenfarbe des Dropdowns anpassen */
}

.dropdown-item {
    color: #F7F6BB; /* Schriftfarbe der Dropdown-Elemente */
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(252, 220, 42, 0.2); /* Helles Gelb mit Transparenz beim Hover/Fokus */
    color: #FCDC2A; /* Schriftfarbe beim Hover/Fokus im Dropdown */
}

/* Optional: Stil für den Toggle-Button (Icon Farbe) */
/* Farbe des Toggle-Button-Icons */
.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='%23F7F6BB' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Farbe des Toggle-Button-Rahmens (optional) */
.navbar-light .navbar-toggler {
    border-color: #F7F6BB;
}

/* Farbe des Toggle-Button-Rahmens beim Fokus (optional) */
.navbar-light .navbar-toggler:focus {
    border-color: #FCDC2A;
    outline: none; /* Entfernt den Standard-Fokusrahmen, falls gewünscht */
    box-shadow: none; /* Entfernt den Standard-Fokus-Leuchteffekt, falls gewünscht */
}
.navbar-light .navbar-nav .nav-link .bi {
    color: #F7F6BB; /* Deine gewünschte Schriftfarbe für das Icon */
}

.navbar-light .navbar-nav .nav-link:hover .bi,
.navbar-light .navbar-nav .nav-link:focus .bi {
    color: #FCDC2A; /* Deine gewünschte Hover-Farbe für das Icon */
}

.navbar-light .navbar-nav .nav-link .d-lg-none {
    color: #F7F6BB; /* Deine gewünschte Schriftfarbe für das Icon */
}

.navbar-light .navbar-nav .nav-link:hover .d-lg-none,
.navbar-light .navbar-nav .nav-link:focus .d-lg-none {
    color: #FCDC2A; /* Deine gewünschte Hover-Farbe für das Icon */
}

/* Aktives Menüelement unterstreichen – auch wenn nur ein Icon enthalten ist */
.navbar-light .navbar-nav .nav-item.active .nav-link,
.navbar-light .navbar-nav .nav-link.active {
    color: #FCDC2A; /* Optional: gleiche Farbe wie Hover/Active */
}

.navbar-light .navbar-nav .nav-item.active .nav-link {
    border-bottom: 2px solid #FCDC2A;
    padding-bottom: 2px; /* Abstand optimieren */
}

/* Icon bei active auch im selben Stil wie der Text einfärben */
.navbar-light .navbar-nav .nav-item.active .nav-link .bi {
    color: #FCDC2A; /* gleiche aktive Farbe */
}