/* Registrierung Formular Wrapper */
.registration-form-wrapper {
    max-width: 615px; /* Maximale Breite des Formulars auf 600px beschränkt */
    margin: 0 auto; /* Zentriert das Formular horizontal */
    padding: 20px; /* Innenabstand innerhalb des Formular-Containers */
    background-color: rgba(0, 0, 0, 0.8); /* Dunkler halbtransparenter Hintergrund */
    color: #fff; /* Weiße Textfarbe */
    border-radius: 10px; /* Abgerundete Ecken für den Container */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Schatten um das Formular */
    box-sizing: border-box; /* Stellen sicher, dass Padding und Border in der Gesamtbreite enthalten sind */
}

.registration-form-wrapper h2 {
    text-align: center; /* Zentriert den Titel */
    font-size: 2rem; /* Setzt die Schriftgröße des Titels */
    margin-bottom: 20px; /* Abstand nach unten zum nächsten Element */
}

/* Formular-Fieldsets (Felder innerhalb des Formulars) */
.registration-form-box {
    background-color: #333; /* Dunkler Hintergrund für die Formularbox */
    padding: 20px; /* Innenabstand innerhalb der Box */
    border-radius: 8px; /* Abgerundete Ecken für die Box */
    box-sizing: border-box; /* Stellen sicher, dass Padding in der Gesamtbreite enthalten ist */
}

.form-fieldset {
    margin-bottom: 20px; /* Abstand nach unten zu anderen Fieldsets */
}

/* Formular-Felder */
.com-users-registration__form .form-control {
    width: 100%; /* Maximale Breite der Eingabefelder */
    padding: 12px; /* Innenabstand für die Felder */

    border-radius: 6px; /* Abgerundete Ecken für die Felder */
    border: 1px solid #ccc; /* Grauer Rand für die Felder */
    background-color: #222; /* Dunkler Hintergrund für die Felder */
    color: #fff; /* Weiße Schriftfarbe für die Eingabe */
    box-sizing: border-box; /* Padding und Border werden in der Gesamtbreite des Feldes mitgerechnet */
}

/* Abstand nach unten für Felder */
#jform_name{
    margin-bottom: 10px; /* z. B. 15px Abstand */
}
#jform_username{
    margin-bottom: 5px; /* z. B. 15px Abstand */
}

#jform_password1 {
    margin-bottom: 0px; /* z. B. 15px Abstand */
}

#progress-0 {
    margin-bottom: 5px; /* z. B. 15px Abstand */
}

#password-0 {
    margin-bottom: 5px; /* z. B. 15px Abstand */
}

#jform_password2 {
    margin-bottom: 5px; /* z. B. 15px Abstand */
}


.com-users-registration__form .form-control:focus {
    border-color: #ff9900; /* Randfarbe beim Fokussieren der Felder */
    background-color: #333; /* Dunklerer Hintergrund beim Fokussieren */
}

/* Registrierung Button */
.register-btn {
    width: 100%; /* Button auf die volle Breite setzen */
    padding: 12px; /* Innenabstand innerhalb des Buttons */
    background-color: #4a4a4a; /* Hintergrundfarbe des Buttons */
    color: #f8f8f8; /* Textfarbe des Buttons */
	border: 1px solid #000!important;
    border-radius: 6px; /* Abgerundete Ecken für den Button */
    font-size: 1rem; /* Schriftgröße des Buttons */
    cursor: pointer; /* Zeiger-Cursor, wenn über den Button gehoben wird */
    box-sizing: border-box; /* Padding und Border werden in der Gesamtbreite des Buttons mitgerechnet */
}

.register-btn:hover {
    background-color: #f8f8f8;
    color: #4a4a4a !important;
}

/* Formular-Token für Sicherheit */
input[type="hidden"] {
    display: none; /* Versteckt das Hidden-Input für das Token */
}

.pflichtfeld-hinweis {
    color: #cc3333;       /* sanftes Rot */
    font-weight: bold;    
    margin-top: 20px;
    font-size: 0.95rem;   /* optional etwas kleiner */
}

/* Passwort Strength Meter */
#member-registration meter {
    width: 100%;
    height: 8px;
    border-radius: 4px;
    appearance: none;
}

/* Button selbst */
.input-password-toggle {
    display: none !important;
}

/* Icon im Button */
.input-password-toggle .icon-eye {
    display: none !important;
}

/* Screenreader-Text */
.input-password-toggle .visually-hidden {
    display: none !important;
}

/* Falls Joomla einen zusätzlichen Wrapper benutzt */
.password-wrapper .input-password-toggle-wrapper {
    display: none !important;
}

#jform\[password1\]-rules {
    font-size: 11px; /* Textgröße Passwortanforderungen */
}

.registration-success-message {
    background-color: #222;
    border: 1px solid #4caf50;
    color: #fff;
    padding: 20px;
    text-align: center;
    border-radius: 8px;
}

.registration-success-message h3 {
    color: #4caf50;
    margin-bottom: 10px;
}

/* JEvents edit/create wrapper fix.
   This file is loaded after JEvents j4.css on the live page, so it can remove the white J5Plus panel. */
#gslc.gsl-scope.j5plus {
    background: rgba(37, 37, 37, 0.92) !important;
    color: #f8f8f8 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45) !important;
}

#gslc.gsl-scope.j5plus #right-col,
#gslc.gsl-scope.j5plus .gsl-content.gsl-frontend,
#gslc.gsl-scope.j5plus #jevents,
#gslc.gsl-scope.j5plus #jevents_body {
    background: transparent !important;
    color: #f8f8f8 !important;
}

#gslc.gsl-scope.j5plus #top-head,
#gslc.gsl-scope.j5plus .gsl-navbar-container,
#gslc.gsl-scope.j5plus .gsl-navbar-left {
    background: #181818 !important;
}

#gslc.gsl-scope.j5plus #top-head {
    margin: 0 !important;
    padding: 16px 20px !important;
}

#gslc.gsl-scope.j5plus .gsl-navbar-left {
    justify-content: center !important;
}

#gslc.gsl-scope.j5plus #adminForm,
#gslc.gsl-scope.j5plus .adminform {
    background: rgba(53, 53, 53, 0.95) !important;
    color: #f8f8f8 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

#gslc.gsl-scope.j5plus .adminform {
    padding: 22px 26px !important;
}

#gslc.gsl-scope.j5plus label,
#gslc.gsl-scope.j5plus legend,
#gslc.gsl-scope.j5plus .catname {
    color: #f8f8f8 !important;
}

#gslc.gsl-scope.j5plus input[type="text"],
#gslc.gsl-scope.j5plus input[type="password"],
#gslc.gsl-scope.j5plus input[type="email"],
#gslc.gsl-scope.j5plus input[type="number"],
#gslc.gsl-scope.j5plus input[type="search"],
#gslc.gsl-scope.j5plus select,
#gslc.gsl-scope.j5plus textarea,
#gslc.gsl-scope.j5plus .form-control,
#gslc.gsl-scope.j5plus .inputbox,
#gslc.gsl-scope.j5plus .gsl-select {
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 8px !important;
    background-color: rgba(255, 255, 255, 0.96) !important;
    color: #20242a !important;
    box-shadow: none !important;
}

/* JEvents calendar admin panel below the month grid. */
#jevents #jevents_body .ev_adminpanel,
#jevents #jevents_body .ev_adminpanel form,
#jevents #jevents_body .ev_adminpanel > div,
#jevents #jevents_body #adminpanel,
#jevents #jevents_body #adminpanel form,
#jevents #jevents_body .jev_adminpanel,
#jevents #jevents_body .jev_adminpanel form {
    background: rgba(20, 20, 20, 0.72) !important;
    background-color: rgba(20, 20, 20, 0.72) !important;
    color: #f8f8f8 !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    box-shadow: none !important;
}

#jevents #jevents_body .ev_adminpanel {
    padding: 14px 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

#jevents #jevents_body .ev_adminpanel *,
#jevents #jevents_body #adminpanel *,
#jevents #jevents_body .jev_adminpanel * {
    color: #f8f8f8 !important;
}

#jevents #jevents_body .ev_adminpanel select,
#jevents #jevents_body #adminpanel select,
#jevents #jevents_body .jev_adminpanel select {
    min-height: 40px !important;
    background: #8f8f8f !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 10px !important;
}

#jevents #jevents_body .ev_adminpanel option,
#jevents #jevents_body #adminpanel option,
#jevents #jevents_body .jev_adminpanel option {
    background: #2b2b2b !important;
    color: #fff !important;
}

#jevents #jevents_body .ev_adminpanel button,
#jevents #jevents_body .ev_adminpanel input[type="button"],
#jevents #jevents_body .ev_adminpanel input[type="submit"],
#jevents #jevents_body #adminpanel button,
#jevents #jevents_body #adminpanel input[type="button"],
#jevents #jevents_body #adminpanel input[type="submit"],
#jevents #jevents_body .jev_adminpanel button,
#jevents #jevents_body .jev_adminpanel input[type="button"],
#jevents #jevents_body .jev_adminpanel input[type="submit"] {
    min-height: 40px !important;
    background: #f5f5f5 !important;
    color: #222 !important;
    border: 0 !important;
    border-radius: 10px !important;
}

/* Fill the full event row with the JEvents category color. */
#jevents #jevents_body .eventstyle {
    position: relative !important;
    overflow: hidden !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

#jevents #jevents_body .eventstyle::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    bottom: 0;
    left: 0;
    width: 0;
    border-left: 100vw solid;
    border-left-color: inherit !important;
    pointer-events: none;
}

#jevents #jevents_body .eventstyle .editlinktip,
#jevents #jevents_body .eventstyle span.hasjevtip,
#jevents #jevents_body .eventstyle a.cal_titlelink,
#jevents #jevents_body .eventstyle a {
    position: relative;
    z-index: 1;
    background: transparent !important;
}

#jevents #jevents_body .eventstyle a.cal_titlelink,
#jevents #jevents_body .eventstyle a.cal_titlelink:link,
#jevents #jevents_body .eventstyle a.cal_titlelink:visited,
#jevents #jevents_body .eventstyle a.cal_titlelink:hover,
#jevents #jevents_body .eventstyle a {
    color: #111 !important;
    font-weight: 600;
}