/*
 * Copyright (c) 2018 NEWPS.CZ s.r.o.
 *
 * Zhotovitel, NEWPS.CZ, nenese odpovednost za vady zpusobene
 * neautorizovanym zasahem do zdrojoveho kodu.
 *
 */




/* ----------------------------- */
/* ---------- Buttons ---------- */

/* ---- Blue button ---- */

.button {
    display: inline-block;
    width: 230px;
    height: 24px;
    padding: 8px 0 0;
    margin: 0;
    background: #005ae6 url(../custimgs/button-blue.png) no-repeat top left;
    color: white;
    font-weight: bold;
    text-align: center;
    font-size: 1.05em;
    line-height: 1.2em;
}

.button:hover,
.button:focus {
    background-position: 0 -33px;
}

.button:active {
    background-position: 0 -66px;
}

a.button {
    text-decoration: none;
}

a.button:hover {
    text-decoration: none;
}

.button + .button {
    margin-left: 10px;
}

/* ---- Small button ---- */

.button.small {
    width: 110px;
    background-image: url(../custimgs/button-blue-small.png);
}

.button.small.white-bg {
    background-image: url(../custimgs/button-blue-small-white.png);
}

/* ---- Medium button ---- */

.button.medium {
    width: 190px;
    background-image: url(../custimgs/button-blue-medium.png);
}

.button.medium.white-bg {
    background-image: url(../custimgs/button-blue-medium-white.png);
}

/* ---- Grey button ---- */

.button.grey {
    background-image: url(../custimgs/button-grey.png);
}

.button.grey.small {
    background-image: url(../custimgs/button-grey-small.png);
}

.button.grey.small.dark-bg {
    background-image: url(../custimgs/button-grey-small-dark.png);
}

/* ---- Light button ---- */

.button.light {
    background-color: #e7e7e7;
    background-image: url(../custimgs/button-light.png);
    color: #465564;
}

.button.light.small {
    background-image: url(../custimgs/button-light-small.png);
}

/* Disabled */
.button.light.inactive {
    color: #b4c3d2;
    background-position: 0 -99px;
}

.button-light.inactive:hover {
    background-position: 0 -99px;
    text-decoration: none;
}

/* ---- Square button ---- */

.square.button {
    height: 32px;
    width: 32px;
    padding: 0;
    background: #e7e7e7 url(../custimgs/button-light-square.png) no-repeat top left;
    vertical-align: middle;
}

.square.button:hover,
a:hover > .square.button,
.square.button:focus,
a:focus > .square.button {
    background-position: 0 -33px;
}

.square.button:active,
a:active > .square.button {
    background-position: 0 -66px;
}

.square.button .icon {
    display: block;
    height: 32px;
    width: 32px;
    background-position: center center;
}


/* ------------------------------ */

span.radioInvisible {
    display: none;
}

span.radioVisible {
    display: inline;
}

/* DATASYS TJ-98: Presun ikonky klavesnice do textoveho prvku */
.form-group.icon-input:hover .form-control {
    border-color: #2362a2;
    border-bottom-width: 2px;
    margin-bottom: -1px;
}

.form-group.icon-input .icon-control {
    position: absolute;
    top: 1.5rem;
    right: 1rem;
    height: 4rem;
    width: 4rem;
    text-align: center;
    vertical-align: middle;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.form-group.icon-input .icon-control.icon-control-right {
    right: -55px;
}

.form-group.icon-input .form-control {
    padding-right: 70px;
}

.form-group.icon-input .icon-control:hover i {
    color: #2362a2; /* DATASYS: Primary blue z MVDS */
}

.form-group.icon-input .fa {
    color: #a8a8a8; /* DATASYS: LightGrey z MVDS */
    opacity: 0.5;
    font-size: 3rem;
    margin-top: -5px;
}

/* DATASYS: smazány další custom styly, zde jsou ponechané pouze styly pro tlačítka kvůli grafické klávesnici. */

/* Vracen styl pro bile odkazy */
.static-white-link, .static-white-link:hover, .static-white-link:visited {
    color: white !important;
}

/* ---------------------------------------------- */
/* ------- Logo in test environments (in particular VT) ------- */
.header__logo_test {
    /*width: 240px !important;*/
    background-image: url("../images/ds_logotyp_rgb_VT.svg") !important;
}

#smsButton, #sms_button_link {
    z-index: 1;
}

/** ISDS-1637, AGW-904 */
.link-spanner {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left: 0;
    z-index: 1;

    /* edit: fixes overlap error in IE7/8,
       make sure you have an empty gif
    background-image: url('empty.gif');*/
}

/* ISDS-2734 - pridano odsazeni kvuli situaci s vice tlacitky nad sebou */
.btn {
    margin-top: .4rem;
}

@-webkit-keyframes rotate {
    100% {
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
@keyframes rotate {
    100% {
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
@-webkit-keyframes color {
    0% {
        stroke:#ecae1a
    }
    40% {
        stroke:#ecae1a
    }
    66% {
        stroke:#ecae1a
    }
    80%, 90% {
        stroke:#ecae1a
    }
}
@keyframes color {
    0% {
        stroke:#ecae1a
    }
    40% {
        stroke:#ecae1a
    }
    66% {
        stroke:#ecae1a
    }
    80%, 90% {
        stroke:#ecae1a
    }
}

/* ISDS-2749 */
@media (min-width: 992px) {
    .side-content__holder {
        position: fixed !important;
        overflow: hidden;
    }
}

@media (min-width: 992px) and (min-height: 525px) and (max-height: 765px) {
    .side-content__footer {
        background: #2463a3;
        width: 270px;
        position: fixed;
        bottom: -10px
    }

    .side-content__menu {
        height: 100%;
        width: 270px;
        position: fixed;
        top: 114px;
        bottom: initial;
        left: initial;
    }
}

.usr-close-overlay {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: gray;
    opacity: .4;
    z-index: 1040;
}

.usr-container {
    display: block;
    position: fixed;
    top: 6px;
    width: 476px;
    z-index: 1060;
    font-size: 1.5rem !important;
    color: #3b3b3b !important;
    border-radius: 6px;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
}
@media (max-width: 510px) {
    .usr-container {
        width: 300px;
    }
    .user-login-row-container {
        max-height: 150px;
    }
}
@media (min-width: 1200px) {
    .usr-container {
        max-width: 1000px;
        margin: 5rem auto;
    }
    .user-login-row-container {
        max-height: 250px;
    }
}

.usr-body {
    padding: 0 1rem 1rem 2rem;
}

user-login-row {
    display: block;
    width: 100%;
}

user-login-row + user-login-row {
    border-top: 1px dashed rgba(59, 59, 59, 0.3);
}

.usr-row-label {
    display: flex;
    font-size: 1.3rem;
    color: #3b3b3b;
}

.usr-text {
    padding-top: 2rem;
}
.usr-text p {
    margin-bottom: 1rem;
}

.user-login-row-container {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

.usr-search {
    padding: 5px 0 10px 0;
    position: relative;
    width: 94%;
    font-size: 1.5rem;
    color: #3b3b3b;
}
.usr-search input {
    width: 100%;
    height: 35px;
    padding-left: 10px;
    padding-right: 40px;
    letter-spacing: 0.06375em;
    cursor: pointer;
    outline: none;
    border: none;
    border-bottom: 1px solid rgba(59, 59, 59, 0.3);
    margin-bottom: 1px;
}
.usr-search input:focus {
    border-bottom: 2px solid #2362a2;
    margin-bottom: 0px;
}
.usr-search .search-icon {
    pointer-events: none;
    position: absolute;
    right: 4px;
    top: 10px;
    font-size: 18px;
    background-color: #2362a2;
    border-radius: 4px;
    color: #fff;
    width: 26px;
    height: 25px;
    padding: 4px 5px;
}
.usr-search .placeholder {
    pointer-events: none;
    position: absolute;
    width: 100%;
    left: 0;
    padding: 5px 10px;
    background-color: transparent;
    opacity: 0.5;
}
.usr-search .placeholder-hidden {
    display: none;
}

.usr-logout {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 2rem 0;
}

.usr-container.to-left {
    margin-left: 8px;
}

.usr-container.to-right {
    right: 8px;
}
@media (min-width: 1280px) {
    .usr-container.to-right {
        margin-left: 786px;
        right: unset;
    }
}

.usr-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 10px;
    outline: none;
}
.usr-row:hover, .usr-row:focus {
    background: #e5ebf0;
}
.usr-row.inactive .usr-box .usr-box-name-id, .usr-row.inactive .usr-box img {
    opacity: 0.6;
}

.current-box .usr-row {
    cursor: default;
    border: 1px dashed rgba(59,59,59,.3);
    border-radius: 3px;
    background-color: #e5ebf0;
}

.usr-box {
    display: flex;
    align-items: center;
}

.usr-box-icon {
    padding-right: 10px;
}
.usr-box-icon img {
    width: 32px;
}

.usr-box-name-id {
    padding-right: 12px;
}

.usr-box-name {
    font-weight: 700;
    font-size: 1.4rem;
    word-break: break-word;
}

.usr-box-id {
    font-size: 1.2rem;
}

.usr-box-state {
    font-size: 1.2rem;
}

.usr-box-type, .usr-box-type-xs {
    background-color: #d0d0d0;
    padding: 5px 10px;
    font-size: 1.2rem;
    width: 126px;
    text-align: center;
}

.usr-box-type-xs {
    display: none;
    margin-top: 0.3rem;
    text-align: unset;
}

@media (max-width: 490px) {
    .usr-box-name-id {
        max-width: unset;
    }
    .usr-box-type {
        display: none;
    }
    .usr-box-type-xs {
        display: inline-block;
        width: unset;
    }
}
.hl {
    color: #0d6efd;
}

.tooltip-popper__text {
    display:none;
    padding:10px 15px 15px 15px;
    color:#fff;
    text-align:left;
    white-space:normal;
    max-width:290px;
    border-radius:2px;
    background-color:#616161;
    font-family:"Roboto",helvetica,arial,sans-serif;
    font-size:1.2rem;
    font-weight:500;
    line-height:16px;
    z-index:10;
    text-transform:none;
    width:max-content
}
.tooltip-popper__text a,
.tooltip-popper__text a:visited {
    color:#fff !important
}
.tooltip-popper__text a:hover {
    color:#afc1e2 !important
}

.tooltip-popper__text[data-show] {
    display: inline;
}

.user-icon-container {
    display: block;
    position: relative;
    top: 54px;
    max-width: 1000px;
    margin: 0 auto;
}

.user-icon-container p {
    margin: 20px 5px 2px;
    color: #fff;
}

.user-icon {
    position: relative;
    width: 34px;
}

.user-icon img {
    width: 33px;
}

.user-icon-label,
.user-icon-label-2,
.user-icon-label-2b,
.user-icon-label-3 {
    position: absolute;
    bottom: -1px;
    width: 100%;
    color: #2463a3;
    font-weight: bold;
    text-align: center;
    font-size: 1.2rem;
    line-height: normal;
}

.user-icon-label-2, .user-icon-label-2b {
    background-color: #fff;
    transform: rotate(-40deg);
    border-radius: 6px;
    left: 10px;
    opacity: 0.9;
    width: 80%;
}

.user-icon-label-2b {
    border: 1px solid #193b64;
    box-shadow: 0 0.25rem 0.5rem rgba(255, 255, 255, 0.3);
    padding: 1px 0;
    width: 96%;
}

.user-icon-label-3 {
    background-color: #fff;
    border-radius: 6px;
    opacity: 0.9;
    bottom: -16px;
}

.d-flex + .d-flex {
    margin-top: 35px;
}

.d-flex {
    display: flex;
    gap: 30px;
}

.t {
    color: #fff;
}

.aural {
    position: absolute;
    top: -10000em;
    left: -10000em;
}

button.close {
    font-size: 4rem;
    padding: 0;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}

.usr-header {
    display:flex;
    justify-content:flex-end;
    font-weight:500;
    padding:0 1rem
}

.btn img {
    filter: brightness(0) saturate(100%)
    invert(18%) sepia(31%) saturate(2000%) hue-rotate(193deg)
    brightness(91%) contrast(92%);
    width: 16px;
}

.name-highlight {
    color: #0d6efd;
}

.icon-hover {
    filter: brightness(0) invert(1);
    transition: filter .2s ease;
}

.icon-hover:hover,
a:hover .icon-hover {
    filter: invert(34%) sepia(76%) saturate(500%) hue-rotate(175deg) brightness(90%) contrast(90%); /* ≈ #2362a2 */
}

.logout-icon:hover,
a:hover .logout-icon {
    filter: invert(36%) sepia(93%) saturate(700%) hue-rotate(176deg) brightness(84%) contrast(92%); /* ≈ #2463a3 */
}