@font-face {
    font-family: "Aqum two Classic";
    font-weight: 900;
    font-style: normal;
    font-display: swap;

    src: local("Aqum two Classic"),
        url("Aqumtwo-Classic.woff2") format("woff2"),
        url("Aqumtwo-Classic.woff") format("woff");
}

.aqum-font {
    font-family: "Aqum two Classic";
}

header nav {
    color: white;
    border-bottom: 2px white solid;
    border-radius: 25px;
    font-family: "Aqum two Classic";
    font-size: 25px;
}

body {
    font-family: "Open Sans", sans-serif;
    color: white;
    background-color: #182533;
    transform: scale(0.8);
    transform-origin: top center;
}

@-moz-document url-prefix() {
  body {
    font-family: "Open Sans", sans-serif;
    color: white;
    background-color: #182533;
    transform: scale(0.8);
    transform-origin: top center;
  }
}

.reset-this {
    all: initial;
}
  
.redo-fieldset {
    font-family: "Open Sans", sans-serif;
    color: white;
    font-size: 16px;
    border: 3px solid white;
    border-radius: 15px;
    padding : 10px;
    min-width: 540px;
    min-height: 138px;
} 

.redo-fieldset-reports {
    font-family: "Open Sans", sans-serif;
    color: white;
    font-size: 16px;
    border: 3px solid white;
    border-radius: 15px;
    padding : 15px;
    min-width: 440px;
    min-height: 55px;
}

.redo-fieldset-settings {
    font-family: "Open Sans", sans-serif;
    color: white;
    font-size: 16px;
    border: 3px solid white;
    border-radius: 15px;
    padding : 15px;
    min-width: 540px;
    min-height: 55px;
} 

.redo-legend {
    color: white;
    font-family: "Aqum two Classic";
    font-size: 19px;
    padding-left: 10px;
    padding-right: 10px;
} 

table tr td, table tr th {
    color: white !important;
    background-color: #182533 !important;
}

table tr td.table-succsess {
    color: green !important;
    font-weight: bold;
}

table tr td.table-unsuccsess {
    color: red !important;
    font-weight: bold;
}

table thead tr th {
    background-color: #293E55 !important;
}

.square {
    width: 100%; /* На мобильных занимает всю ширину */
    max-width: 625px; /* Но не больше исходного размера на десктопе */
    height: auto; /* Высота автоматически */
    aspect-ratio: 625/340; /* Сохраняем пропорции 625:340 */
    border: 3px white solid;
    border-radius: 15px;
    background-image: url("/static/img/stream-loading.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Для очень маленьких экранов */
@media (max-width: 480px) {
    .square {
        border-width: 2px; /* Чуть тоньше рамка */
        border-radius: 10px; /* Чуть меньше скругление */
    }
}

/* Для планшетов */
@media (min-width: 768px) and (max-width: 1024px) {
    .square {
        max-width: 500px; /* Чуть меньше на планшетах */
    }
}

.square-2 {
    height: 200px;
    width: 270px;
    border: 3px white solid;
    border-radius: 15px;
}

.square-3 {
    height: 150px;
    width: 200px;
    border: 3px white solid;
    border-radius: 15px;
}

.table-scroll::-webkit-scrollbar {
    width: 12px;
}

.table-scroll::-webkit-scrollbar-track {
    background: #182533;
}

.table-scroll::-webkit-scrollbar-thumb {
    background-color: #293E55;
    border-radius: 20px;
    border: 3px solid #182533;
}

.help-icon:hover {
    opacity: 70%;
    cursor: pointer;
}

.modal-style {
    background-color: #182533;
    border: 1px white solid;
}

.buttom-img {
    min-width: 287px;
    min-height: 80px;
}

.button-size {
    min-width: 287px;
    max-height: 43px;
    padding: 8px;
}

.button-reload {
    color: white;
    border-color: white;
}

.button-settings {
    background-color: #293E55;
    border: 3px white solid;
    min-width: 250px;
}

.button-data {
    background-color: #293E55;
    border: 3px white solid;
    min-width: 290px;
    /* min-height: 55px; */
}

.button-view {
    background-color: #293E55;
    border: 3px white solid;
    min-width: 200px;
    min-height: 35px;
}

.card-auth {
    background-color: #182533;
    color: white;
    font-size: 20px;
}