/* Estilização geral do container pai */
.card-footer {
    padding: 1rem; /* Equivalente a py-4 */
}

/* Garantir que o container pai alinhe tudo à direita */
.d-flex.justify-content-end {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center;
    width: 100%;
}

/* Sobrescrever o container principal da paginação */
nav[role="navigation"] {
    width: 100%;
    font-family: Arial, sans-serif;
}

/* Seção para dispositivos móveis */
nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    width: 100%;
}

nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden span,
nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden a {
    display: inline-block !important;
    padding: 6px 12px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    font-size: 14px;
    text-decoration: none;
    color: #495057;
    background-color: #fff;
    transition: background-color 0.3s, color 0.3s;
}

nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden a:hover {
    background-color: #e9ecef;
    color: #212529;
}

nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden span {
    color: #6c757d;
    cursor: not-allowed;
}

/* Seção para telas maiores */
nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between {
    display: none !important; /* Escondida por padrão */
    flex-wrap: nowrap !important; /* Impede a quebra de linha */
    align-items: center;
    justify-content: flex-end !important; /* Alinha tudo à direita */
    gap: 15px; /* Espaço entre o texto e os botões */
    width: 100%;
    overflow: hidden; /* Evita que o conteúdo transborde */
}

/* Texto "Showing X to Y of Z results" */
nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between > div:first-child {
    flex-shrink: 0; /* Impede que o texto encolha demais */
}

nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between > div:first-child p {
    font-size: 14px;
    color: #495057;
    margin: 0;
    white-space: nowrap; /* Impede que o texto quebre em várias linhas */
}

nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between > div:first-child p .font-medium {
    font-weight: 600;
}

/* Container dos botões de página */
nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between > div:last-child {
    display: inline-flex !important;
    align-items: center;
    flex-shrink: 0; /* Impede que os botões encolham */
}

/* Links de página */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md {
    display: inline-flex !important;
    align-items: center;
    gap: 0;
}

/* Estilizar os botões de página */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md span,
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border: 1px solid #dee2e6;
    font-size: 14px;
    text-decoration: none;
    color: #495057;
    background-color: #fff;
    transition: background-color 0.3s, color 0.3s;
}

/* Ajuste para bordas contínuas entre os botões */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md span + span,
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md span + a,
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a + a,
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a + span {
    border-left: none;
}

/* Botão "Previous" */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md span[aria-label="« Previous"],
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a[aria-label="« Previous"] {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

/* Botão "Next" */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a[aria-label="Next »"] {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

/* Botão desabilitado */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md span[aria-disabled="true"] {
    color: #6c757d;
    cursor: not-allowed;
}

/* Botão da página atual */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md span[aria-current="page"] span {
    background-color: #007bff;
    color: #fff;
    border-color: #007bff;
}

/* Links de página (não atuais) */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a {
    color: #007bff;
}

nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md a:hover {
    background-color: #e9ecef;
    color: #0056b3;
}

/* Ajuste para ícones SVG */
nav[role="navigation"] .relative.z-0.inline-flex.rtl\:flex-row-reverse.shadow-sm.rounded-md svg {
    width: 16px;
    height: 16px;
}

/* Responsividade: Forçar o comportamento do Tailwind manualmente */
@media (max-width: 640px) {
    /* Equivalente a sm:hidden */
    nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden {
        display: flex !important;
    }
    /* Equivalente a hidden (esconder em telas pequenas) */
    nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between {
        display: none !important;
    }
}

@media (min-width: 641px) {
    /* Equivalente a sm:flex-1 sm:flex sm:items-center sm:justify-between */
    nav[role="navigation"] .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between {
        display: flex !important;
    }
    /* Esconder a seção para dispositivos móveis em telas maiores */
    nav[role="navigation"] .flex.justify-between.flex-1.sm\:hidden {
        display: none !important;
    }
}