/* --- MODERN UI BASICS --- */
    .boerse-hero { text-align: center; margin: 40px 0 30px; }
    .section-title { font-family: 'Oswald', sans-serif; font-size: 2.5rem; font-weight: 700; color: #333; }
    .section-subtitle { color: #888; margin-top: -5px; font-size: 1.1rem; }

    /* Button-System */
    .aloha-btn {
        background: #d63638; color: #fff; border: none; padding: 12px 25px; border-radius: 50px;
        font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; cursor: pointer;
        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); display: inline-flex;
        align-items: center; justify-content: center; box-shadow: 0 4px 6px rgba(214, 54, 56, 0.2);
        font-size: 0.9rem; text-decoration: none;
    }
    .aloha-btn:hover { background: #b52a2c; transform: translateY(-2px); box-shadow: 0 7px 14px rgba(214, 54, 56, 0.3); color: #fff; }
    .aloha-btn-dark { background: #333; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
    .aloha-btn-dark:hover { background: #000; }
    .aloha-btn-outline { background: transparent; border: 2px solid #eee; color: #666; box-shadow: none; }
    .aloha-btn-outline:hover { background: #f8f9fa; border-color: #ddd; color: #333; }

    /* Filter Card */
    .filter-card-modern {
        background: #fff; padding: 25px; border-radius: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.05);
        margin-bottom: 35px; border: 1px solid rgba(0,0,0,0.03);
    }
    .filter-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; align-items: flex-end; }
    .filter-item label { display: block; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; color: #888; margin-bottom: 8px; }

    /* Grid & Cards */
    .boerse-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 25px; }
    .boerse-card {
        background: #fff; border-radius: 20px; padding: 30px; box-shadow: 0 8px 25px rgba(0,0,0,0.03);
        border: 1px solid rgba(0,0,0,0.02); transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
        display: flex; flex-direction: column; justify-content: space-between;
    }
    .boerse-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.08); border-color: rgba(214, 54, 56, 0.2); }

    /* Badges & Tags */
    .type-badge { font-weight: 800; text-transform: uppercase; font-size: 0.65rem; padding: 5px 12px; border-radius: 50px; display: inline-block; margin-bottom: 15px; letter-spacing: 0.5px; }
    .type-suche { background: #fff7ed; color: #c2410c; border: 1px solid #ffedd5; }
    .type-biete { background: #f0fdf4; color: #15803d; border: 1px solid #dcfce7; }
    .tag { font-size: 0.75rem; padding: 4px 10px; border-radius: 6px; background: #f4f7f9; color: #555; margin-right: 5px; font-weight: bold; border: 1px solid #e1e8ed; }

    /* --- OVERLAY SYSTEM (Glassmorphism) --- */
    .custom-overlay {
        display: none; position: fixed !important; top: 0; left: 0; width: 100vw; height: 100vh;
        background: rgba(15, 23, 42, 0.7); backdrop-filter: blur(8px);
        z-index: 999999; justify-content: center; align-items: center; padding: 20px;
    }
    .overlay-content {
        background: #fff; width: 100%; max-width: 550px; border-radius: 24px; overflow: hidden;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); position: relative;
        animation: modalIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    @keyframes modalIn { from { transform: scale(0.9) translateY(20px); opacity: 0; } to { transform: scale(1) translateY(0); opacity: 1; } }

    .overlay-header { padding: 25px 30px; border-bottom: 1px solid #f1f5f9; display: flex; justify-content: space-between; align-items: center; }
    .overlay-header h5 { font-family: 'Oswald', sans-serif; font-size: 1.3rem; margin: 0; color: #1e293b; }
    .overlay-body { padding: 30px; }

    .close-x {
        background: #f1f5f9; border: none; color: #64748b; width: 32px; height: 32px;
        border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center;
        transition: 0.2s; font-size: 1.2rem;
    }
    .close-x:hover { background: #e2e8f0; color: #0f172a; }

    /* --- MODERN FORM STYLING --- */
    .form-floating-custom { position: relative; margin-bottom: 20px; }

    .form-control-modern {
        width: 100%;
        padding: 14px 16px;
        font-size: 1rem;
        background-color: #f8fafc;
        border: 2px solid #f1f5f9;
        border-radius: 12px;
        color: #1e293b;
        transition: all 0.2s ease;
        appearance: none; /* Removes default arrow on some browsers */
    }

    .form-control-modern:focus {
        background-color: #fff;
        border-color: #d63638;
        outline: none;
        box-shadow: 0 0 0 4px rgba(214, 54, 56, 0.1);
    }

    .form-floating-custom label {
        position: absolute;
        top: -10px;
        left: 12px;
        background: #fff;
        padding: 0 6px;
        font-size: 0.7rem;
        font-weight: 800;
        color: #d63638;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        border-radius: 4px;
    }

    /* Custom Styling for Select Arrow */
    .select-wrapper { position: relative; }
    .select-wrapper::after {
        content: '\f078';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        position: absolute;
        right: 18px;
        top: 50%;
        transform: translateY(-50%);
        color: #94a3b8;
        pointer-events: none;
        font-size: 0.8rem;
    }

    textarea.form-control-modern { min-height: 120px; resize: vertical; }

    /* Checkbox Styling */
    .custom-checkbox-group {
        display: flex; gap: 10px; background: #f8fafc; padding: 15px; border-radius: 12px; border: 2px solid #f1f5f9;
    }
    .checkbox-item { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 0.85rem; font-weight: 600; color: #475569; }
    .checkbox-item input[type="checkbox"] {
        width: 18px; height: 18px; accent-color: #d63638; cursor: pointer;
    }

    body.modal-open { overflow: hidden !important; }