/* ============================================================
   Motryz Base Components
   ============================================================
   Componentes compartilhados do Design System Motryz.
   Carregado após motryz-tokens.css e antes de motryz-custom.css.
   ============================================================ */

/* 1. Botões de ação (.btn-action-*) */
/* 2. Action bar */
/* 3. Cards (.context-card, .content-card) */
/* 4. Tabs (.context-tabs) */
/* 5. Formulários (labels, inputs, selects) */
/* 6. Page title (.motryz-page-title) */
/* 7. Empty states */
/* 8. Action modal e choice pattern */
/* 9. Workflow UI */
/* 10. Tabelas (.motryz-table) */
/* 11. Alertas (.motryz-alert) */
/* 12. Ações em lote (.bulk-action-bar) */
/* 13. Skeleton loading */
/* 14. Filtros e busca (.filter-chip, .search-input-group) */
/* 15. Dark mode — ajustes finos */
/* 16. Responsividade */


/* ==========================================================================
   1. Botões de ação (.btn-action-*)
   ========================================================================== */

.btn-action-primary {
    background: var(--success, #65c15c);
    color: #fff;
    border: none;
    border-radius: var(--motryz-radius-base);
    padding: 8px 20px;
    font-weight: 600;
    font-size: .85rem;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    text-decoration: none;
    cursor: pointer;
    line-height: 1.4;
}
.btn-action-primary:hover { opacity: .85; color: #fff; }
.btn-action-primary:disabled { opacity: .5; cursor: not-allowed; }
.btn-action-primary.has-changes {
    background: var(--motryz-warning);
    animation: pulse-save .8s ease-in-out infinite alternate;
}

@keyframes pulse-save {
    from { box-shadow: 0 0 0 0 rgba(var(--motryz-warning-rgb), .3); }
    to   { box-shadow: 0 0 0 6px rgba(var(--motryz-warning-rgb), 0); }
}

.btn-action-secondary {
    background: transparent;
    color: var(--theme-default);
    border: 1.5px solid var(--theme-default);
    border-radius: var(--motryz-radius-base);
    padding: 8px 20px;
    font-weight: 600;
    font-size: .85rem;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    text-decoration: none;
    cursor: pointer;
    line-height: 1.4;
}
.btn-action-secondary:hover { background: var(--theme-default); color: #fff; }

.btn-action-warning {
    background: transparent;
    color: var(--motryz-warning);
    border: 1.5px solid var(--motryz-warning);
    border-radius: var(--motryz-radius-base);
    padding: 8px 20px;
    font-weight: 600;
    font-size: .85rem;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    text-decoration: none;
    cursor: pointer;
    line-height: 1.4;
}
.btn-action-warning:hover { background: var(--motryz-warning); color: #212529; }

.btn-action-primary--sm,
.btn-action-secondary--sm,
.btn-action-warning--sm {
    padding: 7px 14px;
    font-size: .78rem;
}


/* ==========================================================================
   2. Action bar
   ========================================================================== */

.action-bar {
    display: flex;
    gap: .5rem;
    align-items: center;
}


/* ==========================================================================
   3. Cards (.context-card, .content-card)
   ========================================================================== */

.context-card {
    background: var(--white);
    border: 1px solid var(--chart-border);
    border-radius: var(--motryz-radius-lg);
    box-shadow: var(--motryz-shadow-sm);
}
.context-card .card-body {
    padding: 1.25rem 1.5rem;
}

.context-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.context-info h6 {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: var(--chart-text-color);
    margin-bottom: .25rem;
    font-weight: 600;
}
.context-info h4 {
    font-size: 1.15rem;
    color: var(--body-font-color);
    margin: 0;
    font-weight: 700;
}

.content-card {
    background: var(--white);
    border: 1px solid var(--chart-border);
    border-radius: var(--motryz-radius-lg);
    box-shadow: var(--motryz-shadow-sm);
}
.content-card .card-body {
    padding: 1.25rem 1.5rem;
}


/* ==========================================================================
   4. Tabs (.context-tabs)
   ========================================================================== */

.context-tabs .nav-tabs {
    border-bottom: 2px solid var(--chart-border);
    padding: 0 1.5rem;
}
.context-tabs .nav-tabs .nav-link {
    padding: .75rem 1rem;
    font-size: .85rem;
    font-weight: 600;
    color: var(--chart-text-color);
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
}
.context-tabs .nav-tabs .nav-link:hover {
    color: var(--theme-default);
}
.context-tabs .nav-tabs .nav-link.active {
    color: var(--theme-default);
    border-bottom-color: var(--theme-default);
    background: transparent;
}
.context-tabs .nav-tabs .nav-link i,
.context-tabs .nav-tabs .nav-link img {
    font-size: .9rem;
}
.context-tabs .tab-content {
    padding: 1.5rem;
}


/* ==========================================================================
   5. Formulários (labels, inputs, selects)
   ========================================================================== */

.context-card label,
.content-card label {
    font-size: .82rem;
    font-weight: 600;
    color: var(--body-font-color);
    margin-bottom: .35rem;
}

.context-card p,
.content-card p,
.content-card strong,
.content-card .mb-3 label {
    color: var(--body-font-color);
}

.content-card .form-control,
.content-card .form-select {
    border-radius: var(--motryz-radius-base);
    border: 1px solid var(--chart-border);
    font-size: .85rem;
    padding: .5rem .75rem;
    transition: border-color .2s;
}
.content-card .form-control:focus,
.content-card .form-select:focus {
    border-color: var(--theme-default);
    box-shadow: 0 0 0 2px rgba(var(--motryz-primary-rgb), .1);
}


/* ==========================================================================
   6. Page title (.motryz-page-title)
   ========================================================================== */

.motryz-page-title h3 {
    font-weight: 700;
    margin-bottom: 2px;
}
.motryz-page-title p {
    color: var(--chart-text-color);
    font-size: .875rem;
    margin: 0;
}


/* ==========================================================================
   7. Empty states
   ========================================================================== */

.empty-state {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--chart-text-color);
}
.empty-state i {
    font-size: 2rem;
    margin-bottom: .75rem;
    opacity: .5;
}
.empty-state h6 {
    font-weight: 700;
    color: var(--body-font-color);
    margin-bottom: .35rem;
}
.empty-state p {
    font-size: .85rem;
    color: var(--chart-text-color);
    margin: 0;
}


/* ==========================================================================
   8. Action modal e choice pattern
   ========================================================================== */

/* --- Action modal --- */

.motryz-action-modal {
    border: 1px solid var(--chart-border);
    border-radius: 14px;
    overflow: hidden;
    background: var(--white);
}

.motryz-action-modal .modal-body {
    padding: 1rem 1.25rem;
}

.motryz-action-modal .card,
.motryz-action-modal .card-body {
    background: transparent;
    border: 0;
    box-shadow: none;
}

.motryz-action-modal-header {
    align-items: flex-start;
    border-bottom: 1px solid var(--chart-border);
    background: linear-gradient(135deg, rgba(var(--motryz-primary-rgb), .08), rgba(var(--motryz-success-rgb), .06));
}

.motryz-action-modal-heading {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
}
.motryz-action-modal-heading h6 {
    color: var(--body-font-color);
    font-weight: 700;
}
.motryz-action-modal-heading p {
    color: var(--chart-text-color);
    font-size: .85rem;
    margin-top: .2rem;
}

.motryz-action-modal-icon {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    color: var(--theme-default);
    background: rgba(var(--motryz-primary-rgb), .12);
}

.motryz-action-modal-footer {
    border-top: 1px solid var(--chart-border);
    padding: .8rem 1.25rem;
}

/* --- Action summary (compact) --- */

.motryz-action-summary {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.motryz-action-summary > div {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 34px;
    padding: .38rem .65rem;
    border: 1px solid var(--chart-border);
    border-radius: 999px;
    background: var(--light-bg);
}
.motryz-action-summary-label {
    display: inline-flex;
    margin: 0;
    color: var(--chart-text-color);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

/* --- Reprocess panel (compact) --- */

.motryz-reprocess-panel {
    margin-top: .25rem;
    padding: .9rem;
    border: 1px solid var(--chart-border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(var(--motryz-primary-rgb), .035), rgba(var(--motryz-success-rgb), .025));
}

.motryz-reprocess-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .7rem;
    min-height: 28px;
}
.motryz-reprocess-panel-header h6 {
    margin: 0;
    color: var(--body-font-color);
    font-weight: 700;
    font-size: .95rem;
}
.motryz-reprocess-panel-header p {
    margin: .25rem 0 0;
    color: var(--chart-text-color);
    font-size: .78rem;
}

.motryz-reprocess-eyebrow {
    color: var(--theme-default);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.motryz-reprocess-mode-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 700;
    padding: .35rem .75rem;
    white-space: nowrap;
}
.motryz-reprocess-mode-badge.is-partial {
    color: var(--theme-default);
    background: rgba(var(--motryz-primary-rgb), .1);
    border: 1px solid rgba(var(--motryz-primary-rgb), .18);
}
.motryz-reprocess-mode-badge.is-total {
    color: #8a5a00;
    background: rgba(var(--motryz-warning-rgb), .14);
    border: 1px solid rgba(var(--motryz-warning-rgb), .28);
}

.motryz-reprocess-current {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .38rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: var(--chart-text-color);
    font-size: .86rem;
    line-height: 1.35;
}
.motryz-reprocess-current strong {
    color: var(--theme-default);
    font-weight: 700;
}
.motryz-reprocess-current.is-total {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.motryz-reprocess-current.is-total strong {
    color: #9a6500;
}

/* --- Reprocess option (compact) --- */

.motryz-reprocess-option {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 96px;
    gap: .75rem;
    padding: .85rem .9rem;
    border: 1px solid var(--chart-border);
    border-radius: 12px;
    background: linear-gradient(180deg, var(--white), rgba(var(--motryz-primary-rgb), .025));
    border-color: rgba(var(--motryz-primary-rgb), .18);
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.motryz-reprocess-option:hover {
    border-color: var(--theme-default);
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .06);
}
.motryz-reprocess-option.is-selected {
    border-color: var(--theme-default);
    background: linear-gradient(180deg, var(--white), rgba(var(--motryz-primary-rgb), .018));
    box-shadow: 0 0 0 1px rgba(var(--motryz-primary-rgb), .18);
}
.motryz-reprocess-option.is-danger.is-selected {
    border-color: var(--motryz-warning);
    background: linear-gradient(180deg, var(--white), rgba(var(--motryz-warning-rgb), .018));
    box-shadow: 0 0 0 1px rgba(var(--motryz-warning-rgb), .18);
}

.motryz-reprocess-option .form-check-input {
    width: 1.05rem;
    height: 1.05rem;
    margin-top: .2rem;
    border-width: 2px;
    border-color: var(--chart-border);
    box-shadow: 0 0 0 3px rgba(var(--motryz-primary-rgb), .04);
}
.motryz-reprocess-option .form-check-input:checked {
    background-color: var(--theme-default);
    border-color: var(--theme-default);
    box-shadow: 0 0 0 4px rgba(var(--motryz-primary-rgb), .16);
}
.motryz-reprocess-option.is-danger .form-check-input:checked {
    background-color: var(--motryz-warning);
    border-color: var(--motryz-warning);
    box-shadow: 0 0 0 4px rgba(var(--motryz-warning-rgb), .18);
}
.motryz-reprocess-option .form-check-label {
    font-size: .9rem;
    line-height: 1.25;
}

.motryz-reprocess-option .card-body {
    padding: 0;
}

.motryz-reprocess-option-icon {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: var(--motryz-radius-lg);
    color: var(--theme-default);
    background: rgba(var(--motryz-primary-rgb), .1);
}
.motryz-reprocess-option.is-danger .motryz-reprocess-option-icon {
    color: #b26a00;
    background: rgba(var(--motryz-warning-rgb), .12);
}

.motryz-reprocess-option-content {
    display: flex;
    flex-direction: column;
    gap: .22rem;
    min-width: 0;
}
.motryz-reprocess-option-content strong {
    color: var(--body-font-color);
    font-size: .92rem;
}
.motryz-reprocess-option-content small,
.motryz-reprocess-option-note {
    color: var(--chart-text-color);
    font-size: .8rem;
    line-height: 1.35;
}
.motryz-reprocess-option-note {
    max-width: 92%;
    line-height: 1.45;
}

.motryz-reprocess-option-tag {
    position: absolute;
    top: .75rem;
    right: .75rem;
    border-radius: 999px;
    padding: .22rem .55rem;
    color: var(--success);
    background: rgba(var(--motryz-success-rgb), .1);
    font-size: .68rem;
    font-weight: 700;
}
.motryz-reprocess-option-tag.is-warning {
    color: #a66300;
    background: rgba(var(--motryz-warning-rgb), .12);
}

.motryz-reprocess-impact {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-top: .65rem;
    border: 1px solid rgba(var(--motryz-primary-rgb), .14);
    border-radius: var(--motryz-radius-lg);
    padding: .55rem .7rem;
    color: var(--theme-default);
    background: rgba(var(--motryz-primary-rgb), .06);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.4;
}
.motryz-reprocess-impact.is-warning {
    color: #8a5a00;
    border-color: rgba(var(--motryz-warning-rgb), .24);
    background: rgba(var(--motryz-warning-rgb), .08);
}

/* --- Choice pattern (generic) --- */

.motryz-choice-panel {
    padding: .9rem;
    border: 1px solid var(--chart-border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(var(--motryz-primary-rgb), .035), rgba(var(--motryz-success-rgb), .025));
}

.motryz-choice-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 28px;
    margin-bottom: .7rem;
}

.motryz-choice-current {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .35rem;
    color: var(--chart-text-color);
    font-size: .86rem;
    line-height: 1.35;
}
.motryz-choice-current strong {
    color: var(--theme-default);
    font-weight: 700;
}
.motryz-choice-current.is-total strong,
.motryz-choice-current.is-danger strong {
    color: #9a6500;
}

.motryz-choice-card {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 96px;
    padding: .85rem .9rem;
    border: 1px solid var(--chart-border);
    border-radius: 12px;
    background: var(--white);
    cursor: pointer;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease;
}
.motryz-choice-card:hover {
    border-color: rgba(var(--motryz-primary-rgb), .45);
}
.motryz-choice-card.is-selected {
    border-color: var(--theme-default);
    background: linear-gradient(180deg, var(--white), rgba(var(--motryz-primary-rgb), .018));
    box-shadow: 0 0 0 1px rgba(var(--motryz-primary-rgb), .18);
}
.motryz-choice-card.is-danger.is-selected {
    border-color: var(--motryz-warning);
    background: linear-gradient(180deg, var(--white), rgba(var(--motryz-warning-rgb), .018));
    box-shadow: 0 0 0 1px rgba(var(--motryz-warning-rgb), .18);
}

.motryz-choice-card .card-body { padding: 0; }

.motryz-choice-card .form-check-input {
    width: 1.05rem;
    height: 1.05rem;
    border-width: 2px;
    border-color: var(--chart-border);
}
.motryz-choice-card .form-check-input:checked {
    background-color: var(--theme-default);
    border-color: var(--theme-default);
    box-shadow: 0 0 0 4px rgba(var(--motryz-primary-rgb), .16);
}
.motryz-choice-card.is-danger .form-check-input:checked {
    background-color: var(--motryz-warning);
    border-color: var(--motryz-warning);
    box-shadow: 0 0 0 4px rgba(var(--motryz-warning-rgb), .18);
}
.motryz-choice-card .form-check-label {
    color: var(--body-font-color);
    font-size: .9rem;
    line-height: 1.25;
}

.motryz-choice-note {
    max-width: 92%;
    color: var(--chart-text-color);
    font-size: .8rem;
    line-height: 1.45;
}

.motryz-choice-feedback {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-top: .65rem;
    padding: .55rem .7rem;
    border: 1px solid rgba(var(--motryz-primary-rgb), .14);
    border-radius: var(--motryz-radius-lg);
    color: var(--theme-default);
    background: rgba(var(--motryz-primary-rgb), .06);
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.4;
}
.motryz-choice-feedback.is-warning {
    color: #8a5a00;
    border-color: rgba(var(--motryz-warning-rgb), .24);
    background: rgba(var(--motryz-warning-rgb), .08);
}


/* ==========================================================================
   9. Workflow UI
   ========================================================================== */

.workflow-screen .motryz-page-title h3 {
    margin-bottom: .2rem;
    font-weight: 700;
}
.workflow-screen .motryz-page-title p {
    margin: 0;
    color: var(--chart-text-color);
    font-size: .875rem;
}

.motryz-workflow-hero {
    border: 1px solid var(--chart-border);
    border-radius: 12px;
    background: linear-gradient(120deg, rgba(var(--motryz-primary-rgb), .06), rgba(var(--motryz-success-rgb), .045));
}

.motryz-workflow-tabs-shell,
.motryz-workflow-form-shell,
.motryz-workflow-table-card {
    border: 1px solid var(--chart-border);
    border-radius: 12px;
}

.motryz-workflow-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    flex-wrap: wrap;
}
.motryz-workflow-toolbar .btn {
    border-radius: var(--motryz-radius-lg);
    font-weight: 700;
    padding: .52rem .9rem;
}

.motryz-workflow-toolbar-actions {
    display: inline-flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.motryz-workflow-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.motryz-workflow-chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    border: 1px solid rgba(var(--motryz-primary-rgb), .35);
    border-radius: 999px;
    padding: .26rem .68rem;
    font-size: .78rem;
    line-height: 1.15;
    color: var(--theme-default);
    background: rgba(var(--motryz-primary-rgb), .08);
}
.motryz-workflow-chip strong {
    font-weight: 700;
    color: var(--body-font-color);
}

.motryz-workflow-table-wrap {
    border-radius: 12px;
}

.motryz-workflow-table thead th {
    border-bottom-width: 1px;
    text-transform: uppercase;
    letter-spacing: .02em;
    font-size: .76rem;
    color: var(--chart-text-color);
    font-weight: 700;
}
.motryz-workflow-table tbody td {
    vertical-align: middle;
}
.motryz-workflow-table tbody tr:nth-child(even) td {
    background: rgba(var(--motryz-primary-rgb), .02);
}
.motryz-workflow-table tbody tr:hover td {
    background: rgba(var(--motryz-primary-rgb), .06);
}

.motryz-workflow-table th:first-child,
.motryz-workflow-table td:first-child {
    width: 12px;
    padding-left: .45rem;
    padding-right: 0;
}

.motryz-workflow-table .workflow-row-check {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.motryz-workflow-table tbody tr.is-selected td {
    background: rgba(var(--motryz-primary-rgb), .12);
}
.motryz-workflow-table tbody tr.is-selected td:first-child {
    box-shadow: inset 3px 0 0 var(--theme-default);
}

.motryz-workflow-check-all {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .8rem;
    color: var(--chart-text-color);
    margin: 0;
}
.motryz-workflow-check-all input[type="checkbox"] {
    appearance: none;
    width: 16px;
    height: 16px;
    border-radius: var(--motryz-radius-sm);
    border: 1px solid var(--chart-border);
    background: transparent;
    position: relative;
    cursor: pointer;
    transition: all .15s ease;
}
.motryz-workflow-check-all input[type="checkbox"]:hover {
    border-color: rgba(var(--motryz-primary-rgb), .55);
    box-shadow: 0 0 0 3px rgba(var(--motryz-primary-rgb), .14);
}
.motryz-workflow-check-all input[type="checkbox"]:checked {
    background: var(--theme-default);
    border-color: var(--theme-default);
}
.motryz-workflow-check-all input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 1px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.motryz-workflow-bulkbar {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}
.motryz-workflow-bulkbar .form-select {
    min-width: 190px;
}

.motryz-workflow-advanced-filters {
    border: 1px dashed var(--chart-border);
    border-radius: var(--motryz-radius-lg);
    padding: .7rem;
    background: rgba(var(--motryz-primary-rgb), .03);
}
.motryz-workflow-advanced-filters.is-open {
    display: block;
}

.motryz-workflow-results-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}

.motryz-workflow-results-count {
    font-size: .8rem;
    color: var(--chart-text-color);
}

.motryz-workflow-selection-tools {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
}

.motryz-workflow-selected-count {
    font-size: .78rem;
    font-weight: 600;
    color: var(--theme-default);
}

.motryz-workflow-filter-actions {
    display: flex;
    align-items: stretch;
    gap: .5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 100%;
}
.motryz-workflow-filter-actions .btn {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    max-width: 100%;
}
.motryz-workflow-filter-actions .btn-filter-clear {
    flex: 0 0 auto;
}

.motryz-action-kebab {
    width: 34px;
    height: 34px;
    border-radius: var(--motryz-radius-lg);
    border: 1px solid var(--chart-border);
    background: transparent;
    color: var(--chart-text-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.motryz-action-kebab:hover,
.motryz-action-kebab:focus {
    color: var(--theme-default);
    border-color: rgba(var(--motryz-primary-rgb), .5);
    background: rgba(var(--motryz-primary-rgb), .08);
}

.motryz-token {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .22rem .52rem;
    font-size: .7rem;
    font-weight: 700;
    line-height: 1;
}
.motryz-token--success {
    background: rgba(var(--motryz-success-rgb), .15);
    border: 1px solid rgba(var(--motryz-success-rgb), .45);
    color: #3f9744;
}
.motryz-token--warning {
    background: rgba(255, 193, 7, .15);
    border: 1px solid rgba(255, 193, 7, .45);
    color: #b17700;
}
.motryz-token--danger {
    background: rgba(255, 84, 84, .14);
    border: 1px solid rgba(255, 84, 84, .42);
    color: #d83e3e;
}

.motryz-workflow-name {
    display: inline-block;
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.workflow-selectable-row {
    cursor: pointer;
}
.workflow-selectable-row td:last-child,
.workflow-selectable-row td .dropdown,
.workflow-selectable-row td .dropdown * {
    cursor: default;
}

/* --- Mobile card --- */

.motryz-workflow-mobile-card {
    border: 1px solid var(--chart-border);
    border-radius: var(--motryz-radius-lg);
    padding: .75rem;
    background: rgba(var(--motryz-primary-rgb), .03);
}
.motryz-workflow-mobile-head {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    font-size: .85rem;
}
.motryz-workflow-mobile-head span {
    color: var(--chart-text-color);
    font-size: .75rem;
}
.motryz-workflow-mobile-meta {
    display: grid;
    gap: .15rem;
    margin-top: .35rem;
    font-size: .78rem;
    color: var(--chart-text-color);
}
.motryz-workflow-mobile-actions {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
}

.btn-xs {
    padding: .3rem .55rem;
    font-size: .72rem;
    line-height: 1.1;
    border-radius: var(--motryz-radius-base);
}

/* --- Pagination --- */

.motryz-workflow-pagination-wrap .pagination {
    margin-bottom: 0;
}
.motryz-workflow-pagination-wrap .page-link {
    border-color: var(--chart-border);
    background: transparent;
}
.motryz-workflow-pagination-wrap .page-item.active .page-link {
    border-color: var(--theme-default);
}


/* ==========================================================================
   10. Tabelas (.motryz-table)
   ========================================================================== */

.motryz-table {
    border-radius: var(--motryz-radius-base);
    overflow: hidden;
}
.motryz-table table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}
.motryz-table thead th {
    background: var(--light-bg);
    color: var(--body-font-color);
    font-size: var(--motryz-font-xs);
    text-transform: uppercase;
    letter-spacing: .4px;
    font-weight: 700;
    padding: .75rem .5rem;
    border-bottom: 2px solid var(--chart-border);
    white-space: nowrap;
}
.motryz-table tbody td {
    padding: .65rem .5rem;
    border-bottom: 1px solid var(--chart-border);
    vertical-align: middle;
    min-height: 52px;
    height: 52px;
    color: var(--body-font-color);
    font-size: var(--motryz-font-base);
}
/* Zebra striping */
.motryz-table tbody tr:nth-child(odd) td {
    background-color: var(--white);
}
.motryz-table tbody tr:nth-child(even) td {
    background-color: var(--light-bg);
}
/* Hover */
.motryz-table tbody tr:hover td {
    background-color: rgba(var(--motryz-primary-rgb), .1) !important;
}
/* Sticky columns */
.motryz-table th.is-sticky,
.motryz-table td.is-sticky {
    position: sticky;
    z-index: 2;
    background: inherit;
}
.motryz-table th.is-sticky-left,
.motryz-table td.is-sticky-left {
    left: 0;
}
.motryz-table th.is-sticky-right,
.motryz-table td.is-sticky-right {
    right: 0;
}
/* Responsive wrapper */
.motryz-table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}


/* ==========================================================================
   11. Alertas (.motryz-alert)
   ========================================================================== */

.motryz-alert {
    border-radius: var(--motryz-radius-base);
    padding: .75rem 1.25rem;
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    font-size: var(--motryz-font-base);
    line-height: 1.5;
}
.motryz-alert i {
    flex-shrink: 0;
    margin-top: .15rem;
    font-size: 1rem;
}
.motryz-alert strong {
    display: block;
    font-weight: 700;
    margin-bottom: .15rem;
}
.motryz-alert p {
    margin: 0;
    font-size: var(--motryz-font-base);
    color: inherit;
}

.motryz-alert-warning {
    background: rgba(var(--motryz-warning-rgb), .08);
    border: 1px solid rgba(var(--motryz-warning-rgb), .25);
    color: #7a5800;
}
.motryz-alert-warning i {
    color: var(--motryz-warning);
}

.motryz-alert-info {
    background: rgba(var(--motryz-primary-rgb), .06);
    border: 1px solid rgba(var(--motryz-primary-rgb), .15);
    color: var(--body-font-color);
}
.motryz-alert-info i {
    color: var(--theme-default);
}

.motryz-alert-danger {
    background: rgba(var(--motryz-danger-rgb), .06);
    border: 1px solid rgba(var(--motryz-danger-rgb), .15);
    color: #842029;
}
.motryz-alert-danger i {
    color: var(--motryz-danger);
}

.motryz-alert-success {
    background: rgba(var(--motryz-success-rgb), .08);
    border: 1px solid rgba(var(--motryz-success-rgb), .2);
    color: #2d6930;
}
.motryz-alert-success i {
    color: var(--motryz-success);
}


/* ==========================================================================
   12. Ações em lote (.bulk-action-bar)
   ========================================================================== */

.bulk-action-bar {
    background: rgba(var(--motryz-primary-rgb), .1);
    border-radius: var(--motryz-radius-base);
    padding: .5rem 1rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    position: sticky;
    top: 0;
    z-index: 10;
    font-size: var(--motryz-font-base);
}
.bulk-action-bar .bulk-count {
    font-weight: 700;
    color: var(--theme-default);
    white-space: nowrap;
}
.bulk-action-bar .bulk-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}


/* ==========================================================================
   13. Skeleton loading
   ========================================================================== */

@keyframes shimmer {
    0% { background-position: -200px 0; }
    100% { background-position: calc(200px + 100%) 0; }
}

.skeleton {
    background-color: var(--light-bg);
    background-image: linear-gradient(90deg, var(--light-bg) 0px, rgba(255, 255, 255, .4) 40px, var(--light-bg) 80px);
    background-size: 200px 100%;
    background-repeat: no-repeat;
    border-radius: var(--motryz-radius-sm);
    animation: shimmer 1.5s infinite linear;
    display: block;
}

.skeleton-text {
    height: 14px;
    width: 80%;
    margin-bottom: .5rem;
}

.skeleton-title {
    height: 20px;
    width: 50%;
    margin-bottom: .75rem;
}

.skeleton-input {
    height: 38px;
    width: 100%;
    border-radius: var(--motryz-radius-base);
    margin-bottom: .75rem;
}

.skeleton-row {
    height: 52px;
    width: 100%;
    margin-bottom: .5rem;
    border-radius: var(--motryz-radius-sm);
}

.skeleton-avatar {
    height: 40px;
    width: 40px;
    border-radius: 50%;
}

.skeleton-button {
    height: 36px;
    width: 100px;
    border-radius: var(--motryz-radius-base);
}


/* ==========================================================================
   14. Filtros e busca (.filter-chip, .search-input-group)
   ========================================================================== */

.search-input-group {
    position: relative;
    display: flex;
    align-items: center;
}
.search-input-group .search-icon {
    position: absolute;
    left: .75rem;
    color: var(--chart-text-color);
    font-size: .85rem;
    pointer-events: none;
    z-index: 2;
}
.search-input-group .form-control {
    padding-left: 2.25rem;
    border-radius: var(--motryz-radius-base);
    border: 1px solid var(--chart-border);
    font-size: var(--motryz-font-base);
    transition: border-color .2s, box-shadow .2s;
}
.search-input-group .form-control:focus {
    border-color: var(--theme-default);
    box-shadow: 0 0 0 2px rgba(var(--motryz-primary-rgb), .1);
}
.search-input-group .search-spinner {
    position: absolute;
    right: .75rem;
    color: var(--theme-default);
    font-size: .85rem;
}

.filter-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3rem .7rem;
    border-radius: 20px;
    font-size: .78rem;
    font-weight: 600;
    background: rgba(var(--motryz-primary-rgb), .08);
    border: 1px solid rgba(var(--motryz-primary-rgb), .2);
    color: var(--theme-default);
    line-height: 1.2;
    white-space: nowrap;
}
.filter-chip .filter-chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: none;
    background: rgba(var(--motryz-primary-rgb), .15);
    color: var(--theme-default);
    font-size: .65rem;
    cursor: pointer;
    padding: 0;
    transition: background .15s;
}
.filter-chip .filter-chip-remove:hover {
    background: rgba(var(--motryz-primary-rgb), .3);
}

.filter-chip-group {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
}


/* ==========================================================================
   15. Dark mode — ajustes finos
   ========================================================================== */

/* --- Alert light secondary --- */
.dark-only .alert-light-secondary {
    background-color: rgba(var(--motryz-secondary-rgb), .08) !important;
    color: var(--body-font-color, #d0d0d0) !important;
    border-color: rgba(var(--motryz-secondary-rgb), .2) !important;
}
.dark-only .alert-light-secondary p,
.dark-only .alert-light-secondary i {
    color: var(--chart-text-color, #98a6ad) !important;
}

/* --- Cards --- */
.dark-only .context-card,
.dark-only .content-card {
    background: var(--body-bg, #1d1e26);
    border-color: var(--chart-border);
}

/* --- Labels e textos --- */
.dark-only .context-card label,
.dark-only .content-card label,
.dark-only .content-card p,
.dark-only .content-card strong,
.dark-only .content-card h5,
.dark-only .content-card h6,
.dark-only .content-card .mb-3 label,
.dark-only .context-info h4 {
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .context-info h6 {
    color: var(--chart-text-color, #98a6ad);
}

/* --- Tabs --- */
.dark-only .context-tabs .nav-tabs {
    border-bottom-color: var(--chart-border);
}
.dark-only .context-tabs .nav-tabs .nav-link {
    color: var(--chart-text-color, #98a6ad);
}
.dark-only .context-tabs .nav-tabs .nav-link.active {
    color: var(--theme-default);
    border-bottom-color: var(--theme-default);
}

/* --- Inputs --- */
.dark-only .content-card .form-control,
.dark-only .content-card .form-select {
    background: var(--body-bg, #262932);
    border-color: var(--chart-border);
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .content-card .form-control:disabled,
.dark-only .content-card .form-select:disabled {
    background: var(--body-bg, #1d1e26) !important;
    color: var(--chart-text-color, #98a6ad) !important;
    border-color: var(--chart-border);
}
.dark-only .content-card textarea.form-control:disabled {
    background: var(--body-bg, #1d1e26) !important;
    color: var(--chart-text-color, #98a6ad) !important;
}

/* --- Botões --- */
.dark-only .btn-action-primary { background: var(--success, #65c15c); }
.dark-only .btn-action-secondary { border-color: var(--theme-default); color: var(--theme-default); }
.dark-only .btn-action-secondary:hover { background: var(--theme-default); color: #fff; }
.dark-only .btn-action-warning { border-color: var(--motryz-warning); color: var(--motryz-warning); }
.dark-only .btn-action-warning:hover { background: var(--motryz-warning); color: #212529; }

/* --- Page title --- */
.dark-only .motryz-page-title p {
    color: var(--chart-text-color, #98a6ad);
}

/* --- Empty state --- */
.dark-only .empty-state h6 {
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .empty-state p,
.dark-only .empty-state i {
    color: var(--chart-text-color, #98a6ad);
}

/* --- Tables (.motryz-table) --- */
.dark-only .motryz-table thead th {
    background: var(--body-bg, #1d1e26);
    color: var(--body-font-color, #d0d0d0);
    border-bottom-color: var(--chart-border);
}
.dark-only .motryz-table tbody td {
    border-bottom-color: var(--chart-border);
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .motryz-table tbody tr:nth-child(odd) td {
    background-color: #262932 !important;
}
.dark-only .motryz-table tbody tr:nth-child(even) td {
    background-color: #1d1e26 !important;
}
.dark-only .motryz-table tbody tr:hover td {
    background-color: rgba(var(--motryz-primary-rgb), .15) !important;
}

/* --- Alerts (.motryz-alert) --- */
.dark-only .motryz-alert-warning {
    background: rgba(var(--motryz-warning-rgb), .1);
    border-color: rgba(var(--motryz-warning-rgb), .25);
    color: #ffd889;
}
.dark-only .motryz-alert-info {
    background: rgba(var(--motryz-primary-rgb), .1);
    border-color: rgba(var(--motryz-primary-rgb), .2);
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .motryz-alert-info i {
    color: #c9c5ff;
}
.dark-only .motryz-alert-danger {
    background: rgba(var(--motryz-danger-rgb), .1);
    border-color: rgba(var(--motryz-danger-rgb), .2);
    color: #ff9f9f;
}
.dark-only .motryz-alert-success {
    background: rgba(var(--motryz-success-rgb), .1);
    border-color: rgba(var(--motryz-success-rgb), .2);
    color: #8be28f;
}

/* --- Bulk action bar --- */
.dark-only .bulk-action-bar {
    background: rgba(var(--motryz-primary-rgb), .15);
}
.dark-only .bulk-action-bar .bulk-count {
    color: #c9c5ff;
}

/* --- Skeleton loading --- */
.dark-only .skeleton {
    background-color: var(--body-bg, #262932);
    background-image: linear-gradient(90deg, #262932 0px, rgba(255, 255, 255, .05) 40px, #262932 80px);
}

/* --- Filter chips & search --- */
.dark-only .filter-chip {
    background: rgba(var(--motryz-primary-rgb), .15);
    border-color: rgba(var(--motryz-primary-rgb), .35);
    color: #c9c5ff;
}
.dark-only .filter-chip .filter-chip-remove {
    background: rgba(var(--motryz-primary-rgb), .25);
    color: #c9c5ff;
}
.dark-only .filter-chip .filter-chip-remove:hover {
    background: rgba(var(--motryz-primary-rgb), .4);
}
.dark-only .search-input-group .form-control {
    background: var(--body-bg, #262932);
    border-color: var(--chart-border);
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .search-input-group .search-icon {
    color: var(--chart-text-color, #98a6ad);
}

/* --- Action modal --- */
.dark-only .motryz-action-modal,
.dark-only .motryz-reprocess-option {
    background: var(--body-bg, #1d1e26);
    border-color: var(--chart-border);
}
.dark-only .motryz-action-modal-header {
    background: linear-gradient(135deg, rgba(var(--motryz-primary-rgb), .12), rgba(var(--motryz-success-rgb), .06));
    border-color: var(--chart-border);
}
.dark-only .motryz-action-summary > div {
    background: #1d1e26;
    border-color: var(--chart-border);
}
.dark-only .motryz-action-modal-heading h6,
.dark-only .motryz-reprocess-panel-header h6,
.dark-only .motryz-reprocess-option-content strong {
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .motryz-action-modal-heading p,
.dark-only .motryz-action-summary-label,
.dark-only .motryz-reprocess-panel-header p,
.dark-only .motryz-reprocess-option-content small,
.dark-only .motryz-reprocess-option-note {
    color: var(--chart-text-color, #98a6ad);
}

/* Reprocess panel dark */
.dark-only .motryz-reprocess-panel {
    background: linear-gradient(180deg, rgba(36, 39, 51, .78), rgba(29, 30, 38, .9));
    border-color: #384154;
}
.dark-only .motryz-reprocess-option {
    background: #242733;
    border-color: #384154;
}
.dark-only .motryz-reprocess-option.is-selected {
    background: #242733;
    border: 1px solid rgba(var(--motryz-primary-rgb), .72);
    box-shadow: 0 0 0 1px rgba(var(--motryz-primary-rgb), .22);
}
.dark-only .motryz-reprocess-option.is-danger.is-selected {
    background: #242733;
    border: 1px solid rgba(255, 193, 7, .72);
    box-shadow: 0 0 0 1px rgba(var(--motryz-warning-rgb), .22);
}
.dark-only .motryz-reprocess-option .form-check-input {
    background-color: transparent;
    border-color: #596275;
}
.dark-only .motryz-reprocess-option-note {
    color: rgba(226, 232, 240, .74);
}
.dark-only .motryz-reprocess-current {
    color: rgba(226, 232, 240, .68);
    background: transparent;
    border: 0;
    box-shadow: none;
}
.dark-only .motryz-reprocess-current strong {
    color: #c9c5ff;
}
.dark-only .motryz-reprocess-current.is-total {
    background: transparent;
    border: 0;
    box-shadow: none;
}
.dark-only .motryz-reprocess-current.is-total strong {
    color: #ffd889;
}
.dark-only .motryz-reprocess-impact {
    color: #c9c5ff;
    background: rgba(var(--motryz-primary-rgb), .12);
    border-color: rgba(var(--motryz-primary-rgb), .28);
}
.dark-only .motryz-reprocess-impact.is-warning {
    color: #ffd889;
    background: rgba(var(--motryz-warning-rgb), .12);
    border-color: rgba(var(--motryz-warning-rgb), .28);
}

/* --- Choice pattern dark --- */
.dark-only .motryz-choice-panel {
    background: linear-gradient(180deg, rgba(36, 39, 51, .78), rgba(29, 30, 38, .9));
    border-color: #384154;
}
.dark-only .motryz-choice-current {
    color: rgba(226, 232, 240, .68);
}
.dark-only .motryz-choice-current strong {
    color: #c9c5ff;
}
.dark-only .motryz-choice-current.is-total strong,
.dark-only .motryz-choice-current.is-danger strong {
    color: #ffd889;
}
.dark-only .motryz-choice-card {
    background: #242733;
    border-color: #384154;
}
.dark-only .motryz-choice-card:hover {
    border-color: rgba(var(--motryz-primary-rgb), .54);
}
.dark-only .motryz-choice-card.is-selected {
    background: #242733;
    border-color: rgba(var(--motryz-primary-rgb), .72);
    box-shadow: 0 0 0 1px rgba(var(--motryz-primary-rgb), .22);
}
.dark-only .motryz-choice-card.is-danger.is-selected {
    background: #242733;
    border-color: rgba(255, 193, 7, .72);
    box-shadow: 0 0 0 1px rgba(var(--motryz-warning-rgb), .22);
}
.dark-only .motryz-choice-card .form-check-input {
    background-color: transparent;
    border-color: #596275;
}
.dark-only .motryz-choice-card .form-check-label {
    color: var(--body-font-color, #d0d0d0);
}
.dark-only .motryz-choice-note {
    color: rgba(226, 232, 240, .74);
}
.dark-only .motryz-choice-feedback {
    color: #c9c5ff;
    background: rgba(var(--motryz-primary-rgb), .12);
    border-color: rgba(var(--motryz-primary-rgb), .28);
}
.dark-only .motryz-choice-feedback.is-warning {
    color: #ffd889;
    background: rgba(var(--motryz-warning-rgb), .12);
    border-color: rgba(var(--motryz-warning-rgb), .28);
}

/* --- Workflow UI dark --- */
.dark-only .motryz-workflow-hero {
    background: linear-gradient(120deg, rgba(var(--motryz-primary-rgb), .12), rgba(var(--motryz-success-rgb), .09));
    border-color: var(--chart-border);
}
.dark-only .motryz-workflow-tabs-shell,
.dark-only .motryz-workflow-form-shell,
.dark-only .motryz-workflow-table-card {
    border-color: var(--chart-border);
}
.dark-only .motryz-workflow-chip {
    background: rgba(var(--motryz-primary-rgb), .16);
    border-color: rgba(var(--motryz-primary-rgb), .46);
    color: #cfc8ff;
}
.dark-only .motryz-workflow-chip strong {
    color: var(--body-font-color, #d0d0d0);
}

.dark-only .motryz-workflow-results-count,
.dark-only .motryz-workflow-check-all,
.dark-only .motryz-workflow-mobile-meta,
.dark-only .motryz-workflow-mobile-head span {
    color: var(--chart-text-color, #98a6ad);
}

.dark-only .motryz-workflow-table tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, .01);
}
.dark-only .motryz-workflow-table tbody tr:hover td {
    background: rgba(var(--motryz-primary-rgb), .12);
}
.dark-only .motryz-workflow-table tbody tr.is-selected td {
    background: rgba(var(--motryz-primary-rgb), .18);
}

.dark-only .motryz-token--success { color: #8be28f; }
.dark-only .motryz-token--warning { color: #ffd36a; }
.dark-only .motryz-token--danger  { color: #ff9f9f; }

.dark-only .motryz-workflow-mobile-card {
    background: rgba(255, 255, 255, .02);
}
.dark-only .motryz-workflow-advanced-filters {
    background: rgba(255, 255, 255, .02);
}
.dark-only .motryz-workflow-selected-count {
    color: #cfc8ff;
}
.dark-only .motryz-action-kebab {
    color: var(--chart-text-color, #98a6ad);
}

.dark-only .motryz-workflow-check-all input[type="checkbox"] {
    border-color: rgba(255, 255, 255, .22);
    background: rgba(255, 255, 255, .02);
}
.dark-only .motryz-workflow-check-all input[type="checkbox"]:hover {
    border-color: rgba(var(--motryz-primary-rgb), .65);
    box-shadow: 0 0 0 3px rgba(var(--motryz-primary-rgb), .16);
}
.dark-only .motryz-workflow-check-all input[type="checkbox"]:checked {
    background: var(--theme-default);
    border-color: var(--theme-default);
}

.dark-only .motryz-workflow-pagination-wrap .page-link {
    border-color: var(--chart-border) !important;
    background: rgba(255, 255, 255, .02);
    color: var(--body-font-color, #d0d0d0);
    border-radius: var(--motryz-radius-lg) !important;
    box-shadow: none !important;
}
.dark-only .motryz-workflow-pagination-wrap .page-link:hover {
    background: rgba(var(--motryz-primary-rgb), .12);
    border-color: rgba(var(--motryz-primary-rgb), .45) !important;
    color: #fff;
}
.dark-only .motryz-workflow-pagination-wrap .page-item.disabled .page-link {
    background: rgba(255, 255, 255, .01);
    color: var(--chart-text-color, #98a6ad);
}
.dark-only .motryz-workflow-pagination-wrap .page-item.active .page-link {
    background: var(--theme-default);
    border-color: var(--theme-default) !important;
    color: #fff;
    border-radius: var(--motryz-radius-lg) !important;
}


/* ==========================================================================
   16. Responsividade
   ========================================================================== */

/* --- Action modal responsive --- */
@media (max-width: 767.98px) {
    .motryz-action-summary {
        flex-direction: column;
    }
    .motryz-reprocess-panel-header {
        flex-direction: column;
    }
    .motryz-reprocess-option {
        margin-bottom: .75rem;
    }
}

/* --- Workflow UI responsive --- */
@media (max-width: 1399px) {
    .motryz-workflow-filter-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 767px) {
    .motryz-workflow-toolbar {
        align-items: stretch;
    }
    .motryz-workflow-toolbar .btn {
        width: 100%;
        justify-content: center;
    }
    .motryz-workflow-filter-actions {
        flex-wrap: wrap;
    }
    .motryz-workflow-filter-actions .btn {
        flex: 1 1 auto;
    }
    .motryz-workflow-filter-actions .btn[data-bs-target="#workflowFiltrosAvancados"] {
        flex: 0 0 auto;
    }
}