/* sollas-report.css — Páginas de relatório SaaS premium */

/* ── Página base ────────────────────────────────────────── */
.rpt-page {
    min-height: 100vh;
    background: var(--sollas-bg);
    padding: 0 0 80px;
}

/* ── Hero header ────────────────────────────────────────── */
.rpt-hero {
    background: linear-gradient(135deg, var(--sollas-surface) 0%, var(--sollas-bg) 100%);
    border-bottom: 1px solid var(--sollas-border);
    padding: 28px 36px 24px;
    position: relative;
    overflow: hidden;
}
.rpt-hero::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--sollas-primary), rgba(29,158,117,.3), transparent);
}
.rpt-hero::after {
    content: '';
    position: absolute;
    top: -60px; right: -60px;
    width: 260px; height: 260px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(29,158,117,.07) 0%, transparent 70%);
    pointer-events: none;
}
.rpt-hero-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.rpt-hero-left { display: flex; align-items: center; gap: 16px; }
.rpt-back {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1.5px solid var(--sollas-border);
    border-radius: 10px;
    background: var(--sollas-surface);
    color: var(--sollas-text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    font-family: var(--sollas-font);
    cursor: pointer;
    text-decoration: none;
    transition: all .15s;
    flex-shrink: 0;
}
.rpt-back:hover { border-color: var(--sollas-primary); color: var(--sollas-primary); background: var(--sollas-primary-light); }
.rpt-icon {
    width: 48px; height: 48px;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    background: var(--sollas-primary-light);
    color: var(--sollas-primary);
    flex-shrink: 0;
}
.rpt-title-group {}
.rpt-title { font-size: 1.45rem; font-weight: 800; color: var(--sollas-text-main); margin: 0; line-height: 1.2; }
.rpt-subtitle { font-size: 0.82rem; color: var(--sollas-text-muted); margin: 3px 0 0; }
.rpt-hero-right { display: flex; align-items: center; gap: 10px; }
.rpt-date-range {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    color: var(--sollas-text-muted);
}
.rpt-date-input {
    padding: 6px 10px;
    border: 1.5px solid var(--sollas-border);
    border-radius: 8px;
    background: var(--sollas-surface);
    color: var(--sollas-text-main);
    font-size: 0.82rem;
    font-family: var(--sollas-font);
    outline: none;
    transition: border-color .15s;
}
.rpt-date-input:focus { border-color: var(--sollas-primary); }
.rpt-export {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 18px;
    border-radius: 10px;
    border: none;
    background: var(--sollas-primary);
    color: #fff;
    font-size: 0.85rem;
    font-weight: 700;
    font-family: var(--sollas-font);
    cursor: pointer;
    transition: all .15s;
    text-decoration: none;
}
.rpt-export:hover { background: var(--sollas-primary-hover); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(29,158,117,.3); }
.rpt-export:active { transform: translateY(0); }

/* ── Body ───────────────────────────────────────────────── */
.rpt-body { padding: 28px 36px; }

/* ── KPI cards ──────────────────────────────────────────── */
.rpt-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 28px;
}
.rpt-kpi {
    background: var(--sollas-surface);
    border: 1px solid var(--sollas-border);
    border-radius: 14px;
    padding: 20px 22px;
    position: relative;
    overflow: hidden;
    transition: box-shadow .15s;
}
.rpt-kpi:hover { box-shadow: 0 4px 20px rgba(0,0,0,.06); }
.rpt-kpi::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    border-radius: 14px 14px 0 0;
}
.rpt-kpi.green::before  { background: linear-gradient(90deg, #10B981, #34D399); }
.rpt-kpi.blue::before   { background: linear-gradient(90deg, #3B82F6, #60A5FA); }
.rpt-kpi.orange::before { background: linear-gradient(90deg, #F59E0B, #FCD34D); }
.rpt-kpi.red::before    { background: linear-gradient(90deg, #EF4444, #F87171); }
.rpt-kpi.purple::before { background: linear-gradient(90deg, #8B5CF6, #A78BFA); }
.rpt-kpi-icon {
    width: 36px; height: 36px;
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 14px;
}
.rpt-kpi.green  .rpt-kpi-icon { background: rgba(16,185,129,.12); color: #10B981; }
.rpt-kpi.blue   .rpt-kpi-icon { background: rgba(59,130,246,.12); color: #3B82F6; }
.rpt-kpi.orange .rpt-kpi-icon { background: rgba(245,158,11,.12); color: #F59E0B; }
.rpt-kpi.red    .rpt-kpi-icon { background: rgba(239,68,68,.12);  color: #EF4444; }
.rpt-kpi.purple .rpt-kpi-icon { background: rgba(139,92,246,.12); color: #8B5CF6; }
.rpt-kpi-label { font-size: 0.73rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--sollas-text-muted); }
.rpt-kpi-value { font-size: 2rem; font-weight: 800; color: var(--sollas-text-main); line-height: 1.1; margin: 6px 0 2px; }
.rpt-kpi-sub   { font-size: 0.76rem; color: var(--sollas-text-muted); }
.rpt-kpi-value.green  { color: #10B981; }
.rpt-kpi-value.red    { color: #EF4444; }
.rpt-kpi-value.blue   { color: #3B82F6; }
.rpt-kpi-value.orange { color: #F59E0B; }

/* ── Panel (seção de tabela / gráfico) ───────────────────── */
.rpt-panel {
    background: var(--sollas-surface);
    border: 1px solid var(--sollas-border);
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 20px;
}
.rpt-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    border-bottom: 1px solid var(--sollas-border);
    gap: 12px;
    flex-wrap: wrap;
}
.rpt-panel-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--sollas-text-main);
}
.rpt-panel-icon {
    width: 30px; height: 30px;
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    background: var(--sollas-primary-light);
    color: var(--sollas-primary);
    flex-shrink: 0;
}
.rpt-count-badge {
    font-size: 0.72rem;
    font-weight: 700;
    background: var(--sollas-primary-light);
    color: var(--sollas-primary);
    border-radius: 6px;
    padding: 2px 8px;
}
.rpt-panel-search {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border: 1.5px solid var(--sollas-border);
    border-radius: 8px;
    background: var(--sollas-bg);
    min-width: 220px;
}
.rpt-panel-search input {
    border: none;
    background: transparent;
    font-size: 0.85rem;
    color: var(--sollas-text-main);
    font-family: var(--sollas-font);
    outline: none;
    flex: 1;
    min-width: 0;
}
.rpt-panel-search input::placeholder { color: var(--sollas-text-muted); opacity: .7; }

/* ── Tabela ─────────────────────────────────────────────── */
.rpt-table-wrap { overflow-x: auto; }
.rpt-table { width: 100%; border-collapse: collapse; font-size: 0.865rem; }
.rpt-table th {
    padding: 10px 16px;
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--sollas-text-muted);
    border-bottom: 1px solid var(--sollas-border);
    background: var(--sollas-bg);
    white-space: nowrap;
}
.rpt-table td {
    padding: 12px 16px;
    border-bottom: 1px solid rgba(0,0,0,.04);
    color: var(--sollas-text-main);
    vertical-align: middle;
}
.rpt-table tr:last-child td { border-bottom: none; }
.rpt-table tr:hover td { background: var(--sollas-primary-light); }
.rpt-td-nome { display: flex; align-items: center; gap: 10px; }
.rpt-avatar {
    width: 30px; height: 30px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.72rem; font-weight: 700; color: #fff;
    flex-shrink: 0;
}
.rpt-nome-main  { font-weight: 600; color: var(--sollas-text-main); }
.rpt-nome-sub   { font-size: 0.74rem; color: var(--sollas-text-muted); display: block; }
.rpt-muted      { color: var(--sollas-text-muted); font-size: 0.85rem; }
.rpt-valor-pos  { font-weight: 700; color: #10B981; }
.rpt-valor-neg  { font-weight: 700; color: #EF4444; }
.rpt-valor-neu  { font-weight: 700; color: var(--sollas-text-main); }

/* ── Status badges ──────────────────────────────────────── */
.rpt-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}
.rpt-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.rpt-status.green  { background: rgba(16,185,129,.1); color: #059669; }
.rpt-status.blue   { background: rgba(59,130,246,.1);  color: #2563EB; }
.rpt-status.orange { background: rgba(245,158,11,.1);  color: #D97706; }
.rpt-status.red    { background: rgba(239,68,68,.1);   color: #DC2626; }
.rpt-status.gray   { background: rgba(100,116,139,.1); color: #64748B; }
.rpt-status.purple { background: rgba(139,92,246,.1);  color: #7C3AED; }

/* ── Skeleton / carregando ───────────────────────────────── */
.rpt-skeleton { animation: rpt-shimmer 1.4s infinite linear; }
@keyframes rpt-shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}
.rpt-skel-row td {
    padding: 14px 16px;
}
.rpt-skel-line {
    height: 14px;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--sollas-border) 25%, rgba(255,255,255,.04) 37%, var(--sollas-border) 63%);
    background-size: 800px 100%;
    animation: rpt-shimmer 1.4s infinite linear;
}

/* ── Empty state ────────────────────────────────────────── */
.rpt-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 3rem;
    color: var(--sollas-text-muted);
    font-size: 0.875rem;
}

/* ── Summary footer ─────────────────────────────────────── */
.rpt-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    border-top: 1px solid var(--sollas-border);
    background: var(--sollas-bg);
    font-size: 0.8rem;
    color: var(--sollas-text-muted);
}
.rpt-footer-total { font-weight: 700; color: var(--sollas-primary); }

/* ── Dark mode ───────────────────────────────────────────── */
[data-theme="dark"] .rpt-hero { background: linear-gradient(135deg, #0D1B2E 0%, #08111F 100%); }
[data-theme="dark"] .rpt-kpi  { background: #0D1B2E; border-color: rgba(255,255,255,.06); }
[data-theme="dark"] .rpt-panel { background: #0D1B2E; border-color: rgba(255,255,255,.06); }
[data-theme="dark"] .rpt-panel-header { border-color: rgba(255,255,255,.06); }
[data-theme="dark"] .rpt-table th { background: #08111F; border-color: rgba(255,255,255,.06); }
[data-theme="dark"] .rpt-table td { border-color: rgba(255,255,255,.04); }
[data-theme="dark"] .rpt-table tr:hover td { background: rgba(29,158,117,.06); }
[data-theme="dark"] .rpt-back { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .rpt-date-input { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); color: var(--sollas-text-main); }
[data-theme="dark"] .rpt-panel-search { background: rgba(255,255,255,.03); border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .rpt-footer { background: #08111F; border-color: rgba(255,255,255,.06); }

/* ── Print / PDF ─────────────────────────────────────────── */
@media print {
    .rpt-hero::after, .rpt-hero::before, .rpt-kpi::before { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .rpt-back, .rpt-export, .rpt-date-range { display: none !important; }
    .rpt-page { background: #fff; }
    .rpt-hero { background: #fff !important; border-bottom: 2px solid #e2e8f0; }
    .rpt-kpi  { border: 1px solid #e2e8f0; }
    .rpt-panel { border: 1px solid #e2e8f0; break-inside: avoid; }
    .rpt-table tr:hover td { background: none; }
    .rpt-body { padding: 20px; }
}

/* ── Responsivo ─────────────────────────────────────────── */
@media (max-width: 1100px) {
    .rpt-kpi-grid { grid-template-columns: repeat(2, 1fr); }
    .rpt-body { padding: 20px; }
    .rpt-hero { padding: 20px; }
}
@media (max-width: 680px) {
    .rpt-kpi-grid { grid-template-columns: 1fr 1fr; }
    .rpt-hero-top { flex-direction: column; align-items: flex-start; }
    .rpt-hero-right { flex-wrap: wrap; }
    .rpt-body { padding: 16px; }
}