/* =========================================================
   Sistema ERP Fiscal - Estilos personalizados
   Layout inspirado em ERPs modernos (Omie/Bling/Conta Azul).
   Tema controlado por data-bs-theme (light/dark) do Bootstrap 5.
   ========================================================= */

:root {
    --erp-sidebar-width: 250px;
    --erp-sidebar-width-collapsed: 68px;
    --erp-topbar-height: 56px;
    --erp-sidebar-bg: #1f2a44;
    --erp-sidebar-bg-hover: #2b3a5c;
    --erp-sidebar-color: #c8d2e8;
    --erp-sidebar-active: #0d6efd;
}

body {
    background-color: var(--bs-body-bg);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* ---------- Layout principal ---------- */
.erp-wrapper {
    display: flex;
    min-height: 100vh;
}

.erp-sidebar {
    width: var(--erp-sidebar-width);
    background: var(--erp-sidebar-bg);
    color: var(--erp-sidebar-color);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    overflow-y: auto;
    transition: width .2s ease;
    z-index: 1030;
}

.erp-main {
    flex: 1;
    margin-left: var(--erp-sidebar-width);
    transition: margin-left .2s ease;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* Estado recolhido */
body.sidebar-collapsed .erp-sidebar { width: var(--erp-sidebar-width-collapsed); }
body.sidebar-collapsed .erp-main { margin-left: var(--erp-sidebar-width-collapsed); }
body.sidebar-collapsed .nav-text,
body.sidebar-collapsed .brand-text,
body.sidebar-collapsed .erp-nav-section { display: none; }
body.sidebar-collapsed .erp-nav-item { text-align: center; }

/* ---------- Marca ---------- */
.erp-brand {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding: 1rem 1.2rem;
    font-size: 1.15rem;
    font-weight: 600;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.08);
    white-space: nowrap;
}
.erp-brand i { font-size: 1.4rem; color: var(--erp-sidebar-active); }

/* ---------- Navegação ---------- */
.erp-nav { padding: .5rem 0; }
.erp-nav-section {
    padding: .8rem 1.2rem .3rem;
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: rgba(255,255,255,.4);
}
.erp-nav-item {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .65rem 1.2rem;
    color: var(--erp-sidebar-color);
    text-decoration: none;
    white-space: nowrap;
    border-left: 3px solid transparent;
    transition: background .15s, border-color .15s;
}
.erp-nav-item i { font-size: 1.1rem; min-width: 20px; text-align: center; }
.erp-nav-item:hover { background: var(--erp-sidebar-bg-hover); color: #fff; }
.erp-nav-item.active {
    background: var(--erp-sidebar-bg-hover);
    color: #fff;
    border-left-color: var(--erp-sidebar-active);
}

/* ---------- Topbar ---------- */
.erp-topbar {
    height: var(--erp-topbar-height);
    background: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
    display: flex;
    align-items: center;
    padding: 0 1rem;
    position: sticky;
    top: 0;
    z-index: 1020;
}
.erp-toggle, .erp-theme-toggle, .erp-user {
    color: var(--bs-body-color);
    text-decoration: none;
    font-size: 1.2rem;
}
.erp-user { font-size: 1rem; }

/* ---------- Conteúdo ---------- */
.erp-content { padding: 1.5rem; flex: 1; }

/* ---------- Cards de indicadores ---------- */
.erp-card-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

/* ---------- Página de login ---------- */
.erp-login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #1f2a44 0%, #0d6efd 100%);
    padding: 1rem;
}
.erp-login-card {
    background: var(--bs-body-bg);
    width: 100%;
    max-width: 400px;
    padding: 2rem;
    border-radius: 16px;
}
.erp-login-logo { font-size: 2.6rem; color: #0d6efd; }

/* ---------- Impressão (relatórios) ---------- */
@media print {
    .erp-sidebar, .erp-topbar, .no-print { display: none !important; }
    .erp-main { margin-left: 0 !important; }
    .erp-content { padding: 0 !important; }
    .card { border: none !important; box-shadow: none !important; }
    a[href]:after { content: ""; }
}

/* ---------- Responsivo ---------- */
@media (max-width: 768px) {
    .erp-sidebar { width: var(--erp-sidebar-width-collapsed); }
    .erp-main { margin-left: var(--erp-sidebar-width-collapsed); }
    .nav-text, .brand-text, .erp-nav-section { display: none; }
    body.sidebar-collapsed .erp-sidebar { width: var(--erp-sidebar-width); }
    body.sidebar-collapsed .erp-main { margin-left: var(--erp-sidebar-width); }
    body.sidebar-collapsed .nav-text,
    body.sidebar-collapsed .brand-text,
    body.sidebar-collapsed .erp-nav-section { display: inline; }
}
