#empty-slot-modal {
    z-index: 10000;
}

@font-face {
    font-family: "DMSans";
    src: url("../../../public/src/fonts/DMSans-Regular.ttf");
}

@font-face {
    font-family: "SF Compact Display";
    src: url("https//db.onlinewebfonts.com/t/23c8ec0d7b298e340b59bd32a7e661f3.eot");
    src: url("https//db.onlinewebfonts.com/t/23c8ec0d7b298e340b59bd32a7e661f3.eot?#iefix") format("embedded-opentype"),
        url("https//db.onlinewebfonts.com/t/23c8ec0d7b298e340b59bd32a7e661f3.woff2") format("woff2"), url("//db.onlinewebfonts.com/t/23c8ec0d7b298e340b59bd32a7e661f3.woff") format("woff"), url("//db.onlinewebfonts.com/t/23c8ec0d7b298e340b59bd32a7e661f3.ttf") format("truetype"), url("//db.onlinewebfonts.com/t/23c8ec0d7b298e340b59bd32a7e661f3.svg#SF Compact Display") format("svg");
}

@import url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swsap");

:root {
    --bg-background: rgba(82, 82, 85, 0.6);
    --bg-white: #fff;
    --bg-btn-grey: #cbcbcb;
    --bg-btn-blue: #1aa7ec;

    --clr-details: #4adede;
    --clr-txt-darkblue: #020b56;
    --clr-txt-grey: #a3a2a2;
    --clr-input: #042c5c;

    --ff-openSans: "Open Sans", sans-serif;

    --bx-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);

    font-family: 16px;
}

.pointer-redirect,
.transfer-token-btn,
.share-car-history {
    cursor: pointer;
}

.third-long-bar {
    width: 100%;
}

#empty-slot-modal.modal {
    background-color: var(--bg-background);
}

#empty-slot-modal .modal-content {
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    box-shadow: var(--bx-shadow);
    background-color: var(--bg-white);
    border: 0px;
}


.empty-slot-modal__desc {

    font-family: var(--ff-openSans);
    font-size: 1.375rem;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: left;
    color: var(--clr-txt-darkblue);
}

.close-container {
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-25px, -25px);
    cursor: pointer;
}

.close-btn {
    width: 59.3px;
    height: 59.3px;
    object-fit: contain;
}

.empty-slot-modal__title {
    font-family: var(--ff-openSans);
    font-size: 26px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: normal;
    text-align: left;
    color: #020b56;
}

.empty-slot-modal__desc {
    font-family: var(--ff-openSans);
    font-size: 20px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: left;
    color: #020b56;
}

#empty-slot-modal__span {
    word-break: break-word;
    font-family: var(--ff-openSans);
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: left;
    color: #4adede;
    border-bottom: solid 1px #cbcbcb;
    padding-bottom: 10px;
}

/* !  --- MEDIA QUERY  --- */
@media (min-width: 767px) {
    #temp-url-modal .modal-dialog {
        max-width: 728px;
    }
}

@media (max-width: 1024px) {
    :root {
        font-size: 14px;
    }
}
