:root {
    --primary: #1e3653;
    --secondary: #375aa6;
    --accent: #47b48b;
    --primary-tint: #e8edf3;
    --danger-soft: #fdecea;
    --bs-primary: var(--primary);
    --f-deep: var(--primary);
    --f-deep-700:#172a42;
    --f-deep-300:#3b557a;
    --f-primary:#375aa6;
    --f-primary-600:#2f4d8f;
    --f-primary-100:#eaf0fb;
    --f-bg:#f4f6fb;
    --f-surface:#ffffff;
    --f-border:#e3e8f0;
    --f-text:#1f2a3d;
    --f-muted:#6b7790;
    --f-shadow:0 6px 24px rgba(30,54,83,.08);
    --f-shadow-sm:0 2px 8px rgba(30,54,83,.06);
    --f-radius:14px;
    --f-radius-sm:10px;
    --fources-border:#e5e9f2;
    --fources-shadow:0 6px 24px rgba(30,54,83,.08), 0 2px 6px rgba(30,54,83,.06);
    --fources-muted:#64748b;

}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    background: #f5f7fb;
    color: #1f2937;
}

.offcanvas.sidebar {
    width: 260px;
    background-color: var(--primary) !important;
    overflow-y: auto;
}
.sidebar.desktop {
    background: var(--primary);
    min-height: 100vh;
    width: 240px;
    position: sticky;
    top: 0;
}
.sidebar .brand {
    padding: 1.25rem 1.25rem;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: .3px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.sidebar .nav-link {
    color: rgba(255,255,255,.78);
    padding: .65rem 1.25rem;
    border-left: 3px solid transparent;
    display: flex;
    align-items: center;
    gap: .65rem;
    font-size: .95rem;
}
.sidebar .nav-link:hover { color:#fff; background: rgba(255,255,255,.05); }
.sidebar .nav-link.active {
    color:#fff;
    background: rgba(255,255,255,.08);
    border-left-color: var(--accent);
}
/* Garante que botões de logout tenham o mesmo estilo de hover que os links */
.sidebar form .nav-link {
    width: 100%;
    background: none;
    border: none;
    border-left: 3px solid transparent;
    text-align: left;
}

.sidebar form .nav-link:hover {
    background: rgba(255,255,255,.05);
    color: #fff;
}

/* === Topbar === */
.topbar {
    background:#fff;
    border-bottom: 1px solid #e5e7eb;
    padding: .75rem 1.25rem;
}

/* === Buttons === */
.btn-primary {
    background: var(--primary);
    border-color: var(--primary);
}
.btn-primary:hover { background: var(--secondary); border-color: var(--secondary); }
.btn-accent {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.btn-accent:hover { background:#3a9c75; border-color:#3a9c75; color:#fff; }
.btn-outline-primary { color: var(--primary); border-color: var(--primary); }
.btn-outline-primary:hover { background: var(--primary); border-color: var(--primary); }

/* === Cards === */
.card { border: 1px solid #e5e7eb; border-radius: 10px; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.card-header { background:#fff; border-bottom:1px solid #eef0f4; font-weight:600; }

.stat-card { padding: 1.25rem; }
.stat-card .label { color:#6b7280; font-size:.85rem; text-transform:uppercase; letter-spacing:.5px; }
.stat-card .value { font-size:1.6rem; font-weight:700; color: var(--primary); margin-top:.25rem; }
.stat-card .delta { font-size:.8rem; color: var(--accent); }
.stat-card .ico { width:42px; height:42px; background:var(--primary-tint); color:var(--primary); border-radius: 0.5rem; display: flex; align-items:center; justify-content:center; }

/* === Page header === */
.page-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:1.25rem;
    flex-wrap:wrap;
    gap:.75rem;
}
.page-header h1 { font-size:1.4rem; font-weight:700; color:var(--primary); margin:0; }
.page-header .subtitle { color:#6b7280; font-size:.9rem; margin-top:.15rem; }

/* === Badges === */
.badge-status { font-weight:600; padding:.4em .65em; border-radius: 999px; }
.badge-completa { background: #e6f6ee; color:#1f7a4d; }
.badge-pendente { background:#fff4e0; color:#a9651a; }
.badge-low { background: var(--danger-soft); color:#b3261e; font-weight:600; }
.badge-ok    { background:#e6f6ee; color:#1f7a4d; }

/* === Tables === */
.table { background:#fff; }
.table thead th {
    background: var(--primary-tint);
    color: var(--primary);
    font-weight:600;
    font-size:.82rem;
    text-transform:uppercase;
    letter-spacing:.4px;
    border-bottom: none;
}
.table > :not(caption) > * > * { padding: .85rem 1rem; }

/* === Forms === */
.form-section {
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1rem;
}

.d-inline { display: inline !important; }
.d-block { display: block !important; }
.d-none { display: none !important; }
.cursor-pointer { cursor: pointer !important; }
.min-w-180 { min-width: 180px !important; }

.scanner-container {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    overflow: hidden;
}
.form-section h5 { color: var(--primary); font-weight:600; margin-bottom: 1rem; }
.form-label { font-weight:500; color:#374151; }
.form-control:focus, .form-select:focus {
    border-color: var(--secondary);
    box-shadow: 0 0 0 .2rem rgba(55,90,166,.15);
}

/* === Layout shell === */
.app-shell { display:flex; min-height:100vh; }
.app-content { flex:1; min-width:0; }
.page-container { padding: 1.5rem; }

/* Mobile */
@media (max-width: 991.98px) {
    .sidebar.desktop { display:none; }
}
@media (min-width: 992px) {
    .topbar .btn-toggle { display:none; }
}

.mobile-sidebar-offcanvas {
    width: 240px;
    height: 100%;
}
.mobile-sidebar-offcanvas .sidebar {
    min-height: 100%;
    position: relative;
    top: auto;
}

/* Scanner */
#scanner-region { width: 100%; max-width: 480px; margin: 0 auto; }
.scanner-reader-container { width: 100%; border: 1px solid #ccc; border-radius: 8px; overflow: hidden; }

/* Impressão */
@media print {
    .sidebar, .topbar, .no-print { display:none !important; }
    .app-content { width:100%; }
    .page-container { padding: 0; }
}

.topbar-alias {
    width:34px;
    height:34px;
    font-weight:600;
    cursor: pointer;
}
.topbar-logo {
    height: 30px;
}

.chart-card {
    border: 1px solid rgba(30, 54, 83, 0.08);
    border-radius: 16px;
    box-shadow: 0 4px 18px rgba(30, 54, 83, 0.06);
}
.chart-card .card-header {
    background: #fff;
    border-bottom: 1px solid rgba(30, 54, 83, 0.06);
    border-radius: 16px 16px 0 0;
    padding: 1rem 1.25rem;
}
.chart-card .card-header h5 { color: #1e3653; font-weight: 600; }

/* Container responsivo: altura adapta por breakpoint */
.chart-wrap { position: relative; width: 100%; height: 340px; }
@media (max-width: 991.98px) { .chart-wrap { height: 300px; } }
@media (max-width: 575.98px) { .chart-wrap { height: 260px; } }

.legend-dot {
    display: inline-block; width: 10px; height: 10px; border-radius: 50%;
    margin-right: 4px; vertical-align: middle;
}


/* ========== Cards / surfaces ========== */
.f-card{
    background:#ffffff;border:1px solid #e3e8f0;
    border-radius:14px;box-shadow:0 2px 8px rgba(30,54,83,.06);
}
.f-card-pad{padding:1.25rem 1.4rem}
.f-card-head{
    padding:1rem 1.4rem;border-bottom:1px solid #e3e8f0;
    display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.f-card-head h5{margin:0;font-weight:600;color:#1e3653;font-size:1rem}
.f-card-head .sub{font-size:.82rem;color:#6b7790}


.dropzone{
    border:2px dashed #c8d2e6;border-radius:var(--f-radius);padding:2.5rem 1rem;text-align:center;
    background:#fafbff;color:var(--f-muted);transition:.2s;
}
.dropzone:hover{border-color:var(--f-primary);background:var(--f-primary-100);color:var(--f-primary)}
.dropzone i{font-size:2.6rem;color:var(--f-primary);margin-bottom:.5rem;display:block}
.dropzone strong{color:var(--f-deep);display:block;margin-bottom:.25rem}

.fources-modal .modal-content {
    border: 1px solid #dde3ee;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(30, 54, 83, 0.18),
    0 4px 12px rgba(30, 54, 83, 0.08);
    background: #fff;
}
.fources-modal .modal-header {
    border-bottom: 0;
    padding: 1.1rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.fources-modal .modal-header .btn-close { margin: 0; flex-shrink: 0; }
.fources-modal .modal-body { padding: 1.1rem 1.25rem; }
.fources-modal .modal-footer {
    border-top: 1px solid #dde3ee;
    padding: 0.9rem 1.25rem;
    background: #fafbfd;
    gap: 0.5rem;
}

.fources-modal label.required::after {
    content: " *";
    color: #d9534f;
    font-weight: 700;
}
.fources-modal .form-control,
.fources-modal .form-select {
    border-radius: 10px;
    border: 1.5px solid #dde3ee;
    padding: 0.65rem 0.85rem;
    font-size: 0.95rem;
}
.fources-modal .form-control:focus,
.fources-modal .form-select:focus {
    border-color: var(--secondary);
    box-shadow: 0 0 0 0.2rem rgba(55, 90, 166, 0.15);
}
.fources-modal .char-counter { font-size: 0.78rem; color: #6c7a93; }

.modal-cancel-classic .modal-header {
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    color: #fff;
}
.modal-cancel-classic .modal-title { font-weight: 700; font-size: 1.1rem; }
.modal-cancel-classic .btn-close { filter: invert(1) grayscale(100%) brightness(200%); opacity: .9; }
.modal-cancel-classic .order-info {
    background: #f4f6fb;
    border-left: 4px solid var(--secondary);
    border-radius: 8px;
    padding: 0.75rem 0.9rem;
    font-size: 0.88rem;
}
.modal-cancel-classic .order-info strong { color: var(--primary); }

/* Products Search Modal Results */
.product-search-results-container {
    max-height: 400px;
}

.modal-table-scroll {
    max-height: 250px;
    overflow-y: auto;
}

.w-100px { width: 100px !important; }
.mw-250px { max-width: 250px !important; }
.fs-7rem { font-size: 0.7rem !important; }

/* Tablet */
@media (max-width: 768px) {
    .fources-modal .modal-dialog { max-width: 92% !important; }
    .modal-cancel-wizard .step span:not(.num) { display: none; }
    .modal-cancel-wizard .step { flex: 0 0 auto; gap: 0; }
    .modal-cancel-wizard .step-divider { flex: 1; }
}
/* Mobile */
@media (max-width: 576px) {
    .fources-modal .modal-dialog { max-width: 96% !important; margin: 12px auto !important; }
    .fources-modal .modal-header,
    .fources-modal .modal-body,
    .fources-modal .modal-footer { padding-left: 1rem; padding-right: 1rem; }
    .modal-cancel-classic .modal-title { font-size: 1rem; }
    .modal-cancel-classic .order-info .col-4 { flex: 0 0 100%; max-width: 100%; }
    .modal-cancel-alert .reason-grid { grid-template-columns: 1fr 1fr; }
    .fources-modal .modal-footer {
        flex-direction: column-reverse;
        align-items: stretch;
    }
    .fources-modal .modal-footer .btn { width: 100%; }
    .modal-cancel-wizard .stepper { padding: 0.65rem 1rem; }
    .modal-cancel-wizard .summary-card .row > [class*="col-"] { margin-bottom: 0.5rem; }
}

.split { display:grid; grid-template-columns:340px 1fr; gap:1rem; }
.split .sidelist { background:#fff; border:1px solid var(--fources-border); border-radius:14px; box-shadow:var(--fources-shadow); overflow:hidden; display:flex; flex-direction:column; max-height:78vh; }
.split .sidelist .sl-search { padding:.8rem; border-bottom:1px solid var(--fources-border); }
.split .sidelist .sl-list { overflow:auto; }
.sl-item{display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;border-bottom:1px solid #eef1f7;cursor:pointer}
.sl-item:hover{background:#f7f9fd}
.sl-item.active{background:linear-gradient(90deg,rgba(55,90,166,.10),transparent);border-left:3px solid var(--secondary);padding-left:calc(.9rem - 3px)}
.sl-item .nm{font-weight:600;color:var(--primary);font-size:.92rem;line-height:1.1}
.sl-item .em{color:var(--fources-muted);font-size:.78rem}
.detail-hero{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;border-radius:14px;padding:1.4rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap;box-shadow:var(--fources-shadow)}
.detail-hero .avatar{width:64px;height:64px;font-size:1.4rem;background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.35)}
.detail-hero h3{margin:0;font-weight:700}
.detail-hero .muted{color:#cdd7e6}
.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem}
.detail-grid .it{background:#f7f9fd;border:1px solid var(--fources-border);border-radius:10px;padding:.7rem .85rem}
.detail-grid .it span{display:block;color:var(--fources-muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.4px}
.detail-grid .it b{color:var(--primary);font-weight:600}

.avatar { width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg,var(--secondary),var(--accent)); color:#fff; display:inline-grid; place-items:center; font-weight:700; font-size:.85rem; flex-shrink:0; }
.client-cell { display:flex; align-items:center; gap:.7rem; min-width:0; }
.client-cell .nm { font-weight:600; color:var(--primary); line-height:1.1; }
.client-cell .em { color:var(--fources-muted); font-size:.8rem; }