body {
    overflow-x: hidden;
    max-width: 100%;
    background-color: #f9fafb;
    background-image: url("../img/FonClean2.png");
    background-size: 150px 150px;
    background-repeat: repeat;
    background-attachment: fixed;
    @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
        background-size: 250px 250px;
      }
}

.header{
    border-bottom: 1px solid #dee2e6;
    transition: box-shadow 0.3s ease, background-color 0.3s ease;
    max-width: 100%;
    padding: 0.5rem 1.5rem;
}

.footer {
    flex: 0 0 auto;
    padding: 10px;
    background: white;
    border-top: 1px solid #ddd;
    text-align: center;
}

.card{
    background: rgba(248, 249, 250);
    border-radius: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.recur {
    background-color: #b7e1cd;
    font-size: small;
    text-align: center;
    color: white;
    font-weight: bold;
    border-radius: 7px;
    padding: 2px;
    margin: 2px;
}

.not-recur {
    background-color: #f4cccc;
    font-size: small;
    text-align: center;
    color: white;
    font-weight: bold;
    border-radius: 7px;
    padding: 2px;
    margin: 2px;
}

.income {
    background-color: #b7e1cd;
}

.charge {
    background-color: #f4cccc;
}

.navbar-brand {
    padding-top: .75rem;
    padding-bottom: .75rem;
    font-size: clamp(18px, 1.5vw, 1.5vw);
}

.navbar-brand img {
    object-fit: contain;
    width: auto;
    height: 30px;
}

.logo-container {
    position: relative;
    max-width: 315px;
}

.logo-img {
    max-height: 50px;
    width: auto;
    object-fit: contain;
}

.btn-edit-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url("../img/edit.png");
}

.btn-show-contacts-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url("../img/eye.png");
}

.btn-delete-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url("../img/delete.png");
}

.admin-user-actions {
    width: 120px;
}

.showed-email, .showed-phone {
    display: none;
}

.btn-question-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url("../img/question.png");
}

.btn-save-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url("../img/save.png");
}

.btn-cancel-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: url("../img/cancel.png");
}

.js-save-phone-block-btn {
    cursor: pointer;
    font-size: 0.7em;
}

.js-edit-phone-block-btn {
    cursor: pointer;
    font-size: 0.7em;
}

.js-cancel-phone-block-btn {
    cursor: pointer;
    font-size: 0.7em;
}

.js-save-email-block-btn {
    cursor: pointer;
    font-size: 0.7em;
}

.js-edit-email-block-btn {
    cursor: pointer;
    font-size: 0.7em;
}

.js-cancel-email-block-btn {
    cursor: pointer;
    font-size: 0.7em;
}

.menu-switcher {
    display: none;
    cursor: pointer;
}

.menu-switcher-control {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

#alert-login {
    display: none;
}

#alert-pass {
    display: none;
}


@media (max-width: 768px) {
    .menu-switcher {
        display: block;
    }

    .sidebar-sticky {
        display: none;
    }

    .menu-switcher-control:checked ~ .sidebar-sticky {
        display: block;
    }
    .navbar-brand img {
        object-fit: contain;
        width: auto;
        height: 20px;
    }

}

.cursor-pointer {
    cursor: pointer;
}

.cpbd > span {
    cursor: pointer;
    border-bottom: 1px dashed;
}