/* Global form outline override: use soft blue/gray instead of red */
.form-control,
.typeahead.tt-input,
.typeahead.tt-hint,
.form-select,
.form-control-color,
.form-check-input,
textarea.form-control {
    border-color: #cfd8e3;
}

.form-control:focus,
.typeahead.tt-input:focus,
.typeahead.tt-hint:focus,
.form-select:focus,
.form-check-input:focus,
textarea.form-control:focus {
    border-color: #9ec5fe;
    box-shadow: 0 0 0 0.2rem rgba(158, 197, 254, 0.22);
}

.was-validated .form-control:invalid,
.form-control.is-invalid,
.was-validated .typeahead.tt-input:invalid,
.was-validated .typeahead.tt-hint:invalid,
.is-invalid.typeahead.tt-input,
.is-invalid.typeahead.tt-hint,
.was-validated textarea.form-control:invalid,
textarea.form-control.is-invalid,
.was-validated .form-select:invalid,
.form-select.is-invalid,
.was-validated .form-control-color:invalid,
.form-control-color.is-invalid,
.was-validated .form-check-input:invalid,
.form-check-input.is-invalid {
    border-color: #b8c8da !important;
}

.was-validated .form-control:invalid:focus,
.form-control.is-invalid:focus,
.was-validated .typeahead.tt-input:invalid:focus,
.was-validated .typeahead.tt-hint:invalid:focus,
.is-invalid.typeahead.tt-input:focus,
.is-invalid.typeahead.tt-hint:focus,
.was-validated textarea.form-control:invalid:focus,
textarea.form-control.is-invalid:focus,
.was-validated .form-select:invalid:focus,
.form-select.is-invalid:focus,
.was-validated .form-check-input:invalid:focus,
.form-check-input.is-invalid:focus {
    border-color: #9ec5fe !important;
    box-shadow: 0 0 0 0.2rem rgba(158, 197, 254, 0.22) !important;
}

input[style*="border-color: red"],
select[style*="border-color: red"],
textarea[style*="border-color: red"] {
    border-color: #b8c8da !important;
}

/* Info transfer start buttons: align with consulate green branding */
.btn-consulate-solid {
    color: #fff;
    background-color: #033215;
    border-color: #033215;
}

.btn-consulate-solid:hover,
.btn-consulate-solid:focus,
.btn-consulate-solid:active,
.btn-consulate-solid.active,
.show > .btn-consulate-solid.dropdown-toggle {
    color: #fff;
    background-color: #05411d;
    border-color: #05411d;
}

.btn-consulate-solid:focus {
    box-shadow: 0 0 0 0.2rem rgba(3, 50, 21, 0.22);
}

.btn-consulate-outline {
    color: #033215;
    background-color: #fff;
    border-color: #033215;
}

.btn-consulate-outline:hover,
.btn-consulate-outline:focus,
.btn-consulate-outline:active,
.btn-consulate-outline.active,
.show > .btn-consulate-outline.dropdown-toggle {
    color: #033215;
    background-color: #e9f5ee;
    border-color: #033215;
}

.btn-consulate-outline:focus {
    box-shadow: 0 0 0 0.2rem rgba(3, 50, 21, 0.15);
}

/* Keep sidebars still on hover (admin + user) */
.sidebar,
.sidebar * {
    animation: none !important;
}

.sidebar .nav .nav-item,
.sidebar .nav .nav-item .nav-link,
.sidebar .nav .nav-item .nav-link i,
.sidebar .nav .nav-item .nav-link .menu-title,
.sidebar .nav .nav-item .nav-link .menu-arrow,
.sidebar .nav .nav-item::before,
.sidebar .nav .nav-item::after {
    transition: none !important;
    transform: none !important;
}

.sidebar .nav .nav-item .nav-link:hover,
.sidebar .nav .nav-item .nav-link:focus,
.sidebar .nav .sub-menu .nav-item .nav-link:hover,
.sidebar .nav .sub-menu .nav-item .nav-link:focus,
.sidebar .nav:not(.sub-menu) > .nav-item:hover > .nav-link,
.sidebar .nav:not(.sub-menu) > .nav-item > .nav-link[aria-expanded="true"] {
    background: inherit !important;
    color: inherit !important;
    margin-right: 0 !important;
}

.sidebar .nav .nav-item .nav-link:hover i,
.sidebar .nav .nav-item .nav-link:focus i,
.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-icon,
.sidebar .nav .nav-item .nav-link:hover .menu-title,
.sidebar .nav .nav-item .nav-link:focus .menu-title,
.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-title,
.sidebar .nav .nav-item .nav-link:hover .menu-arrow,
.sidebar .nav .nav-item .nav-link:focus .menu-arrow,
.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-arrow {
    color: inherit !important;
}

.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-title,
.sidebar .sidebar-body .nav.sub-menu .nav-item:hover .nav-link,
.sidebar .sidebar-body .nav.sub-menu .nav-item:hover .nav-link::before {
    margin-right: 0 !important;
    background: transparent !important;
    color: inherit !important;
    border-color: inherit !important;
}

.sidebar .sidebar-body .nav .nav-item .nav-link .link-title,
.sidebar .sidebar-body .nav.sub-menu .nav-item .nav-link {
    margin-right: 0 !important;
}

.sidebar .sidebar-body .nav > .nav-item:first-child .nav-link .link-title {
    margin-right: 30px !important;
}

.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-icon,
.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-arrow {
    transform: none !important;
}

/* Info transfer wizard: unified typography and spacing across 3 forms */
.wizard-passport-flow,
.wizard-id-flow,
.wizard-info-flow {
    font-family:
        "Noto Kufi Arabic", "Noto Naskh Arabic", Tahoma, Arial, sans-serif;
}

.wizard-passport-flow > h3,
.wizard-id-flow > h3,
.wizard-info-flow > h3 {
    font-family: inherit !important;
    font-weight: 700 !important;
    margin-bottom: 24px !important;
    line-height: 1.6;
}

.wizard-passport-flow > hr,
.wizard-id-flow > hr,
.wizard-info-flow > hr {
    margin: 0 0 22px 0 !important;
}

.wizard-passport-flow h4,
.wizard-id-flow h4,
.wizard-info-flow h4 {
    font-family: inherit !important;
    font-weight: 600 !important;
    margin-top: 34px !important;
    margin-bottom: 14px !important;
    line-height: 1.55;
}

.wizard-passport-flow h4:first-of-type,
.wizard-id-flow h4:first-of-type,
.wizard-info-flow h4:first-of-type {
    margin-top: 16px !important;
}

.wizard-passport-flow .row[style*="margin-bottom:"],
.wizard-id-flow .row[style*="margin-bottom:"],
.wizard-info-flow .row[style*="margin-bottom:"] {
    margin-bottom: 18px !important;
}

.wizard-passport-flow label,
.wizard-id-flow label,
.wizard-info-flow label {
    font-family: inherit;
    font-weight: 600;
}

.wizard-passport-flow input,
.wizard-passport-flow select,
.wizard-passport-flow textarea,
.wizard-id-flow input,
.wizard-id-flow select,
.wizard-id-flow textarea,
.wizard-info-flow input,
.wizard-info-flow select,
.wizard-info-flow textarea,
.wizard-flow-submit-row .btn {
    font-family: inherit;
}

.wizard-passport-flow.wizard-address-flow > h3 {
    margin-top: 36px !important;
}

.wizard-flow-submit-row {
    margin-top: 30px !important;
    margin-bottom: 4px !important;
}

.wizard-flow-submit-row .btn {
    min-width: 240px;
}

/* Wizard forms: make missing/invalid fields clearly red after submit attempt */
form.wizard-submit-attempted .wizard-passport-flow .form-control:invalid,
form.wizard-submit-attempted .wizard-passport-flow .form-select:invalid,
form.wizard-submit-attempted .wizard-passport-flow .form-check-input:invalid,
form.wizard-submit-attempted .wizard-id-flow .form-control:invalid,
form.wizard-submit-attempted .wizard-id-flow .form-select:invalid,
form.wizard-submit-attempted .wizard-id-flow .form-check-input:invalid,
form.wizard-submit-attempted .wizard-info-flow .form-control:invalid,
form.wizard-submit-attempted .wizard-info-flow .form-select:invalid,
form.wizard-submit-attempted .wizard-info-flow .form-check-input:invalid,
.wizard-passport-flow .form-control.is-invalid,
.wizard-passport-flow .form-select.is-invalid,
.wizard-passport-flow .form-check-input.is-invalid,
.wizard-id-flow .form-control.is-invalid,
.wizard-id-flow .form-select.is-invalid,
.wizard-id-flow .form-check-input.is-invalid,
.wizard-info-flow .form-control.is-invalid,
.wizard-info-flow .form-select.is-invalid,
.wizard-info-flow .form-check-input.is-invalid {
    border-color: #dc3545 !important;
}

form.wizard-submit-attempted .wizard-passport-flow .form-control:invalid:focus,
form.wizard-submit-attempted .wizard-passport-flow .form-select:invalid:focus,
form.wizard-submit-attempted
    .wizard-passport-flow
    .form-check-input:invalid:focus,
form.wizard-submit-attempted .wizard-id-flow .form-control:invalid:focus,
form.wizard-submit-attempted .wizard-id-flow .form-select:invalid:focus,
form.wizard-submit-attempted .wizard-id-flow .form-check-input:invalid:focus,
form.wizard-submit-attempted .wizard-info-flow .form-control:invalid:focus,
form.wizard-submit-attempted .wizard-info-flow .form-select:invalid:focus,
form.wizard-submit-attempted .wizard-info-flow .form-check-input:invalid:focus,
.wizard-passport-flow .form-control.is-invalid:focus,
.wizard-passport-flow .form-select.is-invalid:focus,
.wizard-passport-flow .form-check-input.is-invalid:focus,
.wizard-id-flow .form-control.is-invalid:focus,
.wizard-id-flow .form-select.is-invalid:focus,
.wizard-id-flow .form-check-input.is-invalid:focus,
.wizard-info-flow .form-control.is-invalid:focus,
.wizard-info-flow .form-select.is-invalid:focus,
.wizard-info-flow .form-check-input.is-invalid:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.2) !important;
}

/* Passport wizard (Pakistani passport section): force red outline on empty required fields */
.wizard-passport-flow input[name="current_passport_no"]:invalid,
.wizard-passport-flow input[name="issue_date_passport"]:invalid,
.wizard-passport-flow input[name="expiry_date_passport"]:invalid,
.wizard-passport-flow input[name="place_issue"]:invalid,
.wizard-passport-flow input[name="place_issue_eng"]:invalid {
    border: 1px solid #dc3545 !important;
}

.wizard-passport-flow input[name="current_passport_no"]:invalid:focus,
.wizard-passport-flow input[name="issue_date_passport"]:invalid:focus,
.wizard-passport-flow input[name="expiry_date_passport"]:invalid:focus,
.wizard-passport-flow input[name="place_issue"]:invalid:focus,
.wizard-passport-flow input[name="place_issue_eng"]:invalid:focus {
    border: 1px solid #dc3545 !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.2) !important;
}

/* Freeze desktop sidebar layout so the content area never shifts */
@media (min-width: 992px) {
    .main-wrapper .page-wrapper,
    .sidebar,
    .sidebar .sidebar-header,
    .sidebar .sidebar-body,
    .sidebar .sidebar-body .nav .nav-item .nav-link .link-title,
    .sidebar .sidebar-body .nav .nav-item .nav-link .link-arrow {
        transition: none !important;
    }

    .main-wrapper .page-wrapper:not(.full-page) {
        width: calc(100% - 240px) !important;
        margin-right: 240px !important;
    }

    .main-wrapper .page-wrapper.full-page {
        width: 100% !important;
        margin-right: 0 !important;
    }

    .sidebar,
    .sidebar-folded:not(.open-sidebar-folded) .sidebar {
        width: 240px !important;
    }

    .sidebar .sidebar-header,
    .sidebar-folded .sidebar .sidebar-header {
        width: 240px !important;
    }

    .sidebar-folded .page-wrapper:not(.full-page),
    .sidebar-folded .page-wrapper:not(.full-page) .navbar {
        width: calc(100% - 240px) !important;
        margin-right: 240px !important;
        right: 240px !important;
        left: 0 !important;
    }
}