/*       body.cs_body {
                background-color: #97908C;
                background-size: cover;
                background-position: center;
                background-repeat: no-repeat;
                background-attachment: fixed;
            }



            body {
            margin: 0;
            background-color: #FEF0E5;
            background-image:
                repeating-radial-gradient(
                circle at 7px 7px,
                rgba(0,0,0,0.05),
                rgba(0,0,0,0.05) 3px,
                transparent 3px,
                transparent 10px
                );
            }  

*/      

            body {
            margin: 0;
            background-color: #ADADAD;
            }                

            @media screen and (max-width: 768px) {
                body.cs_body {
                   /* background-color: #FEF0E5; */
                   background-color: #ADADAD;
                }
            }
        
        .cs_splitbg {
            background-color: #97908C;
        }

        .cs_bodycolor {
            color: #202020;
        }

        .cs_secondaryColor {
            color: #707070;
            opacity: 1 !important;
        }

        .cs_formbg {
            background-color: #ffffff;
            border: 2px solid black;  box-shadow: rgb(0, 0, 0) 5px 5px !important;
            border-radius: 0px;
            padding: 40px;
            position: relative;
            margin-top: 30px;

        }

        .cs_formbg a {
            color: #202020;
        }

        [class*="max-h-[60px]"] {
    cursor: pointer;
   
    position: absolute;
position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);

    border: none !important;

    /* Die Magie: Mehrere Schatten kombinieren */
    box-shadow: 
        /* 1. Rahmen: 2px weiß, direkt am Bild */
        0 0 0 2px #ffffff, 
        
        /* 2. Rahmen: 4px schwarz (2px weiß + 2px schwarz), 
           muss dicker sein als der erste */
        0 0 0 4px #000000, 
        
        /* 3. Schlagschatten: 5px nach rechts/unten, 
           nicht verspreizt (keine 4. Zahl) */
        8px 8px 0 0 rgb(0, 0, 0) !important;
} 

        
/* Was ist das?

        .rd_HWpjzaP5qp {
            padding: 2px 6px;
            border-radius: 6px;
            background-color: #0B0A0A !important;
            color: #ffffff !important;
        }

        .rd_HWpjzaP5qp:hover {
            background-color: #0B0A0A !important;
            color: #ffffff !important;
        }

Was ist das? */        



        .cs_field {
            background-color: #ffffff;
           /* border: 2px solid #D1D5DB; */
            border: 0px solid #A0A0A0;
            color: #202020;
            border-radius: 0px;
        }






        .btn__secondary {
            background-color: #ffffff;
            border: 1px solid #D1D5DB;
            color: #202020;
            border-radius: 0px;
        }

        

        .cs_rating.peer:checked ~ label {
           /* border: 1px solid #1c1917; */
            outline: 20px solid #b523b3;
            outline-offset: -2px;
        }

        .cs_check_radio:checked {
            /* color: #1c1917; */
            color: red;
        }

        

        .cs_progress_bg {
            background-color: #F5F5F4;
        }

        .cs_progress {
            background-color: #B8B8B8;
        }

        .cs_field.countryselect .nice-select-dropdown {
            background-color: #ffffff;
            border-color: #D1D5DB;
            color: #202020;
        }

        .cs_field.countryselect .nice-select-dropdown .option:hover,
        .cs_field.countryselect .nice-select-dropdown .option.focus,
        .cs_field.countryselect .nice-select-dropdown .option.selected.focus {
            background-color: #D1D5DB;
            color: #202020;
        }

        .cs_textcolor {
            color: #202020;
        }

        hr {
            border-color: #D1D5DB;
        }

        .cs_field:focus {
            border-color: #0B0A0A;
        }

        .cs_button {
            /*
            background-color: #70A944;
            border: 2px solid #5c8f37;
            */
            background-color: #000000;
            border: none;
            color: white;
           /* padding: 12px 24px; */
            font-size: 16px;
            font-weight: bold;
            text-align: center;
            text-decoration: none;
            border-radius: 0px;
            cursor: pointer;
        }

        .cs_button:hover {
            background-color: #5c8f37;
            border: #5c8f37;
            color: #ffffff;
        }

/* Der linke untere zurueck-button */  
.btn__secondary {
            cursor: pointer;
        }



        .cs_errortext {
            color: #D71616;
        }

        .cs_datepicker {
            color: #202020;
        }

        .cs_fileupload {
            background-color: #ffffff;
            color: #202020;
        }

        .cs_fileupload > div {
            border-color: #D1D5DB;
            border-radius: 0px;
        }

        .cs_uploaded {
            border-color: #D1D5DB;
            border-radius: 0px;
            color: #202020;
        }

        .iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country-primary {
            border-color: #D1D5DB;
        }

        .iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country-primary:hover {
            background-color: #D1D5DB;
        }

        .iti__country-list {
            background-color: #ffffff;
            border-color: #D1D5DB;
            color: #202020;
        }

        .iti__country.iti__highlight {
            background-color: #D1D5DB;
            color: #202020;
        }

        .iti__search-input {
            background-color: #ffffff !important;
            border-color: #D1D5DB !important;
            color: #202020 !important;
        }

        .iti--inline-dropdown .iti__dropdown-content {
            border-color: #D1D5DB;
        }

        .mb-7 {
            font-weight: bold;
            font-family: 'Archivo', sans-serif;
        }

        label.block[for="field0"] {
    color: #ab1866;
}

label.block.mb-1.text-sm.font-medium {
    color: #000000;
    font-size: 110%;
    text-align: bold;
}


block.mb-1.text-sm.font-medium {
    height: 400px;
}

.flex.flex-wrap.items-center.justify-center a {
    color: #393939;
      font-size: 90%;
      background-color: ;
}




/* 1. Das Aussehen auf Standard zurücksetzen */
input:where([type="checkbox"]), 
input:where([type="radio"]) {
    appearance: auto !important; /* Erzwingt das Browser-Standard-Design */
    background-image: none !important; /* Entfernt den weißen Punkt/Haken von Tailwind */
    box-shadow: none !important; /* Entfernt den Fokus-Ring-Schatten */
    outline: revert !important; /* Nutzt die Standard-Outline des Browsers */
    accent-color: #000000 !important; /* Macht den Haken/Punkt schwarz */
}

/* 2. Den Fokus-Ring von Tailwind deaktivieren */
input:where([type="checkbox"]):focus, 
input:where([type="radio"]):focus {
    outline: revert !important;
    outline-offset: revert !important;
    box-shadow: none !important;
outline-color: #000000 !important;
}


/* 3. Alle Hintergründe von Tailwind-Vorgaben säubern */
input:where([type="radio"]):checked,
input:where([type="checkbox"]):checked {
    background-image: none !important;
    background-color: revert !important;
}






/* Gezielte Auswahl von Text-Inputs und Textareas */
input[type="text"], 
input[type="email"], 
input[type="password"], 
input[type="number"], 
input[type="tel"], 
input[type="url"], 
textarea {
    border: 2px solid #4a4a4a;
    /* Optional: Verhindert, dass das Design beim Fokussieren springt */
    outline: none; 
    background-color: #FFF58B;
}

/* Optional: Ein leichter visueller Hinweis beim Anklicken */
textarea:focus, 
input:focus {
    border-color: #555; /* Dunkelgrau statt Tiefschwarz bei Fokus */
}

textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 2px solid #4a4a4a !important; /* !important als Test nutzen */
    background: #f8f6e9;
    background-color: #FFF58B !important;
}

label {

    margin-bottom: 2px;   /* Minimaler Abstand (0px geht auch) */
    line-height: ;     /* Verringert den vertikalen Platzbedarf des Textes */
    padding-bottom: 0;    /* Sicherstellen, dass kein Innenabstand stört */
}