/* --- KDD UNIFIED CONTACT FORM --- */

/* 1. Fields & Textarea: Glassmorphism Style */
.ct-contact-form .fluentform .ff-el-form-control {
    background-color: rgba(255, 255, 255, 0.05) !important;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 240, 255, 0.1) !important;
    color: #FFFFFF !important;
    border-radius: 12px !important;
    padding: 12px !important;
    transition: all 0.3s ease;
}

/* 2. White Placeholder Styling (All Browsers) */
.ct-contact-form .fluentform ::placeholder,
.ct-contact-form .fluentform input::placeholder,
.ct-contact-form .fluentform textarea::placeholder {
    color: rgba(255, 255, 255, 0.9) !important; /* High-visibility white */
    opacity: 1 !important;
    font-weight: 400 !important;
}

/* 3. Budget Selection Pills: Tight & Realistic */
.ct-contact-form .fluentform .ff-el-group.ff_list_buttons .ff-el-input--content {
    display: flex;
    flex-wrap: wrap;
    gap: 8px; /* Tighter professional gap */
    margin-top: 10px;
}

.ct-contact-form .fluentform .ff-el-group.ff_list_buttons .ff-el-form-check span {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #FFFFFF !important; /* White text as requested */
    border: 1px solid rgba(0, 240, 255, 0.1) !important;
    padding: 8px 16px !important;
    border-radius: 8px !important;
    font-weight: 400 !important;
    transition: all 0.2s ease;
}

/* 4. Budget Selection: Hover & Selected States */
.ct-contact-form .fluentform .ff-el-group.ff_list_buttons .ff-el-form-check:not(.ff_item_selected) span:hover {
    background-color: rgba(0, 240, 255, 0.1) !important;
    color: #00F0FF !important;
    border-color: #00F0FF !important;
}

.ct-contact-form .fluentform .ff-el-group.ff_list_buttons .ff_item_selected span {
    background-color: #00F0FF !important; /* KDD Electric Cyan */
    color: #FFFFFF !important; /* Forces text white on selected state */
    border-color: #00F0FF !important;
}

/* 5. Input Focus Glow */
.ct-contact-form .fluentform .ff-el-form-control:focus {
    border-color: #00F0FF !important;
    box-shadow: 0 0 10px rgba(0, 240, 255, 0.1) !important;
    outline: none;
}