/* CSS UTILS */
@import url("utils/colors.css");
@import url("utils/borders.css");
@import url("utils/fonts.css");
@import url("utils/padding.css");
@import url("utils/button.css");
@import url("utils/display.css");
@import url("utils/size.css");
@import url("utils/form.css");


nav .logo-small {
    display: none !important;
}

.semi-nav .logo-large {
    display: none !important;
}

.semi-nav .logo-small {
    display: block !important;
}

.offcanvas-end {
    width: 65% !important;
}

.btn-offcanvas-save {
    position: absolute;
    bottom: 1em;
    right: 1em;
}

.header-profile-canvas {
    max-width: 100% !important;
    width: auto !important;
}

.badge-card {
    top: 3em;
    right: -3em;
    width: 150px;
    position: absolute;
    transform: rotate(45deg);
}

.ts-wrapper.form-select {
    height: 50px;
}

.menu-title span {
    color: rgba(var(--primary), 1) !important;
}

.offcanvas {
    border-left: var(--bs-offcanvas-border-width) solid rgb(0 0 0);
}

@media screen and (max-width: 1024px) {
    .create-entity-btn {
        padding: 5px 0 5px 0px;
        width: 100% !important;
        margin: 0 !important;
    }
    .nav-tabs {
        padding: 0;

        button {
            border-radius: 0 !important;
        }
    }
    .text-end.pe-2 {
        padding-right: 0 !important;
    }
    .offcanvas-end {
        width: 90% !important;
    }
    #add-discount-row {
        padding: 5px 0 5px 0px;
        width: 100% !important;
        margin: 0 !important;
    }
    td {
        .h-30.w-30.d-flex-center {
            display: none;
        }
    }
    .table thead {
        display: none; /* Nasconde l'intestazione */
    }

    .table,
    .table tbody,
    .table tr,
    .table td {
        display: block;
        width: 100%;
    }

    .table tr {
        margin-bottom: 1rem;
        border: 1px solid #ddd;
        border-radius: 10px;
        padding: 10px;
        background-color: #fff;
        box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    }

    .table td {
        border: none;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 6px 0;
    }

    /* Rende tutte le select auto-adattive al contenuto */
    select {
        width: fit-content !important; /* si adatta al testo più lungo */
        min-width: min-content !important;
        white-space: nowrap; /* evita che il testo vada a capo */
        display: inline-block; /* fit-content funziona solo inline-block */
        padding-right: 2rem; /* spazio per la freccia a destra */
        background-position: right 0.5rem center;
    }

    /* Compatibilità con input group Bootstrap */
    .input-group > select.form-select {
        flex: 0 0 auto; /* evita che Bootstrap lo forzi a espandersi */
    }

    /* (opzionale) imposta un limite massimo */
    select {
        max-width: 100%; /* evita overflow in container stretti */
    }

}