/* Screen corrections shared by the existing Web Forms themes. */
@media screen {
    /* Reuse the bundled Font Awesome 4.7 font; some legacy theme font URLs are missing. */
    @font-face {
        font-family: FontAwesome;
        src: url('../UPFDashContents/fonts/fontawesome-webfont.woff2') format('woff2');
        font-weight: normal;
        font-style: normal;
        font-display: swap;
    }
    body.portal-screen {
        color: #243247;
        background-color: #f5f7fa;
        font-family: "Segoe UI", Arial, sans-serif;
        font-size: 15px;
        line-height: 1.5;
        overflow-x: visible;
    }
    .portal-screen .container, .portal-screen .container-fluid,
    .portal-screen .content-wrapper, .portal-screen .centre,
    .portal-screen .widget, .portal-screen .widget-content,
    .portal-screen .service-request-form, .portal-screen fieldset,
    .portal-screen [class*="col-"], .portal-screen .form-group {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
    .portal-screen .centre { width: 100%; margin: 0 auto; }
    /* Legacy theme sections had a fixed 891px height, allowing forms to cross the footer. */
    .portal-screen .s-padding { height: auto; min-height: 0; padding-top: 28px; padding-bottom: 28px; }
    .s-padding:has(.portal-print-preview) { height: auto; min-height: 0; }
    .portal-screen > .header { margin-bottom: 0 !important; }
    .portal-screen > .footer { position: static; float: none; clear: both; width: 100%; max-width: none; padding: 0; }
    .portal-screen #main-nav-collapse,
    .portal-screen #main-nav .nav-item .row { margin-top: 0 !important; }
    .portal-screen #main-nav .navbar-nav { align-items: center; gap: 12px; }
    .portal-screen #main-nav .nav-item .row { align-items: center; flex-wrap: wrap; margin-left: 0; margin-right: 0; }
    .portal-screen #main-nav .nav-item .row > div { flex: 0 1 auto; width: auto; max-width: 100%; padding: 0 6px; }
    .portal-screen #main-nav .navbar-brand img { height: 72px !important; }
    .portal-screen .main-banner { padding: 40px 0; height: auto; min-height: 0; }
    .portal-screen .main-banner .container { width: 100%; max-width: 1200px; }
    .portal-screen .main-banner .banner-content { padding: 0; margin: 0; }
    .portal-screen .main-banner .banner-content .title { font-size: clamp(28px, 3vw, 40px); line-height: 1.25; }
    .portal-screen .main-banner .banner-content .sub-title { font-size: 16px; line-height: 1.6; }
    .portal-screen .main-banner .btn-wrapper { margin-top: 24px; }
    .portal-screen .main-banner .banner-img { margin: 0; padding: 0; transform: none; }
    .portal-screen .main-banner .banner-img img { display: block; width: 100%; max-height: 360px; object-fit: contain; }
    .portal-screen .main-banner .swiper-slide { margin-top: 0 !important; height: auto; }
    .portal-screen .main-banner .swiper-container { padding-bottom: 36px; }
    /* Swiper handles slide visibility; delayed inner animations left headings blank during transitions. */
    .portal-screen .iconic-top-slider .banner-content .title,
    .portal-screen .iconic-top-slider .banner-content .sub-title,
    .portal-screen .iconic-top-slider .banner-content .btn-wrapper,
    .portal-screen .iconic-top-slider .h2-img-shadow { opacity: 1; transform: none; transition: none; }
    /* The bundled public Bootstrap file offsets every column by -49px/-4px. */
    .portal-screen .col,
    .portal-screen [class*="col-"]:not([class*="-push-"]):not([class*="-pull-"]) {
        top: auto;
        left: auto;
    }
    .portal-screen .content { padding: 16px; }
    .portal-screen .widget, .portal-screen .well,
    .portal-screen .service-request-form {
        border: 1px solid #dce2ea;
        border-radius: 6px;
        background: #fff;
        box-shadow: 0 2px 8px rgba(12, 24, 79, .05);
    }
    .portal-screen .service-request-form { padding: 20px; }
    .portal-screen h1, .portal-screen h2, .portal-screen h3,
    .portal-screen p, .portal-screen label, .portal-screen legend,
    .portal-screen .alert, .portal-screen .list-group-item {
        overflow-wrap: anywhere;
    }
    .portal-screen h1 { font-size: 30px; line-height: 1.25; }
    .portal-screen h2 { font-size: 26px; line-height: 1.3; }
    .portal-screen h3 { font-size: 22px; line-height: 1.35; }
    .portal-screen .form-group { margin-bottom: 18px; }
    .portal-screen .form-group > label:first-child { display: block; margin-bottom: 6px; }
    .portal-screen input, .portal-screen select, .portal-screen textarea,
    .portal-screen button, .portal-screen .btn {
        box-sizing: border-box;
        max-width: 100%;
    }
    .portal-screen .form-control, .portal-screen input.txt,
    .portal-screen select.txt, .portal-screen textarea.txt {
        border: 1px solid #aebbc9;
        border-radius: 4px;
        min-height: 40px;
        color: #243247;
        background-color: #fff;
    }
    .portal-screen textarea { resize: vertical; }
    .portal-screen input[type="file"] { width: 100%; white-space: normal; }
    .portal-screen input[type="checkbox"], .portal-screen input[type="radio"] {
        width: auto; min-height: 0; margin-right: 6px;
    }
    .portal-screen input:disabled, .portal-screen select:disabled,
    .portal-screen textarea:disabled, .portal-screen input[readonly] {
        background-color: #edf1f5; color: #526174;
    }
    .portal-screen .btn { white-space: normal; overflow-wrap: anywhere; min-height: 38px; }
    .portal-screen a:focus-visible, .portal-screen button:focus-visible,
    .portal-screen input:focus-visible, .portal-screen select:focus-visible,
    .portal-screen textarea:focus-visible, .portal-table-scroll:focus-visible {
        outline: 3px solid #196bb3; outline-offset: 3px;
    }
    .portal-screen .alert { height: auto; padding: 12px 16px; margin-bottom: 16px; }
    .portal-screen .form-inline { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-width: 0; max-width: 100%; }
    .portal-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin: 12px 0; }
    .portal-summary { max-width: 720px; margin: 20px auto; }
    .portal-screen .portal-summary .alert { width: 100%; }
    .portal-screen img:not(.cboxPhoto), .portal-screen video { max-width: 100%; object-fit: contain; }
    .portal-screen .portal-brand-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .portal-screen .portal-brand-row img { min-width: 0; max-width: 70%; object-fit: contain; }
    .portal-screen #main-nav { position: relative; top: auto; }
    .portal-screen #main-nav > .container-fluid { min-height: 85px; height: auto; }
    .portal-screen .navbar-brand { max-width: 100%; white-space: normal; }
    .portal-screen #main-nav .navbar-brand img { max-width: 100%; object-fit: contain; }
    .portal-screen nav#menu { clear: both; }
    .portal-screen nav#menu::after { content: ""; display: table; clear: both; }
    .portal-screen nav#menu a { overflow-wrap: anywhere; }
    .portal-screen nav#menu input[type="checkbox"] {
        display: block; position: absolute; width: 1px; height: 1px;
        clip-path: inset(50%); overflow: hidden;
    }
    .portal-screen nav#menu:focus-within { outline: 2px solid #196bb3; outline-offset: 2px; }
    .portal-screen nav#menu li:focus-within > input + .sub-menu { display: block; }
    .portal-screen .modal-dialog { max-width: calc(100% - 24px); margin: 12px auto; }
    .portal-screen .modal-body { max-height: 70vh; overflow-y: auto; overflow-wrap: anywhere; }
    .portal-screen .modal-footer { display: flex; flex-wrap: wrap; gap: 8px; }
    .portal-screen .select2-container { max-width: 100%; }
    .portal-screen .select2-selection__rendered { overflow-wrap: anywhere; }
    .portal-screen .dataTables_wrapper { min-width: 0; }
    .portal-screen .dataTables_filter input { max-width: 100%; }
    .portal-screen .dataTables_filter label { white-space: normal; }
    .portal-screen .dt-buttons { display: flex; flex-wrap: wrap; gap: 4px; }
    .portal-table-scroll, .portal-print-preview {
        box-sizing: border-box;
        width: 100%; max-width: 100%; min-width: 0;
        overflow-x: auto; -webkit-overflow-scrolling: touch;
    }
    .portal-table-scroll { margin: 16px 0; border: 1px solid #dce2ea; border-radius: 4px; background: white; }
    .portal-table-scroll > table { width: 100%; border-collapse: collapse; }
    .portal-table-scroll th, .portal-table-scroll td { padding: 10px 12px; vertical-align: top; overflow-wrap: anywhere; }
    .portal-table-scroll th { background: #edf2f8; color: #0c184f; font-weight: 600; }
    .portal-table-scroll tbody tr:hover { background-color: #f3f6fa; }
    .portal-table-scroll td .btn { margin: 2px; }
    .portal-screen .portal-chart { width: 100%; min-width: 0; }
    .portal-screen .flot-chart-content { width: 100%; max-width: 100%; min-width: 0; }
    .portal-screen .footer-amp { margin-top: 24px; }
    .portal-screen .f-copyright-area .row { margin-left: 0; margin-right: 0; }
    .portal-report-filters { width: 100%; min-width: 0; }
    .portal-report-filters > fieldset > .row { margin-left: 0; margin-right: 0; }
    .portal-screen .custom-page-footer { position: relative; bottom: auto; height: auto; min-height: 52px; clear: both; }
    #extr-page .portal-screen #main { position: relative; min-width: 0; width: 100%; margin: 0; padding: 24px 0; }
    #extr-page .portal-screen #header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; height: auto; min-height: 105px; gap: 12px; }
    #extr-page .portal-screen #extr-page-header-space { margin: 0; padding: 12px; }
    .portal-screen .portal-content-column { padding-left: 24px; }
    .portal-screen .portal-field-group { padding-left: 0; }
    .portal-screen .portal-action-column { padding-left: 15px; }
    @media (max-width: 767px) {
        .portal-screen #main-nav .navbar-nav { align-items: stretch; }
        .portal-screen .main-banner { padding: 28px 0; }
        .portal-screen .main-banner .banner-img { margin-top: 24px; }
        .portal-screen .main-banner .banner-img img { max-height: 240px; }
        .portal-screen .container, .portal-screen .container-fluid { padding-left: 15px; padding-right: 15px; }
        .portal-screen .content, .portal-screen .service-request-form { padding: 12px; }
        .portal-screen .portal-stack-column { float: none; flex: 0 0 100%; width: 100%; max-width: 100%; }
        .portal-screen .portal-content-column { padding-left: 15px; border-left: 0; }
        .portal-screen .navbar-fixed-top { position: relative; }
        .portal-screen .navbar-nav, .portal-screen .nav-button { margin: 0; }
        .portal-screen #main-nav .navbar-collapse { width: 100%; }
        .portal-screen #main-nav .nav-button { padding: 8px; }
        .portal-screen .form-inline > .form-control { width: 100%; }
        .portal-screen .dataTables_filter, .portal-screen .dataTables_length { float: none; text-align: left; }
        .portal-screen .dataTables_filter input { width: 100%; margin-left: 0; }
        .portal-screen .alertify-notifier { max-width: calc(100vw - 24px); }
        .portal-screen .alertify-notifier .ajs-message { max-width: calc(100vw - 24px); }
        .portal-screen .h4-testimonial { padding-top: 24px; padding-bottom: 24px; }
        .portal-screen .page-wrapper { margin-left: 0; }
        .portal-screen .card-body { min-width: 0; }
    }
    @media (prefers-reduced-motion: reduce) {
        .portal-screen .btn, .portal-screen nav a, .portal-screen .modal.fade .modal-dialog {
            transition: none; animation: none;
        }
        .portal-screen .main-banner .title, .portal-screen .main-banner .sub-title,
        .portal-screen .main-banner .btn-wrapper, .portal-screen .scroll-next-sec i {
            transition: none; animation: none;
        }
    }
}

/* Personal-details form: isolate the layout from the mixed legacy grid themes. */
@media screen {
    .portal-application .header { margin-bottom: 0 !important; }
    .portal-application .footer { position: static; float: none; width: 100%; max-width: none; padding: 0; clear: both; }
    .portal-application .h4-testimonial { height: auto; min-height: 0; overflow: visible; }
    .portal-application #main-nav .navbar-brand img { height: 72px !important; }
    .portal-application #main-nav-collapse,
    .portal-application #main-nav .nav-item .row { margin-top: 0 !important; }
    .portal-application #main-nav .navbar-nav { align-items: center; gap: 12px; }
    .portal-application #main-nav .nav-item .row { align-items: center; flex-wrap: nowrap; }
    .portal-application #main-nav .nav-item .row > div { flex: 0 1 auto; width: auto; max-width: 100%; padding: 0 6px; }
    .portal-application .h4-testimonial { padding: 28px 0; }
    .portal-application form > .container-fluid { width: 100%; max-width: 1240px; margin: 0 auto; }
    .portal-application .portal-content-column { border-left: 0 !important; }
    .portal-application .portal-content-column > h3 { border: 0 !important; margin: 0 0 20px; font-size: 24px; }
    .portal-application .portal-application-card { margin: 0; padding: 0; }
    .portal-application .portal-application-card > div { padding: 0; }
    .portal-application .portal-application-card h5:empty,
    .portal-application .portal-application-card h5:has(> span:only-child:empty) { display: none; }
    .portal-application .service-request-form { padding: 24px !important; }
    .portal-application #w0 > .container-fluid { padding: 0; }
    .portal-application #divmain { padding: 0 !important; }
    .portal-application #divmain > .row,
    .portal-application #divrturning > .row {
        display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 2.5fr);
        gap: 8px 20px; align-items: start; margin: 0 0 20px; padding: 0 !important;
    }
    /* Bootstrap 3 clearfix pseudo-elements otherwise occupy CSS grid cells. */
    .portal-application #divmain > .row::before,
    .portal-application #divmain > .row::after,
    .portal-application #divrturning > .row::before,
    .portal-application #divrturning > .row::after { display: none; }
    .portal-application #divmain > .row > div,
    .portal-application #divrturning > .row > div {
        width: auto; max-width: none; min-width: 0; padding: 0 !important;
    }
    .portal-application #divmain > .row > div:first-child label,
    .portal-application #divrturning > .row > div:first-child label {
        font: 600 14px/1.5 "Segoe UI", Arial, sans-serif !important;
        margin: 0; padding-top: 11px;
    }
    .portal-application #divmain > .row > div:nth-child(2),
    .portal-application #divrturning > .row > div:nth-child(2) { position: relative; padding-right: 14px !important; }
    .portal-application #w0 .txt,
    .portal-application #w0 .errorClass {
        width: 100% !important; min-height: 44px; border-radius: 5px;
        font-family: "Segoe UI", Arial, sans-serif; padding: 9px 12px;
    }
    .portal-application #divmain > .row > div:nth-child(2) > span[id^="Span"],
    .portal-application #divmain > .row > div:nth-child(2) > span[id^="sp"] {
        position: absolute; right: 0; top: 11px; line-height: 20px;
    }
    .portal-application #divmain > .row > div:nth-child(3),
    .portal-application #divrturning > .row > div:nth-child(3) {
        grid-column: 2; font-size: 13px; color: #526174;
    }
    .portal-application #w0 input[type="radio"] { margin: 8px 5px 8px 0; }
    .portal-application #w0 input[type="radio"] + label { margin: 0 16px 8px 0; }
    .portal-application #div1 { padding: 16px !important; margin: 8px 0 24px; background: #fff8e8; border-left: 3px solid #c17a00; }
    .portal-application #div1 span { color: #765000 !important; font-size: 14px !important; }
    .portal-application #btnSaveBioData, .portal-application #btnRtproceed { min-width: 150px; background: #123d68; color: #fff; border-color: #123d68; }
    .portal-welcome #banner { padding: 48px 0; min-height: 0; height: auto; }
    .portal-welcome #banner .container { width: 100%; max-width: 1200px; }
    .portal-welcome #banner .banner-content { padding: 0; margin: 0; }
    .portal-welcome #banner .title { font-size: clamp(28px, 3vw, 40px); line-height: 1.25; margin: 0 0 20px; }
    .portal-welcome #banner .sub-title { font-size: 16px; line-height: 1.7; margin: 0 0 20px; }
    .portal-welcome #banner .btn-wrapper:not(.hidden) { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
    .portal-welcome #banner .btn-wrapper .btn { margin: 0; padding: 12px 18px; }
    .portal-welcome #banner .btn-wrapper .sub-title { flex-basis: 100%; }
    .portal-welcome #banner .banner-img { margin: 0; padding: 0; transform: none; }
    .portal-welcome #banner .banner-img img { display: block; width: 100%; max-height: 390px; object-fit: contain; }
    .portal-welcome #particles { pointer-events: none; }
    @media (max-width: 767px) {
        .portal-welcome #banner { padding: 28px 0; }
        .portal-welcome #banner .banner-img { margin-top: 28px; }
        .portal-welcome #banner .banner-img img { max-height: 240px; }
        .portal-welcome #banner .btn-wrapper .btn { width: 100%; }
        .portal-application .service-request-form { padding: 18px !important; }
        .portal-application .portal-content-column { padding: 15px; }
        .portal-application #divmain > .row,
        .portal-application #divrturning > .row { grid-template-columns: minmax(0, 1fr); gap: 6px; }
        .portal-application #divmain > .row > div:nth-child(3),
        .portal-application #divrturning > .row > div:nth-child(3) { grid-column: 1; }
        .portal-application #divmain > .row > div:first-child label,
        .portal-application #divrturning > .row > div:first-child label { padding-top: 0; }
        .portal-application #main-nav .navbar-nav { align-items: stretch; }
    }
}

@media print {
    /* The screen wrapper must not inherit the legacy theme's 11px print margin. */
    .portal-print-preview { margin: 0; padding: 0; border: 0; }
}


/* Compact the document screens without changing their printed layout. */
@media screen {
    .portal-screen.portal-document-page #main-nav {
        margin-bottom: 0;
    }
    .portal-screen.portal-document-page:not(.portal-application) .h4-testimonial {
        margin-top: 0 !important;
        padding-top: 24px;
        top: auto;
    }
    .portal-document-page .h4-testimonial .container.row > .non-printable,
    .portal-document-page .h4-testimonial #rgtDiv {
        padding-top: 0 !important;
    }
    .portal-screen.portal-document-page #main-nav .nav-item .row {
        display: flex;
        align-items: baseline;
        flex-wrap: nowrap;
        gap: 8px;
    }
    .portal-screen.portal-document-page #main-nav .nav-item .row > div {
        float: none;
        padding: 0 !important;
        font-size: 14px;
        line-height: 1.5;
    }
    .portal-document-page #main-nav .nav-item .row::before,
    .portal-document-page #main-nav .nav-item .row::after {
        display: none;
    }
}

/* Portal visual refresh. AppMain owns its approved styles; never match that page.
   Keep document/print geometry and vendor assets independent of this layer. */
@media screen {
    .portal-screen:not(.portal-application) { --portal-navy: #204d80; --portal-ink: #253851; --portal-muted: #65758a; --portal-line: #dce4ee; background: #f3f6fa !important; color: var(--portal-ink); font-family: "Segoe UI", Arial, sans-serif; font-size: 14px; line-height: 1.6; }
    .portal-screen:not(.portal-application) :is(h1,h2,h3,h4):not(.portal-print-preview *) { color: #193756; font-family: "Segoe UI", Arial, sans-serif; font-weight: 600; letter-spacing: -.3px; }
    .portal-screen:not(.portal-application) :is(h1,h2,h3):not(.portal-print-preview *) { line-height: 1.3; }
    .portal-screen:not(.portal-application) h1:not(.portal-print-preview *) { font-size: 30px; }
    .portal-screen:not(.portal-application) h2:not(.portal-print-preview *) { font-size: 25px; }
    .portal-screen:not(.portal-application) h3:not(.portal-print-preview *) { font-size: 21px; }
    .portal-screen:not(.portal-application) :is(.h4-testimonial,.bg-color,.content-wrapper) { background-color: #f3f6fa; }
    .portal-screen:not(.portal-application) .h4-testimonial { padding: 36px 0 52px; }
    .portal-screen:not(.portal-application) .h4-testimonial > .container, .portal-screen:not(.portal-application) .h4-testimonial > .container-fluid,
    .portal-screen:not(.portal-application) .h4-testimonial > form > .container-fluid { width: 100%; max-width: 1320px; padding-left: 32px; padding-right: 32px; margin: auto; }

    /* Public navigation: retain its existing collapse/menu behavior. */
    .portal-screen:not(.portal-application) #main-nav { background: #fff; border-top: 4px solid #163f70; border-bottom: 1px solid var(--portal-line); border-radius: 0; box-shadow: none; padding: 12px 24px; }
    .portal-screen:not(.portal-application) #main-nav > .container-fluid { max-width: 1320px; margin: auto; min-height: 68px; gap: 20px; }
    .portal-screen:not(.portal-application) #main-nav .navbar-brand { margin: 0 auto 0 0; padding: 0; height: auto; max-width: 340px; }
    .portal-screen:not(.portal-application) #main-nav .navbar-brand img { height: 64px !important; width: auto; max-width: 100%; }
    .portal-screen:not(.portal-application) #main-nav .navbar-nav { gap: 8px; }
    .portal-screen:not(.portal-application) #main-nav .nav-link { color: #42546a; font: 500 14px/1.5 "Segoe UI", Arial, sans-serif; padding: 10px 12px; }
    .portal-screen:not(.portal-application) #main-nav .nav-link:hover { color: #204d80; background: #edf3fa; border-radius: 6px; }
    .portal-screen:not(.portal-application) #main-nav .nav-item:has(> a:empty) { display: none; }
    .portal-screen:not(.portal-application) #main-nav .nav-item .row { flex-wrap: wrap; gap: 4px; margin: 0 !important; font-size: 13px; }
    .portal-screen:not(.portal-application) #main-nav .nav-item .row i { font-style: normal; }
    .portal-screen:not(.portal-application) #main-nav .nav-item .row .nav-link { padding: 0; }
    .portal-screen:not(.portal-application) #main-nav .nav-button { padding: 0 8px; margin: 0; }
    .portal-screen:not(.portal-application) #main-nav .nav-button > a { background: #204d80; color: white; padding: 11px 18px; border-radius: 7px; font: 600 14px/1.5 "Segoe UI", Arial, sans-serif; box-shadow: none; }
    .portal-screen:not(.portal-application) #main-nav .nav-button img { max-height: 54px; width: auto; }

    /* Existing sidebar/content pairs share a dependable two-column grid. */
    .portal-screen:not(.portal-application) .row:has(> .portal-content-column) { display: grid; grid-template-columns: 230px minmax(0,1fr); gap: 32px; margin: 0; align-items: start; }
    .portal-screen:not(.portal-application) .row:has(> .portal-content-column)::before,
    .portal-screen:not(.portal-application) .row:has(> .portal-content-column)::after { display: none; }
    .portal-screen:not(.portal-application) .row:has(> .portal-content-column) > [class*="col-"] { width: 100%; max-width: 100%; float: none; padding: 0 !important; border-left: 0 !important; }
    .portal-screen:not(.portal-application) .portal-content-column > :is(h1,h2,h3) { border: 0 !important; margin: 0 0 24px; font-size: 28px; }
    .portal-screen:not(.portal-application) .list-group { border: 0; box-shadow: none; border-radius: 9px; overflow: hidden; }
    .portal-screen:not(.portal-application) .list-group-item { width: 100%; border: 0; border-radius: 7px !important; margin-bottom: 5px; padding: 13px 16px; background: transparent; color: #42546a; font: 500 14px/1.5 "Segoe UI", Arial, sans-serif; text-align: left; }
    .portal-screen:not(.portal-application) .list-group-item:has(b), .portal-screen:not(.portal-application) .list-group-item.active { background: #e4edf9; color: #163f70; border-left: 3px solid #244f84; font-weight: 600; }
    .portal-screen:not(.portal-application) .list-group-item:hover { background: #eaf0f7; color: #163f70; }

    .portal-screen:not(.portal-application) .portal-content-column > .row:has(.service-request-form) { margin: 0; padding: 0 !important; background: transparent !important; border-radius: 0 !important; }
    .portal-screen:not(.portal-application) .portal-content-column > .row:has(.service-request-form) > div { padding: 0; }
    .portal-screen:not(.portal-application) .portal-content-column > .row:has(.service-request-form) > div > br { display: none; }
    .portal-screen:not(.portal-application) .service-request-form div:has(> span[style*="color: orange"]) { background: #fff9ec; border: 1px solid #f1e4bf; border-left: 3px solid #d3a446; border-radius: 7px; padding: 15px 18px !important; margin: 24px 0; }
    .portal-screen:not(.portal-application) .service-request-form span[style*="color: orange"] { color: #7a6230 !important; font-size: 13px !important; }
    .portal-screen:not(.portal-application) .service-request-form span[style*="color: orange"] em { font-style: normal; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> .portal-action-column):not(:has(label)) { padding-top: 18px !important; padding-bottom: 0 !important; margin-top: 20px; }
    /* Form cards and dashboard panels. */
    .portal-screen:not(.portal-application) :is(.service-request-form,.widget,.well,.card,.panel):not(.portal-print-preview *) { background: #fff; border: 1px solid #e0e6ef; border-radius: 12px; box-shadow: 0 4px 20px rgba(25,55,86,.04); }
    .portal-screen:not(.portal-application) .service-request-form:not(.portal-print-preview *) { padding: 26px !important; }
    .portal-screen:not(.portal-application) .service-request-form .container-fluid { padding-left: 0; padding-right: 0; }
    .portal-screen:not(.portal-application) :is(.widget-head,.panel-heading,.card-header):not(.portal-print-preview *) { background: #fff; color: #253f5c; border-bottom: 1px solid #e9edf3; border-radius: 12px 12px 0 0; padding: 16px 20px; text-shadow: none; }
    .portal-screen:not(.portal-application) :is(.widget-content,.panel-body,.card-body):not(.portal-print-preview *) { padding: 20px; }
    .portal-screen:not(.portal-application) .centre:not(.portal-print-preview *) { border: 0; padding: 0; }
    .portal-screen:not(.portal-application) label:not(.portal-print-preview *):not(.radio):not(.checkbox):not(.input):not(.select):not(.toggle):not([id="toggle-menu"]):not(.drop-icon) { font-family: "Segoe UI", Arial, sans-serif !important; font-size: 13px !important; line-height: 1.5; color: #40536b; }
    .portal-screen:not(.portal-application) .form-group { margin-bottom: 20px; }
    .portal-screen:not(.portal-application) :is(input.txt,select.txt,textarea.txt,.txtbox,.form-control,.smart-form .input input,.smart-form .select select,.smart-form .textarea textarea):not(.hidden):not([type="hidden"]):not(.portal-print-preview *) { border: 1px solid #d3dce8; border-radius: 7px; min-height: 44px; padding: 10px 12px; color: #293e58; background: #fff; font: 14px/1.5 "Segoe UI", Arial, sans-serif !important; box-shadow: none; }
    .portal-screen:not(.portal-application) :is(input.txt,select.txt,textarea.txt,.form-control,.smart-form .input input,.smart-form .select select,.smart-form .textarea textarea):focus { border-color: #3c70aa; outline: 0; box-shadow: 0 0 0 3px #e4edf9; }
    .portal-screen:not(.portal-application) :is(input,select,textarea):disabled, .portal-screen:not(.portal-application) input[readonly] { background-color: #edf1f5 !important; color: #65758a !important; }
    .portal-screen:not(.portal-application) :is(input[type="radio"],input[type="checkbox"]) { accent-color: #244f84; }
    .portal-screen:not(.portal-application) :is(input,select,textarea)::placeholder { color: #78879a; opacity: 1; }
    .portal-screen:not(.portal-application) .smart-form .icon-append { top: 11px; right: 10px; color: #71839a; }
    .portal-screen:not(.portal-application) .smart-form .input:has(.icon-append) input { padding-right: 40px; }

    /* Only label/control rows become form grids; report filters and radio groups
       keep their existing layout. Never match a row inside a print document. */
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label):has(> div:nth-child(2) > :is(input,select,textarea)):not(.portal-print-preview *) { display: grid; grid-template-columns: 155px minmax(0,1fr); gap: 8px 14px; margin: 0 0 20px; padding: 0 !important; align-items: start; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label):has(> div:nth-child(2) > :is(input,select,textarea))::before,
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label):has(> div:nth-child(2) > :is(input,select,textarea))::after { display: none; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label):has(> div:nth-child(2) > :is(input,select,textarea)) > div { width: auto; max-width: none; padding: 0 !important; min-width: 0; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label) > div:first-child > label { margin: 0; padding-top: 11px; font-weight: 500; text-align: left; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label) > div:first-child { text-align: left !important; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label) > div:nth-child(2) > :is(.txt,.form-control,.txtbox):not(.hidden) { width: 100% !important; }
    .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label) > div:nth-child(n+3) { grid-column: 2; color: #65758a; font-size: 13px; }
    .portal-screen:not(.portal-application) .portal-required-marker { display: inline-block; color: #c34444 !important; margin-left: 12px; vertical-align: middle; font-size: 15px; }
    .portal-screen:not(.portal-application) div:has(> .portal-required-marker) { position: relative; }
    .portal-screen:not(.portal-application) .service-request-form .row > div:has(> .portal-required-marker) { padding-right: 28px !important; }
    .portal-screen:not(.portal-application) .service-request-form .row > div > .portal-required-marker { position: absolute; right: 6px; top: 11px; width: 10px; margin: 0; text-align: center; }

    /* Primary actions; semantic danger/success buttons retain their meanings. */
    .portal-screen:not(.portal-application) .btn:not(.portal-print-preview *) { border-radius: 7px; padding: 10px 18px; min-height: 42px; font: 600 14px/1.5 "Segoe UI", Arial, sans-serif; text-shadow: none; text-transform: none; box-shadow: none; }
    .portal-screen:not(.portal-application) :is(.btn-primary,.btn-default,.btn.fill-style):not(.portal-print-preview *) { background: #204d80; border: 1px solid #204d80; color: #fff; }
    .portal-screen:not(.portal-application) :is(.btn-primary,.btn-default,.btn.fill-style):hover { background: #163b65; border-color: #163b65; }
    .portal-screen:not(.portal-application) .btn-sm { min-height: 34px; padding: 6px 12px; font-size: 12px; }
    .portal-screen:not(.portal-application) .btn:disabled { opacity: .6; cursor: not-allowed; }
    .portal-screen:not(.portal-application) :is(a,button,input,select,textarea):focus-visible { outline: 3px solid #3c70aa; outline-offset: 3px; }
    .portal-screen:not(.portal-application) .alert { border-radius: 8px; padding: 14px 18px; line-height: 1.6; }
    .portal-screen:not(.portal-application) .alert-warning { background: #fff9ec; border: 1px solid #f1e4bf; border-left: 3px solid #d3a446; color: #7a6230; }
    .portal-screen:not(.portal-application) .alert-info { background: #edf4fc; border: 1px solid #d4e3f4; color: #345b87; }
    .portal-screen:not(.portal-application) .alert-danger { background: #fff1ef; border: 1px solid #f0ceca; color: #9b3838; }
    .portal-screen:not(.portal-application) .alert-success { background: #edf8f2; border: 1px solid #cbe6d6; color: #286345; }
    .portal-screen:not(.portal-application) .alert:empty { display: none; }
    .portal-screen:not(.portal-application) .modal-content { border: 1px solid var(--portal-line); border-radius: 12px; box-shadow: 0 16px 50px #19375626; }
    .portal-screen:not(.portal-application) .modal-header { padding: 20px; border-bottom: 1px solid #e9edf3; }
    .portal-screen:not(.portal-application) .modal-footer { background: #f8fafc; border-top: 1px solid #e9edf3; border-radius: 0 0 12px 12px; }

    /* Data screens: restrained headers and generous row spacing. */
    .portal-screen:not(.portal-application) .portal-table-scroll:not(.portal-print-preview *) { border-color: #e0e6ef; border-radius: 9px; margin: 20px 0; }
    .portal-screen:not(.portal-application) .portal-table-scroll :is(th,td):not(.portal-print-preview *) { padding: 12px 14px; border-color: #e6ecf3; font: 13px/1.6 "Segoe UI", Arial, sans-serif; }
    .portal-screen:not(.portal-application) .portal-table-scroll th:not(.portal-print-preview *) { background: #edf2f8; color: #294969; font-weight: 600; }
    .portal-screen:not(.portal-application) .portal-table-scroll tbody tr:nth-child(even):not(.portal-print-preview *) { background-color: #f8fafc; }
    .portal-screen:not(.portal-application) .portal-table-scroll tbody tr:hover:not(.portal-print-preview *) { background-color: #eef4fb; }
    .portal-screen:not(.portal-application) :is(.dataTables_filter,.dataTables_length,.dataTables_info,.dataTables_paginate) { padding: 10px 0; font-size: 13px; color: #65758a; }
    .portal-screen:not(.portal-application) .dataTables_filter input { min-height: 36px; border: 1px solid #d3dce8; border-radius: 6px; padding: 7px 10px; }
    .portal-screen:not(.portal-application) .pagination > .active > a { background: #204d80; border-color: #204d80; }

    .portal-screen:not(.portal-application) .container-fluid:has(> ul.nav.navbar-nav) { background: #fff; border-bottom: 1px solid #e1e7ef; padding: 12px 24px; }
    .portal-screen:not(.portal-application) .container-fluid > ul.nav.navbar-nav { display: flex; flex-wrap: wrap; gap: 4px; float: none; margin: 0; }
    .portal-screen:not(.portal-application) .container-fluid > ul.nav.navbar-nav > li > a { color: #42546a; padding: 10px 12px; border-radius: 6px; font-size: 13px; }
    .portal-screen:not(.portal-application) .container-fluid > ul.nav.navbar-nav > li > a:hover { color: #163f70; background: #e4edf9; }
    .portal-screen:not(.portal-application) .widget-content .padd { padding: 8px; }
    .portal-screen:not(.portal-application) .portal-report-filters { border: 1px solid #e0e6ef; border-radius: 10px; padding: 18px; background: #fff; margin-bottom: 24px; }
    .portal-screen:not(.portal-application) .portal-report-filters fieldset { background: transparent; border: 0; }
    .portal-screen:not(.portal-application) .nav-links { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 0; margin: 0; }
    .portal-screen:not(.portal-application) .nav-links a { display: block; letter-spacing: 0; font-size: 14px; padding: 10px 14px; border-radius: 7px; background: #e4edf9; color: #204d80; }
    .portal-screen:not(.portal-application) #div_btn { padding-left: 0 !important; display: flex; justify-content: flex-end; }
    .portal-screen:not(.portal-application) .page-wrapper { background: #f3f6fa; }
    .portal-screen:not(.portal-application) .page-wrapper > .container-fluid > .row { margin-left: 0; margin-right: 0; }
    /* Staff/report masters keep their menu interactions and content regions. */
    .portal-screen:not(.portal-application) nav#menu { background: #163f70; border: 0; box-shadow: none; }
    .portal-screen:not(.portal-application) nav#menu a { font-family: "Segoe UI", Arial, sans-serif; font-size: 14px; padding: 13px 18px; }
    .portal-screen:not(.portal-application) nav#menu .sub-menu { background: #204d80; border-color: #355e8c; }
    .portal-screen:not(.portal-application) [role="banner"] { padding-top: 18px; padding-bottom: 18px; }
    .portal-screen:not(.portal-application) [role="banner"] .row { align-items: center; }
    .portal-screen:not(.portal-application) [role="banner"] p { font-family: "Segoe UI", Arial, sans-serif !important; line-height: 1.5; }
    .portal-screen:not(.portal-application) [role="banner"] p[style*="1vw"] { font-size: 12px !important; color: #65758a; }
    .portal-screen:not(.portal-application) [role="banner"] p[style*="3vw"] { font-size: clamp(19px,2vw,28px) !important; color: #193756 !important; }
    .portal-screen:not(.portal-application) [role="banner"] p[style*="2vw"] { font-size: 14px !important; color: #65758a; }

    /* Sign-in and registration use the same card/field language. */
    #extr-page .portal-screen:not(.portal-application) #header, .portal-screen:not(.portal-application) #header:not(.portal-print-preview *) { background: #fff !important; border-top: 4px solid #163f70 !important; border-bottom: 1px solid var(--portal-line) !important; padding: 16px 28px; height: auto; min-height: 90px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
    .portal-screen:not(.portal-application) #header .navbar-brand { padding: 0; height: auto; max-width: 350px; }
    .portal-screen:not(.portal-application) #header .navbar-brand img { width: 100% !important; height: auto !important; max-height: 65px; }
    .portal-screen:not(.portal-application) #extr-page-header-space { margin: 0; padding: 0; font-size: 13px; }
    #extr-page .portal-screen:not(.portal-application) #main, .portal-screen:not(.portal-application) #main { background: #f3f6fa; }
    .portal-screen:not(.portal-application) #main > #content.container { max-width: 1180px; padding-top: 28px; padding-bottom: 36px; }
    .portal-screen:not(.portal-application) .smart-form.client-form > header { padding: 24px; border: 0; border-bottom: 1px solid #e9edf3; border-radius: 12px 12px 0 0; background: #fff; color: #253f5c; font: 500 16px/1.7 "Segoe UI", Arial, sans-serif; }
    .portal-screen:not(.portal-application) .smart-form.client-form > fieldset { padding: 24px; background: white; }
    .portal-screen:not(.portal-application) .smart-form.client-form > footer { padding: 18px 24px; background: #f8fafc; border-top: 1px solid #e9edf3; border-radius: 0 0 12px 12px; }
    .portal-screen:not(.portal-application) .smart-form .note { margin-top: 10px; font-size: 12px; }
    .portal-screen:not(.portal-application) .video-wrapper { border-radius: 12px; border: 1px solid #e0e6ef; box-shadow: 0 4px 20px #1937560a; }
    .portal-screen:not(.portal-application) .main-banner { background-color: #f3f6fa; }
    .portal-screen:not(.portal-application) .main-banner .banner-content .title { color: #193756; font-weight: 650; }
    .portal-screen:not(.portal-application) .main-banner .banner-content .sub-title { color: #65758a; }
    .portal-screen:not(.portal-application) .footer .f-copyright-area { background: #fff !important; border-top: 1px solid #e1e7ef !important; padding: 20px 24px !important; }
    .portal-screen:not(.portal-application) .footer .f-copyright-area .row { margin-top: 0 !important; }
    .portal-screen:not(.portal-application) .footer .f-copyright-area :is(p,a) { color: #69788b !important; font-size: 12px; }

    @media (max-width: 1000px) {
        .portal-screen:not(.portal-application) .row:has(> .portal-content-column) { grid-template-columns: 190px minmax(0,1fr); gap: 24px; }
        .portal-screen:not(.portal-application) .service-request-form:not(.portal-print-preview *) { padding: 20px !important; }
        .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label):has(> div:nth-child(2) > :is(input,select,textarea)):not(.portal-print-preview *) { grid-template-columns: 125px minmax(0,1fr); gap: 8px 12px; }
    }
    @media (max-width: 767px) {
        .portal-screen:not(.portal-application) .h4-testimonial { padding: 24px 0 36px; }
        .portal-screen:not(.portal-application) .h4-testimonial > .container, .portal-screen:not(.portal-application) .h4-testimonial > .container-fluid, .portal-screen:not(.portal-application) .h4-testimonial > form > .container-fluid { padding-left: 18px; padding-right: 18px; }
        .portal-screen:not(.portal-application) .row:has(> .portal-content-column) { grid-template-columns: minmax(0,1fr); gap: 24px; }
        .portal-screen:not(.portal-application) #main-nav { padding: 12px 16px; }
        .portal-screen:not(.portal-application) #main-nav .navbar-brand { max-width: calc(100% - 65px); }
        .portal-screen:not(.portal-application) #main-nav .navbar-brand img { height: auto !important; max-height: 60px; }
        .portal-screen:not(.portal-application) #main-nav .navbar-nav { align-items: stretch; }
        .portal-screen:not(.portal-application) #main-nav .nav-button { padding: 8px 0; }
        .portal-screen:not(.portal-application) .service-request-form:not(.portal-print-preview *) { padding: 18px !important; }
        .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label):has(> div:nth-child(2) > :is(input,select,textarea)):not(.portal-print-preview *) { grid-template-columns: minmax(0,1fr); gap: 6px; }
        .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label) > div:first-child > label { padding-top: 0; }
        .portal-screen:not(.portal-application) .service-request-form .row:has(> div:first-child > label) > div:nth-child(n+3) { grid-column: 1; }
        .portal-screen:not(.portal-application) .portal-content-column > :is(h1,h2,h3) { font-size: 25px; }
        #extr-page .portal-screen:not(.portal-application) #header, .portal-screen:not(.portal-application) #header:not(.portal-print-preview *) { padding: 16px 20px; }
        .portal-screen:not(.portal-application) .smart-form.client-form > :is(header,fieldset,footer) { padding: 18px; }
    }
}