/* ==========================================================================
   1. Formular-Layout & Design (RSForm! Pro / YOOtheme Basis)
   ========================================================================== */

/* Ändert das Layout allgemeiner Formularfelder auf vertikale Ausrichtung */
.tm-main form, 
main form {
    display: flex;
    flex-direction: column;
    padding: 40px !important;
    border-radius: 4px;
}

.tm-main .uk-form-horizontal .uk-form-label,
main .uk-form-horizontal .uk-form-label {
    display: block;
    margin-bottom: 5px;
    width: 100%;
    float: none;
}

.tm-main .uk-form-horizontal .uk-form-controls,
main .uk-form-horizontal .uk-form-controls {
    margin-left: 0;
}

/* Weißer 5px Außenrahmen um spezifische Formular-Container */
.formContainer, 
#userForm,
div[id^="rsform_"] {
    border: 5px solid #ffffff !important;
    padding: 20px !important;
    box-sizing: border-box !important;
}

/* Entfernt Rahmen vom inneren Layout-Container */
.formContainer .formHorizontal,
#userForm .uk-form-horizontal,
div[id^="rsform_"] .uk-modal-body,
div[id^="rsform_"] .uk-form-horizontal,
div[id^="rsform_"] .form-horizontal {
    border: none !important;
    padding: 0 !important;
}

/* Globale Einfärbung von RSForm-Eingabefeldern */
.formContainer input:not([type="submit"]):not([type="button"]):not([type="reset"]),
.formContainer textarea,
.formContainer select,
#userForm input:not([type="submit"]):not([type="button"]):not([type="reset"]),
#userForm textarea,
#userForm select,
div[id^="rsform_"] input:not([type="submit"]):not([type="button"]):not([type="reset"]),
div[id^="rsform_"] textarea,
div[id^="rsform_"] select {
    background-color: #DFE5E6 !important;
    border: 1px solid #cccccc !important;
    color: #000000 !important;
}

/* Absendebutton für RSForm */
.formContainer input[type="submit"],
#userForm button[type="submit"],
div[id^="rsform_"] .rsform-submit-button,
div[id^="rsform_"] button[name*="Submit"] {
    background-color: #116974 !important;
    color: #ffffff !important;
    border: 1px solid #0e545d !important;
    padding: 10px 30px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 20px !important;
    text-transform: none !important;
    line-height: initial !important;
    display: inline-block !important;
    box-shadow: none !important;
}

.formContainer input[type="submit"]:hover,
#userForm button[type="submit"]:hover,
div[id^="rsform_"] .rsform-submit-button:hover,
div[id^="rsform_"] button[name*="Submit"]:hover {
    filter: brightness(1.2) !important;
    background-color: #0e545d !important;
}


/* ==========================================================================
   2. Footer-Übergang (Kurven-Design)
   ========================================================================== */

.tm-footer,
.uk-section[uk-sticky].uk-section-muted {
    position: relative !important;
    border-top: none !important;
    box-shadow: none !important;
}

.tm-footer::before,
.uk-section[uk-sticky].uk-section-muted::before {
    display: none !important;
}

.tm-main, 
main {
    position: relative !important;
    padding-bottom: 50px !important;
}

.tm-main::after,
main::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    bottom: -3px !important;
    left: 0 !important;
    width: 100% !important;
    height: 120px !important;
    background-image: url('https://airportcitydevelopers.org/images/internal/ci/untere%20Linie%20web.png?1784563576000') !important;
    background-repeat: no-repeat !important;
    background-position: center bottom !important;
    background-size: 100% auto !important;
    z-index: 999 !important;
    pointer-events: none !important;
}


/* ==========================================================================
   3. Membership Pro Registration & Profile Redesign
   ========================================================================== */

/* Override der generischen Formular-Regel für Membership Pro */
.tm-main #osm-signup-page-columns-form,
main #osm-signup-page-columns-form {
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
    padding: 30px !important;
    margin-bottom: 40px !important;
}

#osm-signup-page-columns .osm-page-title {
    font-size: 2.2rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 24px !important;
    letter-spacing: -0.02em !important;
}

#osm-columns-subscription-information #osm-existing-user-login {
    background: #eff6ff !important;
    border: 1px solid #bfdbfe !important;
    border-radius: 12px !important;
    padding: 12px 18px !important;
    color: #1e40af !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    margin-bottom: 20px !important;
}

#osm-signup-page-columns h3.osm-heading {
    font-size: 1.25rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    border-bottom: 2px solid #f1f5f9 !important;
    padding-bottom: 8px !important;
    margin-top: 32px !important;
    margin-bottom: 20px !important;
}

#osm-new-user-register { border-left: 5px solid #0d6efd !important; padding-left: 12px !important; }
#field_Personal_information { border-left: 5px solid #0ea5e9 !important; padding-left: 12px !important; }
#field_Organisation_information { border-left: 5px solid #10b981 !important; padding-left: 12px !important; }
#field_Further_information, 
#field_Information_about_projects { border-left: 5px solid #6366f1 !important; padding-left: 12px !important; }

/* Optische Trennung & Hervorhebung für "Show on members list" */
#field_show_on_members_list_control {
    margin-top: 20px !important;
    padding-top: 15px !important;
    border-top: 1px dashed #cbd5e1 !important;
}

/* Eingabefelder im Membership Pro Formular */
#osm-signup-page-columns input[type="text"],
#osm-signup-page-columns input[type="email"],
#osm-signup-page-columns input[type="password"],
#osm-signup-page-columns input[type="url"],
#osm-signup-page-columns select,
#osm-signup-page-columns textarea {
    background-color: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-size: 0.95rem !important;
    color: #0f172a !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

#osm-signup-page-columns input:focus,
#osm-signup-page-columns select:focus,
#osm-signup-page-columns textarea:focus {
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15) !important;
    outline: none !important;
}

#osm-signup-page-columns .input-password-toggle,
#osm-signup-page-columns .btn-secondary {
    background-color: #0d6efd !important;
    border-color: #0d6efd !important;
    color: #ffffff !important;
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

#osm-columns-payment-information {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 24px !important;
    margin-top: 15px !important;
}

#osm-signup-page-columns #btnLoginButton,
#osm-signup-page-columns #btn-submit,
#osm-signup-page-columns input[type="button"].btn-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 10px 32px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.25) !important;
    transition: all 0.2s ease !important;
}

#osm-signup-page-columns #btn-submit:hover,
#osm-signup-page-columns #btnLoginButton:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.35) !important;
}

#osm-forgot-username-password a {
    color: #2563eb !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    text-decoration: none !important;
}

#osm-forgot-username-password a:hover {
    text-decoration: underline !important;
}


/* ==========================================================================
   4. Membership Plans - 3-Spalten CSS Grid Layout (Volle Breite)
   ========================================================================== */

.com-osmembership #osm_plans,
.com-osmembership .osm-plans-container,
.com-osmembership .osm-plans-list,
.com-osmembership #osm-plans-columns {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    align-items: stretch !important;
    width: 100% !important;
}

/* Responsives Verhalten für mobile Endgeräte */
@media (max-width: 991px) {
    .com-osmembership #osm_plans,
    .com-osmembership .osm-plans-container,
    .com-osmembership .osm-plans-list,
    .com-osmembership #osm-plans-columns {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    .com-osmembership #osm_plans,
    .com-osmembership .osm-plans-container,
    .com-osmembership .osm-plans-list,
    .com-osmembership #osm-plans-columns {
        grid-template-columns: 1fr !important;
    }
}

/* Deaktivierung der störenden Bootstrap-Row-Struktur */
.com-osmembership #osm_plans .row,
.com-osmembership .osm-plans-container .row,
.com-osmembership #osm-plans-columns .row {
    display: contents !important;
}

.com-osmembership #osm_plans [class*="col-"],
.com-osmembership .osm-plans-container [class*="col-"],
.com-osmembership #osm-plans-columns [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
}

/* Kachel-Veredelung mit fester Ausrichtung und Equal Height */
.com-osmembership .osm-plan,
.com-osmembership .osm-plan-container,
.com-osmembership .osm-item-wrapper,
.com-osmembership .thumbnail,
.com-osmembership .well,
.com-osmembership .plan-box {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    flex: 1 1 auto !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 24px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.com-osmembership .osm-plan:hover,
.com-osmembership .osm-item-wrapper:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
}

.com-osmembership .osm-plan-title,
.com-osmembership .osm-plan-header,
.com-osmembership .plan-title {
    flex: 0 0 auto !important;
    min-height: 2.8em !important;
    max-height: 2.8em !important;
    line-height: 1.4em !important;
    font-size: 1.25rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin-bottom: 15px !important;
    overflow: hidden !important;
}

.com-osmembership .osm-plan-body,
.com-osmembership .osm-plan-description,
.com-osmembership .plan-description {
    flex: 1 0 auto !important;
    color: #475569 !important;
    margin-bottom: 20px !important;
}

.com-osmembership .osm-plan-footer,
.com-osmembership .osm-plan-buttons,
.com-osmembership .action-buttons,
.com-osmembership .btn-signup {
    flex: 0 0 auto !important;
    margin-top: auto !important;
}

.com-osmembership .btn-signup,
.com-osmembership .osm-plan-buttons a,
.com-osmembership .osm-plan-footer .btn {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 10px 24px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-align: center !important;
    text-decoration: none !important;
    display: block !important;
    width: 100% !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
}

.com-osmembership .btn-signup:hover,
.com-osmembership .osm-plan-buttons a:hover,
.com-osmembership .osm-plan-footer .btn:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.3) !important;
}