#registration .sub-heading span {
    background-color: #F6F7FB;
    color: #333;
}
#registration .field, #registration .form-control{
    border: none;
}
#registration .field,
#registration .form-control,
.form-group input {
    box-shadow: none;
    background:none;
    border-radius: 0 !important;
    border-bottom: 1px solid #ddd !important;
    height: 50px;
}
#registration .prepend-icon .field-icon {
    top: 6px;   
}
#registration .prepend-icon:hover .field,
#registration .control:hover .form-control,
#registration .prepend-icon:hover .form-control,
.intl-tel-input.allow-dropdown.separate-dial-code.iti-sdc-2:hover .form-control {
    border-bottom: 1px solid #F7863B !important;
}
#registration .prepend-icon:hover i {
    color: #F7863B !important;
}
input#searchInput {
    border-bottom: 1px solid #ddd !important;
}
input#searchInput:hover {
    border-bottom: 1px solid #F7863B !important;
}
ul.top-nav>li>a:hover {
    color: #F7863B !important ;
}
#registration .sub-heading {
    margin-top: 62px;
}
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
    background: #e44431;
}
.progress-bar-success {
    background-color: #F7863B;
}
#registration label.checkbox {
    padding-left: 30px;
}
.btn-social.btn-google {
    padding-left: 12px;
}

/* Terms of Service Panel Styling */
.tospanel {
    border: 2px solid #e44431 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px rgba(228, 68, 49, 0.15) !important;
    margin-bottom: 20px !important;
}

.tospanel .panel-heading {
    background: linear-gradient(135deg, #e44431 0%, #f7863b 100%) !important;
    color: #ffffff !important;
    border-radius: 10px 10px 0 0 !important;
    padding: 15px 20px !important;
    border: none !important;
}

.tospanel .panel-title {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    margin: 0 !important;
}

.tosicon {
    color: #ffffff !important;
    margin-right: 8px !important;
}

.tospanel .panel-body {
    background: #ffffff !important;
    border-radius: 0 0 10px 10px !important;
    padding: 20px !important;
    border: none !important;
}

.tospanel .checkcontainer {
    color: #333333 !important;
    font-weight: 500 !important;
}

.tospanel .checkcontainer a {
    color: #e44431 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.tospanel .checkcontainer a:hover {
    color: #f7863b !important;
    text-decoration: underline !important;
}

/* Form Improvements */
#registration .form-group {
    margin-bottom: 25px !important;
}

#registration .sub-heading {
    margin-top: 40px !important;
    margin-bottom: 20px !important;
}

#registration .sub-heading:first-child {
    margin-top: 20px !important;
}

#registration .row {
    margin-left: -15px !important;
    margin-right: -15px !important;
    margin-bottom: 0 !important;
}

#registration .row > [class*="col-"] {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

#registration .row:last-child {
    margin-bottom: 0 !important;
}

/* Consistent form styling */
#registration .field,
#registration .form-control {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Security section improvements */
#registration #containerPassword .row {
    margin-bottom: 15px !important;
}

#registration #containerPassword .row:last-child {
    margin-bottom: 0 !important;
}

/* Terms of Service improvements */
#registration .tospanel {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

/* Button alignment */
#registration p[align="center"] {
    margin-top: 30px !important;
    margin-bottom: 0 !important;
}

#registration .sub-heading span {
    background: linear-gradient(135deg, #f7863b 0%, #ff9a56 100%) !important;
    color: #ffffff !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    display: inline-block !important;
    box-shadow: 0 4px 12px rgba(247, 134, 59, 0.3) !important;
}

#registration .field,
#registration .form-control {
    background: #ffffff !important;
    border: 2px solid #e9ecef !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    height: 50px !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
}

#registration .field:focus,
#registration .form-control:focus {
    border-color: #f7863b !important;
    box-shadow: 0 0 0 3px rgba(247, 134, 59, 0.1) !important;
    outline: none !important;
}

#registration .prepend-icon {
    position: relative !important;
}

#registration .prepend-icon .field-icon {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: 20px !important;
    z-index: 2 !important;
    pointer-events: none !important;
    color: #6c757d !important;
    transition: color 0.3s ease !important;
    font-size: 16px !important;
}

#registration .prepend-icon:hover .field-icon,
#registration .prepend-icon:focus-within .field-icon {
    color: #f7863b !important;
}

#registration .prepend-icon .field,
#registration .prepend-icon .form-control {
    padding-left: 55px !important;
    padding-right: 20px !important;
}

/* Phone number input specific styling */
#registration #inputPhone {
    padding-left: 100px !important;
    padding-right: 20px !important;
}

/* International phone input styling */
#registration .intl-tel-input {
    width: 100% !important;
}

#registration .intl-tel-input .selected-flag {
    padding-left: 20px !important;
    padding-right: 10px !important;
    width: 90px !important;
}

#registration .intl-tel-input .selected-flag .flag {
    margin-right: 8px !important;
}

#registration .intl-tel-input .selected-flag .arrow {
    margin-left: 8px !important;
}

#registration .intl-tel-input .country-list {
    z-index: 1000 !important;
}

/* Password Strength Meter */
.password-strength-meter {
    margin-top: 10px !important;
}

.password-strength-meter .progress {
    height: 8px !important;
    border-radius: 4px !important;
    background-color: #e9ecef !important;
}

.password-strength-meter .progress-bar {
    border-radius: 4px !important;
    transition: width 0.3s ease !important;
}

/* Generate Password Button */
.generate-password {
    background: linear-gradient(135deg, #f7863b 0%, #ff9a56 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
    display: inline-block !important;
    margin: 0 auto !important;
    box-shadow: 0 2px 8px rgba(247, 134, 59, 0.2) !important;
}

.generate-password:hover {
    background: linear-gradient(135deg, #e6732a 0%, #f7863b 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(247, 134, 59, 0.3) !important;
}

/* Generate Password Container */
#containerPassword .col-sm-12.text-center {
    margin-bottom: 25px !important;
    padding: 0 15px !important;
}

/* Register Button */
#real-submit {
    background: linear-gradient(135deg, #f7863b 0%, #ff9a56 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 15px 40px !important;
    border-radius: 25px !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(247, 134, 59, 0.3) !important;
}

#real-submit:hover {
    background: linear-gradient(135deg, #e6732a 0%, #f7863b 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(247, 134, 59, 0.4) !important;
}

/* Verify Button */
#btn-verify-modal {
    background: linear-gradient(135deg, #17a2b8 0%, #20c9d2 100%) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

#btn-verify-modal:hover {
    background: linear-gradient(135deg, #138496 0%, #17a2b8 100%) !important;
    transform: translateY(-1px) !important;
}