.donations-report-container {
    width: 100vw !important;
    overflow: hidden !important;
}

.header-panel {
    @apply flex items-center
    justify-between
    px-6 py-4   text-2xl font-semibold text-white;
}

.report-container {
    @apply w-full p-6;
}

.report-table-container {
    @apply w-full;
}

.report-table-container tr th {
    @apply uppercase;
}

.report-table-container tr th:last-of-type {
    @apply text-right;
}

.report-table-container td,
.report-table-container th {
    @apply px-4 py-6  text-white;
}

.report-table-container thead {
    @apply text-xl;
    background: rgba(255, 255, 255, .25);
}

.base-row {
    @apply border-t-2 border-b-2 text-lg;
    background: rgba(255, 255, 255, .1);
    border-color: var(--background);
}

.base-row td:last-of-type {
    @apply text-right;
}

.total-row {
    @apply text-xl uppercase;
    background-color: var(--primary-color);
    color: var(--foreground);
}

.total-row-amount td {
    @apply text-right text-xl p-0;
    width: 100%;
    background: rgba(255, 255, 255, .1);
}



.total-row-amount td:last-of-type span {
    @apply  inline-block ml-auto pl-5 py-6 pr-6;
    background-color: var(--secondary-color);
    color: var(--primary-color);
}

.bank-info {
    @apply flex flex-col mb-12;
}

.bank-content {
    @apply flex md:flex-row mx-6
    md:mx-0 items-center gap-2 justify-center;
}

.bank-info-flex {
    @apply flex flex-col items-center gap-2 flex-auto md:flex-none;
}

.bank-info-flex span:first-of-type {
    font-size: .65em;
    @apply text-gray-300 md:text-lg;
}

.bank-info-flex span:last-of-type {
    @apply px-5 py-2 md:px-12 md:py-6 text-sm
    md:text-xl text-gray-300;
    background: rgba(255, 255, 255, 0.1);
}

.bank-title-container {
    @apply text-xl text-center flex w-full items-center justify-between p-6 text-white;
}

.bank-title-container h2 {
    @apply text-2xl uppercase;
}

.total-row-amount {
    @apply text-xl uppercase;
    background: var(--background);
    color: var(--foreground);
}

.report-error {
    @apply text-red-500 text-center text-2xl flex flex-col p-6 m-12 shadow-sm;
    background: rgba(255, 255, 255, 0.1);
}

.report-error p {
    @apply text-white mt-12 text-lg;
}

.rtext-danger {
    @apply text-white text-lg font-medium  bg-red-400 rounded w-1/2 mx-auto p-4 text-center;
}

.report-table-container tr th:first-of-type,
.report-table-container tr td:first-of-type {
    @apply w-2/3; /* ou une largeur spécifique comme w-64 */
}

.donation-button-container {
    @apply flex items-center justify-center mt-12 mb-16;
}

.donation-button {
    @apply px-12 py-4 rounded-md text-white font-bold focus:outline-none transition-colors border border-transparent;
    background-color: var(--primary-color);
}

.donations-report-container {
    @apply max-w-5xl mx-auto z-20;
}

.total-row-amount td:first-of-type {
    width: 0 !important;
}