.error-highlight {border: 1px solid #ce404078 !important;box-shadow: 0px 0px 4px 0px #ff7777 !important;}
.error-field {
  color: #ff2c2c !important;
  font-size: 12px !important;
  margin-top: 3px;
}

.success-field {border: 1px solid #84ce4078 !important ;box-shadow: 0 0 0 0.2rem rgb(20 43 8 / 17%) !important;}
.custom-form-select {padding-left: 10px;}
.img-pos{
  border: 1px solid #265f77;
  padding: 5px;
  border-radius: 5px;
}
/* Loader Css */
.loader, .overlay_loader, .overlay {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  background: #dbdbdbe0;
  z-index: 10000;
  display:none;
}

.overlay__inner {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  position: absolute;
}

.overlay__content {
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

.spinner {
  width: 80px;
  height: 80px;
  display: inline-block;
  border-width: 4px;
  border-color: rgba(255, 255, 255, 0.33);
  /* border-top-color: #3f4d67; */
  border-top-color:#439BCE;
  animation: spin 1s infinite linear;
  border-radius: 100%;
  border-style: solid;
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}

.fc .fc-toolbar-title{
  color:#000000 !important; 
}


/* --------------------------Auto populare subhauler list----------------------------------------- */

.autocomplete {
  position: relative;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 9;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}
.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}
.est_ending_time{
  width: 65px;
}

.codeblock input{
  border: 1px solid #CECECE;
}

.form-control::-webkit-input-placeholder {
  color:#bdb9b9;
}

.exportList{
  color:#3D6DC2;
  font-weight: 600;
  font-size: 16px;
  text-align: left;
  margin-right: 10px;
}
/* .sidebarblock{
  top: 126px;
} */
.top60{
  top:57px;
}
.top185{
  top:185px;
}
.marginTop110{
  margin-top:165px;
}
.blueRelative{
  position: fixed;
  z-index: 100;
  left: 0;
  right: 0;
  top: 0;
}
.report-quotes {
  max-height: 225px;
  overflow-y: auto;
}
.marginTop60{
  margin-top:60px !important;
}
.textrightdelete {
  padding-left: 10px;
}
.pullright {
  float:right;
}
.custom-nav .navbar-brand img{max-height: 125px;}
/* .actions-list .col-auto {
  margin-right:25px;
} */
#application_reference_form .form-label{
  font-size:14px;
}
#application_reference_form .form-check-label{
  font-size:12px;
}
#application_reference_form label{
  font-size:14px;
}
.customnav ul {
  padding-top: 20px;
}
.highlight-green {
  background-color: #dff0d8 !important;
}
.redtext { color: #CC0000;font-weight: 600;}
#application_reference_form .form-check-input {
  width: 0.75em;
  height: 0.75em;
  margin-top: 0.50em;
}
.custom-table td {
  word-wrap: break-word;
}
.table-responsive {
  overflow-x: auto;
}

table {
  width: 100%; /* Ensure the table takes full width of the container */
  border-collapse: collapse; /* Optional: Remove borders between table cells */
}
/* table tbody td,
table tbody td option,
table tbody td .successtext {
  font-size: 16px !important;
  font-family: Lato !important;
  color: #313131 !important;
  font-weight: 400 !important;
}
table thead th,
table thead th span,
table thead th a,
table thead th option
{
  font-size: 18px !important;
  font-family: Lato !important;
  color: #FFFFFF !important;
  font-weight: 600 !important;
}
table tbody td span {
  font-size: 16px !important;
  font-family: Lato !important;
  font-weight: 400 !important;
}

table tbody td a {
  font-size: 16px !important;
  font-family: Lato !important;
  font-weight: 400 !important;
  color: #3D6DC2 !important;
}
.sort-icon {
  cursor: pointer;
}
body {
  font-family: Lato !important;
} */
.gridtable tbody {
  max-height: 400px;
}
.bodygradiont {
  padding-bottom: 5px;
}

.btn-outline-primary:hover {
  color: white !important;
}
.pagination-custom li.page-item.active a.page-link {
  color: #fff !important;
  background: #3D6DC2;
  border-radius: 2px;
}

/* V2 Application System Styles */
.v2-application {
    font-family: 'Lato', sans-serif;
}

.v2-application .bread_crum_trail {
    background-color: #EFEFEF;
    padding: 52px 0 35px;
}

.v2-application .bread_crum_trail ul.trail { 
    display: flex;
    list-style: none;
    padding: 0px;
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    justify-content: space-between;
    align-items: center;
    background-color: #C6D0E2;
    border-radius: 50px;
    overflow: hidden;
}

.v2-application .bread_crum_trail ul.trail li { 
    max-width: 100px;
    background-repeat: no-repeat;
    background-position: center left;
    padding: 0px 40px 0 40px;
    position: relative;
}

.v2-application .bread_crum_trail ul.trail li.active { 
    background-color: #3D6DC2;
    background-image: unset;
}

.v2-application .bread_crum_trail ul.trail li:before{
    background-image: url('../images/arrow-trail.png');
    width: 28px;
    height: 48px;
    content: ' ';
    display: block;
    position: absolute;
    right: -28px;
    z-index: 9;
    background-repeat: no-repeat;
}

.v2-application .bread_crum_trail ul.trail li.active:before { 
    background-image: url('../images/active-trail-arrow.png');
}

.v2-application .bread_crum_trail ul.trail li.active:after { 
    background-image: url('../images/active-trail-arrow-left2.png');
    width: 28px;
    height: 48px;
    content: ' ';
    display: block;
    position: absolute;
    left: -22px;
    z-index: 9;
    top: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.v2-application .bread_crum_trail ul.trail li.first_step.active:after { 
    display: none; 
}

.v2-application .bread_crum_trail ul.trail li.active a { 
    color: #fff; 
}

.v2-application .bread_crum_trail ul.trail li.last_step { 
    background-image: none; 
    padding: 0px 40px 0 40px;
}

.v2-application .bread_crum_trail ul.trail li a { 
    color: #565656;
    text-align: center;
    font-size: 13.421px;
    font-weight: 700;
    text-transform: uppercase;
    display: flex;
    text-align: center;
    height: 48px;
    align-items: center;
    line-height: 16px;
    text-decoration: none;
}

/* Footer trail */
.v2-application .trail_footer {
    background-color: #EFEFEF;
    padding: 52px 0 35px;
}

/* V2 Application - Exact design from v2_someapplicationdesign folder */
.v2-application {
    font-family: 'Lato', sans-serif;
}

.v2-application .page_wrap .container {
    width: 100%;
    max-width: 1370px;
    margin: 0 auto;
}

/* Breadcrumb Trail - Exact styling from v2 design */
.v2-application .bread_crum_trail {
    background-color: #EFEFEF;
    padding: 52px 0 35px;
}

.v2-application .bread_crum_trail ul.trail { 
    display: flex;
    list-style: none;
    padding: 0px;
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    justify-content: space-between;
    align-items: center;
    background-color: #C6D0E2;
    border-radius: 50px;
    overflow: hidden;
}

.v2-application .bread_crum_trail ul.trail li { 
    max-width: 100px;
    background-repeat: no-repeat;
    background-position: center left;
    padding: 0px 40px 0 40px;
    position: relative;
}

.v2-application .bread_crum_trail ul.trail li.active { 
    background-color: #3D6DC2;
    background-image: unset;
}

.v2-application .bread_crum_trail ul.trail li:before{
    background-image: url('../images/arrow-trail.png');
    width: 28px;
    height: 48px;
    content: ' ';
    display: block;
    position: absolute;
    right: -28px;
    z-index: 9;
    background-repeat: no-repeat;
}

.v2-application .bread_crum_trail ul.trail li.active:before { 
    background-image: url('../images/active-trail-arrow.png');
}

.v2-application .bread_crum_trail ul.trail li.active:after { 
    background-image: url('../images/active-trail-arrow-left2.png');
    width: 28px;
    height: 48px;
    content: ' ';
    display: block;
    position: absolute;
    left: -22px;
    z-index: 9;
    top: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.v2-application .bread_crum_trail ul.trail li.first_step.active:after { 
    display: none; 
}

.v2-application .bread_crum_trail ul.trail li.active a { 
    color: #fff; 
}

.v2-application .bread_crum_trail ul.trail li.last_step { 
    background-image: none; 
    padding: 0px 40px 0 40px;
}

.v2-application .bread_crum_trail ul.trail li a { 
    color: #565656;
    text-align: center;
    font-size: 13.421px;
    font-weight: 700;
    text-transform: uppercase;
    display: flex;
    text-align: center;
    height: 48px;
    align-items: center;
    line-height: 16px;
    text-decoration: none;
}

/* Form Styling - Exact from v2 design */
.v2-application .case_form.steps_1 { 
    max-width: 100%; 
    padding: 100px 0 150px; 
}

.v2-application .case_form h1 {
    color: #CC2330;
    font-size: 32px;
    font-weight: 700;
    line-height: 42px;
    margin-bottom: 10px;
}

.v2-application .case_form .form_row {
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px;
    margin-bottom: 18px;
    width: 100%;
}

.v2-application .case_form .form_row.align_items_center {
    align-items: center;
}

.v2-application .case_form .form_row.align_left {
    justify-content: start;
    align-items: center;
    column-gap: 15px;
}

.v2-application .case_form .form_row .col { 
    flex: 1;
    min-width: 0;
}

/* V2 Application Column Classes - Responsive Grid */
.v2-application .case_form .form_row .col.col-1 {
    flex: 0 0 calc(50% - 10px);
    max-width: calc(50% - 10px);
}

.v2-application .case_form .form_row .col.col-2 {
    flex: 0 0 calc(50% - 10px);
    max-width: calc(50% - 10px);
}

.v2-application .case_form .form_row .col.col-3 {
    flex: 0 0 calc(33.333% - 14px);
    max-width: calc(33.333% - 14px);
}

/* Bootstrap-like responsive behavior for col classes */
@media (max-width: 992px) {
    .v2-application .case_form .form_row .col.col-1,
    .v2-application .case_form .form_row .col.col-2 {
        flex: 0 0 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
    
    .v2-application .case_form .form_row .col.col-3 {
        flex: 0 0 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
}

@media (max-width: 767px) {
    .v2-application .case_form .form_row .col.col-1,
    .v2-application .case_form .form_row .col.col-2,
    .v2-application .case_form .form_row .col.col-3 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .v2-application .stepbg {
        margin-top: 125px !important;
    }
    .v2-application .box_field .form_row {
        margin-bottom: 20px !important;
    }
}

.v2-application .case_form .form_row label { 
    display: block; 
    margin-bottom: 5px; 
    color: #565656;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.v2-application .case_form .form_row select,
.v2-application .case_form .form_row textarea,
.v2-application .case_form .form_row input {
    color: #565656;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    border-radius: 5px;
    border: 1px solid #BFBFBF;
    background: #FFF;
    height: 38px;
    padding: 0 10px;
}

.v2-application .case_form .form_row textarea {
    height: 120px;
    resize: vertical;
    font-family: inherit;
}

.v2-application .case_form .form_row input.radio_input { 
    width: 20px; 
    margin-right: 5px;  
}

.v2-application .case_form .form_row.align_left label {
    margin-right: 30px;
    margin-bottom: 0;
}

.v2-application .case_form .form_row input::placeholder { 
    color: #A5A5A5; 
}

/* Box Field Styling */
.v2-application .box_field {
    margin-top: 50px;
}

/* File Upload Section Title Styling - EXACTLY Matching Design */
.v2-application .fileupload_field h3 {
    color: #000000 !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    font-family: 'Lato', sans-serif !important;
    letter-spacing: 0.5px !important;
}

.v2-application .fileupload_field p {
    color: #666666 !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    margin-bottom: 30px !important;
    font-family: 'Lato', sans-serif !important;
}

.v2-application .box_field h3 {
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.v2-application .box_field p {
    color: #565656;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 35px;
}

.v2-application .box_field textarea { 
    height: 120px; 
    padding: 10px; 
}

/* Box Field Textarea - FIRST INSTANCE - UPDATED */
.v2-application .box_field textarea { 
    height: 120px; 
    padding: 10px; 
    resize: vertical;
    font-family: inherit;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: #FFF;
    color: #565656;
    font-size: 15px;
}

/* File Upload Styling - COMPLETELY NEW APPROACH to Match Design Exactly */
.v2-application .file_upload_wrap { 
    display: flex !important; 
    flex-direction: row !important;
    gap: 30px !important;
    margin-top: 25px !important;
    width: 100% !important;
}

.v2-application .file_upload_wrap .upload_card {
    flex: 1 !important;
    background: #FFFFFF !important;
    border: 1px solid #E0E0E0 !important;
    border-radius: 8px !important;
    padding: 25px !important;
    display: flex !important; 
    flex-direction: column !important;
    gap: 20px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

.v2-application .file_upload_wrap .upload_card .row {
    margin: 0 !important;
    align-items: flex-start !important;
}

.v2-application .file_upload_wrap .upload_card .col-md-4,
.v2-application .file_upload_wrap .upload_card .col-md-8 {
    padding: 0 !important;
}

.v2-application .file_upload_wrap .upload_card .col-md-4 {
    padding-right: 15px !important;
}

.v2-application .file_upload_wrap .upload_card .col-md-8 {
    padding-left: 15px !important;
}

/* Upload label styling */
.v2-application .file_upload_wrap .upload_card .upload_label {
    display: block !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #333333 !important;
    margin-bottom: 15px !important;
    font-family: 'Lato', sans-serif !important;
    line-height: 1.4 !important;
}

.v2-application .file_upload_wrap .upload_card .upload_label .text-danger {
    color: #CC2330 !important;
    font-weight: 700 !important;
}

.v2-application .file_upload_wrap .upload_card h4 {
    color: #333333 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    font-family: 'Lato', sans-serif !important;
}

.v2-application .file_upload_wrap .upload_card p {
    color: #666666 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    font-family: 'Lato', sans-serif !important;
    flex-grow: 1 !important;
}

.v2-application .file_upload_wrap .upload_card .upload_btn {
    background: #666666 !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 10px 25px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    width: 100% !important;
    max-width: 120px !important;
    transition: background-color 0.3s ease !important;
    font-family: 'Lato', sans-serif !important;
}

.v2-application .file_upload_wrap .upload_card .upload_btn:hover {
    background: #555555 !important;
}

.v2-application .file_upload_wrap .upload_card .upload_btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(102, 102, 102, 0.3) !important;
}

.v2-application .file_upload_wrap .upload_card:nth-child(2) .upload_btn:focus {
    box-shadow: 0 0 0 3px rgba(204, 35, 48, 0.3) !important;
}

/* Footer Trail - Exact styling from v2 design */
.v2-application .trail_footer {
    background-color: #EFEFEF;
    padding: 52px 0 35px;
}

.v2-application .trail_footer ul.steps {
    display: flex;
    list-style: none;
    padding: 0px;
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    justify-content: end;
    column-gap: 35px;
    align-items: center;
}

.v2-application .trail_footer ul.steps li a {
    width: 230px; 
    border-radius: 25px;
    border: 2px solid #3D6DC2;
    display: flex;
    text-align: center;
    padding: 13px 0px;
    color: #3D6DC2;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.v2-application .trail_footer ul.steps li a:focus,
.v2-application .trail_footer ul.steps li a:visited,
.v2-application .trail_footer ul.steps li a:active {
    color: #3D6DC2;
}

.v2-application .trail_footer ul.steps li a.continue,
.v2-application .trail_footer ul.steps li a.submit,
.v2-application .trail_footer ul.steps li a.save {
    color: #fff;
    background-color: #3D6DC2;
}

.v2-application .trail_footer ul.steps li a.continue:focus,
.v2-application .trail_footer ul.steps li a.submit:focus,
.v2-application .trail_footer ul.steps li a.continue:visited,
.v2-application .trail_footer ul.steps li a.continue:active,
.v2-application .trail_footer ul.steps li a.submit:visited,
.v2-application .trail_footer ul.steps li a.submit:active,
.v2-application .trail_footer ul.steps li a.save:focus,
.v2-application .trail_footer ul.steps li a.save:visited,
.v2-application .trail_footer ul.steps li a.save:active {
    color: #fff;
}

/* Fieldset Styling */
.v2-application fieldset {
    display: none;
}

.v2-application fieldset.active {
    display: block;
}

/* Responsive Design for V2 Application */

/* Large Desktop (1400px and below) */
@media all and (max-width: 1400px) {
    .v2-application .stepbg .container {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    
    .v2-application .case_form.steps_1 {
        padding: 80px 0 120px;
    }
}

/* Desktop (1199px and below) */
@media all and (max-width: 1199px) {
    .v2-application .stepbg .custom-breadcrumb {
        height: 50px !important;
        font-size: 12px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        padding-left: 25px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a:after {
        width: 50px !important;
        height: 50px !important;
        right: -25px !important;
    }
    
    .v2-application .stepbg .breadcrumb__inner .breadcrumb__title {
        font-size: 10px !important;
        line-height: 12px !important;
    }
    
    .v2-application .case_form h1 {
        font-size: 24px !important;
    }
    
    .v2-application .case_form .form_row {
        gap: 20px;
    }
    
    .v2-application .trail_footer ul.steps {
        column-gap: 25px;
    }
    
    .v2-application .trail_footer ul.steps li a {
        width: 200px;
        font-size: 14px;
    }
}

/* Tablet (1000px and below) */
@media all and (max-width: 1000px) {
    .v2-application .stepbg .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    .v2-application .case_form.steps_1 {
        padding: 60px 0 100px;
    }
    
    .v2-application .case_form .form_row .col.col-1,
    .v2-application .case_form .form_row .col.col-2 {
        flex: 0 0 calc(50% - 10px);
    }
    
    .v2-application .case_form .form_row .col.col-3 {
        flex: 0 0 calc(33.333% - 10px);
    }
}

/* Small Tablet (992px and below) */
@media all and (max-width: 992px) {
    .v2-application .stepbg {
        height: 80px !important;
        padding: 15px 0 !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb {
        height: 45px !important;
        font-size: 11px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        padding-left: 20px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a:after {
        width: 45px !important;
        height: 45px !important;
        right: -22.5px !important;
    }
    
    .v2-application .stepbg .breadcrumb__inner .breadcrumb__title {
        font-size: 9px !important;
        line-height: 11px !important;
    }
    
    .v2-application .case_form h1 {
        font-size: 22px !important;
    }
    
    .v2-application .case_form .form_row {
        flex-direction: column;
        gap: 15px;
    }
    
    .v2-application .case_form .form_row .col.col-1,
    .v2-application .case_form .form_row .col.col-2,
    .v2-application .case_form .form_row .col.col-3 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    
    /* Keep regular col class responsive */
    .v2-application .case_form .form_row .col:not(.col-1):not(.col-2):not(.col-3) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    
    .v2-application .trail_footer {
        padding: 40px 0 30px;
    }
    
    .v2-application .trail_footer ul.steps {
        flex-direction: column;
        gap: 15px;
        align-items: center;
    }
    
    .v2-application .trail_footer ul.steps li a {
        width: 100%;
        max-width: 280px;
        font-size: 14px;
    }
}

/* Mobile Large (767px and below) */
@media only screen and (max-width: 767px) {
    .v2-application .stepbg {
        height: 70px !important;
        padding: 10px 0 !important;
    }
    
    .v2-application .stepbg .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb {
        height: 40px !important;
        font-size: 10px !important;
        border-radius: 35px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        padding-left: 15px !important;
        padding-right: 5px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a:after {
        width: 40px !important;
        height: 40px !important;
        right: -20px !important;
    }
    
    .v2-application .stepbg .breadcrumb__inner .breadcrumb__title {
        font-size: 8px !important;
        line-height: 10px !important;
    }
    
    .v2-application .case_form.steps_1 {
        padding: 40px 0 80px;
    }
    
    .v2-application .case_form h1 {
        font-size: 20px !important;
        margin-bottom: 30px !important;
    }
    
    .v2-application .case_form .form_row {
        gap: 10px;
    }
    
    .v2-application .case_form .form_row label {
        font-size: 14px !important;
    }
    
    .v2-application .case_form .form_row input,
    .v2-application .case_form .form_row select,
    .v2-application .case_form .form_row textarea {
        font-size: 14px !important;
        height: 36px !important;
    }
    
    .v2-application .trail_footer {
        padding: 30px 0 25px;
    }
    
    .v2-application .trail_footer ul.steps {
        gap: 12px;
    }
    
    .v2-application .trail_footer ul.steps li a {
        width: 100%;
        max-width: 250px;
        font-size: 13px;
        padding: 10px 0;
    }
    
    .v2-application .box_field {
        margin-top: 30px !important;
    }
    
    .v2-application .box_field h3 {
        font-size: 18px !important;
    }
    
    .v2-application .box_field p {
        font-size: 14px !important;
    }
}

/* Mobile Medium (576px and below) */
@media only screen and (max-width: 576px) {
    .v2-application .stepbg {
        height: 60px !important;
        padding: 8px 0 !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb {
        height: 35px !important;
        font-size: 9px !important;
        border-radius: 30px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        padding-left: 12px !important;
        padding-right: 3px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a:after {
        width: 35px !important;
        height: 35px !important;
        right: -17.5px !important;
    }
    
    .v2-application .stepbg .breadcrumb__inner .breadcrumb__title {
        font-size: 7px !important;
        line-height: 9px !important;
    }
    
    .v2-application .case_form.steps_1 {
        padding: 30px 0 70px;
    }
    
    .v2-application .case_form h1 {
        font-size: 18px !important;
        margin-bottom: 25px !important;
    }
    
    .v2-application .case_form .form_row {
        gap: 8px;
    }
    
    .v2-application .case_form .form_row label {
        font-size: 13px !important;
    }
    
    .v2-application .case_form .form_row input,
    .v2-application .case_form .form_row select,
    .v2-application .case_form .form_row textarea {
        font-size: 13px !important;
        height: 34px !important;
    }
    
    .v2-application .trail_footer {
        padding: 25px 0 20px;
    }
    
    .v2-application .trail_footer ul.steps {
        gap: 10px;
    }
    
    .v2-application .trail_footer ul.steps li a {
        width: 100%;
        max-width: 220px;
        font-size: 12px;
        padding: 8px 0;
    }
    
    .v2-application .box_field {
        margin-top: 25px !important;
    }
    
    .v2-application .box_field h3 {
        font-size: 16px !important;
    }
    
    .v2-application .box_field p {
        font-size: 13px !important;
    }
}

/* Mobile Small (399px and below) */
@media only screen and (max-width: 399px) {
    .v2-application .stepbg {
        height: 55px !important;
        padding: 6px 0 !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb {
        height: 32px !important;
        font-size: 8px !important;
        border-radius: 25px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        padding-left: 10px !important;
        padding-right: 2px !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a:after {
        width: 32px !important;
        height: 32px !important;
        right: -16px !important;
    }
    
    .v2-application .stepbg .breadcrumb__inner .breadcrumb__title {
        font-size: 6px !important;
        line-height: 8px !important;
    }
    
    .v2-application .case_form.steps_1 {
        padding: 25px 0 60px;
    }
    
    .v2-application .case_form h1 {
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }
    
    .v2-application .case_form .form_row label {
        font-size: 12px !important;
    }
    
    .v2-application .case_form .form_row input,
    .v2-application .case_form .form_row select,
    .v2-application .case_form .form_row textarea {
        font-size: 12px !important;
        height: 32px !important;
    }
    
    .v2-application .trail_footer {
        padding: 20px 0 15px;
    }
    
    .v2-application .trail_footer ul.steps li a {
        width: 100%;
        max-width: 200px;
        font-size: 11px;
        padding: 6px 0;
    }
    
    .v2-application .box_field {
        margin-top: 20px !important;
    }
    
    .v2-application .box_field h3 {
        font-size: 14px !important;
    }
    
    .v2-application .box_field p {
        font-size: 12px !important;
    }
}

/* New System Breadcrumb Full Width Styling - Override all existing styles */
.welcome-new-system .stepbg .custom-breadcrumb {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: space-between !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    position: relative !important;
    margin: 0 auto !important;
    top: auto !important;
    height: 57px !important;
    border-radius: 43px !important;
    overflow: hidden !important;
    background-color: #C6D0E2 !important;
    font-size: 14px !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a {
    flex: 1 !important;
    min-width: auto !important;
    max-width: none !important;
    position: relative !important;
    display: flex !important;
    text-decoration: none !important;
    margin: 0 !important;
    height: 100% !important;
    padding-left: 38px !important;
    padding-right: 0 !important;
    color: #666 !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a:first-child {
    border-radius: 100px 0px 0px 100px !important;
    padding-left: 15.2px !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a:last-child {
    border-radius: 0px 100px 100px 0px !important;
    padding-right: 15.2px !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a:after {
    content: "" !important;
    position: absolute !important;
    display: inline-block !important;
    width: 57px !important;
    height: 57px !important;
    top: 0 !important;
    right: -28.1481481481px !important;
    background-color: #C6D0E2 !important;
    border-top-right-radius: 5px !important;
    transform: scale(0.707) rotate(45deg) !important;
    box-shadow: 2px -2px rgb(255 255 255) !important;
    z-index: 1 !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a:last-child:after {
    content: none !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a.active,
.welcome-new-system .stepbg .custom-breadcrumb a:hover {
    background: #3D6DC2 !important;
    color: white !important;
}

.welcome-new-system .stepbg .custom-breadcrumb a.active:after,
.welcome-new-system .stepbg .custom-breadcrumb a:hover:after {
    background: #3D6DC2 !important;
}

/* Ensure proper spacing for new system */
.welcome-new-system .stepbg .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Override stepbg positioning for new system */
.welcome-new-system .stepbg {
    position: relative !important;
}

.welcome-new-system .stepbg .container {
    position: relative !important;
    height: auto !important;
}

/* V2 Application Form Container - Ensure proper width */
.v2-application .case_form {
    max-width: 100%;
    overflow: hidden;
}

.v2-application .case_form .form_row {
    max-width: 100%;
}

/* V2 Application Pages - Full Width Breadcrumb - FIRST INSTANCE */
.v2-application .stepbg .custom-breadcrumb {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: space-between !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    position: relative !important;
    margin: 0 auto !important;
    top: auto !important;
    height: 57px !important;
    border-radius: 43px !important;
    overflow: hidden !important;
    background-color: #C6D0E2 !important;
    font-size: 14px !important;
}

.v2-application .stepbg .custom-breadcrumb a {
    flex: 1 !important;
    min-width: auto !important;
    max-width: none !important;
    position: relative !important;
    display: flex !important;
    text-decoration: none !important;
    margin: 0 !important;
    height: 100% !important;
    padding-left: 38px !important;
    padding-right: 0 !important;
    color: #666 !important;
}

.v2-application .stepbg .custom-breadcrumb a:first-child {
    border-radius: 100px 0px 0px 100px !important;
    padding-left: 15.2px !important;
}

.v2-application .stepbg .custom-breadcrumb a:last-child {
    border-radius: 0px 100px 100px 0px !important;
    padding-right: 15.2px !important;
}

.v2-application .stepbg .custom-breadcrumb a:after {
    content: "" !important;
    position: absolute !important;
    display: inline-block !important;
    width: 57px !important;
    height: 57px !important;
    top: 0 !important;
    right: -28.1481481481px !important;
    background-color: #C6D0E2 !important;
    border-top-right-radius: 5px !important;
    transform: scale(0.707) rotate(45deg) !important;
    box-shadow: 2px -2px rgb(255 255 255) !important;
    z-index: 1 !important;
}

.v2-application .stepbg .custom-breadcrumb a:last-child:after {
    content: none !important;
}

.v2-application .stepbg .custom-breadcrumb a.active,
.v2-application .stepbg .custom-breadcrumb a:hover {
    background: #3D6DC2 !important;
    color: white !important;
}

.v2-application .stepbg .custom-breadcrumb a.active:after,
.v2-application .stepbg .custom-breadcrumb a:hover:after {
    background: #3D6DC2 !important;
}

/* Ensure proper spacing for V2 application */
.v2-application .stepbg .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Override stepbg positioning for V2 application */
.v2-application .stepbg {
    position: relative !important;
}

.v2-application .stepbg .container {
    position: relative !important;
    height: auto !important;
}

.v2-application .trail_footer ul.steps {
    display: flex;
    list-style: none;
    padding: 0px;
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    justify-content: end;
    column-gap: 35px;
    align-items: center;
}

.v2-application .trail_footer ul.steps li a {
    width: 230px; 
    border-radius: 25px;
    border: 2px solid #3D6DC2;
    display: flex;
    text-align: center;
    padding: 13px 0px;
    color: #3D6DC2;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.v2-application .trail_footer ul.steps li a:focus,
.v2-application .trail_footer ul.steps li a:visited,
.v2-application .trail_footer ul.steps li a:active {
    color: #3D6DC2;
}

.v2-application .trail_footer ul.steps li a.continue,
.v2-application .trail_footer ul.steps li a.save {
    color: #fff;
    background-color: #3D6DC2;
}

.v2-application .trail_footer ul.steps li a.continue:focus,
.v2-application .trail_footer ul.steps li a.continue:visited,
.v2-application .trail_footer ul.steps li a.continue:active,
.v2-application .trail_footer ul.steps li a.save:focus,
.v2-application .trail_footer ul.steps li a.save:visited,
.v2-application .trail_footer ul.steps li a.save:active {
    color: #fff;
}

/* Case Form */
.v2-application .case_form.steps_1 { 
    max-width: 100%; 
    padding: 100px 0 150px; 
}

.v2-application .case_form h1 {
    color: #CC2330;
    font-size: 32px;
    font-weight: 700;
    line-height: 42px;
    margin-bottom: 10px;
}

/* Removed duplicate form_row rules - keeping only the first instance */

.v2-application .box_field {
    margin-top: 50px;
}

.v2-application .box_field h3 {
    color: #000;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.v2-application .box_field p {
    color: #565656;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 35px;
}

.v2-application .box_field textarea { 
    height: 120px; 
    padding: 10px; 
}

/* Removed duplicate file upload rules - keeping only the first instance */

/* Radio and Checkbox Styles */
.v2-application .radio-group {
    display: flex;
    align-items: center;
    gap: 20px;
}

.v2-application .radio-group input[type="radio"] {
    margin-right: 5px;
}

.v2-application .checkbox-group {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
}

.v2-application .checkbox-group input[type="checkbox"] {
    margin-right: 10px;
    margin-top: 3px;
}

.v2-application .checkbox-group label {
    margin-bottom: 0;
    line-height: 1.4;
}

/* Button Styles */
.v2-application .btn {
    padding: 10px 20px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    display: inline-block;
}

.v2-application .btn-primary {
    background-color: #3D6DC2;
    color: #fff;
}

.v2-application .btn-primary:hover {
    background-color: #2d5db2;
}

.v2-application .btn-danger {
    background-color: #dc3545;
    color: #fff;
}

.v2-application .btn-danger:hover {
    background-color: #c82333;
}

/* Form Input Styles */
.v2-application .input-text {
    border-radius: 5px;
    border: 1px solid #BFBFBF;
    background: #FFF;
    height: 38px;
    padding: 0 10px;
    width: 100%;
    color: #565656;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
}

.v2-application .input-text:focus {
    outline: none;
    border-color: #3D6DC2;
    box-shadow: 0 0 0 2px rgba(61, 109, 194, 0.2);
}

.v2-application textarea.input-text {
    height: auto;
    min-height: 100px;
    resize: vertical;
}

/* Additional V2 Application Responsive Components */

/* File Upload Responsive */
@media (max-width: 992px) {
    .v2-application .file_upload_wrap {
        flex-direction: column;
        gap: 20px;
    }
    
    .v2-application .file_upload_wrap .upload_card {
        width: 100%;
        max-width: none;
    }
    
    /* Fix Bootstrap col classes in upload cards */
    .v2-application .file_upload_wrap .upload_card .col-md-4,
    .v2-application .file_upload_wrap .upload_card .col-md-5,
    .v2-application .file_upload_wrap .upload_card .col-md-7,
    .v2-application .file_upload_wrap .upload_card .col-md-8 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Force upload cards to full width on mobile */
@media (max-width: 767px) {
    .v2-application .file_upload_wrap .upload_card .row {
        flex-direction: column;
    }
    
    .v2-application .file_upload_wrap .upload_card .col-md-4,
    .v2-application .file_upload_wrap .upload_card .col-md-5,
    .v2-application .file_upload_wrap .upload_card .col-md-7,
    .v2-application .file_upload_wrap .upload_card .col-md-8 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    
    /* Ensure upload cards stack vertically on mobile */
    .v2-application .file_upload_wrap {
        display: flex !important;
        flex-direction: column !important;
        gap: 15px !important;
    }
    
    .v2-application .file_upload_wrap .upload_card {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 0 !important;
    }
}

/* Checkbox and Radio Groups Responsive */
@media (max-width: 992px) {
    .v2-application .checkbox-group {
        flex-direction: column;
        gap: 10px;
    }
    
    .v2-application .checkbox-item {
        min-width: auto;
        width: 100%;
    }
    
    .v2-application .radio-group {
        flex-direction: column;
        gap: 10px;
    }
    
    /* Keep radio options inline on tablet if there's space */
    .v2-application .radio-options-container {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
    }
    
    .v2-application .radio-option-label {
        display: flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
    }
}

@media (max-width: 767px) {
    /* Only stack radio options on mobile when space is very limited */
    .v2-application .radio-options-container {
        display: flex;
        gap: 12px;
        flex-wrap: wrap;
    }
    
    .v2-application .radio-option-label {
        display: flex;
        align-items: center;
        gap: 4px;
        white-space: nowrap;
    }
}

@media (max-width: 576px) {
    /* Stack radio options only on very small screens */
    .v2-application .radio-options-container {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
    
    .v2-application .radio-option-label {
        display: flex;
        align-items: center;
        gap: 4px;
    }
}

/* Mobile Specific Adjustments */
@media (max-width: 767px) {
    .v2-application .file_upload_wrap .upload_card {
        padding: 20px;
    }
    
    .v2-application .file_upload_wrap .upload_card h4 {
        font-size: 16px;
    }
    
    .v2-application .file_upload_wrap .upload_card p {
        font-size: 13px;
    }
    
    .v2-application .file_upload_wrap .upload_card .upload_btn {
        padding: 8px 16px;
        font-size: 13px;
    }
    
    .v2-application .checkbox-group {
        gap: 8px;
    }
    
    .v2-application .checkbox-item label {
        font-size: 13px;
    }
    
    .v2-application .radio-group {
        gap: 8px;
    }
    
    .v2-application .radio-option-label {
        font-size: 13px;
    }
}

/* Small Mobile Adjustments */
@media (max-width: 576px) {
    .v2-application .file_upload_wrap .upload_card {
        padding: 15px;
    }
    
    .v2-application .file_upload_wrap .upload_card h4 {
        font-size: 14px;
    }
    
    .v2-application .file_upload_wrap .upload_card p {
        font-size: 12px;
    }
    
    .v2-application .file_upload_wrap .upload_card .upload_btn {
        padding: 6px 12px;
        font-size: 12px;
    }
    
    .v2-application .checkbox-item label {
        font-size: 12px;
    }
    
    .v2-application .radio-option-label {
        font-size: 12px;
    }
}

/* Very Small Mobile */
@media (max-width: 399px) {
    .v2-application .file_upload_wrap .upload_card {
        padding: 12px;
    }
    
    .v2-application .file_upload_wrap .upload_card h4 {
        font-size: 13px;
    }
    
    .v2-application .file_upload_wrap .upload_card p {
        font-size: 11px;
    }
    
    .v2-application .file_upload_wrap .upload_card .upload_btn {
        padding: 5px 10px;
        font-size: 11px;
    }
    
    .v2-application .checkbox-item label {
        font-size: 11px;
    }
    
    .v2-application .radio-option-label {
        font-size: 11px;
    }
}

/* V2 Application Agreement Section Responsive */
@media (max-width: 992px) {
    .v2-application .agreement-terms {
        margin-bottom: 25px;
    }
    
    .v2-application .agreement-text {
        font-size: 15px;
        line-height: 1.4;
    }
    
    .v2-application .signature-section {
        margin-top: 25px;
    }
    
    .v2-application .signature-pad {
        height: 150px;
    }
    
    .v2-application .bluebgbox {
        padding: 20px;
    }
    
    .v2-application .bluebgbox h3 {
        font-size: 18px;
    }
    
    .v2-application .bluebgbox p {
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    .v2-application .agreement-terms {
        margin-bottom: 20px;
    }
    
    .v2-application .agreement-text {
        font-size: 14px;
        line-height: 1.3;
    }
    
    .v2-application .signature-section {
        margin-top: 20px;
    }
    
    .v2-application .signature-pad {
        height: 120px;
    }
    
    .v2-application .bluebgbox {
        padding: 15px;
    }
    
    .v2-application .bluebgbox h3 {
        font-size: 16px;
    }
    
    .v2-application .bluebgbox p {
        font-size: 13px;
    }
    
    .v2-application .casa-agreement-section .checkbox-group {
        flex-direction: column;
        gap: 8px;
    }
    
    .v2-application .casa-agreement-section .checkbox-group label {
        font-size: 13px;
    }
}

@media (max-width: 576px) {
    .v2-application .agreement-terms {
        margin-bottom: 15px;
    }
    
    .v2-application .agreement-text {
        font-size: 13px;
        line-height: 1.3;
    }
    
    .v2-application .signature-section {
        margin-top: 15px;
    }
    
    .v2-application .signature-pad {
        height: 100px;
    }
    
    .v2-application .bluebgbox {
        padding: 12px;
    }
    
    .v2-application .bluebgbox h3 {
        font-size: 14px;
    }
    
    .v2-application .bluebgbox p {
        font-size: 12px;
    }
    
    .v2-application .casa-agreement-section .checkbox-group label {
        font-size: 12px;
    }
}

@media (max-width: 399px) {
    .v2-application .agreement-text {
        font-size: 12px;
    }
    
    .v2-application .signature-pad {
        height: 80px;
    }
    
    .v2-application .bluebgbox {
        padding: 10px;
    }
    
    .v2-application .bluebgbox h3 {
        font-size: 13px;
    }
    
    .v2-application .bluebgbox p {
        font-size: 11px;
    }
    
    .v2-application .casa-agreement-section .checkbox-group label {
        font-size: 11px;
    }
}

/* V2 Application Error Badges and Floating Elements Responsive */
@media (max-width: 992px) {
    .v2-application .floating-error-badge {
        width: 20px !important;
        height: 20px !important;
        font-size: 9px !important;
        right: -6px !important;
        top: -2px !important;
    }
}

@media (max-width: 767px) {
    .v2-application .floating-error-badge {
        width: 18px !important;
        height: 18px !important;
        font-size: 8px !important;
        right: -5px !important;
        top: -1px !important;
    }
    
    .v2-application .invalid-feedback {
        font-size: 12px;
        margin-top: 5px;
    }
    
    .v2-application .error-highlight {
        border-width: 2px !important;
    }
}

@media (max-width: 576px) {
    .v2-application .floating-error-badge {
        width: 16px !important;
        height: 16px !important;
        font-size: 7px !important;
        right: -4px !important;
        top: 0px !important;
    }
    
    .v2-application .invalid-feedback {
        font-size: 11px;
        margin-top: 4px;
    }
}

@media (max-width: 399px) {
    .v2-application .floating-error-badge {
        width: 14px !important;
        height: 14px !important;
        font-size: 6px !important;
        right: -3px !important;
        top: 1px !important;
    }
    
    .v2-application .invalid-feedback {
        font-size: 10px;
        margin-top: 3px;
    }
}

/* V2 Application Mobile Touch Improvements */
@media (max-width: 767px) {
    .v2-application .trail_footer ul.steps li a {
        min-height: 44px; /* Minimum touch target size */
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        min-height: 44px; /* Minimum touch target size */
        display: flex;
        align-items: center;
    }
    
    .v2-application .checkbox-item input[type="checkbox"],
    .v2-application .radio-option-label input[type="radio"] {
        min-width: 20px;
        min-height: 20px;
    }
    
    .v2-application .file_upload_wrap .upload_card .upload_btn {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* V2 Application Scroll Improvements */
@media (max-width: 992px) {
    .v2-application .case_form {
        overflow-x: hidden;
    }
    
    .v2-application .case_form .form_row {
        overflow-x: visible;
    }
    
    .v2-application .stepbg {
        /* overflow-x: hidden; */
    }
    
    .v2-application .stepbg .custom-breadcrumb {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

/* V2 Application Print Styles */
@media print {
    .v2-application .stepbg {
        display: none;
    }
    
    .v2-application .trail_footer {
        display: none;
    }
    
    .v2-application .case_form {
        padding: 0;
    }
    
    .v2-application .case_form h1 {
        color: #000;
        font-size: 18px;
    }
    
    .v2-application .case_form .form_row {
        break-inside: avoid;
    }
}

.v2-application .checkbox-group {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin-top: 10px;
}

.v2-application .checkbox-item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 120px;
}

.v2-application .checkbox-item input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  accent-color: #3D6DC2;
}

.v2-application .checkbox-item label {
  margin: 0;
  cursor: pointer;
  font-size: 14px;
  color: #565656;
  font-weight: normal;
  line-height: 1.2;
}

.v2-application .checkbox-item:hover label {
  color: #3D6DC2;
}

/* Custom checkbox styling for better appearance */
.v2-application .checkbox-item input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 18px;
  height: 18px;
  border: 2px solid #ccc;
  border-radius: 3px;
  background-color: white;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
}

.v2-application .checkbox-item input[type="checkbox"]:checked {
  background-color: #3D6DC2;
  border-color: #3D6DC2;
}

.v2-application .checkbox-item input[type="checkbox"]:checked::after {
  content: '✓';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 12px;
  font-weight: bold;
}

.v2-application .checkbox-item input[type="checkbox"]:hover {
  border-color: #3D6DC2;
  box-shadow: 0 0 5px rgba(61, 109, 194, 0.3);
}

.v2-application .checkbox-item input[type="checkbox"]:focus {
  outline: none;
  box-shadow: 0 0 5px rgba(61, 109, 194, 0.5);
}

/* Personal History Step Styles - Updated */
.legal-notice-text {
    color: #565656;
    font-size: 17px;
    font-family: Lato, sans-serif;
    font-weight: 400;
    margin-bottom: 30px;
}

.radio-question-label {
    margin-right: 40px;
    margin-bottom: 0;
    min-width: 300px;
}

.radio-options-container {
    display: flex;
    align-items: center;
    gap: 20px;
}

.radio-option-label {
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.checkbox-question-text {
    margin-right: 20px;
    font-weight: 700;
}

.checkbox-options-container {
    display: flex;
    align-items: center;
    gap: 15px;
}

.checkbox-option-label {
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 5px;
}

.child-relationship-text {
    font-weight: 700;
    margin-bottom: 10px;
}

.child-relationship-italic {
    font-style: italic;
    font-weight: 400;
}

/* Personal Statements Step Styles - Updated */
.instructions-text {
    color: black;
    font-size: 18px;
    font-family: Lato, sans-serif;
    font-weight: 400;
    margin-bottom: 30px;
}

.word-count-right {
    text-align: right;
}

.word-count-over {
    color: red;
    font-weight: bold;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .radio-question-label {
        margin-right: 0;
        margin-bottom: 10px;
        min-width: auto;
    }
    
    .checkbox-question-text {
        margin-right: 0;
        margin-bottom: 10px;
    }
    
    .d-flex {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
}

/* Fix for inline radio and checkbox alignment */
.radio-question-row {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.radio-question-label {
    margin-right: 40px;
    margin-bottom: 0;
    min-width: 300px;
    display: flex;
    align-items: center;
}

.radio-options-container {
    display: flex;
    align-items: center;
    gap: 20px;
}

.radio-option-label {
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.checkbox-question-row {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.checkbox-question-text {
    margin-right: 20px;
    font-weight: 700;
    display: flex;
    align-items: center;
}

.checkbox-options-container {
    display: flex;
    align-items: center;
    gap: 15px;
}

.checkbox-option-label {
    margin-bottom: 0;
    display: flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
    font-size: 14px;
}

/* Ensure radio and checkbox inputs are properly sized */
.radio-option-label input[type="radio"],
.checkbox-option-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    vertical-align: middle;
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .radio-question-row,
    .checkbox-question-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .radio-question-label,
    .checkbox-question-text {
        margin-right: 0;
        margin-bottom: 0;
        min-width: auto;
        width: 100%;
    }
    
    .radio-options-container,
    .checkbox-options-container {
        flex-wrap: wrap;
        gap: 15px;
        width: 100%;
        justify-content: flex-start;
    }
    
    .radio-option-label,
    .checkbox-option-label {
        white-space: nowrap;
    }
}

@media (max-width: 768px) {
    .radio-question-row,
    .checkbox-question-row {
        gap: 8px;
    }
    
    .radio-options-container,
    .checkbox-options-container {
        gap: 12px;
    }
}

@media (max-width: 576px) {
    /* Only stack radio options on very small screens where there's no space */
    .radio-options-container {
        display: flex !important;
        flex-direction: row !important;
        gap: 15px !important;
        align-items: center !important;
    }
    
    .radio-option-label {
        white-space: nowrap !important;
        display: flex !important;
        align-items: center !important;
        gap: 5px !important;
    }
    
    /* Only stack checkbox options on very small screens */
    .checkbox-options-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
}

/* Force radio buttons to stay inline on mobile */
@media (max-width: 767px) {
    .v2-application .radio-options-container {
        display: flex !important;
        flex-direction: row !important;
        gap: 12px !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
    }
    
    .v2-application .radio-option-label {
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
        white-space: nowrap !important;
        margin-bottom: 0 !important;
    }
}

/* Additional V2 Form Element Responsive Improvements */
@media (max-width: 767px) {
    /* Ensure form inputs take full width on mobile */
    .v2-application .case_form .form_row .col {
        width: 100%;
    }
    
    /* Fix inline styles that might override responsive behavior */
    .v2-application .case_form .form_row .col[style*="max-width"] {
        max-width: 100% !important;
    }
    
    /* Ensure select elements are properly sized */
    .v2-application .case_form .form_row select {
        width: 100%;
        min-width: auto;
    }
    
    /* Fix textarea responsiveness */
    .v2-application .case_form .form_row textarea {
        width: 100%;
        min-width: auto;
    }
}

/* CASA Agreement Page Styles */
.agreement-instructions {
    color: #565656;
    font-size: 16px;
    font-style: italic;
    margin-bottom: 20px;
}

.agreement-terms {
    margin-bottom: 30px;
}

.agreement-text {
    color: #565656;
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 20px;
}

.signature-section {
    border-top: 2px solid #E5E5E5;
    padding-top: 30px;
    margin-top: 30px;
}

.signature-instructions {
    color: #565656;
    font-size: 15px;
    font-style: italic;
    margin-bottom: 15px;
}

.signature-pad {
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: white;
    min-height: 150px;
}

.signature-preview img {
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    max-width: 100%;
}

.equal-opportunity-section {
    margin-top: 20px;
}

.bluebgbox {
    background-color: #F0F3F7;
    padding: 35px;
    border-radius: 10px;
}

.bluebgbox h3 {
    color: #5473A7;
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.bluebgbox p {
    color: #565656;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 15px;
}

/* Checkbox styling for agreement */
.checkbox-group {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
    gap: 12px;
}

.checkbox-group input[type="checkbox"] {
    width: 17px;
    height: 17px;
    background: white;
    border-radius: 2px;
    border: 1px solid #B9B9B9;
    margin-top: 3px;
    flex-shrink: 0;
}

.checkbox-group label {
    color: #565656;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 0;
}

.checkbox-group label em {
    font-size: 14px;
    font-style: italic;
    font-weight: 400;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .agreement-text {
        font-size: 16px;
    }
    
    .checkbox-group label {
        font-size: 16px;
    }
    
    .bluebgbox {
        padding: 20px;
    }
    
    .bluebgbox h3 {
        font-size: 18px;
    }
    
    .bluebgbox p {
        font-size: 14px;
    }
}

/* Fix CASA Agreement checkbox alignment */
.checkbox-group {
    display: flex !important;
    align-items: flex-start !important;
    margin-bottom: 20px;
    gap: 12px;
}

.checkbox-group input[type="checkbox"] {
    width: 17px !important;
    height: 17px !important;
    background: white !important;
    border-radius: 2px !important;
    border: 1px solid #B9B9B9 !important;
    margin-top: 3px !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    flex-shrink: 0 !important;
    vertical-align: top !important;
}

.checkbox-group label {
    color: #565656 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    display: block !important;
    flex: 1 !important;
}

.checkbox-group label em {
    font-size: 14px !important;
    font-style: italic !important;
    font-weight: 400 !important;
    display: block !important;
    margin-top: 8px !important;
}

/* Override any conflicting styles */
.agreement-terms .checkbox-group {
    display: flex !important;
    align-items: flex-start !important;
}

.agreement-terms .checkbox-group input[type="checkbox"] {
    margin-top: 3px !important;
    margin-right: 0 !important;
}

.agreement-terms .checkbox-group label {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Additional CASA Agreement checkbox fixes */
.casa-agreement-section .checkbox-group,
.agreement-terms .checkbox-group,
.signature-section .checkbox-group {
    display: flex !important;
    align-items: flex-start !important;
    flex-direction: row !important;
}

.casa-agreement-section .checkbox-group input[type="checkbox"],
.agreement-terms .checkbox-group input[type="checkbox"],
.signature-section .checkbox-group input[type="checkbox"] {
    order: 1 !important;
    margin-top: 3px !important;
    margin-right: 12px !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
}

.casa-agreement-section .checkbox-group label,
.agreement-terms .checkbox-group label,
.signature-section .checkbox-group label {
    order: 2 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    flex: 1 !important;
}

/* Ensure proper alignment for all agreement checkboxes */
.form_row .col .checkbox-group {
    display: flex !important;
    align-items: flex-start !important;
}

.form_row .col .checkbox-group input[type="checkbox"] {
    margin-top: 3px !important;
    margin-right: 6px !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
}

.form_row .col .checkbox-group label {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    flex: 1 !important;
}

/* CASA Agreement validation styles */
.v2-application .error-highlight {
    border: 2px solid #CC2330 !important;
    box-shadow: 0 0 5px rgba(204, 35, 48, 0.5) !important;
}

.v2-application .invalid-feedback {
    color: #CC2330;
    font-size: 14px;
    margin-top: 5px;
    display: block;
}

.v2-application .checkbox-group .error-highlight {
    border: 2px solid #CC2330 !important;
    outline: 2px solid rgba(204, 35, 48, 0.5) !important;
}

.v2-application #sig.error-highlight {
    border: 2px solid #CC2330 !important;
    box-shadow: 0 0 5px rgba(204, 35, 48, 0.5) !important;
}
.v2-application .case_form_agreement .box_field p {
    margin-bottom: 10px !important;
}

.v2-application .case_form_agreement .checkbox-group {
    margin-bottom: 0px !important;
}
.v2-application .case_form_agreement .signature-section {
    border-top: 0px !important;
    margin-top: 0px !important;
    padding-top: 0px !important;
}

/* Word count error styling */
.word-count-error {
    color: #CC2330 !important;
    font-size: 14px !important;
    margin-top: 5px !important;
    display: block !important;
    font-weight: 500 !important;
}

.word-count-over {
    color: #CC2330 !important;
    font-weight: bold !important;
}

/* Word limit warning styling */
.word-limit-warning {
    color: #FF6B35 !important;
    font-size: 13px !important;
    margin-top: 5px !important;
    display: block !important;
    font-weight: 600 !important;
    background-color: #FFF3E0 !important;
    padding: 8px 12px !important;
    border-radius: 4px !important;
    border-left: 4px solid #FF6B35 !important;
    animation: fadeInOut 3s ease-in-out !important;
}

@keyframes fadeInOut {
    0% { opacity: 0; transform: translateY(-5px); }
    20% { opacity: 1; transform: translateY(0); }
    80% { opacity: 1; transform: translateY(0); }
    100% { opacity: 0; transform: translateY(-5px); }
}

/* Simple Mobile Improvements - Stepbox Font Size & Scroll */
@media (max-width: 767px) {
    .v2-application .stepbg .custom-breadcrumb {
        overflow-x: auto !important;
    }
    
    .v2-application .stepbg .custom-breadcrumb a {
        min-width: 150px !important;
    }

    .v2-application .stepbg .custom-breadcrumb a .breadcrumb__title {
        font-size: 11px !important;
        line-height: 13px !important;
    }
    
    /* Fix specific agreement checkbox - absolute positioning approach */
    .v2-application .checkbox-group {
        position: relative !important;
        padding-left: 25px !important;
    }
    
    .v2-application .checkbox-group .checkbox-agreement {
        position: absolute !important;
        left: 0 !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin: 0 !important;
    }
    
    .v2-application .form_row .col .checkbox-group label {
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        margin-top: 10px !important;
    }
    .hidmobile {
        display: none !important;
    }
}