.elementor-9108 .elementor-element.elementor-element-47e51d9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}/* Start custom CSS for html, class: .elementor-element-2eafe81 */<style>
/* Global Styling */
.appointment-v28 { padding: 60px 0 !important; background: #f8faff !important; min-height: 100vh !important; font-family: 'Inter', sans-serif !important; }
.a-container { max-width: 550px !important; margin: 0 auto !important; padding: 0 20px !important; }
.a-card { background: #fff !important; padding: 40px !important; border-radius: 30px !important; box-shadow: 0 20px 50px rgba(0,0,0,0.06) !important; border: 1px solid #f0f0f0 !important; }

/* Form Elements */
.a-header { text-align: center; margin-bottom: 25px; }
.a-header h2 { font-size: 32px; font-weight: 900; color: #111; margin-bottom: 5px; }
.a-blue { color: #3498db; }
.a-header p { color: #777; font-size: 14px; }

.a-row-flex { display: flex !important; gap: 15px !important; margin-bottom: 0px !important; }
.flex-30 { flex: 0.3 !important; }
.flex-70 { flex: 1.7 !important; }

.a-group { margin-bottom: 15px !important; text-align: left !important; flex: 1; }
.a-group label { font-size: 10px !important; font-weight: 900 !important; color: #999 !important; text-transform: uppercase !important; display: block !important; margin-bottom: 4px !important; letter-spacing: 0.5px; }

input, select { 
    width: 100% !important; 
    height: 46px !important; 
    border: 1.5px solid #f2f2f2 !important; 
    background: #fafafa !important; 
    border-radius: 12px !important; 
    padding: 0 12px !important; 
    font-size: 14px !important; 
    font-weight: 600 !important;
}
input:focus, select:focus { border-color: #3498db !important; background: #fff !important; outline: none !important; }

/* Sub-Box Styling */
.a-sub-style { background: #f0f7ff !important; padding: 15px !important; border-radius: 15px !important; border: 1.5px dashed #3498db !important; margin-bottom: 20px !important; }

.a-btn { 
    width: 100% !important; 
    padding: 18px !important; 
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%) !important; 
    color: #fff !important; 
    border: none !important; 
    border-radius: 15px !important; 
    font-weight: 900 !important; 
    font-size: 16px !important;
    cursor: pointer !important; 
    box-shadow: 0 10px 20px rgba(52,152,219,0.2) !important; 
}

/* Success UI */
.a-success-wrap { display: none; flex-direction: column; align-items: center; text-align: center; padding: 20px 0; }
.a-tick { width: 70px; height: 70px; background: #1abc9c; color: #fff; border-radius: 50%; font-size: 35px; line-height: 70px; margin-bottom: 20px; box-shadow: 0 10px 20px rgba(26,188,156,0.3); }
.a-success-wrap h3 { color: #1abc9c; font-size: 26px; font-weight: 900; }
.a-success-wrap p { color: #555; font-weight: 600; line-height: 1.5; margin-top: 10px; }
.a-done { background: #333; color: #fff; border: none; padding: 12px 35px; border-radius: 12px; font-weight: 800; cursor: pointer; margin-top: 25px; }

/* MOBILE COMPACT MODE (Fix for long scrolling) */
@media (max-width: 600px) {
    .appointment-v28 { padding: 30px 0 !important; }
    .a-card { padding: 25px 15px !important; border-radius: 25px !important; }
    .a-header h2 { font-size: 24px !important; }
    
    /* Inputs height reduced for mobile */
    input, select { height: 40px !important; font-size: 13px !important; }
    .a-group { margin-bottom: 10px !important; }
    
    /* Row stay flex on mobile to save space */
    .a-row-flex { gap: 10px !important; }
}
</style>/* End custom CSS */