/* Reback Finance — design tokens portados para o projeto.
   As cores e utilitários abaixo replicam o design_system/design-system.html
   sem dependência dos assets `vendor.min.css` / `app.min.css` originais. */

:root {
    --bs-primary: #1c84ee;
    --bs-primary-rgb: 28, 132, 238;
    --bs-secondary: #5d7186;
    --bs-secondary-rgb: 93, 113, 134;
    --bs-success: #22c55e;
    --bs-success-rgb: 34, 197, 94;
    --bs-info: #4ecac2;
    --bs-info-rgb: 78, 202, 194;
    --bs-warning: #f9b931;
    --bs-warning-rgb: 249, 185, 49;
    --bs-danger: #ef5f5f;
    --bs-danger-rgb: 239, 95, 95;
    --bs-light: #eef2f7;
    --bs-light-rgb: 238, 242, 247;
    --bs-dark: #323a46;
    --bs-dark-rgb: 50, 58, 70;
    --bs-body-bg: #f8f8fa;
    --bs-body-color: #4a4f5a;
    --bs-body-color-rgb: 74, 79, 90;
    --bs-link-color: #1c84ee;
    --bs-link-color-rgb: 28, 132, 238;
    --bs-link-hover-color: #1568c0;
    --bs-link-hover-color-rgb: 21, 104, 192;
    --bs-border-color: #e9ebf2;
    --bs-border-color-rgb: 233, 235, 242;

    /* Subtle backgrounds (Reback usa rgba 12% sobre cor base) */
    --bs-primary-bg-subtle: rgba(28, 132, 238, 0.12);
    --bs-secondary-bg-subtle: rgba(93, 113, 134, 0.12);
    --bs-success-bg-subtle: rgba(34, 197, 94, 0.12);
    --bs-info-bg-subtle: rgba(78, 202, 194, 0.12);
    --bs-warning-bg-subtle: rgba(249, 185, 49, 0.18);
    --bs-danger-bg-subtle: rgba(239, 95, 95, 0.12);
    --bs-dark-bg-subtle: rgba(50, 58, 70, 0.1);
    --bs-light-bg-subtle: rgba(238, 242, 247, 0.6);
    --bs-body-bg-subtle: #ffffff;

    --bs-card-spacer-y: 1rem;
    --bs-card-spacer-x: 1rem;
}

body {
    font-family: 'Wix Madefor Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
    font-size: 0.875rem;
    line-height: 1.5;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    color: #323a46;
    font-weight: 600;
    line-height: 1.1;
}

h1, .h1 { font-size: 2.25rem; }
h2, .h2 { font-size: 1.875rem; }
h3, .h3 { font-size: 1.5rem; }
h4, .h4 { font-size: 1.125rem; }
h5, .h5 { font-size: 0.9375rem; }
h6, .h6 { font-size: 0.75rem; }

/* Tipografia utilitária do design system */
.fs-12 { font-size: 12px !important; }
.fs-14 { font-size: 14px !important; }
.fs-16 { font-size: 16px !important; }
.fs-18 { font-size: 18px !important; }
.fs-20 { font-size: 20px !important; }
.fs-22 { font-size: 22px !important; }
.fs-24 { font-size: 24px !important; }
.fs-28 { font-size: 28px !important; }
.fs-32 { font-size: 32px !important; }

.text-white-50 { color: rgba(255, 255, 255, 0.5) !important; }

/* Topbar / wrapper */
.wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.topbar {
    background-color: #ffffff;
    border-bottom: 1px solid var(--bs-border-color);
    padding: 0.5rem 0;
    position: relative;
}

.topbar::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 2px;
    background: linear-gradient(to right, #1c84ee 10%, #f9b931 50%, #22c55e 60%);
}

.topbar .navbar-brand {
    font-weight: 700;
    color: var(--bs-primary);
}

.topbar .nav-link {
    color: #4a4f5a;
    font-weight: 500;
}

.topbar .nav-link:hover { color: var(--bs-primary); }
.topbar .nav-link.active { color: var(--bs-primary); }

.page-content {
    flex: 1 1 auto;
    padding: 1.5rem 0 2rem 0;
}

footer.footer {
    background-color: #ffffff;
    border-top: 1px solid var(--bs-border-color);
    padding: 1rem 0;
    color: #6c757d;
    font-size: 0.875rem;
}

/* Page title box */
.page-title-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 1.25rem 0;
}

.page-title-box .breadcrumb {
    margin: 0;
}

.page-title-box .breadcrumb-item + .breadcrumb-item::before {
    content: '›';
    color: #adb5bd;
}

/* Cards */
.card {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    background-color: var(--bs-body-bg-subtle);
    margin-bottom: 1.25rem;
}

.card-header {
    background-color: transparent;
    border-bottom: 1px solid var(--bs-border-color);
    padding: 0.875rem 1rem;
}

.card-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #323a46;
}

.card-body {
    padding: 1rem;
}

/* Soft buttons */
.btn-soft-primary { color: var(--bs-primary); background-color: rgba(var(--bs-primary-rgb), 0.12); border-color: transparent; }
.btn-soft-primary:hover { color: #fff; background-color: var(--bs-primary); border-color: var(--bs-primary); }
.btn-soft-secondary { color: var(--bs-secondary); background-color: rgba(var(--bs-secondary-rgb), 0.12); border-color: transparent; }
.btn-soft-secondary:hover { color: #fff; background-color: var(--bs-secondary); }
.btn-soft-success { color: var(--bs-success); background-color: rgba(var(--bs-success-rgb), 0.12); border-color: transparent; }
.btn-soft-success:hover { color: #fff; background-color: var(--bs-success); }
.btn-soft-info { color: var(--bs-info); background-color: rgba(var(--bs-info-rgb), 0.12); border-color: transparent; }
.btn-soft-info:hover { color: #fff; background-color: var(--bs-info); }
.btn-soft-warning { color: #b48007; background-color: rgba(var(--bs-warning-rgb), 0.18); border-color: transparent; }
.btn-soft-warning:hover { color: #1c1c1c; background-color: var(--bs-warning); }
.btn-soft-danger { color: var(--bs-danger); background-color: rgba(var(--bs-danger-rgb), 0.12); border-color: transparent; }
.btn-soft-danger:hover { color: #fff; background-color: var(--bs-danger); }

/* Solid colour overrides */
.btn-primary {
    --bs-btn-bg: #1c84ee;
    --bs-btn-border-color: #1c84ee;
    --bs-btn-hover-bg: #1568c0;
    --bs-btn-hover-border-color: #1568c0;
    --bs-btn-active-bg: #1568c0;
    --bs-btn-active-border-color: #1568c0;
}

.btn-success {
    --bs-btn-bg: #22c55e;
    --bs-btn-border-color: #22c55e;
    --bs-btn-hover-bg: #1ba24c;
    --bs-btn-hover-border-color: #1ba24c;
}

/* Soft badges */
.badge { font-weight: 500; }
.badge-soft-primary { color: var(--bs-primary); background-color: rgba(var(--bs-primary-rgb), 0.15); }
.badge-soft-secondary { color: var(--bs-secondary); background-color: rgba(var(--bs-secondary-rgb), 0.15); }
.badge-soft-success { color: var(--bs-success); background-color: rgba(var(--bs-success-rgb), 0.15); }
.badge-soft-info { color: var(--bs-info); background-color: rgba(var(--bs-info-rgb), 0.15); }
.badge-soft-warning { color: #b48007; background-color: rgba(var(--bs-warning-rgb), 0.18); }
.badge-soft-danger { color: var(--bs-danger); background-color: rgba(var(--bs-danger-rgb), 0.15); }

/* Subtle background helpers (Bootstrap 5.3 compat) */
.bg-primary-subtle   { background-color: var(--bs-primary-bg-subtle) !important; }
.bg-secondary-subtle { background-color: var(--bs-secondary-bg-subtle) !important; }
.bg-success-subtle   { background-color: var(--bs-success-bg-subtle) !important; }
.bg-info-subtle      { background-color: var(--bs-info-bg-subtle) !important; }
.bg-warning-subtle   { background-color: var(--bs-warning-bg-subtle) !important; }
.bg-danger-subtle    { background-color: var(--bs-danger-bg-subtle) !important; }
.bg-dark-subtle      { background-color: var(--bs-dark-bg-subtle) !important; }
.bg-body-secondary   { background-color: #ffffff !important; }
.bg-body-tertiary    { background-color: #f3f4f8 !important; }

/* Avatar */
.avatar-xs { height: 1.5rem; width: 1.5rem; }
.avatar-sm { height: 2rem; width: 2rem; }
.avatar-md { height: 2.5rem; width: 2.5rem; }
.avatar-lg { height: 3.5rem; width: 3.5rem; }
.avatar-xl { height: 4.5rem; width: 4.5rem; }

.avatar-title {
    align-items: center;
    color: #fff;
    display: flex;
    font-weight: 600;
    height: 100%;
    justify-content: center;
    width: 100%;
    border-radius: inherit;
}

/* Tables */
.table {
    --bs-table-bg: transparent;
    color: var(--bs-body-color);
}

.thead-sm th {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #6c757d;
    font-weight: 600;
    padding: 0.625rem 0.75rem;
}

.table-card { margin: 0; }

.table-hover > tbody > tr:hover > * {
    background-color: rgba(var(--bs-light-rgb), 0.6);
}

/* Forms */
.form-control,
.form-select {
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
    background-color: #ffffff;
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(var(--bs-primary-rgb), 0.5);
    box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.1);
}

.form-label { font-weight: 500; color: #4a4f5a; }

/* Pagination boxed */
.pagination-boxed .page-link {
    border-radius: 0.375rem;
    margin-inline: 0.125rem;
    border: 1px solid var(--bs-border-color);
    color: #4a4f5a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}

.pagination-boxed .page-item.active .page-link {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

.pagination-boxed .page-item.disabled .page-link {
    color: #a0a4ab;
}

/* Stat tabs — cards-resumo que também navegam entre filas (casos complexos) */
.stat-tab {
    display: block;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.stat-tab:hover {
    color: inherit;
    transform: translateY(-2px);
}

.stat-tab.active {
    border-color: transparent;
    box-shadow: 0 0 0 2px var(--stat-accent, var(--bs-primary)),
                0 6px 16px rgba(15, 23, 42, 0.08);
}

.stat-tab--danger  { --stat-accent: var(--bs-danger); }
.stat-tab--warning { --stat-accent: var(--bs-warning); }
.stat-tab--success { --stat-accent: var(--bs-success); }

/* Dropdown — Reback DropDownSlide */
@keyframes DropDownSlide {
    100% { transform: translateY(0); opacity: 1; }
    0% { transform: translateY(10px); opacity: 0; }
}

.dropdown-menu {
    box-shadow: 0 1rem 3rem rgba(15, 23, 42, 0.15);
    border: 1px solid var(--bs-border-color);
    animation-name: DropDownSlide;
    animation-duration: 0.35s;
    animation-fill-mode: both;
}

/* Auth screens */
.auth-shell {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at top left, rgba(var(--bs-primary-rgb), 0.08), transparent 60%),
                radial-gradient(circle at bottom right, rgba(var(--bs-warning-rgb), 0.08), transparent 60%),
                var(--bs-body-bg);
    padding: 2rem 1rem;
    font-family: 'Wix Madefor Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.auth-card {
    width: min(100%, 28rem);
}

.auth-logo {
    color: var(--bs-primary);
    font-weight: 700;
    font-size: 1.25rem;
}
