/* ============================================================
   REDESIGN CSS - UK ETA Application Form
   Pixel-perfect match to design reference screenshots
   Only adds/overrides visual CSS — all IDs, names, JS hooks
   remain untouched.
   ============================================================ */

/* ---- Page background ---- */
section#apply {
    background: #f1f5f9 !important;
    padding-top: 32px !important;
    padding-bottom: 48px !important;
}

/* ---- Main form card ---- */
div#applicationForm {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    overflow: visible !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06) !important;
}

/* ---- Trusted badge ---- */
.Hero-Section-subheading {
    background: #15803d !important;
    color: #fff !important;
    border-radius: 9999px !important;
    padding: 5px 14px 5px 10px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin-left: 0 !important;
    margin-top: 20px !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

.Hero-Section-subheading::before {
    content: '✓';
    background: rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
}

/* ---- Form header section ---- */
div#newformHeader {
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 20px 28px !important;
}

.newFormLabel {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    line-height: 1.25 !important;
    margin-bottom: 8px;
}

.newFormSubLabel {
    color: #64748b !important;
    font-size: 14px !important;
    max-width: 100% !important;
    padding-top: 6px !important;
    line-height: 1.55;
}

/* ---- Step 1 form area ---- */
div#step1Form {
    padding: 24px 28px !important;
}

/* ---- Form labels ---- */
#step1Form .form-label {
    font-weight: 600 !important;
    color: #1e293b !important;
    font-size: 14px !important;
    margin-bottom: 7px;
}

/* ---- Form inputs & selects ---- */
#step1Form .form-control,
#step1Form .form-select {
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    height: 44px !important;
    font-size: 14px !important;
    color: #374151 !important;
    background-color: #fff !important;
    padding: 0 36px 0 12px !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease !important;
}

#step1Form .form-control:focus,
#step1Form .form-select:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

/* msDropdown custom select header */
.ms-dd .ms-dd-header {
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    min-height: 44px !important;
    border-bottom: none !important;
}

.ms-dd .ms-dd-header .option-selected {
    padding: 8px 32px 8px 12px !important;
    font-weight: 500;
    color: #374151 !important;
    line-height: 1.4 !important;
}

/* ---- Applicant counter — three connected pill boxes ---- */
div#applicantscount {
    border: 1px solid #cbd5e1 !important;
    border-left: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    width: 72px !important;
    height: 44px !important;
    padding: 0 8px !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    color: #1e293b !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #fff !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

button#decrement {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px 0 0 8px !important;
    padding: 0 14px !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    color: #1e3a8a !important;
    line-height: 1 !important;
    height: 44px !important;
    transition: background 0.15s ease;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

button#increment {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0 8px 8px 0 !important;
    padding: 0 14px !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    color: #1e3a8a !important;
    line-height: 1 !important;
    height: 44px !important;
    transition: background 0.15s ease;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

button#increment:hover,
button#decrement:hover {
    background: #eff6ff !important;
    border-color: #93c5fd !important;
}

/* Wrap counter row tightly */
#step1Form .d-flex:has(#applicantscount) {
    gap: 0 !important;
    margin-top: 8px !important;
}

/* ---- Checkbox ---- */
.form-check-input {
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 4px !important;
}

.form-check-input:checked {
    background-color: #1e3a8a !important;
    border-color: #1e3a8a !important;
}

.form-check-label {
    color: #64748b !important;
    font-size: 13px !important;
}

/* ---- Step 1 — Right sidebar (fieldset) ---- */
#firstPageSideSec {
    border: 1px solid #e2e8f0 !important;
    border-top: 4px solid #1e3a8a !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    padding: 0 !important;
    overflow: hidden !important;
}

#firstPageSideSec legend {
    background: #1e3a8a !important;
    color: #fff !important;
    border-radius: 0 0 6px 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    padding: 4px 14px !important;
    margin: 0 !important;
    width: auto !important;
    float: none !important;
    display: inline-block !important;
    margin-left: 16px !important;
    margin-top: -1px !important;
}

#firstPageSideSec h5 {
    font-size: 19px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    padding: 14px 18px 6px !important;
    margin: 0 !important;
}

/* ---- Validity detail rows ---- */
#validityBox {
    padding: 6px 18px 14px !important;
}

#validityBox .d-flex {
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 9px 0 !important;
    margin: 0 !important;
    gap: 10px;
}

#validityBox .d-flex:last-child {
    border-bottom: none !important;
}

#validityBox p {
    font-size: 13px !important;
    color: #475569 !important;
    line-height: 1.4 !important;
}

#validityBox p.fw-bold {
    color: #1e293b !important;
    font-size: 13px !important;
}

/* Icons via ::before — uses :has() so order doesn't matter */
#validityBox .d-flex > p:first-child {
    display: flex !important;
    align-items: center !important;
}

#validityBox .d-flex > p:first-child::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    min-width: 20px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-right: 8px;
    opacity: 0.8;
    flex-shrink: 0;
}

/* Validity row */
#validityBox .d-flex:has(#valid-for) > p:first-child::before {
    background-image: url('https://visafi.com/wp-content/themes/hello-theme-child-master/assets/img/visa-uk-eta/application/calender.png');
}

/* Entries row */
#validityBox .d-flex:has(#entries) > p:first-child::before {
    background-image: url('https://visafi.com/wp-content/themes/hello-theme-child-master/assets/img/visa-uk-eta/application/entrytype.png');
}

/* Max stay row */
#validityBox .d-flex:has(#max-stay) > p:first-child::before {
    background-image: url('https://visafi.com/wp-content/themes/hello-theme-child-master/assets/img/visa-uk-eta/application/stay.png');
}

/* Government fees row */
#validityBox .d-flex:has(#governmentFees) > p:first-child::before {
    background-image: url('https://visafi.com/wp-content/themes/hello-theme-child-master/assets/img/visa-uk-eta/application/fee.png');
}

/* ---- CTA Primary Button ---- */
button.Hero-Section-application-btn {
    background: #1e3a8a !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 13px 24px !important;
    color: #fff !important;
    letter-spacing: 0.01em;
    margin-top: 16px !important;
    transition: background 0.15s ease !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

button.Hero-Section-application-btn:hover {
    background: #1e40af !important;
    color: #fff !important;
    border: none !important;
}

#startAppBtn {
    width: 100% !important;
    margin-top: 16px !important;
}

/* ---- Value Added box ---- */
div#valueAddedBox {
    background: #fefce8 !important;
    border: 1px solid #fde68a !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
}

div#valueAddedBox #boxHeader {
    margin-bottom: 10px !important;
}

div#valueAddedBox #boxHeader span.fw-bold {
    font-weight: 700 !important;
    font-size: 14px !important;
    color: #1e293b !important;
}

div#valueAddedBox .d-flex {
    margin-top: 6px !important;
    align-items: flex-start !important;
    gap: 6px !important;
}

div#valueAddedBox .valueTextelm {
    font-size: 12px !important;
    color: #374151 !important;
    line-height: 1.55 !important;
}

div#valueAddedBox .iconElm {
    flex-shrink: 0;
    padding-top: 1px;
}

/* ---- Help box ---- */
div#helperbox {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 16px 18px !important;
}

div#helpAppHeader {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    color: #1e293b !important;
    margin-bottom: 4px !important;
}

div#helpAppHeader span:first-child {
    background: #1e3a8a !important;
    color: #fff !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-size: 12px !important;
    font-weight: 700 !important;
    border: none !important;
}

.helpHeader {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    padding-top: 10px !important;
    padding-bottom: 0 !important;
    margin-bottom: 2px;
}

.helpSubtext {
    font-size: 12px !important;
    color: #64748b !important;
    line-height: 1.5 !important;
    padding-top: 3px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

div#form-help-section {
    width: 26% !important;
}

/* ---- STEP 2 ---- */
div#step2Form {
    padding: 24px 28px !important;
}

/* Step 2 heading */
#step2details h4 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin-bottom: 4px !important;
}

#step2details > div > div > p {
    font-size: 13px !important;
    color: #64748b !important;
    margin-bottom: 20px !important;
}

/* Step 2 form labels */
#step2Form .form-label {
    font-weight: 600 !important;
    color: #1e293b !important;
    font-size: 13px !important;
    margin-bottom: 6px;
}

/* Step 2 inputs */
#step2Form .form-control,
#step2Form .form-select {
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    height: 42px !important;
    font-size: 14px !important;
    color: #374151 !important;
    background-color: #fff !important;
    box-shadow: none !important;
}

#step2Form .form-control:focus,
#step2Form .form-select:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12) !important;
}

/* Traveler box */
.traveler-box {
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    margin-bottom: 16px !important;
    background: #fff !important;
}

.traveler-box-header {
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    border-radius: 0 !important;
    padding: 13px 16px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #1e293b !important;
}

/* Passport details section */
.passportdetails {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 16px !important;
}

/* Traveler inner padding */
.traveler-box > .p-3,
.traveler-box > div:not(.traveler-box-header) {
    padding: 16px !important;
}

/* Remove traveler link */
div#removetraveler {
    border-top: 1px solid #e2e8f0 !important;
    padding: 10px 16px !important;
    text-align: right !important;
}

/* Add more traveler button */
button#adddtravelerbtn {
    background: #15803d !important;
    color: #fff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 10px 20px !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    transition: background 0.15s ease;
}

button#adddtravelerbtn:hover {
    background: #166534 !important;
}

/* ---- Step 2 right sidebar ---- */
#step2Form .side-content {
    border: 1px solid #e2e8f0 !important;
    border-top: 4px solid #1e3a8a !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    padding: 20px !important;
    margin-top: 0 !important;
}

#step2Form .rightsidedet h5.rightSideMobContentBlock {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    padding-bottom: 14px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    margin-bottom: 0 !important;
}

.details-wrapper {
    padding-top: 14px !important;
    padding-bottom: 14px !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.details-wrapper p {
    font-size: 13px !important;
    color: #475569 !important;
}

.details-wrapper p.fw-bold {
    color: #1e293b !important;
}

/* Back button */
#btnPreviousSidebar {
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    color: #1e3a8a !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    background: #ffffff !important;
    padding: 8px 16px !important;
    transition: background 0.15s ease;
}

#btnPreviousSidebar:hover {
    background: #eff6ff !important;
    border-color: #93c5fd !important;
}

/* "More Details / data info" strip */
.alert.alert-warning {
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    color: #15803d !important;
    font-size: 12px !important;
    cursor: pointer !important;
}

.alert.alert-warning .ny.v2-link-blue {
    color: #15803d !important;
    font-weight: 500 !important;
    font-size: 12px !important;
}

/* Save and continue buttons */
#stepBtn,
#stepBtnSecond {
    width: 100% !important;
    margin-top: 14px !important;
    border-radius: 10px !important;
}

/* ---- STEP 3 — Processing time cards ---- */
#step3details h5 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin-bottom: 4px !important;
}

.card-option {
    display: block !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    cursor: pointer !important;
    transition: border-color 0.15s ease, background 0.15s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

.card-option:hover {
    border-color: #93c5fd !important;
    background: #f8fbff !important;
}

.card-option > div {
    padding: 16px 16px 16px 50px !important;
}

/* Radio button - show at left center */
.card-option input[type="radio"] {
    position: absolute !important;
    left: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    accent-color: #1e3a8a !important;
    width: 18px !important;
    height: 18px !important;
    cursor: pointer !important;
}

.card-option .fw-semibold {
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #1e293b !important;
}

.card-option .text-muted {
    font-size: 13px !important;
    color: #64748b !important;
}

/* Selected card state */
.card-option input[type="radio"]:checked ~ div {
    background: #eff6ff !important;
    border: none !important;
    border-radius: 0 !important;
}

.card-option:has(input[type="radio"]:checked) {
    border: 1px solid #1e3a8a !important;
    border-bottom: 3px solid #1e3a8a !important;
    background: #eff6ff !important;
}

/* Step 3 price label alignment */
#step3details .card-option > div {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

#step3details .card-option > div > div {
    display: flex !important;
    flex-direction: column !important;
}

/* ---- Stats bar ---- */
section.vf-stats {
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 28px 0 !important;
}

.vf-stats .vf-stat-num {
    font-size: 2rem !important;
    font-weight: 800 !important;
    color: #1e3a8a !important;
    margin-bottom: 4px !important;
}

.vf-stats .vf-stat-label {
    font-size: 10.5px !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: #64748b !important;
    font-weight: 600 !important;
}

/* ---- Process section ---- */
section.vf-process {
    background: #fff !important;
}

.vf-eyebrow {
    color: #1e3a8a !important;
    font-size: 11px !important;
    letter-spacing: 0.12em !important;
}

.vf-process .vf-title {
    color: #1e293b !important;
    font-size: 26px !important;
    font-weight: 700 !important;
}

.vf-process .vf-subtitle {
    color: #64748b !important;
    font-size: 15px !important;
}

/* Step number — rounded square, not circle */
.vf-step-num {
    background: #1e3a8a !important;
    color: #fff !important;
    width: 52px !important;
    height: 52px !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    border-radius: 14px !important;
    margin-bottom: 0 !important;
    position: relative;
    z-index: 1;
}

/* Step card — white bordered card below the number */
.vf-step {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.vf-step h5 {
    font-weight: 700 !important;
    color: #1e293b !important;
    font-size: 15px !important;
    margin-top: 0 !important;
}

.vf-step p {
    color: #64748b !important;
    font-size: 13px !important;
    margin-bottom: 0 !important;
}

/* White card wrapping h5+p inside each step */
.vf-step h5,
.vf-step p {
    background: transparent;
}

/* Add visible card around each step content area */
.vf-step::after {
    content: '';
    position: absolute;
    top: 26px;
    left: 0;
    right: 0;
    bottom: 0;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    z-index: 0;
    pointer-events: none;
}

/* Push text above the ::after overlay */
.vf-step h5,
.vf-step p {
    position: relative;
    z-index: 1;
    padding-left: 12px;
    padding-right: 12px;
}

.vf-step h5 {
    padding-top: 28px;
}

.vf-step p {
    padding-bottom: 16px;
}

/* Requirements box */
.vf-req-box {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    margin-top: 2.5rem !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 0 !important;
    flex-wrap: wrap;
}

/* Left heading column with icon */
.vf-req-box h5 {
    color: #1e293b !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    width: 200px !important;
    min-width: 160px !important;
    padding: 1.75rem 1.5rem !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    border-right: 1px solid #e2e8f0 !important;
    margin: 0 !important;
    align-self: stretch;
}

.vf-req-box h5::before {
    content: '';
    display: block;
    width: 44px;
    height: 44px;
    background: url('https://visafi.com/wp-content/themes/hello-theme-child-master/assets/img/visa-uk-eta/application/need to apply.png') no-repeat center / contain;
    margin-bottom: 10px;
}

/* Right: bullet columns fill remaining space */
.vf-req-box .row {
    flex: 1 !important;
    margin: 0 !important;
    padding: 1.5rem 1rem !important;
    min-width: 0;
}

.vf-req-list li {
    color: #64748b !important;
    font-size: 13px !important;
    margin-bottom: 10px !important;
}

@media (max-width: 767.98px) {
    .vf-req-box {
        flex-direction: column !important;
    }
    .vf-req-box h5 {
        width: 100% !important;
        border-right: none !important;
        border-bottom: 1px solid #e2e8f0 !important;
        flex-direction: row !important;
        gap: 12px;
        text-align: left !important;
    }
    .vf-req-box h5::before {
        margin-bottom: 0;
        min-width: 36px;
    }
}

/* ---- Feature cards ---- */
section.vf-features {
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
}

.vf-features .vf-feature-card {
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    padding: 2rem 1.5rem !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
}

.vf-features .vf-feature-card:hover {
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.09) !important;
    transform: translateY(-2px) !important;
}

.vf-icon-box {
    background: #eff6ff !important;
    color: #1e3a8a !important;
    border-radius: 14px !important;
    width: 60px !important;
    height: 60px !important;
}

.vf-features .vf-feature-card h5 {
    color: #1e293b !important;
    font-weight: 700 !important;
    font-size: 15px !important;
}

.vf-features .vf-feature-card p {
    color: #64748b !important;
    font-size: 13px !important;
}

/* ---- Connecting line between steps (desktop) ---- */
.vf-step:not(:first-child)::before {
    background: #e2e8f0 !important;
}

/* ---- Trust section (Reviews.io) ---- */
#trustpilotsec a {
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

#trustpilotsec .rating-start-box {
    font-size: 14px !important;
    margin: 0 !important;
    line-height: 1 !important;
}

#trustpilotsec img {
    height: 22px !important;
    width: auto !important;
}

/* ---- Span red asterisk ---- */
#spanId {
    color: #ef4444 !important;
    font-weight: 600 !important;
}

/* ---- Mobile adjustments ---- */
@media (max-width: 767.98px) {
    div#applicationForm {
        border-radius: 12px !important;
    }

    div#step1Form,
    div#step2Form {
        padding: 16px !important;
    }

    div#newformHeader {
        padding: 16px !important;
    }

    .newFormLabel {
        font-size: 22px !important;
    }

    #firstPageSideSec {
        margin-top: 20px !important;
    }

    button.Hero-Section-application-btn {
        font-size: 15px !important;
        padding: 14px 20px !important;
    }

    div#form-help-section {
        width: 100% !important;
        margin-top: 16px !important;
    }

    section#apply {
        padding-top: 16px !important;
        padding-bottom: 24px !important;
    }
}

@media (max-width: 575.98px) {
    .newFormLabel {
        font-size: 20px !important;
    }

    div#newformHeader {
        padding: 14px 14px !important;
    }

    div#step1Form,
    div#step2Form {
        padding: 14px !important;
    }
}

/* ---- Value Added box images ---- */
.vab-icon {
    width: 22px !important;
    height: 22px !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
}

/* Better gap and alignment inside Value Added box */
div#valueAddedBox {
    background: #E2F5E9 !important;
    border: 1px solid #24721eeb !important;
    border-radius: 12px !important;
    padding: 14px 16px !important;
    margin-bottom: 14px !important;
}

div#valueAddedBox .d-flex {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 6px 0 !important;
    align-items: flex-start !important;
    gap: 8px !important;
    border-bottom: 1px solid rgba(36, 114, 30, 0.12);
}

div#valueAddedBox .d-flex:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

div#valueAddedBox #boxHeader {
    padding-bottom: 10px !important;
    border-bottom: 1px solid rgba(36, 114, 30, 0.2) !important;
    margin-bottom: 6px !important;
}

div#valueAddedBox #boxHeader .vab-icon {
    width: 20px !important;
    height: 20px !important;
}

div#valueAddedBox .iconElm {
    padding-top: 2px !important;
    flex-shrink: 0 !important;
    width: 22px !important;
    text-align: center;
}

div#valueAddedBox .valueTextelm {
    font-size: 12px !important;
    color: #1a4d1a !important;
    line-height: 1.55 !important;
    padding-top: 2px;
}

div#valueAddedBox #boxHeader span.fw-bold {
    font-weight: 700 !important;
    font-size: 13px !important;
    color: #14532d !important;
}

/* Connecting line tweak for process steps */
.vf-steps-row {
    padding-top: 30px !important;
}

.vf-step:not(:first-child)::before {
    top: 52px !important;
}