.accordion-button {
    background-color: white;
    color: black; /* Optional: Change text color to black for better contrast */
}

.accordion-button:not(.collapsed) {
    background-color: rgba(173, 216, 230, 0.27);
    color: black; /* Optional: Change text color to black for better contrast */
}

.accordion-collapse {
    background-color: white;
}

.accordion-collapse.show {
    background-color: rgba(173, 216, 230, 0.27);
}
.accordion-button .grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr 10fr 1fr; /* Adjust the widths as needed */
    width: 100%;
}

.accordion-button .grid-layout span {
    margin-left: 0;
}
.accordion-button .grid-layout .castka {
    text-align: right; /* Align the amount to the right */
}
.accordion-button .grid-layout .popis {
    margin-left: 20px; /* Move the description 10 pixels to the right */
}
.accordion-button .grid-layout .badge {
    margin-right: 20px; /* Move the badge 10 pixels to the right */
}

.with-errors{
    color: red;
    font-size: 0.8em;
    margin-top: 5px;
}
/* Stylování loga projektu */
.navbar-brand {
    display: flex;
    align-items: center;
    justify-content: center; /* Přidáno pro vystředění */
    text-decoration: none;
    width: 100%; /* Přidáno pro vystředění */
}

.navbar-brand img {
    max-height: 30px;
    margin-right: 10px;
}

.navbar-brand span {
    font-size: 1.25rem;
    font-weight: bold;
    color: black;
}

.btn-opacity-50 {
    opacity: 0.50; /* Částečná průhlednost */
    /*background-color: #6c757d; !* Jemnější barva *!*/
    border-radius: 5px; /* Zaoblené rohy */
    transition: opacity 0.3s ease, transform 0.2s ease; /* Plynulý přechod */
}

.btn-opacity-75:hover {
    opacity: 1; /* Plná neprůhlednost při najetí myší */
    transform: scale(1.05); /* Jemné zvětšení při najetí */
}
@media (max-width: 576px) and (orientation: portrait) {
    .graf-container {
        height: 250px;
        min-height: 250px;
    }
    canvas.graf {
        height: 100% !important;
        width: 100% !important;
    }
}

@media (max-width: 576px) and (orientation: landscape) {
    .graf-container {
        height: 140px;
        min-height: 140px;
    }
    canvas.graf {
        height: 100% !important;
        width: 100% !important;
    }
}
.graf-container {
    height: 350px;
    min-height: 350px;
}
canvas.graf {
    height: 100% !important;
    width: 100% !important;
    display: block;
}
