:root {
    --kgr-blue: #2B3580; --kgr-blue-hover: #1e2559;
    --kgr-green: #008B45; --kgr-green-hover: #006633;
    --kgr-red: #D32729; --kgr-red-hover: #a61c1e;
    --kgr-yellow: #f1c40f; --kgr-yellow-hover: #d4ac0d;
    --kgr-black: #2c3e50; --bg-color: #f0f2f5;
}

body { font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; padding: 20px; background-color: var(--bg-color); color: var(--kgr-black); line-height: 1.5; }
.container { max-width: 600px; margin: 0 auto; background: white; padding: 35px 25px; border-radius: 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); border-top: 6px solid var(--kgr-blue); }

.header-logo { text-align: center; margin-bottom: 25px; }
.header-logo img { max-width: 200px; height: auto; transition: transform 0.3s ease; }
.header-logo img:hover { transform: scale(1.02); }
.header-logo h2 { margin-top: 15px; font-size: 20px; color: #495057; font-weight: 600; }

.search-box { margin: 15px 0 25px 0; display: flex; gap: 10px; }
/* Autocomplete de colaboradores */
.ac-wrap { position: relative; flex: 1; }
.ac-list { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 50;
           background: #fff; border: 1px solid #ced4da; border-radius: 8px;
           box-shadow: 0 8px 24px rgba(0,0,0,0.12); max-height: 320px; overflow-y: auto; display: none; }
.ac-list.show { display: block; }
.ac-item { padding: 10px 14px; cursor: pointer; border-bottom: 1px solid #f1f3f5; display: flex; flex-direction: column; gap: 2px; }
.ac-item:last-child { border-bottom: none; }
.ac-item:hover, .ac-item.active { background: #eef2ff; }
.ac-item .ac-nome { font-weight: 600; color: #212529; font-size: 14px; }
.ac-item .ac-meta { font-size: 12px; color: #6c757d; }
.ac-item .ac-tag { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 10px; margin-left: 6px; }
.ac-tag.inativo { background: #fff3cd; color: #856404; }
.ac-tag.demitido { background: #f8d7da; color: #842029; }
.ac-empty { padding: 12px 14px; color: #6c757d; font-size: 13px; }
/* Botão de escanear crachá */
.btn-scan { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
            background: var(--kgr-green); box-shadow: 0 4px 6px rgba(0,139,69,0.2); }
.btn-scan:hover { background: var(--kgr-green-hover); box-shadow: 0 6px 8px rgba(0,139,69,0.3); }
/* Modal do leitor (câmera) */
.scan-overlay { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,0.75);
                display: flex; align-items: center; justify-content: center; padding: 16px; }
.scan-card { background: #fff; border-radius: 14px; width: 100%; max-width: 420px; overflow: hidden;
             box-shadow: 0 20px 60px rgba(0,0,0,0.4); }
.scan-head { display: flex; align-items: center; justify-content: space-between;
             padding: 14px 16px; border-bottom: 1px solid #e9ecef; }
.scan-head strong { font-size: 16px; color: #212529; }
.scan-close { background: transparent; color: #6c757d; box-shadow: none; padding: 4px 10px;
              font-size: 18px; line-height: 1; }
.scan-close:hover { background: #f1f3f5; color: #212529; transform: none; box-shadow: none; }
.scan-view { width: 100%; min-height: 260px; background: #000; }
.scan-view video { width: 100% !important; display: block; }
.scan-status { padding: 12px 16px; font-size: 14px; color: #495057; text-align: center; min-height: 20px; }
.scan-status.erro { color: var(--kgr-red); font-weight: 600; }
.scan-status.ok { color: var(--kgr-green); font-weight: 700; }
@media (max-width: 480px) { .btn-scan-txt { display: none; } }
/* Barra de status offline / fila pendente */
.offline-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1200;
               display: flex; align-items: center; justify-content: center; gap: 12px;
               padding: 10px 16px; font-size: 14px; font-weight: 600; color: #fff;
               box-shadow: 0 -4px 12px rgba(0,0,0,0.15); }
.offline-bar.off  { background: #6c757d; }
.offline-bar.pend { background: var(--kgr-blue); }
.offline-bar button { background: rgba(255,255,255,0.2); box-shadow: none; padding: 6px 14px; font-size: 13px; }
.offline-bar button:hover { background: rgba(255,255,255,0.32); transform: none; box-shadow: none; }
/* Modal de resultado da entrega */
.res-msg { padding: 16px; font-size: 14px; color: #212529; line-height: 1.55; white-space: pre-line; }
.res-acoes { display: flex; flex-direction: column; gap: 10px; padding: 0 16px 16px; }
.res-acoes button { width: 100%; }
.res-acoes .btn-secundario { background: #fff; color: var(--kgr-blue); border: 1.5px solid #ced4da; box-shadow: none; }
.res-acoes .btn-secundario:hover { background: #f1f3f5; transform: none; box-shadow: none; }
/* Consentimento LGPD */
.consent-box { margin-top: 18px; padding: 14px 16px; background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 8px; }
.consent-item { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: #495057; font-weight: 500; cursor: pointer; line-height: 1.45; }
.consent-item + .consent-item { margin-top: 10px; padding-top: 10px; border-top: 1px dashed #dee2e6; }
.consent-item input[type=checkbox] { width: 18px; height: 18px; flex: 0 0 auto; margin-top: 1px; cursor: pointer; accent-color: var(--kgr-green); }
.consent-item a { color: var(--kgr-blue); font-weight: 700; text-decoration: underline; }
.consent-opt span { color: #6c757d; }
/* Modal do termo (reusa overlay) */
.termo-corpo { padding: 16px; font-size: 13px; color: #343a40; line-height: 1.6; max-height: 60vh; overflow-y: auto; white-space: pre-line; }
/* OTP (assinatura avançada) */
.otp-corpo { padding: 16px; text-align: center; }
.otp-corpo p { color: #495057; font-size: 14px; }
.otp-corpo .otp-email { font-weight: 700; color: var(--kgr-blue); }
.otp-input { width: 100%; text-align: center; letter-spacing: 10px; font-size: 28px; font-weight: 700;
             padding: 12px; margin: 14px 0 6px; border: 2px solid #ced4da; border-radius: 8px; }
.otp-msg { min-height: 18px; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.otp-msg.erro { color: var(--kgr-red); }
.otp-msg.ok { color: var(--kgr-green); }
.otp-links { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 4px; }
.otp-links a { color: var(--kgr-blue); font-size: 13px; font-weight: 600; cursor: pointer; }
.otp-links a.otp-skip { color: #6c757d; }
input, select { padding: 12px 15px; flex: 1; border: 1px solid #ced4da; border-radius: 6px; font-size: 15px; width: 100%; box-sizing: border-box; transition: all 0.3s ease; background-color: #f8f9fa; }
input:focus, select:focus { background-color: #fff; border-color: var(--kgr-blue); outline: none; box-shadow: 0 0 0 3px rgba(43, 53, 128, 0.15); }

label { font-weight: 600; font-size: 14px; color: #495057; margin-bottom: 6px; display: block; }
p { margin-bottom: 8px; color: #495057; }

button { padding: 12px 20px; cursor: pointer; border: none; border-radius: 6px; background: var(--kgr-blue); color: white; font-weight: 600; font-size: 15px; letter-spacing: 0.3px; transition: all 0.2s ease; box-shadow: 0 4px 6px rgba(43, 53, 128, 0.2); }
button:hover { background: var(--kgr-blue-hover); transform: translateY(-1px); box-shadow: 0 6px 8px rgba(43, 53, 128, 0.3); }
button:active { transform: translateY(1px); }

.btn-novo { background: var(--kgr-green); width: 100%; margin-top: 25px; font-size: 16px; padding: 16px; box-shadow: 0 4px 6px rgba(0, 139, 69, 0.2); }
.btn-novo:hover { background: var(--kgr-green-hover); box-shadow: 0 6px 8px rgba(0, 139, 69, 0.3); }

.btn-danger { background: var(--kgr-red); padding: 8px 15px; width: 100%; font-size: 13px; box-shadow: none; margin-top: 0;}
.btn-danger:hover { background: var(--kgr-red-hover); box-shadow: 0 4px 6px rgba(211, 39, 41, 0.2); }

.btn-voltar { background: #6c757d; margin-bottom: 25px; box-shadow: none; padding: 8px 16px; font-size: 14px;}
.btn-voltar:hover { background: #5a6268; }

.info-grid { background: #ffffff; padding: 20px; border-radius: 8px; line-height: 1.8; border: 1px solid #e9ecef; border-left: 5px solid var(--kgr-green); margin-bottom: 20px; box-shadow: 0 2px 8px rgba(0,0,0,0.04); }

.assinatura-container { border: 1px solid #e9ecef; padding: 15px; border-radius: 8px; margin-top: 20px; background: #f8f9fa; box-shadow: inset 0 2px 4px rgba(0,0,0,0.02); }
canvas { border: 2px dashed #adb5bd; background: #fff; width: 100%; height: 120px; cursor: crosshair; touch-action: none; margin-top: 12px; border-radius: 6px; transition: border-color 0.3s; }

.epi-item { border: 1px solid #e9ecef; padding: 15px; border-radius: 8px; margin-bottom: 12px; display: flex; justify-content: space-between; align-items: center; background: #fff; box-shadow: 0 2px 4px rgba(0,0,0,0.02); }
.epi-info strong { color: var(--kgr-blue); display: block; margin-bottom: 4px; font-size: 15px; }
.epi-info small { color: #6c757d; font-size: 13px; }

/* Estilo do Carrinho */
.carrinho-item { background: #e8f4fd; border: 1px solid #b8daff; padding: 10px 15px; border-radius: 6px; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center;}
.carrinho-item span { font-weight: 600; color: var(--kgr-blue); font-size: 14px;}

/* Login */
.login-page { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #0f1548 0%, #2B3580 55%, #1a4fa0 100%); z-index: 1000; padding: 20px; }
.login-card { max-width: 420px; width: 100%; box-sizing: border-box; background: white; padding: 48px 40px; border-radius: 20px; box-shadow: 0 24px 64px rgba(0,0,0,0.4); text-align: center; }
.login-icon { width: 72px; height: 72px; background: linear-gradient(135deg, var(--kgr-blue), #1a4fa0); border-radius: 18px; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px; box-shadow: 0 8px 20px rgba(43,53,128,0.4); }
.login-titulo { font-size: 26px; font-weight: 700; color: var(--kgr-blue); margin: 0 0 6px; }
.login-subtitulo { font-size: 14px; color: #6c757d; margin: 0 0 32px; line-height: 1.4; }
.login-logo { margin: 0 0 18px; display: flex; justify-content: center; }
.login-logo-img { width: 100%; max-width: 260px; height: auto; }

/* Responsivo da tela de login (mobile / tablet / desktop) */
@media (max-width: 480px) {
    .login-page { padding: 16px; align-items: flex-start; padding-top: 7vh; }
    .login-card { padding: 32px 22px; border-radius: 16px; box-shadow: 0 14px 40px rgba(0,0,0,0.35); }
    .login-logo-img { max-width: 220px; }
    .login-subtitulo { font-size: 13px; margin-bottom: 26px; }
}
@media (min-width: 481px) and (max-width: 1024px) {
    .login-card { max-width: 480px; padding: 52px 44px; }
    .login-logo-img { max-width: 280px; }
}
@media (max-height: 560px) {
    .login-page { align-items: flex-start; padding-top: 18px; }
}
.login-field { text-align: left; margin-bottom: 18px; }
.login-field label { font-weight: 600; font-size: 13px; color: #495057; margin-bottom: 6px; display: block; }
.password-wrapper { position: relative; }
.password-wrapper input { padding-right: 48px; margin-bottom: 0; }
.btn-toggle-senha { position: absolute !important; right: 10px; top: 50%; transform: translateY(-50%) !important; background: none !important; border: none !important; padding: 4px !important; cursor: pointer; color: #adb5bd; box-shadow: none !important; line-height: 1; width: auto !important; font-size: 0; }
.btn-toggle-senha:hover { color: var(--kgr-blue) !important; background: none !important; box-shadow: none !important; transform: translateY(-50%) !important; }
.btn-login { width: 100%; padding: 14px; font-size: 16px; font-weight: 700; background: linear-gradient(135deg, var(--kgr-blue), #1a4fa0); border-radius: 8px; margin-top: 8px; box-shadow: 0 4px 15px rgba(43,53,128,0.4); letter-spacing: 0.5px; }
.btn-login:hover { background: linear-gradient(135deg, var(--kgr-blue-hover), #0e3a80); box-shadow: 0 8px 24px rgba(43,53,128,0.5); }
.btn-login:disabled { opacity: 0.65; cursor: not-allowed; transform: none !important; box-shadow: none; }
.login-card input { margin-bottom: 0; }
.login-erro { color: var(--kgr-red); font-size: 13px; font-weight: 600; margin-top: 14px; min-height: 20px; }
.topbar { display: flex; justify-content: flex-end; align-items: center; margin-bottom: 12px; gap: 12px; }
.topbar span { font-size: 13px; color: #6c757d; }
.btn-logout { background: #6c757d; padding: 6px 14px; font-size: 13px; box-shadow: none; }
.btn-logout:hover { background: #5a6268; }

/* ── App Shell (sidebar + conteúdo) ─────────────────────────── */
#app-shell { display: none; min-height: 100vh; }
body:has(#app-shell[style*="flex"]) { padding: 0; margin: 0; background: #f0f2f5; }

.sidebar { width: 74px; flex-shrink: 0; background: #15171f; display: flex; flex-direction: column; align-items: center; padding: 14px 0; gap: 8px; position: sticky; top: 0; height: 100vh; z-index: 50; }
.sidebar-top { margin-bottom: 8px; }
.sidebar-logo { width: 44px; height: 44px; border-radius: 12px; background: rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.sidebar-logo img { width: 100%; height: 100%; object-fit: contain; }
.sidebar-nav { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.sidebar-bottom { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: auto; }
.sidebar-user { width: 36px; height: 36px; border-radius: 50%; background: var(--kgr-blue); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; text-transform: uppercase; }

.nav-item { position: relative; width: 46px; height: 46px; border-radius: 13px; background: transparent; box-shadow: none; padding: 0; display: flex; align-items: center; justify-content: center; color: #8b90a3; transition: all 0.18s ease; }
.nav-item:hover { background: rgba(255,255,255,0.08); color: #fff; transform: none; box-shadow: none; }
.nav-item.ativo { background: var(--kgr-blue); color: #fff; box-shadow: 0 6px 16px rgba(43,53,128,0.45); }
.nav-item svg { width: 22px; height: 22px; }
.nav-item::after { content: attr(data-label); position: absolute; left: 56px; top: 50%; transform: translateY(-50%); background: #15171f; color: #fff; font-size: 12.5px; font-weight: 600; padding: 6px 10px; border-radius: 7px; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 0.15s; box-shadow: 0 4px 12px rgba(0,0,0,0.3); z-index: 60; }
.nav-item:hover::after { opacity: 1; }
.nav-logout { color: #d98b8b; }
.nav-logout:hover { background: rgba(211,39,41,0.18); color: #ff6b6b; }
.nav-badge { position: absolute; top: 6px; right: 6px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--kgr-red); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 2px #15171f; }

.content { flex: 1; min-width: 0; padding: 34px 28px 60px; }
.content .container { max-width: 780px; margin: 0 auto; }

.page-head { max-width: 780px; margin: 0 auto 22px; }
.page-head .crumb { font-size: 13px; color: #9aa0b3; font-weight: 600; letter-spacing: 0.3px; }
.page-head h1 { font-size: 26px; color: var(--kgr-black); margin: 4px 0 0; font-weight: 700; }

.area-vazia { text-align: center; padding: 50px 20px; color: #9aa0b3; }
.area-vazia svg { width: 46px; height: 46px; opacity: 0.5; margin-bottom: 12px; }

/* ── Colaboradores ──────────────────────────────────────────── */
.colab-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.seg { display: inline-flex; background: #eef0f4; border-radius: 9px; padding: 3px; gap: 2px; }
.seg button { background: transparent; color: #6c757d; box-shadow: none; padding: 7px 13px; font-size: 13px; border-radius: 7px; font-weight: 600; }
.seg button:hover { transform: none; box-shadow: none; background: rgba(0,0,0,0.04); }
.seg button.ativo { background: #fff; color: var(--kgr-blue); box-shadow: 0 1px 3px rgba(0,0,0,0.12); }
.status-badge { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 12px; font-weight: 700; }
.status-ativo { background: #d4edda; color: #155724; }
.status-inativo { background: #fff3cd; color: #856404; }
.status-demitido { background: #f8d7da; color: #721c24; }
.colab-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.colab-table th { background: var(--kgr-blue); color: #fff; padding: 10px 12px; text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: 0.4px; }
.colab-table td { padding: 10px 12px; border-bottom: 1px solid #e9ecef; vertical-align: middle; }
.colab-table tr:hover td { background: #f8f9fa; }
.colab-acao { padding: 5px 10px; font-size: 12px; font-weight: 600; border-radius: 6px; box-shadow: none; background: #f1f3f5; color: #495057; margin: 0; }
.colab-acao:hover { background: #e2e6ea; box-shadow: none; transform: none; }
.colab-acao.danger { background: #fdecea; color: var(--kgr-red); }
.colab-acao.danger:hover { background: #fbd9d6; }
.colab-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.colab-form-grid .full { grid-column: 1 / -1; }
@media (max-width: 560px) { .colab-form-grid { grid-template-columns: 1fr; } }

/* ── EPIs obrigatórios por função ───────────────────────────── */
.chip { display: inline-block; background: rgba(43,53,128,0.08); color: var(--kgr-blue); border: 1px solid rgba(43,53,128,0.18); border-radius: 14px; padding: 3px 10px; font-size: 12px; font-weight: 600; margin: 2px 4px 2px 0; }
.epi-checklist { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; max-height: 260px; overflow: auto; border: 1px solid #e9ecef; border-radius: 8px; padding: 12px; background: #fff; }
.epi-check { display: flex; gap: 8px; align-items: center; font-size: 13px; cursor: pointer; color: #495057; }
.epi-check input { width: 16px; height: 16px; flex-shrink: 0; }
.regra-card { border: 1px solid #e9ecef; border-radius: 10px; padding: 14px 16px; margin-bottom: 10px; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.03); }
.regra-card .rc-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 8px; }
.regra-card h4 { margin: 0; font-size: 15px; color: var(--kgr-black); }

/* ── Dashboard (KPIs) ───────────────────────────────────────── */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; max-width: 1000px; margin: 0 auto; }
.kpi-card { background: #fff; border-radius: 14px; padding: 20px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); border-left: 5px solid var(--kgr-blue); }
.kpi-card .kpi-icon { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: rgba(43,53,128,0.10); color: var(--kgr-blue); margin-bottom: 12px; }
.kpi-card .kpi-icon svg { width: 20px; height: 20px; }
.kpi-card .kpi-num { font-size: 30px; font-weight: 800; color: var(--kgr-black); line-height: 1; }
.kpi-card .kpi-label { font-size: 13px; color: #6c757d; margin-top: 6px; font-weight: 600; }
.kpi-card.warn { border-left-color: #f1c40f; }
.kpi-card.warn .kpi-icon { background: rgba(241,196,15,0.16); color: #b8860b; }
.kpi-card.danger { border-left-color: var(--kgr-red); }
.kpi-card.danger .kpi-icon { background: rgba(211,39,41,0.12); color: var(--kgr-red); }
.kpi-card.clic { cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
.kpi-card.clic:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,0.10); }
.kpi-card.clic.ativo { box-shadow: 0 0 0 2px var(--kgr-blue), 0 8px 20px rgba(0,0,0,0.10); }
.kpi-card .kpi-mais { font-size: 11px; color: #9aa0b3; font-weight: 600; margin-top: 8px; }

/* ── Dashboard: gráficos (top 5) ─────────────────────────────── */
.dash-charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; max-width: 1000px; margin: 18px auto 0; }
.chart-card { background: #fff; border-radius: 14px; padding: 20px 22px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.chart-card h3 { margin: 0 0 16px; font-size: 15px; color: var(--kgr-black); font-weight: 700; }
.bar-row { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.bar-row .bar-label { width: 40%; font-size: 13px; color: #495057; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bar-track { flex: 1; background: #eef0f4; border-radius: 6px; height: 22px; overflow: hidden; }
.bar-fill { height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--kgr-blue), #1a4fa0); display: flex; align-items: center; justify-content: flex-end; padding-right: 8px; color: #fff; font-size: 12px; font-weight: 700; min-width: 26px; box-sizing: border-box; transition: width .5s ease; }
.bar-fill.alt { background: linear-gradient(90deg, var(--kgr-green), #00b25a); }

/* ── Dashboard: painel de detalhe dos cards ──────────────────── */
.dash-detalhe { max-width: 1000px; margin: 18px auto 0; background: #fff; border-radius: 14px; padding: 20px 22px; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.dash-detalhe .dd-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; gap: 10px; }
.dash-detalhe .dd-head h3 { margin: 0; font-size: 15px; color: var(--kgr-black); }
.dd-fechar { background: #f1f3f5; color: #495057; box-shadow: none; padding: 5px 12px; font-size: 12px; font-weight: 600; }
.dd-fechar:hover { background: #e2e6ea; box-shadow: none; transform: none; }
.dd-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.dd-table th { text-align: left; color: #6c757d; font-size: 12px; text-transform: uppercase; letter-spacing: .3px; padding: 8px 10px; border-bottom: 2px solid #e9ecef; }
.dd-table td { padding: 8px 10px; border-bottom: 1px solid #f1f3f5; color: #495057; }
.dd-vazio { color: #9aa0b3; font-size: 14px; padding: 8px 0; }

/* ── Notificações ───────────────────────────────────────────── */
.notif-wrap { max-width: 760px; margin: 0 auto; }
.notif-grupo-h { font-size: 12px; font-weight: 700; color: #6c757d; text-transform: uppercase; letter-spacing: 0.4px; margin: 20px 0 10px; }
.notif-item { display: flex; gap: 12px; padding: 14px 16px; border: 1px solid #e9ecef; border-radius: 10px; margin-bottom: 10px; background: #fff; align-items: flex-start; box-shadow: 0 1px 4px rgba(0,0,0,0.03); }
.notif-dot { width: 38px; height: 38px; border-radius: 10px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.notif-dot svg { width: 19px; height: 19px; }
.notif-body h4 { margin: 0; font-size: 14px; color: var(--kgr-black); font-weight: 700; }
.notif-body p { margin: 3px 0 0; font-size: 13px; color: #6c757d; }
.notif-alta .notif-dot  { background: rgba(211,39,41,0.12); color: var(--kgr-red); }
.notif-media .notif-dot { background: rgba(241,196,15,0.16); color: #b8860b; }

/* ── Polish telas internas ──────────────────────────────────── */
.link-voltar { display: inline-flex; align-items: center; gap: 6px; color: #6c757d; font-size: 13px; font-weight: 600; cursor: pointer; margin-bottom: 18px; background: none; box-shadow: none; padding: 0; }
.link-voltar:hover { color: var(--kgr-blue); background: none; box-shadow: none; transform: none; }
.colab-card { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 14px; background: linear-gradient(135deg, rgba(43,53,128,0.08), rgba(43,53,128,0.02)); border: 1px solid rgba(43,53,128,0.12); margin-bottom: 22px; }
.colab-avatar { width: 52px; height: 52px; border-radius: 14px; background: var(--kgr-blue); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 20px; flex-shrink: 0; }
.colab-card .cc-nome { font-size: 20px; font-weight: 800; color: var(--kgr-black); }
.colab-card .cc-meta { font-size: 13px; color: #6c757d; margin-top: 3px; }
.sec-titulo { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--kgr-black); margin: 24px 0 12px; }
.sec-titulo svg { width: 18px; height: 18px; color: var(--kgr-blue); }
.epi-item { border-radius: 12px; box-shadow: 0 1px 4px rgba(0,0,0,0.04); padding: 14px 16px; }
.epi-item .epi-ic { width: 38px; height: 38px; border-radius: 10px; background: rgba(43,53,128,0.10); color: var(--kgr-blue); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-right: 12px; }
.epi-item .epi-ic svg { width: 19px; height: 19px; }
.epi-row-l { display: flex; align-items: center; min-width: 0; }
.carrinho-item { border-radius: 12px; }

@media (max-width: 768px) {
    #app-shell { flex-direction: column; }
    .sidebar { width: 100%; height: auto; flex-direction: row; justify-content: space-around; position: fixed; bottom: 0; top: auto; padding: 8px 6px; gap: 2px; border-top: 1px solid rgba(255,255,255,0.08); }
    .sidebar-top { display: none; }
    .sidebar-nav { flex-direction: row; flex: 1; justify-content: space-around; gap: 2px; }
    .sidebar-bottom { flex-direction: row; margin: 0; }
    .sidebar-user { display: none; }
    .nav-item::after { display: none; }
    .content { padding: 20px 14px 90px; }
    .content .container, .page-head { max-width: 100%; }
}

/* Estoque */
.estoque-badge { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: 13px; font-weight: 700; margin-top: 8px; }
.estoque-ok    { background: #d4edda; color: #155724; }
.estoque-baixo { background: #fff3cd; color: #856404; }
.estoque-zero  { background: #f8d7da; color: #721c24; }
.estoque-table { width: 100%; border-collapse: collapse; margin-top: 15px; font-size: 14px; }
.estoque-table th { background: var(--kgr-blue); color: white; padding: 10px 12px; text-align: left; font-size: 13px; }
.estoque-table td { padding: 10px 12px; border-bottom: 1px solid #e9ecef; vertical-align: middle; }
.estoque-table tr:hover td { background: #f8f9fa; }
.badge-ok   { background: #d4edda; color: #155724; padding: 3px 8px; border-radius: 12px; font-size: 12px; font-weight: 700; }
.badge-baixo{ background: #fff3cd; color: #856404; padding: 3px 8px; border-radius: 12px; font-size: 12px; font-weight: 700; }
.badge-zero { background: #f8d7da; color: #721c24; padding: 3px 8px; border-radius: 12px; font-size: 12px; font-weight: 700; }
.entrada-form { background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 8px; padding: 20px; margin-bottom: 25px; }
.entrada-form .row { display: flex; gap: 12px; flex-wrap: wrap; }
.entrada-form .row > div { flex: 1; min-width: 140px; }

#printArea { display: none; }

/* CSS DA IMPRESSORA */
@media print {
    @page { size: A4 landscape; margin: 10mm; }
    body { background-color: #fff; margin: 0; padding: 0; -webkit-print-color-adjust: exact; }
    .container { display: none !important; }
    #topbar, #app-shell, .sidebar { display: none !important; }
    .login-page { display: none !important; }
    #printArea { display: block !important; position: static; width: 100%; font-family: Arial, sans-serif; }
    .ficha-table { width: 100%; border-collapse: collapse; border: 2px solid #000; font-size: 11px; }
    .ficha-table td, .ficha-table th { border: 1px solid #000; padding: 4px; vertical-align: top; }
    .label-print { font-weight: bold; font-size: 10px; display: block; margin-bottom: 2px; }
    .val-print { font-size: 12px; }
    .termo-titulo { text-align: center; font-weight: bold; font-size: 12px; margin-bottom: 5px; }
    
    /* RESTAURAÇÃO DO FORMATO DE LISTA DO TERMO DE RESPONSABILIDADE */
    .termo-texto { font-size: 9.5px; line-height: 1.2; text-align: justify; margin: 0; }
    .termo-texto ul { margin: 2px 0 2px 15px; padding: 0; }
    .termo-texto li { margin-bottom: 2px; }
    
    .area-assinaturas { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 10px; font-size: 11px; padding: 0 20px; }
    .linha-ass { text-align: center; }
    .linha-ass div { border-top: 1px solid #000; width: 250px; padding-top: 2px; }
    .img-ass-termo { height: 45px; display: block; margin: 0 auto; margin-bottom: 2px; }
    .table-header-gray { background-color: #e0e0e0; font-weight: bold; text-align: center; vertical-align: middle !important; font-size: 10px; }
}