* {
    font-family: "Lato", sans-serif;
}

html,
body {
    height: 100%;
}

body {
    background-color: #edece5 !important;
}

    body > .container-fluid {
        height: 100%;
        display: flex;
        flex-direction: column;
        padding: 0;
    }

.header,
.footer {
    background-color: #004d44;
    color: #fff;
}

.header {
    padding-top: 5px;
    padding-bottom: 5px;
}

    .header h1 {
        font-size: 2rem;
        margin-bottom: 0;
    }

    .header .headerContent {
        align-content: center;
    }

.navbar.navbar-profile {
    background-color: #edece5 !important;
}

.footer-navigation .navbar {
    background-color: unset !important;
}

    .footer-navigation .navbar .container-fluid .navbar-brand,
    .footer-navigation .navbar .container-fluid .navbar-toggler {
        display: none;
    }

    .footer-navigation .navbar .container-fluid .navbar-collapse {
        display: flex !important;
    }

        .footer-navigation .navbar .container-fluid .navbar-collapse .navbar-nav {
            margin-right: unset !important;
            margin-left: auto;
        }

            .footer-navigation .navbar .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link {
                color: #fff !important;
            }

                .footer-navigation .navbar .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link:hover, .footer-navigation .navbar .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link:active, .footer-navigation .navbar .container-fluid .navbar-collapse .navbar-nav .nav-item .nav-link:focus {
                    color: #e6e6e6 !important;
                }

.btn-primary {
    background-color: #004d44 !important;
    border-color: #004d44 !important;
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active {
        background-color: #00433b !important;
        border-color: #00433b !important;
        box-shadow: 0 0 0 0.25rem rgba(0, 77, 68, 0.5);
    }

.btn-secondary {
    background-color: #565148 !important;
    border-color: #565148 !important;
}

    .btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active {
        background-color: #504c43 !important;
        border-color: #504c43 !important;
        box-shadow: 0 0 0 0.25rem rgba(86, 81, 72, 0.5);
    }

a {
    color: #004d44 !important;
}

    a:hover, a:focus, a:active {
        color: #00433b !important;
    }

    a.btn-primary {
        background-color: #004d44 !important;
        border-color: #004d44 !important;
        color: #fff !important;
    }

        a.btn-primary:hover, a.btn-primary:focus, a.btn-primary:active {
            background-color: #00433b !important;
            border-color: #00433b !important;
            box-shadow: 0 0 0 0.25rem rgba(0, 77, 68, 0.5);
            color: #fff !important;
        }

.tpc-submit-button {
    margin-top: 16px;
}

    .tpc-submit-button .form-group {
        margin-bottom: 0;
    }

        .tpc-submit-button .form-group .form-row .col-12 {
            display: flex;
            justify-content: space-evenly;
            flex-direction: row-reverse;
            align-items: center;
        }

.tpc-lookup .k-picker-solid,
.tpc-text-field .k-picker-solid,
.tpc-text-field-numeric .k-picker-solid,
.tpc-datetime .k-picker-solid,
.tpc-file-upload .k-picker-solid,
.tpc-drop-down .k-picker-solid,
.tpc-text-field-textarea .k-picker-solid {
    background-color: #fff !important;
    height: calc(1.5em + 0.75rem + 6px) !important;
    border-color: #000 !important;
}

.tpc-lookup .k-input-solid,
.tpc-text-field .k-input-solid,
.tpc-text-field-numeric .k-input-solid,
.tpc-datetime .k-input-solid,
.tpc-file-upload .k-input-solid,
.tpc-drop-down .k-input-solid,
.tpc-text-field-textarea .k-input-solid {
    height: calc(1.5em + 0.75rem + 6px) !important;
    border-color: #000 !important;
}

.tpc-lookup .form-control,
.tpc-text-field .form-control,
.tpc-text-field-numeric .form-control,
.tpc-datetime .form-control,
.tpc-file-upload .form-control,
.tpc-drop-down .form-control,
.tpc-text-field-textarea .form-control {
    /* height: calc(1.5em + 0.75rem + 6px) !important; */
    border-color: #000 !important;
}

.tpc-lookup.tpc-invalid .k-tooltip-validation,
.tpc-text-field.tpc-invalid .k-tooltip-validation,
.tpc-text-field-numeric.tpc-invalid .k-tooltip-validation,
.tpc-datetime.tpc-invalid .k-tooltip-validation,
.tpc-file-upload.tpc-invalid .k-tooltip-validation,
.tpc-drop-down.tpc-invalid .k-tooltip-validation,
.tpc-text-field-textarea.tpc-invalid .k-tooltip-validation {
    width: 100%;
    margin-top: 8px !important;
    display: flex;
    align-items: center;
    padding: 8px;
    font-size: 14px;
}

    .tpc-lookup.tpc-invalid .k-tooltip-validation .k-icon,
    .tpc-text-field.tpc-invalid .k-tooltip-validation .k-icon,
    .tpc-text-field-numeric.tpc-invalid .k-tooltip-validation .k-icon,
    .tpc-datetime.tpc-invalid .k-tooltip-validation .k-icon,
    .tpc-file-upload.tpc-invalid .k-tooltip-validation .k-icon,
    .tpc-drop-down.tpc-invalid .k-tooltip-validation .k-icon,
    .tpc-text-field-textarea.tpc-invalid .k-tooltip-validation .k-icon {
        height: 15px;
        font-size: 18px !important;
        margin-right: 6px;
    }

.k-upload {
    border-radius: 0.25rem;
    border-color: #000 !important;
}

    .k-upload .k-dropzone {
        border-radius: 0.25rem;
    }

.heading-landing {
    margin: 1rem 0;
}

.main-content {
    flex: 1;
    padding: 1rem 0;
}

    .main-content .main-heading {
        background-color: #004d44;
        padding: 8px;
        text-align: center;
        color: #fff;
        margin: 8px 0;
    }

    .main-content .sub-heading {
        background-color: #004d44;
        padding: 8px;
        text-align: left;
        vertical-align: center;
        color: #fff;
        margin: 8px 0;
    }

    .main-content .k-list-item.k-selected,
    .main-content .k-selected.k-list-optionlabel {
        background-color: #edece5 !important;
        color: #000 !important;
    }

    .main-content .form-control {
        border-color: #000;
    }

    .main-content .btn-block {
        width: 100%;
        height: 60px;
    }

    .main-content #autoaddress-input {
        border: 1px solid #000;
        border-radius: 0.25rem;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .main-content .login-form h3 {
        background-color: #004d44;
        padding: 8px;
        text-align: center;
        color: #fff;
        margin: 8px 0;
    }

    .main-content .k-grid-toolbar {
        border: none !important;
        background-color: #edece5 !important;
    }

    .main-content .k-grid {
        border-color: #edece5 !important;
    }

        .main-content .k-grid td {
            border-color: #000 !important;
        }

        .main-content .k-grid .k-grid-header .k-header {
            background-color: #eee;
        }

        .main-content .k-grid table {
            border: 1px solid #000 !important;
        }

            .main-content .k-grid table tbody tr td {
                border-bottom: 1px solid #000 !important;
            }

            .main-content .k-grid table tbody tr:last-of-type td {
                border-bottom: 0 !important;
            }

    .main-content .tpc .readOnly {
        background-color: #eee;
        border-radius: 0.25rem;
        border: 1px solid #000;
        padding: 0.375rem 0.75rem !important;
    }

.sf_cols.tpc-submit-button_two_col_layout {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

.iti {
    width: 100%;
}

    .iti .iti__flag-container {
        height: calc(1.5em + 0.75rem + 6px) !important;
    }

        .iti .iti__flag-container .iti__country-list {
            z-index: 9999 !important;
        }

    .iti input {
        padding-right: 16px !important;
        width: 100%;
        height: calc(1.5em + 0.75rem + 6px) !important;
        color: #000 !important;
        border: 1px solid #000 !important;
        border-radius: 0.25rem;
    }

        .iti input[aria-invalid=true] {
            border: 1px solid rgb(220, 53, 69) !important;
        }

.k-window-content {
    padding: 0 !important;
}

.popup-container {
    height: 100%;
}

    .popup-container .main-heading {
        background-color: #004d44;
        padding: 8px;
        text-align: center;
        color: #fff;
        margin: 8px 0;
    }

    .popup-container .sub-heading {
        background-color: #004d44;
        padding: 8px;
        text-align: left;
        vertical-align: center;
        color: #fff;
        margin: 8px 0;
    }

    .popup-container .k-list-item.k-selected,
    .popup-container .k-selected.k-list-optionlabel {
        background-color: #edece5 !important;
        color: #000 !important;
    }

    .popup-container .form-control {
        border-color: #000;
    }

    .popup-container .btn-block {
        width: 100%;
        height: 60px;
    }

    .popup-container #autoaddress-input {
        border: 1px solid #000;
        border-radius: 0.25rem;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }

    .popup-container .login-form h3 {
        background-color: #004d44;
        padding: 8px;
        text-align: center;
        color: #fff;
        margin: 8px 0;
    }

    .popup-container .k-grid td {
        border-color: #000 !important;
    }

    .popup-container .k-grid .k-grid-header .k-header {
        background-color: #eee;
    }

    .popup-container .k-grid table {
        border: 1px solid #000 !important;
    }

        .popup-container .k-grid table tbody tr td {
            border-bottom: 1px solid #000 !important;
        }

        .popup-container .k-grid table tbody tr:last-of-type td {
            border-bottom: 0 !important;
        }

    .popup-container .tpc .readOnly {
        background-color: #eee;
        border-radius: 0.25rem;
        border: 1px solid #000;
        padding: 0.375rem 0.75rem !important;
    }

    .popup-container .iti {
        width: 100%;
    }

        .popup-container .iti .iti__flag-container {
            height: calc(1.5em + 0.75rem + 6px) !important;
        }

            .popup-container .iti .iti__flag-container .iti__country-list {
                z-index: 9999 !important;
            }

        .popup-container .iti input {
            padding-right: 16px !important;
            width: 100%;
            height: calc(1.5em + 0.75rem + 6px) !important;
            color: #000 !important;
            border: 1px solid #000 !important;
            border-radius: 0.25rem;
        }

            .popup-container .iti input[aria-invalid=true] {
                border: 1px solid rgb(220, 53, 69) !important;
            }

    .popup-container .content {
        height: 100%;
    }

        .popup-container .content > div {
            display: flex;
            flex-direction: column;
            height: 100%;
            justify-content: space-between;
        }

            .popup-container .content > div .content__form {
                padding: 10px;
            }

            .popup-container .content > div .content__toolbar {
                padding: 10px;
                display: flex;
                justify-content: space-evenly;
            }

.k-grid-norecords .tpc-nodata-error {
    width: 100% !important;
    margin: 0 !important;
}

    .k-grid-norecords .tpc-nodata-error p {
        margin: 0 !important;
        color: #000;
    }


#headingEmploymentPermit {
    background-color: #217346;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
    font-weight: bold;
    margin: 0;
}

    #headingEmploymentPermit h2 {
        text-align: center;
        font-size: 1.5rem;
        margin: 0;
    }

.dark-grey-line {
    border-bottom: 2px solid darkgrey;
    width: 100%;
    margin: 10px 0;
}

.disabled-input {
    background-color: lightgrey;
    color: grey;
    border: 1px solid darkgrey;
    cursor: not-allowed;
}

.osds_table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (width >= 1024px) {
    .osds_table-responsive {
        overflow-x: visible;
        -webkit-overflow-scrolling: visible;
    }
}
textarea {
    width: 100%;
    min-height: 50px;
    max-height: 300px; 
    overflow-y: auto; 
    resize: none; 
}

/* SDPIU-36 - TPC grid widgets carry a fixed 550px height set per-widget in the
   Sitefinity backend, which leaves a large empty scroll area beneath the rows.
   Swap the fixed height for a cap: the grid shrinks to its rows when there are
   few, and scrolls internally when there are many, so the header and the pager
   stay put and both scrollbars stay inside the grid. Grids with no height set
   render without a .k-grid-content pane, so these rules are a no-op for them. */
.tpc-grid .k-grid {
    height: auto !important;
}

    .tpc-grid .k-grid .k-grid-content {
        height: auto !important;
        /* 410px is the pane height Kendo derived from the old 550px grid, so the
           scroll window is unchanged - only the empty space below the rows goes. */
        max-height: 410px !important;
        overflow-x: auto !important;
        overflow-y: auto !important;
        /* Load-bearing. An absolutely positioned element is only clipped by an
           ancestor that is its containing block, so taking the pane out of the
           positioning chain lets the row Actions menu overhang the scroll area
           instead of being cut off. The menu's containing block becomes .k-grid. */
        position: static !important;
        /* Reserve the scrollbar gutter whether or not the pane is scrolling, so the
           body columns always line up with Kendo's scrollbar-compensated header.
           Do NOT zero the header's padding-right - Kendo sets it to the real
           scrollbar width, which is 0 on platforms with overlay scrollbars. */
        scrollbar-gutter: stable;
    }

        /* Floor of roughly two rows on grids that hold data, so a one-row grid does
           not look cramped. Empty grids stay collapsed - padding those out is the
           white space SDPIU-36 was raised about. */
        .tpc-grid .k-grid .k-grid-content:has(tbody tr) {
            min-height: 110px;
        }

        /* Kendo centres the no-records block against a tall content pane. With a
           content-sized pane that centring lifts it up behind the header row. */
        .tpc-grid .k-grid .k-grid-content .k-grid-norecords {
            position: static !important;
            top: auto !important;
            left: auto !important;
            transform: none !important;
            height: auto !important;
            width: auto !important;
        }

/* SDPIU-36 - the page content wraps these grids in a .vertical-scroll container
   (max-height 650px, overflow-y auto) defined in the Sitefinity page CSS, not here.
   That window was sized to pair with the old fixed grid; keep it from ever
   scrolling a grid's pager out of view. */
.vertical-scroll:has(.tpc-grid) {
    max-height: none !important;
    overflow: visible !important;
}

/*# sourceMappingURL=styles.css.map */