@charset "utf-8";

* {
    box-sizing: border-box;
}

:root {
    --blue-menu-hover-color: rgb(0, 64, 197);
    --light-blue-hover-color: rgb(76, 199, 244);
    --light-link-background-color: rgba(194, 202, 207, 0.2);
    --navy-blue: rgb(0, 30, 80);
}

body {
    margin: 0;
    padding: 0;
}

body .title {
    font-family: VWHeadWeb-Regular, sans-serif;
    font-size: 20px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: normal;
    color: #001e50;
}

body .subtitle {
    font-family: VWTextWeb-Bold, sans-serif;
    font-size: 16px;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: black;
}

body .text-main {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #001e50;
}

body .text-secondary {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    color: #000;
}

body .text-secondary-small {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: black;
}

body .text-secondary-small-red {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: normal;
    color: red;
}

.icon-lock {
    content: url("/resources/icons/construction-icon-24-px-lock.svg");
}

.icon-incomplete {
    content: url("/resources/icons/24-px-alert-black.svg")
}

.icon-active {
    content: url("/resources/icons/24-px-country-road.svg")
}

.icon-close {
    content: url("/resources/icons/24-px-close.svg");
}

body .ui-button.ui-button-text-icon-left .ui-icon.icon-close {
    top: 40.5%;
}

.ui-button-icon-left.ui-icon.ui-c.icon-close:hover {
    content: none;
    mask: url("/resources/icons/24-px-close.svg") no-repeat left;

    /**
    Needed for browsers like Edge, not needed in Firefox:
     */
    -webkit-mask: url("/resources/icons/24-px-close.svg") no-repeat left;

    background-color: var(--light-blue-hover-color);
    /** Make it wider, so a hover effect covers also the text it belongs to */
    min-width: 24px;
    min-height: 24px;
}

.imageMenu {
    content: url("/resources/icons/24-px-menu.svg");
}

body .ui-button.ui-button-text-icon-left .ui-icon.imageMenu {
    top: 40.5%;
}

.ui-button-icon-left.ui-icon.ui-c.imageMenu:hover {
    content: none;
    mask: url("/resources/icons/24-px-menu.svg") no-repeat left;

    /**
    Needed for browsers like Edge, not needed in Firefox:
     */
    -webkit-mask: url("/resources/icons/24-px-menu.svg") no-repeat left;

    background-color: var(--light-blue-hover-color);

    min-width: 24px;
    min-height: 24px;
}

.ui-state-hover > .imageMenu {
    content: none;
    mask: url("/resources/icons/24-px-menu.svg") no-repeat left;

    /**
    Needed for browsers like Edge, not needed in Firefox:
     */
    -webkit-mask: url("/resources/icons/24-px-menu.svg") no-repeat left;

    background-color: var(--light-blue-hover-color);

    min-width: 24px;
    min-height: 24px;
}

.ui-state-active > .imageMenu {
    content: none;
    mask: url("/resources/icons/24-px-menu.svg") no-repeat left;

    /**
    Needed for browsers like Edge, not needed in Firefox:
     */
    -webkit-mask: url("/resources/icons/24-px-menu.svg") no-repeat left;

    background-color: var(--light-blue-hover-color);

    min-width: 24px;
    min-height: 24px;
}

body .ui-button.btn {
    width: 135px;
    height: 42px;
    border: none;
    border-radius: 24px;
    font-size: 1rem;
}

body .ui-button.btn.btn-passive {
    background: #dfe4e8;
    color: #6a767d;
}

body .ui-button.btn.btn-active {
    background: #001e50;
    color: #fff;
    border: 2px solid #001e50;
}

body .ui-button.btn.btn-active:hover {
    opacity: 0.8;
}

body .ui-button.btn.btn-active:focus {
    color: rgb(255, 255, 255);
    background: rgb(0, 119, 204);
    border: 2px solid #001e50;
    box-shadow: none;
}

body .ui-state-disabled.btn.btn-active {
    background-color: #6a767d;
    border-color: #6a767d;
    color: #dfe4e8;
    opacity: 1;
}

body .ui-button.btn.btn-cancel {
    color: #001e50;
    background: white;
    border: 2px solid #001e50;
}

body .ui-state-disabled.btn.btn-cancel {
    border-color: #dfe4e8;
    color: #dfe4e8;
    opacity: 1;
}

body .ui-button.btn.btn-cancel:hover {
    background: #F0F0F0;
    opacity: 0.8;
}

body .ui-button.btn.btn-cancel:focus {
    color: rgb(255, 255, 255);
    background: rgb(0, 119, 204);
    border: 2px solid #001e50;
    box-shadow: none;
}

body .ui-button.btn-dialog {
    width: 100%;
    height: 44px;
    border-radius: 24px;
    font-size: 1rem;
    border: none;
}

body .ui-button.btn-dialog:hover {
    opacity: 0.8;
}

body .ui-button.btn-dialog:focus {
    box-shadow: none;
}

body .ui-button.btn-dialog.btn-dialog-confirm {
    background: #ffffff;
    color: var(--navy-blue);
}

body .ui-button.btn-dialog.btn-dialog-confirm:focus {
    color: rgb(255, 255, 255);
    background: rgb(0, 119, 204);
    border: 2px solid #001e50;
}

body .ui-button.btn-dialog.btn-dialog-cancel {
    border: solid 2px #fff;
    border-radius: 22px;
    background: rgb(91, 8, 164);
}

body .ui-button.btn-dialog.btn-dialog-cancel:focus {
    color: white;
    background: rgb(0, 119, 204);
    border: 2px solid #001e50;
}

body .ui-inputfield {
    width: 100%;
    height: 30px;
    color: #001e50;
    line-height: 1.5;
    font-family: VWTextWeb-Regular, sans-serif;
    border-width: 0 0 1px 0;
    border-color: #e6e6e6;
    border-radius: 0;
    padding: 0;
}

body .ui-inputfield.ui-state-hover {
    border-color: #001e50;
}

body .ui-inputfield.ui-state-focus {
    border-color: rgb(0, 176, 240);
    border-width: 0 0 2px 0;
    outline: 0 none;
    box-shadow: none;
}

body .ui-inputfield.input-text-error {
    border-color: #e4002c;
}

body .ui-inputfield.ui-state-focus.input-text-error {
    border-color: #e4002c;
}

body .ui-inputfield.ui-state-hover.input-text-error {
    border-color: #e4002c;
}

body .ui-float-label > label {
    margin-left: 0;
    color: #001e50;
    line-height: 1.5;
    font-size: 16px;
    left: 0;
}

body .ui-float-label > input:focus ~ label,
body .ui-float-label > input.ui-state-filled ~ label,
body .ui-float-label > textarea:focus ~ label,
body .ui-float-label > textarea.ui-state-filled ~ label,
body .ui-float-label > .ui-inputwrapper-focus ~ label,
body .ui-float-label > .ui-inputwrapper-filled ~ label {
    color: #001e50;
    line-height: 1.5;
    margin-left: 0;
}

body .ui-message.ui-message-error {
    padding: 3px 8px 5px;
    border-radius: 4px;
    background: #e4002c;
    font-size: 12px;
    font-family: VWTextWeb-Regular, sans-serif;
    color: white;
    border: none;
    margin: 0;
}

body .ui-message.ui-message-error .ui-message-error-detail {
    margin-left: 0;
}

/*VW Style Guide--Checkbox */
body .ui-chkbox .ui-chkbox-box {
    border: 1px solid #001e50;
    border-radius: 0;
    transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
}

body .ui-chkbox .ui-chkbox-box.ui-state-hover {
    color: white;
    -moz-box-shadow: 0 0 5px 5px #f2f2f2;
    -webkit-box-shadow: 0 0 5px 5px #f2f2f2;
    box-shadow: 0 0 5px 5px #f2f2f2;
    background: #f2f2f2;
    border-color: #001e50;
}

body .ui-chkbox .ui-chkbox-box.ui-state-active.ui-state-hover {
    color: white;
    -moz-box-shadow: 0 0 5px 5px #f2f2f2;
    -webkit-box-shadow: 0 0 5px 5px #f2f2f2;
    box-shadow: 0 0 5px 5px #f2f2f2;
    background: rgb(0, 119, 204);
    border-color: #001e50;
}

body .ui-chkbox .ui-chkbox-box.ui-state-active {
    border: 1px solid #001e50;
    background: white;
    color: #001e50;
}

body .ui-chkbox .ui-chkbox-box.ui-state-focus {
    border: 3px solid #001e50;
    box-shadow: none;
    background: rgb(0, 119, 204);
    color: white;
}

body .ui-chkbox .ui-chkbox-box .ui-chkbox-icon {
    margin-top: -0.75rem;
    margin-left: -0.55rem;
}

/*command Link */
body .ui-commandlink {
    color: #001e50;
    text-decoration: underline;
}

/* =====================================dropdown menu============================================= */
body .ui-selectonemenu {
    border-width: 0 0 1px 0;
    border-style: solid;
    border-radius: 0;
    border-color: #dfe4e8;
}

body .ui-selectonemenu.ui-state-hover {
    border-color: #dfe4e8;
}

body .ui-selectonemenu.ui-state-focus {
    box-shadow: none;
    border-color: #dfe4e8;
    min-height: 31px;
}

body .ui-selectonemenu[aria-expanded="true"] .ui-selectonemenu-trigger .ui-icon:before {
    content: none;
}

body .ui-selectonemenu[aria-expanded="true"] .ui-selectonemenu-trigger .ui-icon {
    mask: url("/resources/icons/24-px-chevron-up.svg") no-repeat left;

    /**
    Needed for browsers like Edge, not needed in Firefox:
     */
    -webkit-mask: url("/resources/icons/24-px-chevron-up.svg") no-repeat left;

    background-color: rgb(0, 176, 240);
    min-width: 24px;
    min-height: 24px;
}

body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item {
    padding: 0 2px 1px;
}

body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-hover {
    background: rgb(106 118 125);
    color: white;
}

body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-highlight {
    background: white;
    color: #001e50;
}

/* =============================================================================================== */

/* data table*/
body .ui-datatable thead th {
    background: white;
    color: #000;
    white-space: normal !important;
    padding: 1rem 10px;
}

body .ui-datatable.ui-datatable-sticky.ui-sticky {
    box-shadow: none;
    border-collapse: collapse;
}

body .ui-datatable .ui-datatable-data > tr > td {
    white-space: normal !important;
    padding: 1rem 10px;
}

.text-red {
    color: #ff335c !important;
}

@media only screen and (max-width: 1024px) {
    body .ui-datatable thead th {
        overflow: visible;
    }
}

@media only screen and (max-width: 700px) {
    body .ui-datatable thead th {
        text-align: center;
    }

    body .ui-datatable .ui-datatable-data > tr > td {
        text-align: center;
        padding: 1.5rem 0;
    }

}

/* ===================== DataTable Paginator Entry Numbers (from ... to ... entries) ================== */
body .ui-paginator-current {
    position: absolute;
    left: 60px;

    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
}

body .ui-paginator .ui-paginator-current {
    color: black;

    margin-left: 0;
    padding-left: 0;
}

body .ui-paginator .ui-paginator-top {
    display: flex;
    justify-content: space-evenly;
}

@media only screen and (max-width: 720px) {
    body .ui-paginator .ui-paginator-top {
        flex-direction: column;
        height: 130px;
        justify-content: center;
    }

    body .ui-paginator .ui-paginator-current {
        position: revert;
        flex: 1;
        margin: auto;
        width: 100%;
    }

    body .ui-datatable .ui-paginator {
        padding: 0;
    }
}

/* ====================================== [End] DataTable Paginator Entry Numbers ================== */

/* ====================================== DataTable Paginator Numbers (from ... to ... entries) ================== */
body .ui-paginator-pages {
    color: var(--navy-blue);
}

body .ui-paginator .ui-paginator-pages .ui-paginator-page {
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 7px;
    border-radius: 16px;

    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    text-align: center;
    color: var(--navy-blue);
}

body .ui-paginator .ui-paginator-pages .ui-paginator-page.ui-state-active {
    background-color: #dfe4e8;
}

/* ============================================================================================================= */

.ui-selectonemenu-label {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    color: var(--navy-blue);
}

/* ========================================== Next action button ================================================ */

body .ui-button.nextBestActionButton {
    width: auto;
    max-width: 64px;
    height: 64px;

    border-radius: 32px;

    background-color: #00b0f0;

    -webkit-transition: max-width 1s;
    transition: max-width 1s;
    padding-left: 20px;
    padding-right: 20px;
    z-index: 9998;
}

body .ui-button.nextBestActionButton > span.ui-button-text.ui-c {
    opacity: 0;
}

body .ui-button.nextBestActionButton:not(:hover) > span.ui-button-text.ui-c {
    -webkit-transition: opacity 2s;
    transition: opacity 2s;
}

body .ui-button.nextBestActionButton:hover > span.ui-button-text.ui-c {
    opacity: 100%;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
}

body .ui-button.nextBestActionButton:hover {
    max-width: 320px;
}

body .ui-button.ui-button-text-icon-right.ui-button.nextBestActionButton .ui-icon {
    top: 19.166666px;
    right: 19.166666px;
    margin: unset;
    display: grid;
}

body .ui-button.ui-button-text-icon-right.ui-button.nextBestActionButton > .ui-button-text.ui-c {
    padding: unset;
    padding-right: 32px;
    color: rgb(0, 30, 80);
    overflow: hidden;
}

.plusImage {
    content: url("/resources/icons/24-px-add.svg")
}

.editImage {
    content: url("/resources/icons/24-px-edit.svg");
}

.imageChevron {
    content: url("/resources/icons/24-px-chevron-right.svg");
    width: 24px;
    height: 24px;
    margin-bottom: -1.5%;
}

.heartIcon {
    content: url("/resources/icons/12-px-heart.svg");
    width: 24px;
    height: 24px;
    margin-bottom: -1.5%;
}

.activeRideIcon {
    content: url("/resources/icons/24-px-country-road.svg");
    width: 24px;
    height: 24px;
    margin-bottom: -1.5%;
}


.next-best-action-button-alignment {
    position: fixed;
    right: 60px;
    bottom: 60px;
}

/* ====================================== Bread Crumb ======================================*/

body .ui-breadcrumb {
    border: unset;
    margin-left: 120px;
    margin-top: 12px;
    padding-left: 0;

    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: var(--navy-blue);
}

body .ui-breadcrumb .ui-breadcrumb-items li .ui-menuitem-link {
    border-radius: 0;
}

body .ui-breadcrumb .ui-breadcrumb-items li .ui-menuitem-link .ui-menuitem-text {
    color: var(--navy-blue);
}

body .ui-breadcrumb .ui-breadcrumb-items li .ui-menuitem-link .ui-menuitem-text:hover:not(:focus) {
    background-color: rgba(194, 202, 207, 0.2)
}

body .ui-breadcrumb .ui-breadcrumb-items li .ui-menuitem-link:focus {
    box-shadow: none;
    outline: none;
    color: rgb(255, 255, 255);
    background-color: rgb(0, 119, 204);
}

body .ui-breadcrumb .ui-breadcrumb-items li .ui-menuitem-link:focus .ui-menuitem-text {
    color: rgb(255, 255, 255);
}

.ui-breadcrumb .ui-menuitem-link.ui-state-disabled {
    opacity: 1;
}

body .ui-breadcrumb .ui-breadcrumb-items li:last-child .ui-menuitem-link .ui-menuitem-text {
    color: black;
    font-family: VWTextWeb-Bold, sans-serif;
}

body .ui-breadcrumb .ui-breadcrumb-items li:not(.ui-breadcrumb-chevron)::before {
    content: url("/resources/icons/ico-breadcrumbtriangle.svg");
    font-family: VWTextWeb-Light, sans-serif !important;
    margin: 1px 8px 0 8px;
    object-fit: contain;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
}

/* ====================================== Default Link ======================================*/
body .ui-link.link-default {
    width: fit-content;
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    color: #001e50;
    text-decoration: none;
    border: solid #001e50;
    border-width: 0 0 1px 0;
}

body .ui-link.link-default:hover {
    background: var(--light-link-background-color);
}

body .ui-link.link-default:focus {
    color: white;
    background: #00b0f0;
    border-color: #001e50;
    border-width: 0 0 2px 0;
}

.hideDataViewHeader > .ui-dataview-header {
    border-bottom: 0 none;
    display: none;
}

/* ==================== Panel Toggleable ==================================== */

body .panel-toggleable.ui-panel .ui-panel-titlebar {
    border-bottom: solid;
    border-width: 0 0 1px 0;
    border-radius: 0;
    border-color: #dfe4e8;
    background: white;
    color: #000;
    margin-top: 2px;
    padding: 0.8rem 0;
}

body .panel-toggleable.ui-panel .ui-panel-titlebar:hover {
    cursor: pointer;
    border-color: #001e50;
}

.panel-toggleable .ui-panel .ui-panel-titlebar {
    padding: 0;
}

body .panel-toggleable.ui-panel .ui-panel-titlebar .ui-panel-titlebar-icon {
    color: #001e50;
    padding-top: 4px;
    height: 36px;
    width: 36px;
}

body .panel-toggleable.ui-panel .ui-panel-titlebar .ui-panel-titlebar-icon:focus {
    border: 2px solid #001e50;
    background: rgb(0, 119, 204);
}

body .panel-toggleable.ui-panel .ui-panel-titlebar:hover > .ui-panel-titlebar-icon {
    border: none;
    background: #F0F0F0;
}

body .panel-toggleable.ui-panel .ui-panel-titlebar .ui-panel-titlebar-icon .ui-icon-minusthick:before {
    content: url("/resources/icons/24-px-chevron-up.svg");
}

body .panel-toggleable.ui-panel .ui-panel-titlebar .ui-panel-titlebar-icon .ui-icon-plusthick:before {
    content: url("/resources/icons/24-px-chevron-down.svg");
}

body .panel-toggleable.ui-panel .ui-panel-content {
    border: none;
    padding: 0;
}

/* =========================== [END] Panel Toggleable =================================== */

/* ==================== Growl messages ==================================== */

body .ui-growl {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: unset;
}

body .ui-growl-item-container {
    top: 0;
}

body .ui-growl .ui-growl-item-container.ui-growl-error, body .ui-growl .ui-growl-item-container.ui-growl-info {
    color: white;
    background-color: #5b08a4;
    border: none;
}

.ui-growl-title {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    color: white;
}

.ui-growl-message {
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    color: white;
    width: unset;
    float: unset;
    padding: 0;
    min-height: 64px;
    display: flex;
    align-items: center;
}

body .ui-growl .ui-growl-item-container {
    margin: 0;
}

body .ui-growl .ui-growl-item-container .ui-growl-item {
    padding: unset;
    min-height: 64px;
    margin-left: 60px;
}

body .ui-growl .ui-growl-item-container .ui-icon-closethick {
    top: 20px;
    right: 60px;
}

body .ui-growl .ui-growl-item-container .ui-icon-closethick::before {
    content: url("/resources/icons/24-px-close.svg");
}

body .ui-growl .ui-growl-item-container.ui-growl-error .ui-growl-image, body .ui-growl .ui-growl-item-container.ui-growl-info .ui-growl-image {
    display: none;
}

/* ==================== [END] Growl messages ==================================== */

/* ========================== DIALOG ================================== */

.dialog {
    max-width: 460px;
    height: 372px;
    padding: 40px 44px;
}

.dialog-lockReason {
    width: 460px !important;
    height: 372px !important;
    background-color: white;
}

.dialog-userCreation {
    width: 460px !important;
    height: auto !important;
    background-color: white;
}

.dialog-warning {
    background-color: #5b08a4;
}

body .dialog .ui-button.btn-dialog {
    margin-top: 20px;
}

body .dialog .ui-dialog-content {
    display: flex;
    flex-direction: column;
    margin: 40px;
    padding: 0;
}

body .dialog-warning .ui-dialog-content {
    background-color: #5b08a4;
    color: white;
}

body .dialog-warning .ui-datalist .ui-datalist-content {
    color: white;
    background: none;
    border: none;
}

body .dialog .ui-datalist-item {
    margin-top: 10px;
}

body .dialog-title {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 24px;
}

.dialog-warning .dialog-title {
    color: white;
}

.dialog-lockReason .dialog-title {
    color: black;
}

.dialog-text {
    /* button below has already margin-top: 20px, so it's in sum 32px. */
    margin-bottom: 12px;
}

.dialog-warning .dialog-text {
    color: white;
}

/* ========================== STATIC MESSAGE ================================== */

body .ui-message.staticMessage {
    border-radius: 0;
}

body .ui-message.ui-message-info.staticMessage {
    background: #5b08a4;
    color: white;
    font-family: VWTextWeb-Regular, sans-serif;
    font-size: 16px;
    line-height: 1.25;
    width: 100%;
    height: 64px;
    margin-left: 0;
    border: none;
    display: flex;
    align-items: center;
    padding: 0 4.5rem;
    z-index: 50;
}

body .ui-message.ui-message-info.staticMessage .ui-message-info-detail {
    margin-left: 0;
}

body .ui-message.ui-message-info.staticMessage .ui-message-info-icon {
    margin-right: 24px;
}

body .ui-message.ui-message-info.staticMessage .ui-message-info-icon:before {
    content: url("/resources/icons/24-px-info.svg");
}

#pdfContainer {
    width: 100%;
    height: 70vh;
    overflow-y: auto;
    background: #525659;
    padding: 16px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

#pdfContainer canvas {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    background: white;
    display: block;
}

.document-item {
    padding: 16px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s;
}

.document-item:hover {
    background: #f5f5f5;
}

.document-title {
    font-weight: bold;
    font-size: 1rem;
    margin-bottom: 4px;
}

.document-description {
    font-size: 0.875rem;
    color: #666;
}

.back-button {
    background: none;
    border: none;
    color: #007ad9;
    cursor: pointer;
    font-size: 0.9rem;
    padding: 8px 0;
    margin-bottom: 10px;
}

.back-button:hover {
    text-decoration: underline;
}

.pdf-loading {
    color: white;
    font-family: sans-serif;
    padding: 20px;
}

.ui-icon-car-documents {
    width: 20px;
    height: 20px;
    background-image: url('/resources/icons/24PxCarDocuments.svg') !important;
    position: absolute !important;
    top: 50% !important;
    margin-top: -0.66rem !important;
    left: 0.5rem !important;
    background-size: cover;
}

.ui-icon-car-documents-white {
    width: 20px;
    height: 20px;
    background-image: url('/resources/icons/24PxCarDocuments_white.svg') !important;
    position: absolute !important;
    top: 50% !important;
    margin-top: -0.66rem !important;
    left: 0.5rem !important;
    background-size: cover;
}

.ui-outputlabel {
    overflow: visible !important;
}

.search-highlight {
    background-color: rgba(0, 176, 240, 0.5);
    color: #1a1a1a;
    border-radius: 3px;
}