:root {
    --font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --primary-color: #4f46e5;
    --primary-hover: #4338ca;
    --primary-gradient: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    --success-gradient: linear-gradient(135deg, #059669 0%, #10b981 100%);
    --warning-gradient: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    --danger-gradient: linear-gradient(135deg, #dc2626 0%, #ef4444 100%);
    --info-gradient: linear-gradient(135deg, #0284c7 0%, #0ea5e9 100%);
    --surface-bg: #f8fafc;
    --surface-card: #ffffff;
    --border-color: #e2e8f0;
    --text-muted: #64748b;
    --radius-md: 0.75rem;
    --radius-lg: 1rem;
    --shadow-soft: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
    --shadow-hover: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.05);
}

[data-bs-theme="dark"] {
    --surface-bg: #0f172a;
    --surface-card: #1e293b;
    --border-color: #334155;
    --text-muted: #94a3b8;
    --card-bg: #1e293b;
    --card-border: #334155;
    --main-bg: #0f172a;
    --header-bg: #1e293b;
    --header-border: #334155;
}

/* =========================================================================
   Reset Estrutural Alinhado a JT_Finance e JT_Estoque
   ========================================================================= */
html, body {
    height: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    font-family: var(--font-family-base);
    background-color: var(--surface-bg, #f8fafc);
    color: var(--text-color, #1e293b);
}

/* Garante que o layout ocupe rigorosamente 100vh sem rolagem dupla na janela */
.dashboard-layout {
    height: 100vh !important;
    max-height: 100vh !important;
    overflow: hidden !important;
}

.main-content {
    height: 100vh !important;
    max-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background-color: var(--surface-bg, #f8fafc) !important;
}

header.header {
    flex-shrink: 0 !important;
    min-height: 56px !important;
    height: auto !important;
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
    z-index: 1020 !important;
}

main.content-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding: 0.75rem 1rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.app-footer {
    flex-shrink: 0 !important;
    background-color: var(--card-bg, #ffffff) !important;
    border-top: 1px solid var(--card-border, #e2e8f0) !important;
    color: var(--text-color-light, #64748b) !important;
    margin: 0 !important;
    z-index: 1010 !important;
}

/* =========================================================================
   Componentes e Cards no Estilo Moderno / JT_Finance & Estoque
   ========================================================================= */
.card-modern {
    background-color: var(--card-bg, #ffffff) !important;
    border: 1px solid var(--card-border, #e2e8f0) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--shadow-soft) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.card-modern:hover {
    box-shadow: var(--shadow-hover) !important;
}

.card-clickable {
    cursor: pointer;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.card-clickable:hover {
    transform: translateY(-4px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

.text-indigo {
    color: #4f46e5 !important;
}

/* Scrollbars suaves para o Canvas Central e painéis */
#biCanvasArea::-webkit-scrollbar,
.overflow-y-auto::-webkit-scrollbar,
main.content-body::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

#biCanvasArea::-webkit-scrollbar-track,
.overflow-y-auto::-webkit-scrollbar-track,
main.content-body::-webkit-scrollbar-track {
    background: transparent;
}

#biCanvasArea::-webkit-scrollbar-thumb,
.overflow-y-auto::-webkit-scrollbar-thumb,
main.content-body::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.35);
    border-radius: 4px;
}

#biCanvasArea::-webkit-scrollbar-thumb:hover,
.overflow-y-auto::-webkit-scrollbar-thumb:hover,
main.content-body::-webkit-scrollbar-thumb:hover {
    background: rgba(100, 116, 139, 0.65);
}

/* Helpers gerais */
.cursor-pointer { cursor: pointer; }
.cursor-grab { cursor: grab; }
.transition-all { transition: all 0.2s ease-in-out; }
.shadow-xs { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }