html.hide-action-labels .action-text {
    display: none !important;
}

@media (hover: none), (pointer: coarse) {
    [data-tooltip-dica] {
        display: none !important;
    }

    [data-tooltip-dica].tooltip-dica--open {
        display: block !important;
    }
}

[data-user-actions].action-grid-compact-left {
    width: calc(66.666667% - 0.125rem);
    margin-right: auto;
}

@media (min-width: 640px) {
    [data-user-actions].action-grid-compact-left {
        width: calc(66.666667% - 0.166667rem);
    }
}

html.hide-action-labels th[data-column="Ações"],
html.hide-action-labels th[data-column="actions"],
html.hide-action-labels td[data-column="Ações"],
html.hide-action-labels td[data-column="actions"] {
    text-align: center !important;
    white-space: nowrap;
}

html.hide-action-labels td[data-column="Ações"] > .flex,
html.hide-action-labels td[data-column="actions"] > .flex {
    justify-content: center !important;
    gap: 0.5rem;
}

html.hide-action-labels td[data-column="Ações"] > [data-user-actions] {
    width: max-content !important;
    justify-content: center !important;
    gap: 0.5rem;
}

html.hide-action-labels td[data-column="Ações"] > [data-user-actions].grid-cols-2 {
    grid-template-columns: repeat(2, 2.5rem) !important;
    margin-left: calc(50% - 4.25rem);
    margin-right: auto;
}

html.hide-action-labels td[data-column="Ações"] > [data-user-actions].grid-cols-3 {
    grid-template-columns: repeat(3, 2.5rem) !important;
    margin-left: auto;
    margin-right: auto;
}

html.hide-action-labels td[data-column="Ações"] a,
html.hide-action-labels td[data-column="Ações"] button,
html.hide-action-labels td[data-column="Ações"] span[title],
html.hide-action-labels td[data-column="actions"] a,
html.hide-action-labels td[data-column="actions"] button,
html.hide-action-labels td[data-column="actions"] span[title] {
    width: 2.5rem;
    min-width: 2.5rem;
    height: 1.5rem;
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: center !important;
    gap: 0;
}

html.hide-action-labels td[data-column="Ações"] svg,
html.hide-action-labels td[data-column="actions"] svg {
    flex: 0 0 auto;
}

@media (max-width: 1279px) {
    td[data-column="Ações"] .action-text,
    td[data-column="actions"] .action-text {
        display: none !important;
    }

    th[data-column="Ações"],
    th[data-column="actions"],
    td[data-column="Ações"],
    td[data-column="actions"] {
        text-align: center !important;
        white-space: nowrap;
    }

    td[data-column="Ações"] > .flex,
    td[data-column="actions"] > .flex {
        justify-content: center !important;
        gap: 0.5rem;
    }

    td[data-column="Ações"] > [data-user-actions] {
        width: max-content !important;
        justify-content: center !important;
        gap: 0.5rem;
    }

    td[data-column="Ações"] > [data-user-actions].grid-cols-2 {
        grid-template-columns: repeat(2, 2.5rem) !important;
        margin-left: calc(50% - 4.25rem);
        margin-right: auto;
    }

    td[data-column="Ações"] > [data-user-actions].grid-cols-3 {
        grid-template-columns: repeat(3, 2.5rem) !important;
        margin-left: auto;
        margin-right: auto;
    }

    td[data-column="Ações"] a,
    td[data-column="Ações"] button,
    td[data-column="Ações"] span[title],
    td[data-column="actions"] a,
    td[data-column="actions"] button,
    td[data-column="actions"] span[title] {
        width: 2.5rem;
        min-width: 2.5rem;
        height: 1.5rem;
        padding-left: 0 !important;
        padding-right: 0 !important;
        justify-content: center !important;
        gap: 0;
    }

    td[data-column="Ações"] svg,
    td[data-column="actions"] svg {
        flex: 0 0 auto;
    }
}

@media (max-width: 639px) {
    html.hide-action-labels td[data-column="Ações"] > [data-user-actions],
    td[data-column="Ações"] > [data-user-actions] {
        gap: 0.375rem;
    }

    html.hide-action-labels td[data-column="Ações"] > [data-user-actions].grid-cols-2,
    td[data-column="Ações"] > [data-user-actions].grid-cols-2 {
        grid-template-columns: repeat(2, 2.25rem) !important;
        margin-left: calc(50% - 3.75rem);
    }

    html.hide-action-labels td[data-column="Ações"] > [data-user-actions].grid-cols-3,
    td[data-column="Ações"] > [data-user-actions].grid-cols-3 {
        grid-template-columns: repeat(3, 2.25rem) !important;
    }

    html.hide-action-labels td[data-column="Ações"] a,
    html.hide-action-labels td[data-column="Ações"] button,
    html.hide-action-labels td[data-column="Ações"] span[title],
    html.hide-action-labels td[data-column="actions"] a,
    html.hide-action-labels td[data-column="actions"] button,
    html.hide-action-labels td[data-column="actions"] span[title],
    td[data-column="Ações"] a,
    td[data-column="Ações"] button,
    td[data-column="Ações"] span[title],
    td[data-column="actions"] a,
    td[data-column="actions"] button,
    td[data-column="actions"] span[title] {
        width: 2.25rem;
        min-width: 2.25rem;
    }

    #sidebar {
        display: none;
    }

}

/* Suppress all sidebar-related transitions on initial page load */
html.sidebar-no-transition #sidebar,
html.sidebar-no-transition #header-content,
html.sidebar-no-transition #main-content {
    transition: none !important;
}

/* Fundo #030B29 em toda a página, nos DOIS temas.
   Decisão de produto do commit 34d7500 ("makes 'dark mode' as default bg color
   in dashboards"): o prefixo html.dark foi removido de propósito. Como este
   arquivo é carregado depois do Tailwind e usa !important, as classes
   `dark:bg-gray-950` / `dark:bg-gray-900` nos <main> não têm efeito. */
body,
main {
    background-color: #030B29 !important;
}

/* Força o fundo escuro da página mesmo quando o <main> usa classes Tailwind como bg-gray-100 */
main,
main.bg-gray-100,
main.bg-gray-50,
main.bg-white,
main.bg-white\/50,
main.bg-slate-50,
main.bg-slate-100 {
    background-color: #030B29 !important;
}

.dashboard-card-grid {
    grid-auto-rows: 16rem;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    align-content: start;
}

.dashboard-card-grid--compact {
    grid-auto-rows: auto;
}

@media (max-width: 640px) {
    .dashboard-card-grid {
        grid-template-columns: 1fr;
    }
}

.dashboard-card-sync-label {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-card-media,
.dashboard-card-body {
    height: 7.5rem;
}

.dashboard-card-body {
    height: 8.5rem;
}

.dashboard-card--compact .dashboard-card-body {
    height: auto;
}

.dashboard-card-title,
.dashboard-card-warning:not(.hidden) {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
}

.dashboard-card-title {
    -webkit-line-clamp: 2;
    line-clamp: 2;
    line-height: 1.2;
}

.dashboard-card-warning {
    -webkit-line-clamp: 1;
    line-clamp: 1;
}

@media (max-width: 639px) {
    .dashboard-row-list {
        gap: 0.625rem;
    }

    .dashboard-row-card {
        min-height: 5.75rem;
        border-radius: 0.875rem;
    }

    .dashboard-row-media.dashboard-visual-media {
        width: 5.5rem;
        min-height: 5.75rem;
    }

    .dashboard-row-body {
        justify-content: center;
        gap: 0.25rem;
        padding: 0.5rem 0.75rem;
    }

    .dashboard-row-title {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        line-height: 1.15;
    }

    .dashboard-row-client {
        margin-top: 0.125rem;
        line-height: 1.1;
    }

    .dashboard-row-sync-actions {
        align-items: center;
        gap: 0.375rem;
    }

    .dashboard-row-sync-badge {
        align-items: center;
        gap: 0.25rem;
        padding: 0.1875rem 0.5rem;
        font-size: 0.6875rem;
        line-height: 1.1;
    }

    .dashboard-row-sync-badge [data-card-sync-status-icon] {
        width: 0.875rem;
        height: 0.875rem;
        margin-top: 0;
    }

    .dashboard-row-sync-button {
        min-width: 1.875rem;
        height: 1.875rem;
        justify-content: center;
        padding: 0.375rem;
    }

    .dashboard-row-sync-button [data-card-sync-icon],
    .dashboard-row-sync-button svg {
        width: 1rem;
        height: 1rem;
    }
}

#sidebar nav a,
#sidebar nav button {
    white-space: nowrap;
}

#sidebar nav svg {
    flex: 0 0 auto;
}

@media (max-width: 1023px) {
    #sidebar {
        transform: translateX(-100%);
        transition: transform 240ms ease;
        will-change: transform;
    }

    #sidebar[data-visible="true"] {
        transform: translateX(0);
    }

    html,
    body,
    main {
        min-height: 100%;
        height: 100%;
        min-height: 100dvh;
        height: 100dvh;
    }

    body.min-h-screen,
    main.min-h-screen {
        min-height: 100dvh;
    }
    
    #sidebar {
        height: 100dvh;
    }

    body,
    main {
        background-color: #030B29 !important;
    }

    html,
    body {
        overflow: hidden !important;
    }

    main {
        display: flex;
        flex-direction: column;
        min-height: 100%;
        height: 100%;
        min-height: 100dvh;
        height: 100dvh;
        overflow: hidden;
    }

    main > .min-h-screen.flex.flex-col {
        display: flex;
        flex: 1 1 auto;
        min-height: 0;
        flex-direction: column;
        order: 1;
        overflow: hidden;
    }

    main > .mobile-bottom-navigation {
        flex: 0 0 auto;
        order: 2;
        width: 100%;
    }

    main > .min-h-screen.flex.flex-col > main {
        display: flex;
        flex: 1 1 0;
        min-height: 0;
        flex-direction: column;
        overflow: visible;
        padding-bottom: 0;
    }
}

.bottom-sheet--dragging {
    transition: none !important;
}

@media (min-width: 1024px) {
    html[data-sidebar-desktop-state="expanded"] main > .min-h-screen.flex.flex-col {
        margin-left: 16rem;
        transition: margin-left 240ms ease;
    }

    html[data-sidebar-desktop-state="collapsed"] main > .min-h-screen.flex.flex-col {
        margin-left: 4rem;
        transition: margin-left 240ms ease;
    }

    /* Desktop: animate sidebar width so content and sidebar expand together */
    #sidebar {
        width: 16rem; /* default width matches .w-64 */
        transition: width 240ms ease;
        will-change: width;
        overflow: hidden;
    }

    html,
    body,
    main {
        min-height: 100%;
        height: 100%;
    }

    body,
    main {
        background-color: #030B29 !important;
    }

    html,
    body {
        overflow: hidden !important;
    }

    main {
        display: flex;
        flex-direction: column;
        min-height: 100%;
        height: 100%;
        overflow: hidden;
    }

    main > .min-h-screen.flex.flex-col {
        display: flex;
        flex: 1 1 auto;
        min-height: 0;
        flex-direction: column;
        overflow: hidden;
    }

    main > .min-h-screen.flex.flex-col > main {
        display: flex;
        flex: 1 1 0;
        min-height: 0;
        flex-direction: column;
        overflow: visible;
        padding-bottom: 0;
    }

    #main-content {
        position: relative;
        box-sizing: border-box;
        width: auto;
        max-width: none;
        flex: 1 1 0;
        min-height: 0;
        margin: 0 1rem 1rem 0;
        padding: 1rem;
        border-radius: 1rem;
        background-color: #f3f4f6;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        border: 1px solid rgba(15, 23, 42, 0.06);
        box-shadow: none;
    }

    html.dark #main-content {
        background-color: #030B29;
        
        box-shadow: none;
    }

    html[data-sidebar-desktop-state="collapsed"] #main-content {
        width: auto;
        max-width: none;
    }

    html[data-sidebar-desktop-state="collapsed"] #sidebar {
        width: 4rem;
    }

    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-text,
    #sidebar[data-desktop-state="collapsed"] .sidebar-section-title,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-section-title,
    #sidebar[data-desktop-state="collapsed"] .sidebar-desktop-label,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-desktop-label,
    #sidebar[data-desktop-state="collapsed"] .sidebar-home-label,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-home-label {
        display: none;
    }

    #sidebar[data-desktop-state="collapsed"] .sidebar-logo-row,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-logo-row {
        justify-content: center;
    }

    #sidebar[data-desktop-state="collapsed"] .sidebar-logo,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-logo {
        justify-content: center;
        width: 100%;
    }

    #sidebar[data-desktop-state="collapsed"] nav a,
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav a,
    #sidebar[data-desktop-state="collapsed"] nav button,
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav button,
    #sidebar[data-desktop-state="collapsed"] .sidebar-home-link,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-home-link {
        justify-content: center;
        gap: 0 !important;
        font-size: 0;
        padding-left: 0.25rem !important;
        padding-right: 0.25rem !important;
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }

    /*
     * Minimizada, a coluna de 4px reservada na direita da linha não é necessária:
     * a estrela e o olho ficam escondidos aqui. Sem zerá-la, a pílula do item
     * ativo nasce 2px fora do centro dos 64px e o ícone acompanha o desvio.
     */
    #sidebar[data-desktop-state="collapsed"] nav > ul > li > ul > li,
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav > ul > li > ul > li {
        border-right-width: 0;
    }

    #sidebar[data-desktop-state="collapsed"] [data-sidebar-desktop-toggle],
    html[data-sidebar-desktop-state="collapsed"] #sidebar [data-sidebar-desktop-toggle] {
        justify-content: center;
        gap: 0;
    }

    /* Removido o display: none do botão de toggle no modo minimizado para mantê-lo visível */

    #sidebar[data-desktop-state="collapsed"] .sidebar-logo-rp,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-logo-rp {
        display: none;
    }

    #sidebar[data-desktop-state="collapsed"] .sidebar-logo-icon,
    html[data-sidebar-desktop-state="collapsed"] #sidebar .sidebar-logo-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    /* No modo minimizado, as seções de título são substituidas por divisores */
    #sidebar[data-desktop-state="collapsed"] nav > ul,
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav > ul {
        gap: 0 !important;
    }

    #sidebar[data-desktop-state="collapsed"] nav > ul > :not([hidden]) ~ :not([hidden]),
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav > ul > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0 !important;
    }

    #sidebar[data-desktop-state="collapsed"] nav > ul > li,
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav > ul > li {
        position: relative;
        padding-top: 0.35rem;
        padding-bottom: 0.35rem;
    }

    #sidebar[data-desktop-state="collapsed"] nav > ul > li + li::before,
    html[data-sidebar-desktop-state="collapsed"] #sidebar nav > ul > li + li::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        /* Acompanha o recuo das pílulas das linhas (`mx-2` de cada lado): um
         * divisor de 100% ficaria visivelmente mais largo que o conteúdo. */
        width: calc(100% - 1rem);
        height: 1px;
        background-color: oklch(44.6% 0.03 256.802 / 0.5);
        border-radius: 9999px;
    }
}

/* Mobile: ensure #main-content background is visible */
@media (max-width: 1023px) {
    #main-content {
        position: relative;
        box-sizing: border-box;
        width: auto;
        max-width: none;
        flex: 1 1 0;
        min-height: 0;
        margin: 0;
        padding: 1rem;
        border-radius: 0;
        background-color: #ffffff;
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        border: none;
        box-shadow: none;
    }

    html.dark #main-content {
        background-color: #030B29;
        box-shadow: none;
    }

    #main-content.responsive-main-shell {
        margin-left: 0.5rem;
        margin-right: 0.5rem;
        border-radius: 1rem;
        clip-path: inset(0 round 1rem);
    }
}

@media (max-width: 639px) {
    #main-content.responsive-list-content {
        padding: 0.75rem;
    }
}

@media (min-width: 640px) and (max-width: 1023px) {
    #main-content.responsive-main-shell {
        margin-bottom: 0.5rem;
    }
}

#main-content.responsive-list-content {
    overflow: hidden;
}

#main-content.report-view-main,
html.dark #main-content.report-view-main {
    background-color: #030B29;
    border-color: transparent;
}