:root, html[data-theme="dark"] {
    --bg-color: #0b1220;
    --bg-elevated: #111827;
    --card-bg: #1e293b;
    --text-color: #f8fafc;
    --accent-color: #F5A623;
    --accent-hover: #d4890f;
    --copper: #b87333;
    --copper-soft: rgba(184, 115, 51, 0.18);
    --muted: #94a3b8;
    --border: #334155;
    --border-subtle: rgba(51, 65, 85, 0.65);
    --input-bg: #0f172a;
    --shadow: rgba(0,0,0,0.35);
    --shadow-elev: 0 8px 24px rgba(0,0,0,0.35);
    --label: #cbd5e1;
    --danger: #ef4444;
    --ok: #4ade80;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --space: 8px;
    --wa-green: #F5A623;
    --wa-green-text: #0b1220;
}
html[data-theme="light"] {
    --bg-color: #f1f5f9;
    --bg-elevated: #ffffff;
    --card-bg: #ffffff;
    --text-color: #0f172a;
    --accent-color: #d97706;
    --accent-hover: #b45309;
    --copper: #b87333;
    --copper-soft: rgba(184, 115, 51, 0.12);
    --muted: #64748b;
    --border: #e2e8f0;
    --border-subtle: #e2e8f0;
    --input-bg: #f8fafc;
    --shadow: rgba(15,23,42,0.08);
    --shadow-elev: 0 8px 24px rgba(15,23,42,0.1);
    --label: #475569;
    --danger: #dc2626;
    --ok: #16a34a;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --space: 8px;
    --wa-green: #F5A623;
    --wa-green-text: #0b1220;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    padding: 16px;
    min-height: 100vh;
}
@media (max-width: 480px) {
    body { padding: 12px; }
}

html, body {
    max-width: 100%;
    overflow-x: hidden;
}
.container {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    min-width: 0;
}

.container.wide {
    max-width: 920px;
}

header {
    text-align: center;
    margin-bottom: 24px;
}

header h1 {
    color: var(--accent-color);
    font-size: 1.8rem;
}

.card {
    background-color: var(--card-bg);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-subtle);
    padding: 16px;
    margin-bottom: 16px;
    box-shadow: 0 4px 14px var(--shadow);
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
}

.card h2 {
    font-size: 1.2rem;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--border);
    padding-bottom: 8px;
}

form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

input, select, textarea {
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #475569;
    background-color: var(--input-bg);
    color: var(--text-color);
    font-size: 1rem;
    width: 100%;
}

textarea { resize: vertical; min-height: 64px; }

button {
    background-color: var(--accent-color);
    color: #0f172a;
    font-weight: 700;
    padding: 12px 16px;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
    font-size: 0.95rem;
}

button:hover {
    background-color: var(--accent-hover);
}
button:disabled { opacity: 0.45; cursor: not-allowed; }

.btn-primary, .btn-ok {
    background: var(--accent-color);
    color: #0f172a;
    border: none;
    font-weight: 700;
}
.btn-primary:hover, .btn-ok:hover { background: var(--accent-hover); }

.btn-secondary {
    background: var(--copper-soft);
    color: #fdba74;
    border: 1px solid var(--copper);
    font-weight: 700;
}
.btn-secondary:hover { background: rgba(184,115,51,0.28); }

.btn-danger, .btn-sm.btn-danger {
    background: #7f1d1d;
    color: #fecaca;
    border: 1px solid #991b1b;
}
.btn-danger:hover { background: #991b1b; }

ul { list-style: none; }

li {
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
    font-size: 0.95rem;
}

a { color: var(--accent-color); }

.oculto { display: none !important; }
.tabs { display: flex; gap: 8px; margin-bottom: 16px; }
.tab {
    flex: 1;
    background: #0f172a;
    color: var(--muted);
    border: 1px solid #475569;
    padding: 10px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
}
.tab.on {
    background: var(--accent-color);
    color: #000;
    border-color: var(--accent-color);
}
label { font-size: 0.9rem; color: var(--label); }
.msg { margin-top: 12px; font-size: 0.95rem; min-height: 1.2em; }
.msg.ok { color: var(--ok); }
.msg.erro, .erro { color: var(--danger); }
.loading { color: var(--muted); }

.header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    text-align: left;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}
.btn-sair {
    width: auto;
    padding: 8px 14px;
    background: transparent;
    border: 1px solid #475569;
    color: #e2e8f0;
    font-weight: 600;
}
.btn-sair:hover { background: #334155; }

/* Nav chips */
.nav-chips { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; align-items: center; }
.nav-chips .chip {
    display: inline-block;
    text-decoration: none;
    background: #0f172a;
    color: var(--muted);
    border: 1px solid #475569;
    padding: 8px 14px;
    border-radius: 20px;
    font-size: 0.85rem;
    cursor: pointer;
    font-weight: 600;
}
.nav-chips .chip.on {
    background: var(--accent-color);
    color: #000;
    border-color: var(--accent-color);
    font-weight: 700;
}
.nav-chips .chip-sair {
    background: transparent;
    color: #e2e8f0;
    margin-left: auto;
}
.nav-chips .chip-sair:hover { background: #334155; }

.sub { color: var(--muted); font-size: 0.9rem; margin: -4px 0 12px; }

/* Feed */
.feed-list { list-style: none; }
.feed-item {
    padding: 14px 0;
    border-bottom: 1px solid var(--border);
}
.feed-top { font-size: 0.9rem; color: #cbd5e1; margin-bottom: 6px; }
.feed-body { font-size: 1.05rem; }
.feed-meta { font-size: 0.85rem; color: var(--muted); margin-top: 4px; }

/* Badges */
.badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    background: #334155;
    color: #e2e8f0;
}
.badge-pendente { background: #422006; color: #fbbf24; }
.badge-em_processo { background: #1e3a5f; color: #93c5fd; }
.badge-processado { background: #14532d; color: #86efac; }
.badge-expedido { background: #4c1d95; color: #c4b5fd; }

/* Tables */
.table-wrap { overflow-x: auto; }
.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}
.data-table th, .data-table td {
    text-align: left;
    padding: 10px 8px;
    border-bottom: 1px solid var(--border);
}
.data-table th {
    color: var(--muted);
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
}
.data-table tr:hover td { background: rgba(245, 158, 11, 0.06); }

/* Chat */
.chat-card { display: flex; flex-direction: column; }
/* Área de mensagens do chat — regra ÚNICA (antes havia 7 blocos brigando).
   overflow-anchor:none → quem controla a posição ao carregar antigas é o chat.js. */
.chat-msgs {
    display: flex;
    flex-direction: column;
    gap: 10px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    overflow-anchor: none;
    padding: 12px;
    margin-bottom: 0;
    border: none;
    border-radius: 12px;
    background-color: #0d1526;
    background-image:
        radial-gradient(rgba(245,166,35,.04) 1px, transparent 1px),
        radial-gradient(rgba(148,163,184,.03) 1px, transparent 1px);
    background-size: 24px 24px, 48px 48px;
    background-position: 0 0, 12px 12px;
}
.chat-thread-pane .chat-msgs {
    flex: 1;
    min-height: 240px;
    max-height: calc(100vh - 360px);
}
.bubble {
    max-width: 85%;
    padding: 10px 14px;
    border-radius: 14px;
    background: #0f172a;
    border: 1px solid var(--border);
}
.bubble.mine, .bubble.sent {
    align-self: flex-end;
    background: var(--accent-color, #F5A623);
    border-color: #c47d12;
    color: #0b1220;
}
.bubble.theirs { align-self: flex-start; }
.bubble-meta { font-size: 0.75rem; color: var(--muted); margin-bottom: 4px; }
.bubble-text { font-size: 0.95rem; word-break: break-word; }
.chat-form {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: stretch;
}
.chat-form input { flex: 1; }
.chat-form button { width: auto; white-space: nowrap; }

/* KPIs */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 12px;
}
.kpi-card {
    background: #0f172a;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    text-align: center;
}
.kpi-value {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--accent-color);
    margin-bottom: 4px;
}
.kpi-label {
    font-size: 0.75rem;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.log-list li { font-size: 0.85rem; }
.log-when { color: var(--muted); margin-right: 6px; }

@media (max-width: 640px) {
    body { padding: 12px; }
    .nav-chips .chip { padding: 6px 10px; font-size: 0.8rem; }
    .chat-form { flex-direction: column; }
}

/* Papéis (checkboxes) */
.papeis-fieldset {
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px;
    margin: 4px 0;
}
.papeis-fieldset legend {
    padding: 0 6px;
    color: #cbd5e1;
    font-size: 0.9rem;
}
.check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    color: var(--text-color);
    font-size: 0.95rem;
    cursor: pointer;
}
.check-row input[type="checkbox"] {
    width: auto;
    accent-color: var(--accent-color);
}

/* Filtros do feed */
.filtros-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}
.filtro-campo {
    flex: 1;
    min-width: 140px;
}
.filtro-campo label {
    display: block;
    margin-bottom: 4px;
}

/* Badges frete */
.badge-agendado { background: #422006; color: #fbbf24; }
.badge-em_transito { background: #1e3a5f; color: #93c5fd; }
.badge-concluido { background: #14532d; color: #86efac; }
.badge-cancelado { background: #450a0a; color: #fca5a5; }

/* Auth logo */
.auth-header { text-align: center; }
.logo-mark { display: flex; justify-content: center; margin-bottom: 8px; }
.btn-link {
    background: transparent !important;
    color: var(--accent-color) !important;
    border: none;
    padding: 8px;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}
.btn-link:hover { color: #fbbf24 !important; background: transparent !important; }

.header-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-shrink: 0;
    flex-wrap: wrap;
    max-width: 100%;
}
.btn-icon {
    width: auto;
    padding: 8px 12px;
    background: #0f172a;
    border: 1px solid #475569;
    color: #e2e8f0;
    border-radius: 8px;
    font-size: 1.1rem;
}
.btn-icon:hover { background: #334155; }

/* Chip filters / segmented controls */
.chip-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}
.fchip {
    width: auto;
    padding: 7px 12px;
    border-radius: var(--radius-sm, 8px);
    background: #0f172a;
    color: var(--muted);
    border: 1px solid #475569;
    font-size: 0.82rem;
    font-weight: 600;
}
.fchip.on {
    background: rgba(245,158,11,.16);
    color: #fbbf24;
    border-color: var(--accent-color);
}
.seg-minerio {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0;
    padding: 3px;
    background: #0b1220;
    border: 1px solid var(--border);
    border-radius: 10px;
    margin-bottom: 10px;
}
.seg-minerio .fchip {
    border-radius: 7px;
    border-color: transparent;
    background: transparent;
    margin: 0;
}
.seg-minerio .fchip.on {
    background: var(--card-bg);
    border-color: transparent;
    box-shadow: 0 1px 4px rgba(0,0,0,.35);
    color: #fbbf24;
}

/* Lote marketplace cards */
.lote-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 12px;
}
.lote-card {
    background: var(--bg-elevated, #111827);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color .15s ease, box-shadow .15s ease;
    box-shadow: 0 2px 10px rgba(0,0,0,.22);
}
.lote-card:hover {
    border-color: rgba(245,158,11,.45);
    box-shadow: var(--shadow-elev);
}
.lote-img {
    height: 140px;
    background: linear-gradient(145deg, #1e293b, #0f172a 55%, #422006);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.lote-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.lote-img.placeholder .min-ph {
    width: 48px; height: 48px; border-radius: 50%;
    box-shadow: inset 0 1px 3px rgba(255,255,255,.35), 0 0 0 2px rgba(0,0,0,.3);
}
.lote-img.placeholder .min-ph.ouro { background: radial-gradient(circle at 30% 30%, #fde68a, #f59e0b 55%, #b45309); }
.lote-img.placeholder .min-ph.ferro { background: radial-gradient(circle at 30% 30%, #94a3b8, #475569 50%, #1e293b); }
.lote-img.placeholder .min-ph.cobre { background: radial-gradient(circle at 30% 30%, #fdba74, #c2410c 55%, #7c2d12); }
.lote-img.placeholder .min-ph.niquel,
.lote-img.placeholder .min-ph.default { background: radial-gradient(circle at 30% 30%, #e2e8f0, #64748b 50%, #334155); }
.lote-card-body { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.lote-card-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lote-tipo { font-size: 0.72rem; color: var(--muted); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.lote-codigo { font-size: 0.95rem; color: #e2e8f0; font-weight: 700; line-height: 1.25; margin: 2px 0; }
.lote-meta { font-size: 0.82rem; color: #94a3b8; display: flex; flex-wrap: wrap; gap: 6px 10px; }
.lote-meta .meta-item { display: inline-flex; align-items: center; gap: 4px; }
.lote-preco { font-weight: 800; font-size: 1.15rem; color: #fbbf24; letter-spacing: -0.02em; margin-top: 2px; }
.lote-who { font-size: 0.75rem; color: var(--muted); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.lote-trust {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 0.68rem; font-weight: 700; color: #86efac;
    background: rgba(74,222,128,.1); border: 1px solid rgba(74,222,128,.28);
    padding: 2px 7px; border-radius: 999px;
}
.btn-card {
    display: block;
    text-align: center;
    margin-top: 8px;
    padding: 9px 10px;
    background: var(--accent-color);
    color: #0f172a !important;
    text-decoration: none;
    border-radius: var(--radius-sm);
    font-weight: 700;
    font-size: 0.88rem;
}
.btn-card:hover { background: var(--accent-hover); }

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}
.section-head h2 { border: none; padding: 0; margin: 0; }
.btn-primary-lg {
    width: auto;
    white-space: nowrap;
    padding: 12px 18px;
    font-size: 1rem;
}

.card-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.btn-sm {
    width: auto;
    padding: 6px 10px;
    font-size: 0.8rem;
    background: #334155;
    color: #e2e8f0;
}
.btn-sm:hover { background: #475569; }
.btn-sm.btn-danger { background: #7f1d1d; color: #fecaca; }
.btn-sm.btn-ok { background: #14532d; color: #bbf7d0; }

/* Modal */
.modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.modal.oculto { display: none !important; }
.modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.65);
}
.modal-panel {
    position: relative;
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 18px;
    width: min(480px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    z-index: 1;
}
.modal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}
.modal-head h3 { color: var(--accent-color); }
.modal-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}
.btn-ghost {
    width: auto;
    background: transparent;
    border: 1px solid #475569;
    color: #e2e8f0;
}
.btn-ghost:hover { background: #334155; }
.hint { font-size: 0.8rem; color: var(--muted); }

/* Toast */
.app-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(80px);
    background: #1e293b;
    border: 1px solid var(--accent-color);
    color: #f8fafc;
    padding: 12px 18px;
    border-radius: 10px;
    z-index: 2000;
    opacity: 0;
    transition: all 0.25s ease;
    pointer-events: none;
    max-width: 90vw;
}
.app-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.config-form { margin-top: 14px; }
.painel-britagem .kpi-grid { margin-bottom: 8px; }

/* ===== Bottom nav Instagram-style ===== */
body.has-bottom-nav {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
}
.bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 2px;
    background: #0b1220;
    border-top: 1px solid var(--border);
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -4px 20px rgba(0,0,0,0.35);
}
.bn-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    text-decoration: none;
    color: #94a3b8;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 4px 2px;
    min-width: 0;
}
.bn-item.on { color: #F5A623; }
.bn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    line-height: 1;
    color: inherit;
}
.bn-icon svg {
    width: 22px;
    height: 22px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.bn-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.bn-novo .bn-plus {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--accent-color);
    color: #000;
    font-size: 1.6rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -18px;
    border: 3px solid var(--bg-color);
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4);
}
.bn-novo.on .bn-plus,
.bn-novo:hover .bn-plus { background: var(--accent-hover); }
.bn-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #334155;
    color: #f8fafc;
    font-size: 0.7rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid transparent;
}
.bn-perfil.on .bn-avatar {
    border-color: var(--accent-color);
    background: #422006;
    color: var(--accent-color);
}

.nav-secondary {
    margin-bottom: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    overflow-x: hidden;
    max-width: 100%;
    padding-bottom: 2px;
    align-items: center;
}
@media (min-width: 720px) {
    .nav-secondary {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .nav-secondary::-webkit-scrollbar { display: none; }
}
.nav-secondary::-webkit-scrollbar { display: none; }
.nav-secondary .chip { flex: 0 0 auto; }
.nav-secondary .chip-mais {
    background: #1e293b;
}

/* Mais sheet */
.mais-sheet {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.mais-sheet.oculto { display: none !important; }
.mais-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.55);
}
.mais-panel {
    position: relative;
    z-index: 1;
    width: min(480px, 100%);
    background: var(--card-bg);
    border-radius: 18px 18px 0 0;
    border: 1px solid var(--border);
    border-bottom: none;
    padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    max-height: 70vh;
    overflow-y: auto;
}
.mais-handle {
    width: 40px;
    height: 4px;
    background: #475569;
    border-radius: 4px;
    margin: 4px auto 12px;
}
.mais-panel h3 { color: var(--accent-color); margin-bottom: 10px; }
.mais-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.mais-item {
    display: block;
    padding: 12px 14px;
    background: #0f172a;
    border: 1px solid var(--border);
    border-radius: 10px;
    text-decoration: none;
    color: #e2e8f0;
    font-weight: 600;
}
.mais-item:hover { border-color: var(--accent-color); color: var(--accent-color); }
.mais-sair { width: 100%; margin-top: 4px; }

/* Toast above bottom nav */
body.has-bottom-nav .app-toast {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}

/* ===== Cotações (compact strip) ===== */
.cotacoes-card {
    margin-bottom: 10px;
    padding: 10px 12px !important;
    overflow: hidden;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
.cotacoes-card.cotacoes-compact h2 { display: none; }
.cotacoes-strip-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 6px;
    min-width: 0;
    width: 100%;
}
.cotacoes-strip-title {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted);
    flex-shrink: 0;
}
.cotacoes-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 6px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.cotacoes-strip .cotacao-item {
    background: #0f172a;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 6px 8px;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    box-sizing: border-box;
}
.cotacao-item .c-label {
    font-size: 0.65rem;
    color: var(--muted);
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cotacao-item .c-valor {
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--accent-color);
    margin: 2px 0;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cotacao-item .c-sub {
    font-size: 0.65rem;
    color: #94a3b8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cotacoes-links { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; max-width: 100%; }
.cotacoes-links a {
    display: inline-block;
    padding: 3px 8px;
    background: #0f172a;
    border: 1px solid #475569;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.68rem;
    font-weight: 600;
}
.cotacoes-links a:hover { border-color: var(--accent-color); }
.cotacoes-fonte {
    font-size: 0.65rem;
    color: var(--muted);
    margin: 0;
    min-width: 0;
    flex: 1 1 auto;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media (max-width: 480px) {
    .cotacoes-card { padding: 8px 8px !important; }
    .cotacoes-grid { gap: 4px; }
    .cotacoes-strip .cotacao-item { padding: 5px 5px; }
    .cotacao-item .c-valor { font-size: 0.78rem; }
    .cotacao-item .c-label,
    .cotacao-item .c-sub { font-size: 0.58rem; }
    .cotacoes-fonte { font-size: 0.58rem; max-width: 50%; }
    .header-actions { gap: 6px; }
    .btn-caixa-bank { width: 52px; min-width: 52px; height: 40px; }
    .header-actions .btn-icon { width: 34px; height: 34px; padding: 0; }
    .btn-sair { padding: 6px 10px; font-size: 0.8rem; }
}

/* ===== Chat WhatsApp-like ===== */
.chat-card { min-height: 60vh; }
/* .chat-msgs: regra única lá em cima (20260925e) */
.bubble {
    max-width: 82%;
    padding: 8px 12px 6px;
    border-radius: 12px;
    border: none;
    position: relative;
}
.bubble.mine, .bubble.sent {
    align-self: flex-end;
    background: #F5A623;
    border-color: transparent;
    border-bottom-right-radius: 4px;
    color: #0b1220;
}
.bubble.theirs {
    align-self: flex-start;
    background: #1e293b;
    border-bottom-left-radius: 4px;
}
.bubble.scheduled {
    opacity: 0.75;
    border: 1px dashed #64748b;
}
.bubble-meta { font-size: 0.7rem; color: #94a3b8; margin-bottom: 3px; }
.bubble.mine .bubble-meta, .bubble.sent .bubble-meta { color: rgba(11,18,32,.72); }
.bubble-text { font-size: 0.95rem; word-break: break-word; white-space: pre-wrap; }
.bubble-media { margin-top: 6px; }
.bubble-media img, .bubble-media video {
    max-width: 100%;
    border-radius: 8px;
    display: block;
}
.bubble-media audio { width: 100%; margin-top: 4px; }
.bubble-status {
    font-size: 0.65rem;
    color: #86efac;
    text-align: right;
    margin-top: 2px;
}
.bubble.mine .bubble-status, .bubble.sent .bubble-status {
    color: rgba(11,18,32,.7);
}
.chat-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
    align-items: center;
}
.chat-toolbar .btn-sm { margin: 0; }
.chat-form {
    flex-wrap: wrap;
}
.chat-form input[type="text"] { flex: 1; min-width: 140px; }
.chat-extra {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}
.chat-extra label { font-size: 0.8rem; }
.chat-agendar-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-end;
    margin-top: 8px;
}
.chat-agendar-row input[type="datetime-local"] { flex: 1; min-width: 160px; }

/* ===== Admin ===== */
.admin-kpis { margin-bottom: 16px; }
.pix-box {
    background: #0f172a;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    margin-bottom: 12px;
}
.pix-chave {
    font-family: ui-monospace, monospace;
    font-size: 1.05rem;
    color: #86efac;
    word-break: break-all;
    margin: 6px 0;
}

/* ===== Pix Copia e Cola + QR ===== */
.pix-emv-panel {
    margin-top: 14px;
    padding: 14px;
    background: #0f172a;
    border: 1px solid var(--border);
    border-radius: 10px;
}
.pix-preview-title {
    margin: 0 0 10px;
    font-size: 1rem;
    font-weight: 600;
}
.pix-qr {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 8px auto 12px;
    padding: 10px;
    background: #fff;
    border-radius: 8px;
    width: fit-content;
    max-width: 100%;
}
.pix-qr img, .pix-qr canvas {
    display: block;
    max-width: 100%;
    height: auto;
}
.pix-emv-panel textarea {
    width: 100%;
    font-family: ui-monospace, monospace;
    font-size: 0.78rem;
    word-break: break-all;
    resize: vertical;
    min-height: 72px;
}
.pix-emv-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 8px 0;
}
.pix-hint { margin-top: 6px; }
.admin-tabs { margin-bottom: 12px; }

@media (max-width: 640px) {
    .nav-secondary .chip { padding: 5px 8px; font-size: 0.75rem; }
    .bn-label { font-size: 0.6rem; }
}

/* ===== Mapa de Satélite ===== */
body.mapa-page {
    padding: 12px 12px 0;
    min-height: 100vh;
    height: 100vh;
    overflow: hidden;
}
body.mapa-page.has-bottom-nav {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    height: 100vh;
}
.mapa-layout {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 12px - 72px - env(safe-area-inset-bottom, 0px));
    max-width: 1100px;
    margin: 0 auto;
}
body.mapa-page .header-row {
    margin-bottom: 8px;
    flex-shrink: 0;
}
body.mapa-page .header-row h1 {
    font-size: 1.35rem;
}
body.mapa-page #app-nav {
    margin-bottom: 8px;
    flex-shrink: 0;
}
.mapa-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin-bottom: 8px;
    flex-shrink: 0;
}
.mapa-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #e2e8f0;
    cursor: pointer;
    user-select: none;
}
.mapa-toggle input {
    width: auto;
    accent-color: var(--accent-color);
}
.mapa-base-select {
    margin-left: 4px;
    padding: 4px 8px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: #0f172a;
    color: #e2e8f0;
    font-size: 0.85rem;
    cursor: pointer;
}
.mapa-base-select:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 1px;
}
.mapa-toolbar-hint {
    font-size: 0.75rem;
    color: var(--muted);
}
.mapa-canvas {
    flex: 1 1 auto;
    min-height: 260px;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
    background: #020617;
    z-index: 1;
}
.mapa-legend {
    flex-shrink: 0;
    font-size: 0.78rem;
    color: var(--muted);
    padding: 8px 4px 10px;
    text-align: center;
}
body.mapa-fs .mapa-layout {
    position: fixed;
    inset: 0;
    z-index: 850;
    max-width: none;
    height: auto;
    background: var(--bg-color);
    padding: 8px 8px calc(72px + env(safe-area-inset-bottom, 0px));
}
body.mapa-fs .header-row,
body.mapa-fs #app-nav,
body.mapa-fs .mapa-toolbar,
body.mapa-fs .mapa-legend {
    display: none;
}
body.mapa-fs .mapa-canvas {
    border-radius: 0;
    min-height: 100%;
    height: 100%;
}
body.mapa-fs #btn-mapa-fs {
    position: fixed;
    top: 12px;
    right: 12px;
    z-index: 1000;
    display: flex !important;
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid var(--border);
}
.mapa-popup { font-size: 0.9rem; line-height: 1.35; color: #0f172a; }
.mapa-popup-meta { color: #475569; font-size: 0.8rem; }
.mapa-popup-link { color: #b45309; font-weight: 700; }
.leaflet-container { background: #0b1220; font: inherit; }
.leaflet-control-attribution {
    font-size: 9px !important;
    background: rgba(15, 23, 42, 0.85) !important;
    color: #94a3b8 !important;
    max-width: 70vw;
}
.leaflet-control-attribution a { color: var(--accent-color) !important; }
.leaflet-bar a {
    background: #1e293b !important;
    color: #f8fafc !important;
    border-bottom-color: #334155 !important;
}
.leaflet-bar a:hover { background: #334155 !important; }
.coords-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.coords-row label { display: block; }
@media (max-width: 640px) {
    .coords-row { grid-template-columns: 1fr; }
    .mapa-layout { height: calc(100vh - 8px - 72px - env(safe-area-inset-bottom, 0px)); }
}
.btn-mapa-fs-exit {
    position: fixed;
    top: 12px;
    right: 12px;
    z-index: 1000;
    background: rgba(15, 23, 42, 0.92);
    color: var(--accent-color);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px 14px;
    font-weight: 700;
}
.btn-mapa-fs-exit:hover { background: #1e293b; }


/* ---- Tema / bloqueio / tutorial / histórico ---- */
.banner-bloqueio {
    background: #7f1d1d;
    color: #fecaca;
    padding: 12px 16px;
    text-align: center;
    font-size: 0.92rem;
    position: sticky;
    top: 0;
    z-index: 900;
    border-bottom: 1px solid #991b1b;
}
.banner-bloqueio a { color: #fde68a; font-weight: 700; }
html[data-theme="light"] .banner-bloqueio {
    background: #fee2e2;
    color: #7f1d1d;
    border-bottom-color: #fecaca;
}
html[data-theme="light"] .banner-bloqueio a { color: #b45309; }

.badge-atrasado { background: #7f1d1d; color: #fecaca; }
.badge-pago { background: #14532d; color: #bbf7d0; }
html[data-theme="light"] .badge-atrasado { background: #fecaca; color: #7f1d1d; }
html[data-theme="light"] .badge-pago { background: #bbf7d0; color: #14532d; }

.prefs-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }

.tutorial-steps {
    list-style: decimal;
    padding-left: 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 12px 0;
}
.tutorial-steps li { border-bottom: none; padding: 4px 0; line-height: 1.4; }

.hist-heading {
    font-size: 1rem;
    margin: 16px 0 8px;
    color: var(--muted);
    font-weight: 600;
}
.cotacoes-historico {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
}
.hist-block {
    background: var(--input-bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 10px;
}
.hist-title { font-weight: 700; font-size: 0.85rem; margin-bottom: 6px; color: var(--accent-color); }
.hist-bars {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    height: 48px;
    margin-bottom: 8px;
}
.hist-bar {
    flex: 1;
    background: var(--accent-color);
    border-radius: 3px 3px 0 0;
    min-width: 4px;
    opacity: 0.85;
}
.hist-list { font-size: 0.75rem; color: var(--muted); }
.hist-list li { border-bottom: 1px solid var(--border); padding: 3px 0; }

html[data-theme="light"] .card {
    border: 1px solid var(--border);
}
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
    border-color: var(--border);
    background: var(--input-bg);
    color: var(--text-color);
}
html[data-theme="light"] .tab {
    background: #e2e8f0;
    color: var(--muted);
    border-color: var(--border);
}
html[data-theme="light"] .nav-chips .chip,
html[data-theme="light"] .bottom-nav {
    background: #fff;
    border-color: var(--border);
}
html[data-theme="light"] .bn-item { color: var(--muted); }
html[data-theme="light"] .bn-item.on { color: var(--accent-color); }
html[data-theme="light"] .btn-sair {
    border-color: var(--border);
    color: var(--text-color);
}
html[data-theme="light"] .mais-panel {
    background: var(--card-bg);
    color: var(--text-color);
}

/* ---- Cadastro welcome callout ---- */
.callout-institucional {
    background: linear-gradient(135deg, #422006 0%, #1e293b 100%);
    border: 1px solid #f59e0b;
    border-radius: 12px;
    padding: 14px 16px;
    margin: 0 0 16px;
    color: var(--text-color);
}
.callout-institucional strong {
    display: block;
    color: #fbbf24;
    margin-bottom: 8px;
    font-size: 0.95rem;
}
.callout-institucional p {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.45;
    color: #e2e8f0;
}
html[data-theme="light"] .callout-institucional {
    background: #fff7ed;
    border-color: #f59e0b;
}
html[data-theme="light"] .callout-institucional p { color: #334155; }
html[data-theme="light"] .callout-institucional strong { color: #b45309; }

/* ---- Caixa Minera bank card ---- */
.caixa-bank-card {
    background: linear-gradient(145deg, #0f172a 0%, #1e3a5f 55%, #422006 100%);
    border: 1px solid #f59e0b;
    box-shadow: 0 8px 28px rgba(245, 158, 11, 0.18);
}
.caixa-bank-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 8px;
}
.caixa-bank-eyebrow {
    margin: 0 0 4px;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fbbf24;
    font-weight: 700;
}
.caixa-bank-card h2 { margin-top: 0; color: #fef3c7; }
.btn-saiba-mais {
    flex-shrink: 0;
    font-size: 0.85rem;
    color: #fbbf24 !important;
    text-decoration: underline;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 4px 0;
}
.caixa-saldo-block {
    margin: 16px 0 12px;
    padding: 16px;
    border-radius: 12px;
    background: rgba(15, 23, 42, 0.55);
    border: 1px solid rgba(251, 191, 36, 0.35);
}
.caixa-saldo-label {
    font-size: 0.8rem;
    color: #94a3b8;
    margin-bottom: 4px;
}
.caixa-saldo-valor {
    font-size: 2rem;
    font-weight: 800;
    color: #fef3c7;
    letter-spacing: -0.02em;
}
.caixa-rendimento {
    margin-top: 6px;
    font-size: 0.85rem;
    color: #86efac;
}
.caixa-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}
.caixa-actions .btn-ok,
.caixa-actions .btn-ghost {
    flex: 1;
    min-width: 120px;
}
.caixa-mov-form { margin-top: 12px; }
.aviso-credito {
    background: #422006;
    border: 1px solid #f59e0b;
    color: #fde68a;
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 14px;
    font-size: 0.95rem;
}
.saiba-mais-body { font-size: 0.92rem; line-height: 1.5; }
.saiba-mais-body ul { padding-left: 1.2em; margin: 10px 0; }
.saiba-mais-body li { margin-bottom: 8px; }
.saiba-mais-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Featured nav chip */
.nav-chips .chip.chip-featured {
    background: linear-gradient(135deg, #422006, #1e3a5f);
    border-color: #f59e0b;
    color: #fde68a;
    font-weight: 700;
}
.nav-chips .chip.chip-featured.on {
    background: #f59e0b;
    color: #1c1917;
}
.mais-item-featured {
    border: 1px solid #f59e0b !important;
    color: #fde68a !important;
    font-weight: 700;
}
html[data-theme="light"] .caixa-bank-card {
    background: linear-gradient(145deg, #fff7ed, #e0f2fe);
}
html[data-theme="light"] .caixa-bank-card h2 { color: #92400e; }
html[data-theme="light"] .caixa-saldo-block { background: #fff; }
html[data-theme="light"] .caixa-saldo-valor { color: #92400e; }
html[data-theme="light"] .aviso-credito {
    background: #fff7ed;
    color: #92400e;
}

/* Caixa PIN lock + painéis de ação */
.caixa-lock-overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.92);
    border-radius: 12px;
    padding: 20px;
}
.caixa-bank-card { position: relative; }
.caixa-bank-card.caixa-locked .caixa-unlocked-body { filter: blur(4px); pointer-events: none; user-select: none; }
.caixa-lock-panel {
    width: 100%;
    max-width: 360px;
    background: #0f172a;
    border: 1px solid #f59e0b;
    border-radius: 12px;
    padding: 16px;
}
.caixa-lock-panel h3 { margin: 0 0 8px; color: #fef3c7; font-size: 1.05rem; }
.caixa-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.caixa-actions button { flex: 1; min-width: 100px; }
.caixa-panel { margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(251,191,36,0.25); }
.caixa-panel.oculto { display: none; }
.pix-dep-box { margin: 10px 0; }
.pix-dep-box .pix-qr { display: flex; justify-content: center; margin: 8px 0; }
.pix-dep-box textarea { width: 100%; font-size: 0.75rem; }
.caixa-pin-hint { font-size: 0.8rem; color: #94a3b8; margin: 6px 0 10px; }

/* Header Caixa Minera bank icon — more prominent than bell */
.btn-caixa-bank {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 54px;
    min-width: 54px;
    height: 44px;
    padding: 2px 4px;
    border-radius: 12px;
    background: linear-gradient(145deg, #422006, #1e3a5f);
    border: 1.5px solid #f59e0b;
    color: #fbbf24;
    text-decoration: none;
    box-shadow: 0 0 14px rgba(245, 158, 11, 0.45), 0 2px 8px rgba(0,0,0,0.35);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    flex-shrink: 0;
}
.btn-caixa-bank:hover,
.btn-caixa-bank:focus {
    transform: scale(1.08);
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.7), 0 2px 10px rgba(0,0,0,0.4);
    color: #fde68a;
    outline: none;
}
.btn-caixa-bank svg { display: block; width: 24px; height: 24px; }
.btn-caixa-bank-label {
    display: block;
    font-size: .62rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .02em;
}
.header-actions .btn-icon {
    width: 36px;
    height: 36px;
    font-size: 1.05rem;
    opacity: 0.9;
}
html[data-theme="light"] .btn-caixa-bank {
    background: linear-gradient(145deg, #fff7ed, #e0f2fe);
    color: #b45309;
    border-color: #f59e0b;
}


/* —— Fale conosco / Robô Minera —— */
/* Fale conosco: só card no Perfil (sem FAB flutuante em nenhuma página) */
.btn-fale-float { display: none !important; }
.card-fale-conosco .btn-fale-conosco-card {
    width: 100%;
    min-height: 48px;
    margin-top: 4px;
    font-size: 1rem;
    font-weight: 700;
}
.card-fale-conosco.oculto { display: none !important; }
/* Header Sair always tappable and last in row */
.header-row .btn-sair,
.perfil-topbar #btn-sair {
    position: relative;
    z-index: 95;
    flex-shrink: 0;
    pointer-events: auto;
}
.header-row {
    position: relative;
    z-index: 30;
}
.header-actions {
    position: relative;
    z-index: 40;
}
@media (max-width: 700px) {
    /* Extra room under sticky admin-as-user bar on small phones */
    body.modo-ui-usuario {
        padding-top: calc(60px + env(safe-area-inset-top, 0px));
    }
    body.modo-ui-usuario.pagina-perfil .perfil-topbar {
        top: calc(60px + env(safe-area-inset-top, 0px));
    }
}
body.pagina-chat .olx-fab {
    display: none !important;
}
body.pagina-chat.chat-thread-open #bottom-nav {
    display: none !important;
}
body.pagina-chat.chat-thread-open {
    padding-bottom: 0 !important;
}
.suporte-panel { width: min(440px, 100%); display: flex; flex-direction: column; max-height: 85vh; }
.suporte-intro { margin: 0 0 8px; }
.suporte-msgs {
    flex: 1;
    min-height: 180px;
    max-height: 42vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px;
    background: rgba(15, 23, 42, 0.45);
    border-radius: 10px;
    border: 1px solid var(--border, #334155);
    margin-bottom: 8px;
}
.suporte-bubble {
    max-width: 92%;
    padding: 8px 10px;
    border-radius: 12px;
    font-size: 0.9rem;
    line-height: 1.35;
}
.suporte-bubble .suporte-meta {
    font-size: 0.7rem;
    opacity: 0.75;
    margin-bottom: 2px;
}
.suporte-bubble.user {
    align-self: flex-end;
    background: #1d4ed8;
    color: #eff6ff;
    border-bottom-right-radius: 4px;
}
.suporte-bubble.bot {
    align-self: flex-start;
    background: #334155;
    color: #f1f5f9;
    border-bottom-left-radius: 4px;
}
.suporte-bubble.admin {
    align-self: flex-start;
    background: #065f46;
    color: #ecfdf5;
    border-bottom-left-radius: 4px;
}
.suporte-form {
    display: flex;
    gap: 8px;
    margin-top: 6px;
}
.suporte-form input { flex: 1; margin: 0; }
.suporte-form button { margin: 0; flex-shrink: 0; }
.suporte-actions { margin: 4px 0 6px; }
.suporte-thread {
    border: 1px solid var(--border, #334155);
    border-radius: 10px;
    margin-bottom: 10px;
    overflow: hidden;
}
.suporte-thread-head {
    width: 100%;
    text-align: left;
    background: rgba(30, 41, 59, 0.8);
    border: 0;
    color: inherit;
    padding: 10px 12px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.suporte-thread-body { padding: 10px; }
.admin-suporte-msgs { max-height: 240px; }
.suporte-admin-reply { display: flex; gap: 8px; margin-top: 8px; }
.suporte-admin-reply input { flex: 1; margin: 0; }

/* —— Família Minera (thin bar → expands) —— */
.familia-card {
    border: 1.5px solid #f59e0b;
    background: linear-gradient(145deg, rgba(66, 32, 6, 0.55), rgba(30, 58, 95, 0.4));
    padding: 0;
    overflow: hidden;
}
.familia-card.familia-collapsed { padding: 0; }
.familia-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    min-height: 42px;
    border: 0;
    background: transparent;
    color: #fef3c7;
    text-align: left;
    cursor: pointer;
    font: inherit;
}
.familia-bar:hover,
.familia-bar:focus {
    background: rgba(251, 191, 36, 0.12);
    outline: none;
}
.familia-bar-icon { flex-shrink: 0; font-size: 1.05rem; line-height: 1; }
.familia-bar-text {
    flex: 1;
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.25;
    color: #fef3c7;
}
.familia-bar-chevron {
    flex-shrink: 0;
    font-size: 0.85rem;
    opacity: 0.85;
    transition: transform 0.15s ease;
}
.familia-card.familia-expanded .familia-bar-chevron { transform: rotate(180deg); }
.familia-panel {
    padding: 0 14px 14px;
    border-top: 1px solid rgba(251, 191, 36, 0.28);
}
.familia-panel-title {
    margin: 12px 0 6px;
    color: #fbbf24;
    font-size: 1.05rem;
}
.familia-stats {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin: 12px 0;
}
.familia-stat {
    flex: 1;
    min-width: 120px;
    background: rgba(15, 23, 42, 0.55);
    border-radius: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(251, 191, 36, 0.35);
}
.familia-stat-val {
    display: block;
    font-size: 1.25rem;
    font-weight: 700;
    color: #fde68a;
}
.familia-stat-lbl { font-size: 0.75rem; color: #94a3b8; }
.familia-share-row {
    display: flex;
    gap: 8px;
    align-items: center;
}
.familia-share-row input { flex: 1; margin: 0; font-family: ui-monospace, monospace; }
.familia-link-hint { word-break: break-all; font-size: 0.75rem; }
html[data-theme="light"] .familia-card {
    background: linear-gradient(145deg, #fff7ed, #e0f2fe);
}
html[data-theme="light"] .familia-bar-text { color: #92400e; }
html[data-theme="light"] .familia-bar:hover,
html[data-theme="light"] .familia-bar:focus { background: rgba(245, 158, 11, 0.12); }
html[data-theme="light"] .familia-stat { background: #fff; }
html[data-theme="light"] .familia-stat-val { color: #b45309; }
html[data-theme="light"] .familia-panel-title { color: #b45309; }
.familia-share-row { gap: 8px; }
.familia-share-row .btn-sm { white-space: nowrap; }

.familia-og-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 10px 0 12px;
    padding: 10px;
    border-radius: 14px;
    background: #0b1220;
    border: 1px solid rgba(245, 166, 35, 0.45);
}
.familia-og-logo {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #F5A623;
    flex-shrink: 0;
    background: #0b1220;
}
.familia-og-meta { min-width: 0; flex: 1; }
.familia-og-title {
    display: block;
    color: #F5A623;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 4px;
}
.familia-og-desc {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.35;
    color: #cbd5e1;
}
#familia-msg-custom {
    width: 100%;
    resize: vertical;
    min-height: 64px;
    margin-bottom: 10px;
}
html[data-theme="light"] .familia-og-card {
    background: #0b1220;
}
html[data-theme="light"] .familia-og-desc { color: #e2e8f0; }

.familia-share-preview {
    margin-top: 10px;
    border-radius: 10px;
    border: 1px solid rgba(245, 166, 35, 0.28);
    background: rgba(15, 23, 42, 0.45);
    padding: 6px 10px;
}
.familia-share-preview summary {
    cursor: pointer;
    color: #F5A623;
    font-size: 0.82rem;
    font-weight: 600;
    list-style: none;
}
.familia-share-preview summary::-webkit-details-marker { display: none; }
.familia-share-text {
    margin: 8px 0 4px;
    white-space: pre-wrap;
    word-break: break-word;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.75rem;
    line-height: 1.4;
    color: #cbd5e1;
    background: transparent;
    border: 0;
    padding: 0;
}
html[data-theme="light"] .familia-share-preview {
    background: #fffbeb;
    border-color: rgba(180, 83, 9, 0.25);
}
html[data-theme="light"] .familia-share-text { color: #78350f; }

html[data-theme="light"] .suporte-msgs { background: #f1f5f9; }
html[data-theme="light"] .suporte-bubble.bot { background: #e2e8f0; color: #0f172a; }


/* ===== Brand logo (escavadeira) ===== */
.brand-title {
    text-align: left;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}
.brand-title > #user-label,
.brand-title > p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.brand-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    min-width: 0;
    max-width: 100%;
}
.brand-row h1 {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: clamp(1.05rem, 4.2vw, 1.8rem);
    line-height: 1.2;
}
.brand-logo {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--accent-color, #f59e0b);
    background: #1c1917;
    flex-shrink: 0;
}
.brand-logo-lg {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #f59e0b;
    background: #1c1917;
    box-shadow: 0 0 0 4px #422006;
}
.logo-mark { display: flex; justify-content: center; margin-bottom: 8px; }

/* ===== Notif badge + dropdown ===== */
#btn-notif { position: relative; }
.notif-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #ef4444;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 800;
    line-height: 18px;
    text-align: center;
    border: 2px solid #0f172a;
}
#btn-notif.has-unread { border-color: #f59e0b; }
.notif-dropdown {
    position: absolute;
    z-index: 1200;
    width: min(320px, calc(100vw - 16px));
    background: #0f172a;
    border: 1px solid #475569;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0,0,0,.45);
    overflow: hidden;
}
.notif-dd-head {
    padding: 10px 14px;
    font-weight: 700;
    border-bottom: 1px solid var(--border);
    color: #e2e8f0;
}
.notif-dd-list { max-height: 280px; overflow-y: auto; padding: 6px; }
.notif-dd-item {
    display: block;
    padding: 10px 12px;
    border-radius: 8px;
    text-decoration: none;
    color: #e2e8f0;
    margin-bottom: 4px;
}
.notif-dd-item:hover { background: #1e293b; }
.notif-dd-item strong { display: block; font-size: 0.9rem; }
.notif-dd-item span { display: block; font-size: 0.8rem; color: var(--muted); margin-top: 2px; }
.notif-dd-foot {
    display: block;
    text-align: center;
    padding: 10px;
    border-top: 1px solid var(--border);
    color: var(--accent-color);
    font-weight: 700;
    text-decoration: none;
}

/* ===== Chat WA layout (contacts + thread) ===== */
.chat-wa-layout {
    display: grid;
    grid-template-columns: minmax(260px, 340px) 1fr;
    gap: 0;
    padding: 0;
    overflow: hidden;
    min-height: 70vh;
}
.chat-contacts-pane {
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    background: #0b1220;
    min-height: 60vh;
}
.chat-contacts-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border);
}
.chat-contacts-head h2 { margin: 0; font-size: 1.05rem; }
.chat-busca {
    margin: 8px 12px;
    width: calc(100% - 24px);
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid #334155;
    background: #0f172a;
    color: #e2e8f0;
}
.chat-contatos-list {
    flex: 1;
    overflow-y: auto;
    padding: 0 0 12px;
}
.chat-group-title {
    padding: 8px 14px 4px;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #f59e0b;
}
.chat-contact-item {
    display: flex;
    gap: 10px;
    width: 100%;
    text-align: left;
    padding: 10px 14px;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(71,85,105,.35);
    color: #e2e8f0;
    cursor: pointer;
    border-radius: 0;
}
.chat-contact-item:hover { background: rgba(245,158,11,.08); }
.chat-contact-item.on { background: rgba(245,158,11,.16); }
.contact-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #422006;
    color: #fbbf24;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex-shrink: 0;
}
.contact-body { min-width: 0; flex: 1; }
.contact-name {
    font-weight: 700;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 6px;
}
.contact-unread {
    background: #22c55e;
    color: #052e16;
    font-size: 0.65rem;
    font-weight: 800;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 999px;
    padding: 0 4px;
}
.contact-preview {
    font-size: 0.8rem;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.contact-role { font-size: 0.7rem; color: #94a3b8; margin-top: 2px; }

.chat-thread-pane {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 12px 14px 14px;
    background: #0a1628;
}
.chat-thread-empty {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    text-align: center;
    padding: 24px;
}
.chat-thread-active { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.chat-thread-head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 8px;
}
.chat-thread-head .sub { margin: 2px 0 0; }
.chat-back { display: none; }
/* .chat-msgs: regra única lá em cima (20260925e) */

.chat-add-panel { max-width: 480px; width: 94vw; }
.chat-add-roles { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 12px; }
.chat-add-roles .chip {
    background: #0f172a;
    border: 1px solid #475569;
    color: #cbd5e1;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    cursor: pointer;
}
.chat-add-roles .chip.on {
    background: var(--accent-color);
    color: #000;
    border-color: var(--accent-color);
    font-weight: 700;
}
.chat-diretorio-list {
    max-height: 280px;
    overflow-y: auto;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 6px;
    margin-bottom: 12px;
}
.chat-dir-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-bottom: 1px solid rgba(71,85,105,.3);
}
.chat-dir-item:last-child { border-bottom: none; }
.chat-add-email-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}
.chat-add-email-row input { flex: 1; }

@media (max-width: 800px) {
    .chat-wa-layout {
        grid-template-columns: 1fr;
    }
    .chat-wa-layout .chat-thread-pane { display: none; }
    .chat-wa-layout.thread-open .chat-contacts-pane { display: none; }
    .chat-wa-layout.thread-open .chat-thread-pane { display: flex; }
    .chat-back { display: inline-flex; }
    .chat-contacts-pane { border-right: none; }
}


/* ===== Brand logo mobile + chat empty ===== */
@media (max-width: 640px) {
    .brand-logo {
        width: 32px;
        height: 32px;
    }
    .brand-row { gap: 8px; }
    .brand-row h1 { font-size: 1.15rem; }
    .brand-logo-lg {
        width: 64px;
        height: 64px;
    }
}
.chat-empty-logo {
    margin-bottom: 12px;
    opacity: 0.95;
}
.chat-empty-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text, #e2e8f0);
    margin: 0 0 6px;
}
.chat-thread-empty .hint { max-width: 320px; }
.chat-contatos-list:empty::before {
    content: none;
}


/* ===== TURBO UX alignment + media (20260916v) ===== */
html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
body, .container, .card, header, nav, section { min-width: 0; }

.header-row {
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    overflow: visible;
}
.header-row .brand-title {
    flex: 1 1 190px;
    min-width: 0;
}
.brand-row { min-width: 0; }
.brand-row h1 { min-width: 0; overflow-wrap: anywhere; }
.header-actions {
    display: flex;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.header-actions > * { margin: 0; flex-shrink: 0; }

/* Secondary chips wrap cleanly instead of producing a sideways/janky tab. */
.nav-secondary {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    overflow-x: hidden;
    overscroll-behavior-x: none;
    padding: 0;
}
.nav-secondary .chip {
    flex: 0 1 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    max-width: 100%;
    white-space: normal;
    text-align: center;
    line-height: 1.15;
}
.nav-secondary .chip-sair { margin-left: 0; }

.bottom-nav {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
    justify-content: center;
}
.bottom-nav .bn-item { flex: 1 1 20%; min-width: 0; max-width: 20%; }

.familia-card, .familia-bar, .cotacoes-card, .cotacoes-grid,
.cotacoes-strip-head, .cotacoes-links { width: 100%; max-width: 100%; min-width: 0; }
.familia-bar { flex-wrap: nowrap; overflow: hidden; }
.familia-bar-text { min-width: 0; overflow-wrap: anywhere; }
.familia-share-row { min-width: 0; flex-wrap: wrap; }
.familia-share-row input { min-width: 0; flex: 1 1 190px; }
.cotacoes-links a { min-width: 0; overflow-wrap: anywhere; }

.chat-toolbar { flex-wrap: wrap; align-items: center; }
.audio-timer {
    display: inline-flex;
    align-items: center;
    color: #fca5a5;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    padding: 0 6px;
}
.audio-preview-box {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px;
    margin-top: 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(15, 23, 42, .75);
}
.audio-preview-box audio { flex: 1 1 220px; min-width: 0; max-width: 100%; }
.audio-preview-box .hint { flex: 1 1 140px; margin: 0; }
.audio-preview-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.bubble-media { position: relative; overflow: hidden; border-radius: 8px; }
.bubble-media-loading img,
.bubble-media-loading video { opacity: .68; }
.media-upload-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, .55);
    color: #fff;
    font-weight: 800;
}
.bubble.pending { opacity: .92; }

.chat-add-roles { max-width: 100%; overflow-x: hidden; }
.chat-add-roles .chip { min-width: 0; white-space: normal; }
.chat-dir-item > div:first-child { min-width: 0; overflow-wrap: anywhere; }

@media (max-width: 560px) {
    body { padding: 12px; }
    .header-row { gap: 8px; align-items: center; }
    .header-row .brand-title { flex-basis: 150px; }
    .header-actions { gap: 5px; flex: 0 1 auto; margin-left: auto; justify-content: flex-end; }
    .header-actions .btn-caixa-bank { width: 52px; min-width: 52px; height: 36px; }
    .header-actions .btn-caixa-bank svg { width: 20px; height: 20px; }
    .header-actions .btn-caixa-bank-label { font-size: .58rem; }
    .nav-secondary { gap: 6px; }
    .nav-secondary .chip { flex: 0 1 auto; padding: 6px 10px; }
    .nav-secondary .servicos-wrap { flex: 0 1 auto; }
    .header-row { gap: 6px; row-gap: 8px; }
    .header-row .brand-title { flex: 1 1 120px; min-width: 0; }
    .header-row .brand-title h1 { font-size: clamp(0.95rem, 4.2vw, 1.15rem); }
    .header-row #user-label { font-size: 0.72rem; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
    .header-actions { gap: 4px; flex-wrap: nowrap; max-width: calc(100% - 8px); }
    .header-actions .btn-modo-ui { max-width: 7.5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .cotacoes-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .cotacao-item .c-valor { font-size: clamp(.65rem, 3vw, .82rem); }
    .familia-bar { padding: 9px 10px; }
    .familia-bar-text { font-size: .78rem; }
    .chat-toolbar .btn-sm { flex: 1 1 calc(50% - 6px); }
}


/* Composer media preview and live recording bar. */
.chat-media-preview {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    padding: 9px;
    margin: 0 0 8px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(15,23,42,.8);
}
.media-preview-thumb {
    display: block;
    width: 72px;
    height: 72px;
    flex: 0 0 72px;
    object-fit: cover;
    border-radius: 8px;
    background: #020617;
}
.media-preview-audio { flex: 1 1 150px; min-width: 0; font-weight: 700; }
.media-preview-audio + audio { flex: 1 1 180px; min-width: 0; }
.media-preview-status { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: .8rem; }
.media-uploading-spin {
    width: 17px;
    height: 17px;
    border: 2px solid #64748b;
    border-top-color: var(--accent-color);
    border-radius: 50%;
    animation: minera-spin .75s linear infinite;
}
@keyframes minera-spin { to { transform: rotate(360deg); } }
.chat-rec-bar {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 10px;
    margin-bottom: 8px;
    border: 1px solid rgba(239,68,68,.6);
    border-radius: 10px;
    background: rgba(127,29,29,.2);
}
.rec-dot {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    border-radius: 50%;
    background: #ef4444;
    animation: rec-pulse 1s ease-in-out infinite;
}
@keyframes rec-pulse { 50% { opacity: .35; transform: scale(.8); } }
.chat-rec-timer { font-variant-numeric: tabular-nums; font-weight: 800; }
.chat-rec-wave {
    flex: 1 1 auto;
    height: 18px;
    background: repeating-linear-gradient(90deg, transparent 0 4px, #fca5a5 4px 6px, transparent 6px 10px);
    opacity: .75;
}
#btn-audio { touch-action: none; user-select: none; -webkit-user-select: none; }

/* Small-screen overflow hardening for tabs and message media. */
.tabs { flex-wrap: wrap; max-width: 100%; }
.tabs .tab { min-width: min(130px, 100%); }
/* .chat-msgs: regra única lá em cima (20260925e) */
.bubble-media img, .bubble-media video {
    width: 100%;
    height: auto;
    max-height: 360px;
    object-fit: contain;
}
@media (max-width: 640px) {
    .chat-form { flex-direction: row; flex-wrap: nowrap; gap: 6px; }
    .chat-form input[type="text"] { min-width: 0; }
    .chat-form button { flex: 0 0 auto; padding: 10px; }
}


/* WhatsApp-like recording bar + composer media preview */
.chat-rec-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    margin: 6px 0;
    background: rgba(239, 68, 68, 0.12);
    border: 1px solid #ef4444;
    border-radius: 10px;
}
.chat-rec-bar.oculto { display: none !important; }
.rec-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ef4444;
    animation: rec-blink 1s ease-in-out infinite;
    flex-shrink: 0;
}
@keyframes rec-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.25; }
}
.chat-rec-timer {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: #fecaca;
    min-width: 3.2em;
}
.chat-rec-wave {
    flex: 1;
    height: 4px;
    border-radius: 2px;
    background: linear-gradient(90deg, #ef4444 0%, #fca5a5 40%, #ef4444 80%);
    background-size: 200% 100%;
    animation: wave-slide 1.2s linear infinite;
}
@keyframes wave-slide {
    0% { background-position: 0 0; }
    100% { background-position: 200% 0; }
}
#btn-audio.recording {
    background: #7f1d1d;
    border-color: #ef4444;
    color: #fecaca;
}
.chat-media-preview {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 8px;
    margin: 6px 0;
    background: #0b1220;
    border: 1px solid var(--border);
    border-radius: 10px;
}
.chat-media-preview.oculto { display: none !important; }
.media-preview-thumb {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: #1e293b;
}
.media-preview-audio { font-size: 0.9rem; color: var(--muted); }
.media-preview-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: var(--muted);
}
.media-uploading-spin {
    width: 14px;
    height: 14px;
    border: 2px solid #475569;
    border-top-color: var(--accent-color);
    border-radius: 50%;
    display: inline-block;
    animation: spin-up 0.7s linear infinite;
}
@keyframes spin-up { to { transform: rotate(360deg); } }

.chat-lightbox {
    position: fixed; inset: 0; z-index: 2000; background: rgba(0,0,0,.88);
    display: flex; align-items: center; justify-content: center; padding: 16px;
}
.chat-lightbox.oculto { display: none !important; }
.chat-lightbox img { max-width: min(960px, 100%); max-height: 90vh; border-radius: 8px; object-fit: contain; }
.chat-lightbox-close {
    position: absolute; top: 12px; right: 16px; width: 40px; height: 40px; border-radius: 50%;
    border: none; background: #1e293b; color: #fff; font-size: 1.5rem; cursor: pointer;
}
.bubble-media img { cursor: zoom-in; }

/* WhatsApp-like composer preview and live recording timer */
.chat-rec-bar, .chat-media-preview {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 7px 0;
    padding: 8px 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(15, 23, 42, .78);
}
.chat-rec-bar { border-color: rgba(239, 68, 68, .7); }
.rec-dot {
    width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0;
    background: #ef4444; animation: minera-rec-pulse 1s ease-in-out infinite;
}
@keyframes minera-rec-pulse { 50% { opacity: .3; } }
.chat-rec-timer { color: #fecaca; font-weight: 800; font-variant-numeric: tabular-nums; }
.chat-rec-wave {
    flex: 1 1 80px; min-width: 40px; height: 4px; border-radius: 4px;
    background: linear-gradient(90deg, #ef4444, #fca5a5, #ef4444);
}
.chat-media-preview .media-preview-thumb {
    width: 76px; height: 76px; max-width: 28vw; object-fit: cover;
    border-radius: 8px; border: 1px solid var(--border);
}
.chat-media-preview audio { flex: 1 1 180px; min-width: 0; max-width: 100%; }
.media-preview-status { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }
.media-uploading-spin {
    width: 14px; height: 14px; display: inline-block; border-radius: 50%;
    border: 2px solid #475569; border-top-color: var(--accent-color);
    animation: minera-spin .7s linear infinite;
}
@keyframes minera-spin { to { transform: rotate(360deg); } }
#btn-audio.recording { background: #7f1d1d; color: #fecaca; }


/* Admin: empréstimos pendentes */
.kpi-card.kpi-alert .kpi-value { color: #fbbf24; }
tr.row-pendente { background: rgba(251, 191, 36, 0.08); }
.bubble-failed { opacity: 0.85; border: 1px solid var(--danger, #f87171); }
.bubble-audio audio { width: 100%; min-width: 180px; }
.bubble-audio .audio-err { color: #fca5a5; margin-top: 4px; }
.notif-emp-item strong { color: #fbbf24; }


/* Publicar como + badge de papel no card */
.publicado-como-wrap {
    margin-bottom: 0.85rem;
}
.publicado-como-wrap.publicado-unico select {
    opacity: 0.92;
    pointer-events: none;
}
.lote-papel-badge {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: #1e293b;
    color: #93c5fd;
    border: 1px solid #334155;
    letter-spacing: 0.02em;
}
html[data-theme="light"] .lote-papel-badge {
    background: #e0f2fe;
    color: #075985;
    border-color: #bae6fd;
}


/* ===== Chat page: hide secondary chips + message actions (20260916ad) ===== */
body.pagina-chat #app-nav,
body.pagina-chat .nav-chips.nav-secondary {
    display: none !important;
}

.chat-thread-head {
    display: flex;
    align-items: center;
    gap: 8px;
}
.chat-thread-head-info { flex: 1; min-width: 0; }
.chat-thread-head-actions { margin-left: auto; }
.chat-head-menu {
    position: absolute;
    right: 12px;
    top: 56px;
    z-index: 40;
    background: var(--card, #0f172a);
    border: 1px solid var(--border, #334155);
    border-radius: 12px;
    min-width: 220px;
    box-shadow: 0 12px 28px rgba(0,0,0,.35);
    padding: 6px;
}
.chat-head-menu button {
    display: block;
    width: 100%;
    text-align: left;
    background: transparent;
    border: 0;
    color: inherit;
    padding: 10px 12px;
    border-radius: 8px;
    cursor: pointer;
    font: inherit;
}
.chat-head-menu button:hover { background: rgba(148,163,184,.12); }
.chat-head-menu button.danger { color: #fca5a5; }

.chat-thread-active { position: relative; }

.chat-reply-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(15,23,42,.9);
    border: 1px solid var(--border, #334155);
    border-left: 3px solid var(--accent, #f59e0b);
    border-radius: 10px;
    padding: 8px 10px;
    margin-top: 8px;
}
.chat-reply-bar.oculto { display: none !important; }
.chat-reply-bar-body { flex: 1; min-width: 0; }
.chat-reply-bar-label {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--accent, #f59e0b);
}
.chat-reply-snippet {
    display: block;
    font-size: 0.85rem;
    color: var(--muted, #94a3b8);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.chat-reply-cancel {
    border: 0;
    background: transparent;
    color: var(--muted, #94a3b8);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    padding: 4px 8px;
}

.bubble-quote {
    border-left: 3px solid rgba(245,158,11,.85);
    background: rgba(15,23,42,.35);
    border-radius: 8px;
    padding: 6px 8px;
    margin-bottom: 6px;
}
.bubble.mine .bubble-quote { background: rgba(0,0,0,.18); }
.bubble-quote-name {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: #fbbf24;
}
.bubble-quote-text {
    display: block;
    font-size: 0.82rem;
    color: #cbd5e1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bubble.deleted { opacity: 0.78; }
.bubble-deleted { font-style: italic; color: var(--muted, #94a3b8); }

.chat-msg-sheet {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.chat-msg-sheet.oculto { display: none !important; }
.chat-msg-sheet-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2,6,23,.55);
}
.chat-msg-sheet-panel {
    position: relative;
    width: min(440px, 100%);
    background: var(--card, #0f172a);
    border: 1px solid var(--border, #334155);
    border-radius: 16px 16px 0 0;
    padding: 10px 12px 18px;
    box-shadow: 0 -10px 30px rgba(0,0,0,.35);
}
.chat-msg-sheet-handle {
    width: 42px;
    height: 4px;
    border-radius: 999px;
    background: #475569;
    margin: 4px auto 12px;
}
.chat-msg-sheet-preview {
    font-size: 0.85rem;
    color: var(--muted, #94a3b8);
    margin: 0 4px 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.chat-msg-sheet-item {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    color: inherit;
    padding: 12px 10px;
    border-radius: 10px;
    font: inherit;
    cursor: pointer;
}
.chat-msg-sheet-item:hover { background: rgba(148,163,184,.12); }
.chat-msg-sheet-item.danger { color: #fca5a5; }
.chat-msg-sheet-item.ghost { color: var(--muted, #94a3b8); }
.chat-msg-sheet-item.oculto { display: none !important; }

@media (min-width: 720px) {
    .chat-msg-sheet { align-items: center; }
    .chat-msg-sheet-panel {
        border-radius: 14px;
        margin: 16px;
    }
}

/* ===== Localidade Marketplace (20260916af) ===== */
.loc-bar {
    margin: 0 0 14px;
    padding: 0;
    border-radius: 12px;
    border: 1px solid var(--border, #334155);
    background: rgba(15, 23, 42, 0.55);
    overflow: hidden;
}
.loc-bar-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    min-height: 44px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    font: inherit;
}
.loc-bar-toggle:hover,
.loc-bar-toggle:focus {
    background: rgba(251, 191, 36, 0.08);
    outline: none;
}
.loc-bar-toggle-title {
    flex-shrink: 0;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #94a3b8;
}
.loc-bar-status {
    flex: 1;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--accent-color, #f59e0b);
    line-height: 1.3;
    margin: 0;
    min-width: 0;
}
.loc-bar-chevron {
    flex-shrink: 0;
    font-size: 0.75rem;
    opacity: 0.85;
    color: #94a3b8;
    transition: transform 0.15s ease;
}
.loc-bar-expanded .loc-bar-chevron { transform: rotate(180deg); }
.loc-bar-panel {
    padding: 0 12px 12px;
    border-top: 1px solid rgba(148, 163, 184, 0.25);
}
.loc-mode-chips { margin: 10px 0 8px; }
.filtro-grupo-label {
    margin: 12px 0 6px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #94a3b8;
}
.loc-selects {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.loc-select,
.loc-form-row select,
#lote_estado, #lote_cidade, #lote_ddd {
    width: 100%;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid #475569;
    background: #0f172a;
    color: inherit;
    font: inherit;
}
.loc-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 8px 0;
}
@media (max-width: 640px) {
    .loc-selects { grid-template-columns: 1fr; }
    .loc-form-row { grid-template-columns: 1fr; }
}


/* ===== Admin shell (monitoramento) + mesa de crédito + wizard KYC ===== */
body.pagina-admin .bottom-nav,
body.pagina-admin #app-nav,
body.pagina-admin .nav-chips.nav-secundarios,
body.pagina-admin .btn-caixa-bank,
body.pagina-admin #btn-caixa-bank {
    display: none !important;
}
body.pagina-admin {
    padding-bottom: 24px;
}
.admin-badge-pill {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    background: #f59e0b;
    color: #111827;
    vertical-align: middle;
}
.admin-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 12px 0 16px;
}
.admin-tab {
    border: 1px solid var(--border, #334155);
    background: var(--card, #0f172a);
    color: inherit;
    border-radius: 999px;
    padding: 8px 14px;
    font: inherit;
    cursor: pointer;
}
.admin-tab.on {
    background: #f59e0b;
    color: #111827;
    border-color: #f59e0b;
    font-weight: 700;
}
.admin-panel.oculto { display: none !important; }

.credito-filas {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 12px 0;
}
.credito-filas .chip.on {
    background: #f59e0b;
    color: #111827;
    border-color: #f59e0b;
}
.credito-card {
    border: 1px solid var(--border, #334155);
    border-radius: 12px;
    padding: 12px;
    margin: 10px 0;
    background: rgba(15, 23, 42, 0.5);
}
.credito-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}
.credito-nome {
    color: #38bdf8;
    text-decoration: none;
}
.credito-nome:hover { text-decoration: underline; }
.credito-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 0.9rem;
    margin-bottom: 6px;
}
.doc-checklist {
    list-style: none;
    padding: 0;
    margin: 8px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    font-size: 0.85rem;
}
.doc-ok { color: #4ade80; }
.doc-falta { color: #fca5a5; }
.alerta-item {
    border: 1px solid var(--border, #334155);
    border-radius: 10px;
    padding: 10px 12px;
    margin: 8px 0;
}
.alerta-item.alerta-novo {
    border-color: #f59e0b;
    background: rgba(245, 158, 11, 0.08);
}
.alerta-item.alerta-lido { opacity: 0.7; }

.emp-wizard { margin-top: 8px; }
.emp-progress {
    height: 4px;
    background: #0f172a;
    border-radius: 999px;
    overflow: hidden;
    margin-bottom: 10px;
    border: 1px solid var(--border);
}
.emp-progress-bar {
    height: 100%;
    width: 25%;
    background: linear-gradient(90deg, var(--copper), var(--accent-color));
    transition: width .25s ease;
}
.emp-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}
.emp-step {
    padding: 5px 10px;
    border-radius: 8px;
    border: 1px solid var(--border, #475569);
    font-size: 0.78rem;
    color: #94a3b8;
    font-weight: 600;
}
.emp-step.on {
    background: rgba(245, 158, 11, 0.16);
    border-color: #f59e0b;
    color: #fbbf24;
}
.emp-step.done {
    border-color: #166534;
    color: #86efac;
    background: rgba(22,101,52,.18);
}
.bot-bubble, .kyc-hint {
    background: rgba(15, 23, 42, 0.65);
    border: 1px solid var(--border);
    border-left: 3px solid var(--copper);
    padding: 10px 12px;
    border-radius: 0 10px 10px 0;
    margin-bottom: 12px;
    font-size: 0.88rem;
    color: #cbd5e1;
    line-height: 1.45;
}
.emp-resumo-list { padding-left: 18px; }
.aviso-credito {
    color: #fbbf24;
    margin: 8px 0;
}


/* ---- Modo UI admin ↔ usuário ---- */
body.modo-ui-admin .bottom-nav,
body.modo-ui-admin #app-nav,
body.modo-ui-admin .nav-chips.nav-secondary,
body.modo-ui-admin .btn-caixa-bank,
body.modo-ui-admin #btn-caixa-bank {
    display: none !important;
}
body.modo-ui-admin {
    padding-bottom: 24px;
}
.btn-modo-ui {
    border: 1px solid #f59e0b;
    background: rgba(245, 158, 11, 0.15);
    color: #fbbf24;
    border-radius: 999px;
    padding: 6px 12px;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
}
.btn-modo-ui:hover,
.btn-modo-ui:focus {
    background: #f59e0b;
    color: #111827;
}
.btn-modo-ui.btn-modo-voltar {
    border-color: #38bdf8;
    background: rgba(56, 189, 248, 0.15);
    color: #7dd3fc;
}
.btn-modo-ui.btn-modo-voltar:hover,
.btn-modo-ui.btn-modo-voltar:focus {
    background: #38bdf8;
    color: #0f172a;
}
.modo-ui-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* Below modals (2000+) but above page chrome; do not blanket-cover Sair forever */
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    padding-top: max(10px, env(safe-area-inset-top, 0px));
    min-height: 48px;
    box-sizing: border-box;
    background: rgba(11, 18, 32, 0.97);
    border-bottom: 2px solid #F5A623;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 18px rgba(0,0,0,0.35);
}
/* Safe-area: sticky bar grows with notch — body padding must match or Sair is covered */
body.modo-ui-usuario {
    padding-top: calc(56px + env(safe-area-inset-top, 0px));
}
body.modo-ui-usuario.pagina-perfil .perfil-topbar {
    top: calc(56px + env(safe-area-inset-top, 0px));
}
body.modo-ui-usuario.pagina-admin .header-row {
    position: relative;
    z-index: 90;
}
.modo-ui-sticky span {
    font-size: 0.85rem;
    color: #94a3b8;
}
html[data-theme="light"] .modo-ui-sticky {
    background: rgba(255, 255, 255, 0.95);
    border-bottom-color: #e2e8f0;
}
html[data-theme="light"] .modo-ui-sticky span { color: #64748b; }
html[data-theme="light"] .btn-modo-ui {
    color: #b45309;
    background: rgba(245, 158, 11, 0.2);
}
@media (max-width: 640px) {
    .btn-modo-ui { font-size: 0.72rem; padding: 5px 10px; }
}


/* —— Admin monitor: accordion por usuário + seleção bolinha —— */
.admin-bulk-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    margin-bottom: 12px;
    border-radius: 10px;
    background: rgba(30, 58, 95, 0.55);
    border: 1px solid var(--border, #334155);
    position: sticky;
    top: 0;
    z-index: 5;
}
.admin-bulk-bar.oculto { display: none !important; }
.admin-bulk-count {
    font-size: 0.85rem;
    color: var(--muted, #94a3b8);
    margin-right: 4px;
}
.admin-user-list { display: flex; flex-direction: column; gap: 8px; }
.admin-user-acc {
    border: 1px solid var(--border, #334155);
    border-radius: 10px;
    overflow: hidden;
    background: rgba(15, 23, 42, 0.35);
}
.admin-user-acc-head {
    width: 100%;
    text-align: left;
    background: rgba(30, 41, 59, 0.85);
    border: 0;
    color: inherit;
    padding: 10px 12px;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.admin-acc-chevron {
    display: inline-block;
    width: 1em;
    color: var(--muted, #94a3b8);
    font-size: 0.85rem;
}
.admin-acc-hint { margin-left: auto; }
.admin-user-acc-body { padding: 8px 10px 12px; }
.admin-unread-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.4em;
    height: 1.4em;
    padding: 0 6px;
    border-radius: 999px;
    background: #ef4444;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
}
.admin-thread-block { margin-bottom: 10px; }
.admin-thread-peer {
    font-size: 0.8rem;
    color: var(--muted, #94a3b8);
    margin: 6px 0 4px;
    padding-left: 2px;
}
.admin-sel-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 6px;
    border-radius: 8px;
    cursor: pointer;
    margin: 0;
}
.admin-sel-row:hover { background: rgba(148, 163, 184, 0.08); }
.admin-sel-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.admin-sel-meta {
    font-size: 0.75rem;
    color: var(--muted, #94a3b8);
}
.admin-sel-text { font-size: 0.9rem; word-break: break-word; }
.admin-bolinha {
    position: relative;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 2px;
    cursor: pointer;
}
.admin-bolinha input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    cursor: pointer;
    z-index: 1;
}
.admin-bolinha .bolinha {
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid #64748b;
    background: transparent;
    box-sizing: border-box;
    transition: background .15s, border-color .15s, box-shadow .15s;
}
.admin-bolinha input:checked + .bolinha {
    border-color: #38bdf8;
    background: #0ea5e9;
    box-shadow: inset 0 0 0 3px rgba(15, 23, 42, 0.85);
}
.admin-bolinha input:focus-visible + .bolinha {
    outline: 2px solid #38bdf8;
    outline-offset: 2px;
}
.suporte-thread-head-row {
    display: flex;
    align-items: stretch;
    gap: 0;
}
.suporte-thread-head-row .admin-bolinha-thread {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px 0 10px;
    background: rgba(30, 41, 59, 0.85);
    margin: 0;
}
.suporte-thread-head-row .suporte-thread-head {
    flex: 1;
    border-radius: 0;
}
.suporte-sel-msg .suporte-bubble {
    margin: 0;
    padding: 6px 8px;
    border-radius: 8px;
}


/* ===== Serviços bottom sheet + mineral filter icons (20260918b) ===== */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.servicos-wrap {
    position: relative;
    display: inline-flex;
    flex: 0 1 auto;
    z-index: 40;
}
.nav-chips .chip.chip-servicos {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    line-height: 1.2;
    padding: 8px 14px;
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #3b2410 100%);
    border-color: #f59e0b;
    font-weight: 700;
    color: #fbbf24;
}
.nav-chips .chip.chip-servicos .servicos-btn-main {
    white-space: nowrap;
    font-size: 0.88rem;
}
.nav-chips .chip.chip-servicos .servicos-btn-cue {
    display: none;
}
.nav-chips .chip.chip-servicos.open,
.nav-chips .chip.chip-servicos[aria-expanded="true"] {
    border-color: var(--accent-color);
    color: var(--accent-color);
}
.nav-chips .chip.chip-servicos .servicos-chevron {
    font-size: 0.7em;
    line-height: 1;
    transition: transform .15s ease;
}
.nav-chips .chip.chip-servicos.open .servicos-chevron {
    transform: rotate(180deg);
}

/* Bottom sheet overlay + panel */
.servicos-sheet {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.servicos-sheet.oculto { display: none !important; }
.servicos-mkt-panel {
    position: relative;
    z-index: 1;
    width: min(560px, 100%);
    background: var(--card-bg, #1e293b);
    border-radius: 18px 18px 0 0;
    border: 1px solid var(--border, #334155);
    border-bottom: none;
    padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    max-height: min(88vh, 720px);
    overflow-y: auto;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.servicos-mkt-head h3 {
    color: var(--accent-color);
    margin: 0 0 6px;
    font-size: 1.15rem;
}
.servicos-mkt-cue {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.4;
    color: var(--muted, #94a3b8);
}
.servicos-busca-wrap { display: block; margin: 0; }
.servicos-busca {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid var(--border, #334155);
    background: #0f172a;
    color: #e2e8f0;
    font-size: 0.95rem;
}
.servicos-busca:focus {
    outline: none;
    border-color: var(--accent-color);
}
.servicos-filtros {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    scrollbar-width: none;
}
.servicos-filtros::-webkit-scrollbar { display: none; }
.servicos-filtros .svc-fchip {
    flex: 0 0 auto;
    white-space: nowrap;
}
.servicos-dir-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 80px;
}
.servicos-empty {
    margin: 8px 0 4px;
    padding: 16px 14px;
    text-align: center;
    color: var(--muted, #94a3b8);
    font-size: 0.92rem;
    line-height: 1.45;
    background: #0f172a;
    border: 1px dashed #475569;
    border-radius: 12px;
}
.svc-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    background: #0f172a;
    border: 1px solid var(--border, #334155);
    border-radius: 14px;
}
.svc-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, #334155, #0f172a);
    border: 1px solid #475569;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.8rem;
    color: #fbbf24;
    flex-shrink: 0;
}
.svc-body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.svc-nome {
    font-size: 0.95rem;
    color: #e2e8f0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.svc-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.svc-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(245, 158, 11, 0.35);
    color: #fbbf24;
    font-size: 0.72rem;
    font-weight: 700;
}
.svc-cidade {
    font-size: 0.78rem;
    color: var(--muted, #94a3b8);
}
.svc-negociar {
    flex-shrink: 0;
    text-decoration: none;
    background: var(--accent-color, #f59e0b) !important;
    color: #000 !important;
    border: none;
    font-weight: 800;
    padding: 8px 12px;
    border-radius: 10px;
}
.svc-negociar:hover {
    filter: brightness(1.08);
}
.servicos-ferramentas {
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px solid var(--border, #334155);
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.servicos-ferramentas.oculto { display: none !important; }
.servicos-ferr-title {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted, #94a3b8);
}
.servicos-ferr-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 10px;
    text-decoration: none;
    color: #e2e8f0;
    font-weight: 600;
    background: #0f172a;
    border: 1px solid var(--border, #334155);
}
.servicos-ferr-link:hover {
    border-color: var(--accent-color);
    color: var(--accent-color);
}
.feed-empty {
    margin: 12px 0;
    padding: 16px;
    text-align: center;
    color: var(--muted, #94a3b8);
    line-height: 1.45;
}

html[data-theme="light"] .nav-chips .chip.chip-servicos {
    background: linear-gradient(135deg, #fff7ed, #ffedd5);
    color: #9a3412;
}
html[data-theme="light"] .nav-chips .chip.chip-servicos .servicos-btn-cue {
    color: #b45309;
}
html[data-theme="light"] .nav-chips .chip.chip-servicos.open,
html[data-theme="light"] .nav-chips .chip.chip-servicos[aria-expanded="true"] {
    color: #b45309;
    border-color: #f59e0b;
}
html[data-theme="light"] .servicos-mkt-panel {
    background: #fff;
    box-shadow: 0 -12px 40px rgba(15, 23, 42, 0.18);
}
html[data-theme="light"] .servicos-mkt-cue { color: #64748b; }
html[data-theme="light"] .servicos-busca {
    background: #f8fafc;
    color: #0f172a;
    border-color: #cbd5e1;
}
html[data-theme="light"] .servicos-empty,
html[data-theme="light"] .svc-card,
html[data-theme="light"] .servicos-ferr-link {
    background: #f8fafc;
    border-color: #e2e8f0;
}
html[data-theme="light"] .svc-nome { color: #0f172a; }
html[data-theme="light"] .svc-avatar {
    background: linear-gradient(135deg, #e2e8f0, #f8fafc);
    border-color: #cbd5e1;
    color: #b45309;
}
html[data-theme="light"] .svc-badge {
    background: #fff7ed;
    border-color: #fcd34d;
    color: #b45309;
}
html[data-theme="light"] .servicos-ferr-link { color: #0f172a; }
html[data-theme="light"] .servicos-ferr-link:hover { color: #b45309; border-color: #f59e0b; }

@media (max-width: 560px) {
    .servicos-mkt-panel {
        max-height: 92vh;
        padding-left: 12px;
        padding-right: 12px;
    }
    .svc-negociar { padding: 8px 10px; font-size: 0.82rem; }
}

/* Mineral filter chips — visual language */
.chip-filters-minerio .fchip-mineral {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}
.fchip-mineral .min-ico {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: inset 0 1px 2px rgba(255,255,255,.35), 0 0 0 1px rgba(0,0,0,.25);
}
.fchip-ouro .min-ico {
    background: radial-gradient(circle at 30% 30%, #fde68a, #f59e0b 55%, #b45309);
    box-shadow: inset 0 1px 2px rgba(255,255,255,.45), 0 0 0 1px #92400e;
}
.fchip-ferro .min-ico {
    background: radial-gradient(circle at 30% 30%, #94a3b8, #475569 50%, #1e293b);
    box-shadow: inset 0 1px 2px rgba(255,255,255,.2), 0 0 0 1px #0f172a;
}
.fchip-cobre .min-ico {
    background: radial-gradient(circle at 30% 30%, #fdba74, #c2410c 55%, #7c2d12);
    box-shadow: inset 0 1px 2px rgba(255,255,255,.3), 0 0 0 1px #7c2d12;
}
.fchip-niquel .min-ico {
    background: radial-gradient(circle at 30% 30%, #f8fafc, #cbd5e1 45%, #64748b);
    box-shadow: inset 0 1px 2px rgba(255,255,255,.55), 0 0 0 1px #475569;
}
.fchip-mineral.on .min-ico {
    box-shadow: inset 0 1px 2px rgba(255,255,255,.5), 0 0 0 1.5px rgba(0,0,0,.35);
}

@media (max-width: 560px) {
    .chip-filters-minerio .fchip-mineral {
        padding: 6px 10px;
        font-size: 0.8rem;
    }
}


/* ===== TURBO redesign 20260923ar — industrial premium ===== */

.mkt-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.mkt-head h2 {
    margin: 0;
    border: none;
    padding: 0;
    font-size: 1.15rem;
}
.mkt-head .sub { margin: 4px 0 0; color: var(--muted); font-size: 0.85rem; }
.mkt-search {
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
}
.mkt-search input {
    flex: 1;
    padding: 10px 12px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border);
    background: var(--input-bg);
    color: var(--text-color);
    font-size: 0.92rem;
}
.mkt-search input:focus {
    outline: none;
    border-color: var(--accent-color);
}
.cta-servicos {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    margin-bottom: 12px;
    border-radius: var(--radius-md);
    border: 1px solid rgba(245,158,11,.4);
    background: linear-gradient(120deg, rgba(66,32,6,.55), rgba(15,23,42,.9));
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    width: 100%;
    text-align: left;
}
.cta-servicos:hover { border-color: var(--accent-color); }
.cta-servicos-ico {
    width: 40px; height: 40px; border-radius: 10px;
    background: rgba(245,158,11,.15);
    border: 1px solid rgba(245,158,11,.35);
    display: flex; align-items: center; justify-content: center;
    color: #fbbf24; flex-shrink: 0;
}
.cta-servicos-body { flex: 1; min-width: 0; }
.cta-servicos-title { font-weight: 700; color: #fef3c7; font-size: 0.95rem; }
.cta-servicos-sub { font-size: 0.78rem; color: var(--muted); margin-top: 2px; }
.cta-servicos-arrow { color: #fbbf24; font-weight: 700; font-size: 1.1rem; }

/* Bank action tiles (Nubank/Inter) */
.caixa-bank-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 12px 0 8px;
}
.bank-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 8px;
    border-radius: var(--radius-md);
    background: rgba(15,23,42,.55);
    border: 1px solid rgba(251,191,36,.28);
    color: #fef3c7;
    font-weight: 700;
    font-size: 0.82rem;
    cursor: pointer;
    min-height: 88px;
}
.bank-tile:hover {
    background: rgba(245,158,11,.12);
    border-color: var(--accent-color);
}
.bank-tile-ico {
    width: 36px; height: 36px; border-radius: 50%;
    background: rgba(245,158,11,.18);
    display: flex; align-items: center; justify-content: center;
    color: #fbbf24;
}
.bank-tile.ghost {
    border-style: dashed;
    color: #e2e8f0;
}
.caixa-saldo-valor { font-variant-numeric: tabular-nums; }

/* Chat WA polish */
.chat-wa-layout {
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-elev);
}
.chat-thread-pane {
    background:
        radial-gradient(ellipse at top left, rgba(0,92,75,.12), transparent 55%),
        #0b141a;
}
/* .chat-msgs: regra única lá em cima (20260925e) */
.bubble.mine, .bubble.sent {
    background: var(--wa-green, #F5A623);
    color: var(--wa-green-text, #0b1220);
}
.bubble.theirs {
    background: #202c33;
    color: #e9edef;
}
.chat-form:not(.wa-composer) {
    display: flex;
    gap: 8px;
    align-items: center;
    background: #1f2c34;
    border-radius: 24px;
    padding: 6px 8px 6px 14px;
    border: 1px solid #2a3942;
}
.chat-form:not(.wa-composer) input {
    border: none !important;
    background: transparent !important;
    padding: 8px 0 !important;
}
.chat-form:not(.wa-composer) button {
    border-radius: 999px;
    padding: 10px 16px;
    min-width: 72px;
}
.chat-toolbar .btn-sm {
    border-radius: 999px;
    background: #1f2c34;
    border: 1px solid #2a3942;
}

/* Mapa — Google-like chrome */
.mapa-chrome {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}
.mapa-search-float {
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    z-index: 800;
    display: flex;
    gap: 8px;
    align-items: stretch;
    max-width: 520px;
}
.mapa-search-float input {
    flex: 1;
    padding: 12px 14px;
    border-radius: 999px;
    border: none;
    background: #1e293b;
    color: #f8fafc;
    box-shadow: 0 2px 12px rgba(0,0,0,.45);
    font-size: 0.92rem;
}
.mapa-search-float .btn-mapa {
    border-radius: 999px;
    box-shadow: 0 2px 12px rgba(0,0,0,.4);
    background: #1e293b;
}
.mapa-fab-col {
    position: absolute;
    right: 12px;
    bottom: 88px;
    z-index: 800;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.mapa-fab {
    width: 48px; height: 48px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: #1e293b;
    color: #f8fafc;
    box-shadow: 0 4px 14px rgba(0,0,0,.4);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    font-size: 1.1rem;
    padding: 0;
}
.mapa-fab.on, .mapa-fab:hover {
    background: var(--accent-color);
    color: #0f172a;
    border-color: transparent;
}
.mapa-sheet {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    z-index: 850;
    background: var(--card-bg);
    border-radius: 16px 16px 0 0;
    border: 1px solid var(--border);
    border-bottom: none;
    padding: 10px 14px calc(14px + env(safe-area-inset-bottom,0px));
    box-shadow: 0 -8px 28px rgba(0,0,0,.4);
    transform: translateY(110%);
    transition: transform .22s ease;
}
.mapa-sheet.open { transform: translateY(0); }
.mapa-sheet-handle {
    width: 40px; height: 4px; border-radius: 999px;
    background: #475569; margin: 0 auto 10px;
}
.mapa-sheet-actions {
    display: flex; flex-wrap: wrap; gap: 8px;
}
.mapa-sheet-actions .btn-mapa { flex: 1; min-width: 120px; }
body.mapa-page .mapa-canvas {
    border-radius: var(--radius-md);
    overflow: hidden;
    flex: 1;
    min-height: 320px;
}
.mapa-layout .mapa-toolbar { display: none; }

/* Admin ops console */
body.pagina-admin .container.wide { max-width: 1100px; }
body.pagina-admin .admin-badge-pill {
    background: rgba(245,158,11,.15);
    border: 1px solid rgba(245,158,11,.45);
    color: #fbbf24;
    letter-spacing: .06em;
    text-transform: uppercase;
    font-size: 0.68rem;
}
body.pagina-admin .admin-tabs {
    background: #0b1220;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 4px;
    gap: 4px;
}
body.pagina-admin .admin-tab {
    border-radius: 8px;
    font-weight: 600;
}
body.pagina-admin .admin-tab.on {
    background: rgba(245,158,11,.18);
    color: #fbbf24;
    border-color: transparent;
}
body.pagina-admin .kpi-card {
    background: #0f172a;
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
}

/* Serviços sheet — GetNinjas polish */
.servicos-mkt-cue {
    font-size: 0.85rem;
    color: var(--muted);
}
.svc-card {
    border-radius: 12px;
    padding: 12px 14px;
}
.svc-avatar {
    width: 46px; height: 46px;
    background: linear-gradient(145deg, #334155, #0f172a);
    border: 1px solid var(--copper);
    color: #fbbf24;
}
.svc-badge {
    background: rgba(184,115,51,.14);
    border-color: rgba(184,115,51,.4);
    color: #fdba74;
}
.svc-verificado {
    font-size: 0.68rem;
    color: #86efac;
    font-weight: 600;
}
.svc-negociar {
    border-radius: 8px !important;
    font-weight: 700 !important;
}

html[data-theme="light"] .cta-servicos {
    background: linear-gradient(120deg, #fff7ed, #fff);
    color: #0f172a;
}
html[data-theme="light"] .cta-servicos-title { color: #92400e; }
html[data-theme="light"] .bank-tile {
    background: #fff;
    color: #92400e;
}
html[data-theme="light"] .mapa-search-float input,
html[data-theme="light"] .mapa-fab {
    background: #fff;
    color: #0f172a;
}
html[data-theme="light"] .lote-preco { color: #b45309; }
html[data-theme="light"] .seg-minerio { background: #e2e8f0; }
html[data-theme="light"] .seg-minerio .fchip.on { background: #fff; color: #b45309; }

@media (max-width: 560px) {
    .caixa-bank-actions { grid-template-columns: repeat(3, 1fr); gap: 6px; }
    .bank-tile { min-height: 76px; padding: 10px 4px; font-size: 0.72rem; }
    .lote-cards { grid-template-columns: 1fr 1fr; gap: 8px; }
    .lote-img { height: 110px; }
    .mapa-search-float { left: 8px; right: 8px; top: 8px; }
}


/* Mapa chrome layout fix */
.mapa-layout {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 24px - env(safe-area-inset-bottom, 0px));
}
.mapa-chrome {
    position: relative;
    flex: 1 1 auto;
    min-height: 280px;
    display: flex;
    flex-direction: column;
}
.mapa-chrome .mapa-canvas {
    flex: 1 1 auto;
    min-height: 280px;
    height: 100%;
    width: 100%;
    border-radius: 12px;
    z-index: 1;
}
.mapa-search-float {
    position: absolute;
    top: 12px;
    left: 12px;
    right: 64px;
    z-index: 900;
    max-width: 480px;
}
.mapa-search-float .mapa-busca-results {
    top: calc(100% + 4px);
}
.mapa-fab-col { z-index: 900; }
.mapa-sheet { z-index: 950; }
.mapa-info {
    position: absolute;
    left: 12px;
    right: 72px;
    bottom: 96px;
    z-index: 880;
    max-width: 420px;
    margin: 0;
}
body.has-bottom-nav .mapa-layout {
    height: calc(100vh - 8px - 72px - env(safe-area-inset-bottom, 0px));
}


/* === 20260923ar — marketplace / bank / habit polish === */
.mkt-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.btn-anunciar {
  flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 10px 16px; border-radius: 999px;
  background: #f59e0b; color: #0f172a; font-weight: 800; font-size: .9rem;
  text-decoration: none; box-shadow: 0 4px 14px rgba(245,158,11,.35);
}
.btn-anunciar:hover { filter: brightness(1.05); }
.mkt-trust-row {
  display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px;
  font-size: 11px; color: #94a3b8;
}
.mkt-trust-row span {
  padding: 4px 10px; border-radius: 999px;
  background: rgba(148,163,184,.12); border: 1px solid rgba(148,163,184,.2);
}
.mkt-cat-rail {
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  margin: 8px 0 10px; padding-bottom: 2px;
}
.mkt-cat-rail .chip-filters { flex-wrap: nowrap; min-width: max-content; }
.lote-card-pro {
  display: flex; flex-direction: column;
  border: 1px solid rgba(148,163,184,.18);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
  transition: transform .15s ease, box-shadow .15s ease;
}
.lote-card-pro:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(0,0,0,.28);
}
.lote-trust-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0; }
.lote-trust {
  font-size: 11px; font-weight: 700; color: #34d399;
  background: rgba(52,211,153,.12); padding: 2px 8px; border-radius: 999px;
}
.lote-trust.soft { color: #94a3b8; background: rgba(148,163,184,.12); font-weight: 600; }
.lote-preco-consulta { opacity: .55; font-size: .95rem; }
.lote-card-actions {
  margin-top: auto; padding-top: 8px;
  position: sticky; bottom: 0;
  background: linear-gradient(180deg, transparent, var(--card-bg, #1e293b) 40%);
}
.btn-negociar-sticky {
  display: block; text-align: center; width: 100%;
  font-weight: 800; letter-spacing: .01em;
}
.empty-cta {
  text-align: center; padding: 22px 16px;
  border: 1px dashed rgba(148,163,184,.35); border-radius: 14px;
}
.empty-cta .btn-ok, .empty-cta a.btn-ok {
  display: inline-flex; margin-top: 10px; text-decoration: none;
}
.caixa-credito-status { margin-top: 8px; }
.cred-pill {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 600; color: #e2e8f0;
  padding: 5px 10px; border-radius: 999px;
  background: rgba(59,130,246,.15); border: 1px solid rgba(59,130,246,.3);
}
.cred-pill.aprovado, .cred-pill.pago { background: rgba(52,211,153,.15); border-color: rgba(52,211,153,.35); color: #6ee7b7; }
.cred-pill.analise { background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.35); color: #fbbf24; }
.cred-pill.rejeitado { background: rgba(248,113,113,.12); border-color: rgba(248,113,113,.35); color: #fca5a5; }
.contact-unread {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px;
  border-radius: 999px; background: #22c55e; color: #052e16;
  font-size: 11px; font-weight: 800; vertical-align: middle;
}
.chat-contact-item .contact-preview {
  color: #94a3b8; font-size: 12px; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
html[data-theme="light"] .mkt-trust-row span { background: #f1f5f9; color: #64748b; }
html[data-theme="light"] .lote-card-pro { box-shadow: 0 4px 14px rgba(15,23,42,.08); }
html[data-theme="light"] .btn-anunciar { box-shadow: 0 4px 12px rgba(245,158,11,.25); }

/* ===== FULL REBUILD pillars 20260923ar — Minera Pará ===== */
:root, html[data-theme="dark"] {
  --accent-color: #F5A623;
  --accent-hover: #d4890f;
  --bg-color: #0b1220;
}
.brand-logo { width: 56px !important; height: 56px !important; }
.brand-logo-lg { width: 112px !important; height: 112px !important; }
.brand-row h1, header.header-row h1, .auth-header h1 { font-size: 1.35rem; }

/* Round Voltar */
.btn-voltar-round {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-width: 88px; height: 40px; padding: 0 14px;
  border-radius: 999px; border: 1px solid var(--border);
  background: #1e293b; color: #f8fafc; font-weight: 700; font-size: 0.9rem;
  text-decoration: none; cursor: pointer;
}
.btn-voltar-round:hover { background: #334155; color: #fff; }
.btn-voltar-round .vb-ico { font-size: 1.05rem; line-height: 1; }

/* ===== OLX Marketplace ===== */
body.pagina-inicio { padding: 0 0 72px; }
body.pagina-inicio .container.wide { max-width: 640px; padding: 0; }
.olx-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px 8px; gap: 12px;
}
.olx-loc {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 0; color: #f8fafc; font-weight: 700;
  font-size: 0.98rem; cursor: pointer; padding: 4px 0;
}
.olx-loc .pin { color: var(--accent-color); font-size: 1.1rem; }
.olx-loc .chev { color: var(--muted); font-size: 0.75rem; margin-left: 2px; }
.olx-bell {
  width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--border);
  background: #1e293b; color: #f8fafc; display: inline-flex; align-items: center;
  justify-content: center; position: relative; cursor: pointer; font-size: 1.1rem;
}
.olx-bell .notif-badge {
  position: absolute; top: -2px; right: -2px; min-width: 18px; height: 18px;
  border-radius: 9px; background: #ef4444; color: #fff; font-size: 0.65rem;
  font-weight: 800; display: flex; align-items: center; justify-content: center;
  padding: 0 4px;
}
.olx-tabs {
  display: flex; gap: 0; overflow-x: auto; padding: 0 8px;
  border-bottom: 1px solid var(--border); scrollbar-width: none;
}
.olx-tabs::-webkit-scrollbar { display: none; }
.olx-tab {
  flex: 0 0 auto; appearance: none; border: 0; background: transparent;
  color: var(--muted); font-weight: 700; font-size: 0.92rem;
  padding: 12px 14px 10px; cursor: pointer; position: relative;
}
.olx-tab.on { color: var(--accent-color); }
.olx-tab.on::after {
  content: ''; position: absolute; left: 10px; right: 10px; bottom: 0;
  height: 3px; border-radius: 3px 3px 0 0; background: var(--accent-color);
}
.olx-search-wrap { padding: 12px 16px 8px; }
.olx-search {
  width: 100%; height: 44px; border-radius: 22px; border: 1px solid var(--border);
  background: #111827; color: #f8fafc; padding: 0 16px 0 42px;
  font-size: 0.95rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%2394a3b8' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 14h-.79l-.28-.27A6.47 6.47 0 0016 9.5 6.5 6.5 0 109.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 14px center;
}
.olx-quick {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;
  padding: 8px 16px 12px;
}
.olx-qcard {
  aspect-ratio: 1; border-radius: 16px; border: 1px solid transparent;
  background: transparent; color: #e8eef7; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 8px; text-decoration: none;
  font-size: 0.72rem; font-weight: 700; cursor: pointer; padding: 8px 4px 10px;
  position: relative; overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.olx-qcard::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  opacity: .95;
}
.olx-qcard .qi-wrap {
  position: relative; z-index: 1;
  width: 44px; height: 44px; border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 6px 16px rgba(0,0,0,.25);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.olx-qcard .qi-svg { width: 22px; height: 22px; display: block; }
.olx-qcard .qi { font-size: 1.35rem; line-height: 1; color: var(--accent-color); position: relative; z-index: 1; }
.olx-qcard > :not(::before) { position: relative; z-index: 1; }
/* Favoritos — coração / calor */
.olx-qcard.q-fav { color: #fecaca; border-color: rgba(248,113,113,.28); }
.olx-qcard.q-fav::before {
  background:
    radial-gradient(120% 90% at 30% 20%, rgba(248,113,113,.35), transparent 55%),
    linear-gradient(160deg, rgba(127,29,29,.35), rgba(15,23,42,.15));
}
.olx-qcard.q-fav .qi-wrap { color: #fb7185; background: rgba(248,113,113,.16); border-color: rgba(251,113,133,.35); }
/* Mapa — território / azul-teal */
.olx-qcard.q-mapa { color: #bae6fd; border-color: rgba(56,189,248,.28); }
.olx-qcard.q-mapa::before {
  background:
    radial-gradient(120% 90% at 70% 15%, rgba(56,189,248,.38), transparent 55%),
    linear-gradient(160deg, rgba(12,74,110,.4), rgba(15,23,42,.12));
}
.olx-qcard.q-mapa .qi-wrap { color: #38bdf8; background: rgba(56,189,248,.14); border-color: rgba(56,189,248,.35); }
/* Serviços — ferramenta / âmbar */
.olx-qcard.q-serv { color: #fde68a; border-color: rgba(245,166,35,.32); }
.olx-qcard.q-serv::before {
  background:
    radial-gradient(120% 90% at 40% 10%, rgba(245,166,35,.4), transparent 55%),
    linear-gradient(160deg, rgba(120,53,15,.38), rgba(15,23,42,.12));
}
.olx-qcard.q-serv .qi-wrap { color: #F5A623; background: rgba(245,166,35,.16); border-color: rgba(245,166,35,.4); }
/* Banco — confiança / ouro-vidro */
.olx-qcard.q-banco { color: #fef3c7; border-color: rgba(251,191,36,.3); }
.olx-qcard.q-banco::before {
  background:
    radial-gradient(120% 90% at 60% 20%, rgba(251,191,36,.36), transparent 55%),
    linear-gradient(160deg, rgba(66,32,6,.42), rgba(15,23,42,.14));
}
.olx-qcard.q-banco .qi-wrap { color: #fbbf24; background: rgba(251,191,36,.14); border-color: rgba(251,191,36,.38); }
/* Maquinário — aço / slate-teal */
.olx-qcard.q-maq { color: #c7d2fe; border-color: rgba(129,140,248,.32); }
.olx-qcard.q-maq::before {
  background:
    radial-gradient(120% 90% at 35% 15%, rgba(99,102,241,.38), transparent 55%),
    linear-gradient(160deg, rgba(30,41,59,.5), rgba(15,23,42,.14));
}
.olx-qcard.q-maq .qi-wrap { color: #818cf8; background: rgba(99,102,241,.16); border-color: rgba(129,140,248,.4); }
.olx-qcard:active { transform: scale(.97); }
.olx-banner {
  margin: 0 16px 12px; border-radius: 14px; overflow: hidden;
  aspect-ratio: 16 / 6;
  width: calc(100% - 32px);
  max-height: none;
  height: auto;
  flex-shrink: 0;
  background: linear-gradient(135deg,#1e293b,#0b1220 60%,#F5A62333);
  border: 1px solid var(--border); position: relative;
}
.olx-banner-track {
  position: absolute; inset: 0;
  display: flex; width: 100%; height: 100%;
  transition: transform .35s ease; touch-action: pan-y;
}
.olx-banner-slide {
  min-width: 100%; height: 100%; display: flex; flex-direction: column;
  justify-content: center; padding: 16px 20px; box-sizing: border-box;
}
.olx-banner-slide strong { font-size: 1.05rem; color: #fff; }
.olx-banner-slide span { color: var(--muted); font-size: 0.82rem; margin-top: 4px; }
.olx-promo {
  margin: 0 16px 14px; padding: 10px 14px; border-radius: 12px;
  background: rgba(245,166,35,.12); border: 1px solid rgba(245,166,35,.35);
  color: #fde68a; font-size: 0.82rem; font-weight: 600;
}
.olx-feed {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
  padding: 0 16px 88px;
}
.olx-card {
  background: #1e293b; border: 1px solid var(--border-subtle); border-radius: 12px;
  overflow: hidden; cursor: pointer; text-decoration: none; color: inherit;
  display: flex; flex-direction: column; min-width: 0;
}
.olx-card-photo {
  position: relative; aspect-ratio: 16/9; background: #0f172a; overflow: hidden;
}
.olx-card-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.olx-card-photo .ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.olx-heart {
  position: absolute; top: 8px; right: 8px; width: 32px; height: 32px;
  border-radius: 50%; border: 0; background: rgba(15,23,42,.55); color: #fff;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  font-size: 0.95rem; backdrop-filter: blur(4px);
}
.olx-heart.on { color: #ef4444; }
.olx-card-body { padding: 8px 10px 12px; display: flex; flex-direction: column; gap: 4px; }
.olx-card-title {
  font-size: 0.82rem; font-weight: 600; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; min-height: 2.5em;
}
.olx-card-price { font-size: 0.98rem; font-weight: 800; color: #fff; }
.olx-card-loc { font-size: 0.72rem; color: var(--muted); }
.olx-chip {
  display: inline-flex; align-self: flex-start; margin-top: 4px;
  font-size: 0.65rem; font-weight: 700; padding: 2px 8px; border-radius: 999px;
  background: rgba(74,222,128,.15); color: #4ade80;
}
.olx-chip.transit { background: rgba(245,166,35,.18); color: #F5A623; }
.olx-chip.sold { background: rgba(148,163,184,.18); color: #94a3b8; }
.olx-empty {
  grid-column: 1 / -1; border: 2px dashed var(--border); border-radius: 16px;
  padding: 28px 16px; text-align: center; color: var(--muted);
}
.olx-fab {
  position: fixed;
  right: max(14px, env(safe-area-inset-right, 0px));
  bottom: calc(78px + env(safe-area-inset-bottom, 0px));
  z-index: 55; /* primary CTA; Fale stays left at z-index 50 */
  width: 56px; height: 56px; border-radius: 50%; border: 0;
  background: #F5A623; color: #0b1220; font-size: 1.75rem; font-weight: 800;
  box-shadow: 0 8px 24px rgba(245,166,35,.45); cursor: pointer;
  display: flex; align-items: center; justify-content: center; text-decoration: none;
}
@media (max-width: 420px) {
  .olx-fab { width: 52px; height: 52px; font-size: 1.6rem; }
}
body.pagina-inicio #app-nav { display: none !important; }
body.pagina-inicio .header-row { display: none !important; }

/* ===== WhatsApp Chat ===== */
body.pagina-chat { padding: 0 0 72px; }
body.pagina-chat .container.wide { max-width: 720px; padding: 0; }
body.pagina-chat #app-nav,
body.pagina-chat .header-row { display: none !important; }
.wa-list-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px 4px;
}
.wa-circ-btn {
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border);
  background: #1e293b; color: #f8fafc; font-size: 1.1rem; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.wa-circ-btn.accent { background: #F5A623; color: #0b1220; border-color: transparent; }
.wa-head-right { display: flex; gap: 8px; }
.wa-title { font-size: 1.75rem; font-weight: 800; padding: 2px 16px 10px; letter-spacing: -0.02em; }
.wa-search {
  margin: 0 16px 10px; height: 40px; border-radius: 20px; border: 0;
  background: #1e293b; color: #f8fafc; padding: 0 14px; width: calc(100% - 32px);
  font-size: 0.95rem;
}
.wa-chips {
  display: flex; gap: 8px; overflow-x: auto; padding: 0 16px 10px; scrollbar-width: none;
}
.wa-chip {
  flex: 0 0 auto; border-radius: 999px; border: 0; padding: 7px 14px;
  background: #1e293b; color: #cbd5e1; font-weight: 700; font-size: 0.8rem; cursor: pointer;
}
.wa-chip.on { background: #F5A623; color: #0b1220; }
.wa-archived {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  color: var(--muted); font-weight: 600; font-size: 0.9rem; cursor: pointer;
  border-bottom: 1px solid var(--border-subtle);
}
.wa-row {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  border-bottom: 1px solid rgba(51,65,85,.45); cursor: pointer;
}
.wa-row:active { background: rgba(30,41,59,.6); }
.wa-av {
  width: 56px; height: 56px; border-radius: 50%; background: #334155;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; color: #F5A623; flex-shrink: 0; font-size: 1.05rem;
}
.wa-row-mid { flex: 1; min-width: 0; }
.wa-row-name { font-weight: 700; font-size: 0.98rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-row-prev { color: var(--muted); font-size: 0.82rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.wa-row-right { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; }
.wa-row-time { font-size: 0.72rem; color: var(--muted); }
.wa-unread {
  min-width: 20px; height: 20px; border-radius: 10px; background: #F5A623; color: #0b1220;
  font-size: 0.7rem; font-weight: 800; display: flex; align-items: center; justify-content: center; padding: 0 5px;
}
.wa-thread-head {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  background: #111827; border-bottom: 1px solid var(--border); position: sticky; top: 0; z-index: 5;
}
.wa-thread-info { flex: 1; min-width: 0; }
.wa-thread-info strong { display: block; font-size: 0.98rem; }
.wa-thread-info .sub { font-size: 0.75rem; color: var(--muted); }
.wa-call-btns { display: flex; gap: 6px; }
/* .chat-msgs: regra única lá em cima (20260925e) */
.bubble.mine, .bubble.sent {
  background: var(--accent-color, #F5A623) !important;
  color: #0b1220 !important;
  margin-left: auto;
  --wa-green: #F5A623;
  --wa-green-text: #0b1220;
}
.bubble.mine .bubble-text,
.bubble.mine .bubble-meta,
.bubble.mine .bubble-status,
.bubble.sent .bubble-text,
.bubble.sent .bubble-meta,
.bubble.sent .bubble-status { color: #0b1220 !important; }
.bubble.theirs { background: #1e293b !important; color: #f8fafc !important; margin-right: auto; }
.bubble.theirs .bubble-status { color: #86efac !important; }
.wa-day-div {
  text-align: center; margin: 12px 0; font-size: 0.72rem; font-weight: 700;
  color: var(--muted);
}
.wa-day-div span {
  background: rgba(30,41,59,.9); padding: 4px 12px; border-radius: 8px;
  border: 1px solid var(--border-subtle);
}
.wa-composer {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px 12px;
  background: #0b1220; position: sticky; bottom: 0; z-index: 6;
}
.wa-comp-btn {
  width: 40px; height: 40px; border-radius: 50%; border: 0; background: #1e293b;
  color: #f8fafc; font-size: 1.2rem; cursor: pointer; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.wa-comp-btn.mic { background: #F5A623; color: #0b1220; }
.wa-comp-input {
  flex: 1; height: 42px; border-radius: 21px; border: 1px solid var(--border);
  background: #111827; color: #f8fafc; padding: 0 14px; font-size: 0.95rem; min-width: 0;
}
.wa-attach-sheet .chat-msg-sheet-panel { padding-bottom: 24px; }
.wa-attach-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 8px 4px 16px;
}
.wa-attach-item {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  background: transparent; border: 0; color: #e2e8f0; cursor: pointer; font-size: 0.75rem; font-weight: 600;
}
.wa-attach-item .ai {
  width: 52px; height: 52px; border-radius: 16px; background: #1e293b;
  display: flex; align-items: center; justify-content: center; font-size: 1.35rem;
  border: 1px solid var(--border);
}
.wa-rec-overlay {
  position: absolute; left: 0; right: 0; bottom: 60px; background: #111827;
  padding: 12px 16px; display: flex; align-items: center; gap: 12px;
  border-top: 1px solid var(--border); z-index: 8;
}

/* ===== Nubank Bank (base; glass overrides below) ===== */
body.pagina-financeiro { padding: 0 0 88px; background: #0b1220; }
body.pagina-financeiro .container.wide { max-width: 480px; padding: 0; }
body.pagina-financeiro #app-nav,
body.pagina-financeiro > .container > .header-row { display: none !important; }
.nb-strip {
  background: transparent;
  padding: 14px 16px 28px; color: #f8fafc;
}
.nb-strip-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
}
.nb-strip-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1;
}
.nb-av {
  flex: 0 0 auto;
  width: 44px; height: 44px; border-radius: 50%;
  background: rgba(245,166,35,.22);
  border: 1px solid rgba(245,166,35,.45);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 0.92rem; color: #fde68a;
  letter-spacing: 0.02em;
}
.nb-hello {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nb-strip-right { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.nb-ico-btn {
  width: 40px; height: 40px; border-radius: 50%; border: 0;
  background: rgba(255,255,255,.10);
  color: #fde68a;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  touch-action: manipulation;
}
.nb-ico-btn:active { transform: scale(.96); }
.nb-ico-svg { width: 20px; height: 20px; display: block; }
.nb-shortcut { display: none !important; }
.nb-body { margin-top: -16px; padding: 0 16px 24px; }
.nb-saldo {
  background: rgba(15, 23, 42, 0.45); border-radius: 16px; padding: 16px; color: #fff;
  border: 1px solid rgba(255,255,255,0.12);
}
.nb-saldo-label { display: flex; align-items: center; gap: 6px; color: #a1a1aa; font-size: 0.88rem; font-weight: 600; }
.nb-saldo-valor { font-size: 1.6rem; font-weight: 800; margin: 8px 0 6px; }
.nb-yield {
  display: inline-flex; padding: 4px 10px; border-radius: 999px;
  background: rgba(245,166,35,.18); color: #F5A623; font-size: 0.72rem; font-weight: 700;
}
.nb-circles {
  display: flex; justify-content: space-between; gap: 6px; margin: 18px 0 14px; overflow-x: auto;
}
.nb-circle {
  flex: 1; min-width: 64px; display: flex; flex-direction: column; align-items: center; gap: 8px;
  background: transparent; border: 0; color: #e2e8f0; cursor: pointer; padding: 0; font-size: 0.68rem; font-weight: 700;
  position: relative;
}
.nb-circle .nci {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(30, 41, 59, 0.35); border: 1px solid rgba(255,255,255,0.14);
  display: flex; align-items: center; justify-content: center; font-size: 1.25rem; color: #F5A623;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.nb-circle .nci-svg {
  width: 26px; height: 26px; display: block; color: #F5A623;
}
.nb-circle:active .nci { transform: scale(.94); }
.nb-badge-novo {
  position: absolute; top: -2px; right: 4px; background: #F5A623; color: #0b1220;
  font-size: 0.58rem; font-weight: 800; padding: 2px 5px; border-radius: 6px;
}
.nb-card {
  background: rgba(30, 41, 59, 0.4); border-radius: 14px; padding: 14px 16px; margin-bottom: 12px;
  border: 1px solid rgba(255,255,255,0.1); color: #f8fafc;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
}
.nb-card-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.nb-list-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0; border-bottom: 1px solid rgba(51,65,85,.5); color: #e2e8f0;
  text-decoration: none; font-weight: 600; font-size: 0.92rem; cursor: pointer; background: transparent; border-left: 0; border-right: 0; border-top: 0; width: 100%; text-align: left;
}
.nb-list-item:last-child { border-bottom: 0; }
.nb-list-item .chev { color: var(--muted); }
.nb-dock {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 78px; z-index: 35;
  background: #F5A623; color: #0b1220; border-radius: 999px; padding: 10px 18px;
  font-weight: 800; font-size: 0.82rem; border: 0; box-shadow: 0 8px 24px rgba(245,166,35,.4);
  display: flex; gap: 14px; align-items: center; cursor: pointer;
}
.nb-view { display: none; }
.nb-view.on { display: block; }
.nb-inner-head {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px;
  position: sticky; top: 0; background: #0b1220; z-index: 5; border-bottom: 1px solid var(--border);
}
.nb-inner-head h2 { font-size: 1.15rem; font-weight: 800; flex: 1; }
.nb-inner-body { padding: 16px; }
.emp-opt-card {
  background: #1e293b; border: 1px solid var(--border); border-radius: 14px;
  padding: 14px; margin-bottom: 12px;
}
.emp-opt-card h3 { font-size: 1rem; margin-bottom: 6px; }
.emp-opt-card .rate { color: #F5A623; font-weight: 800; font-size: 0.9rem; }
.emp-chance-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 14px 0; }
.emp-chance {
  background: #111827; border: 1px solid var(--border); border-radius: 12px; padding: 12px;
  font-size: 0.82rem; color: var(--muted);
}
.mapa-native-card {
  margin: 24px 16px; padding: 28px 20px; text-align: center;
  background: #1e293b; border-radius: 16px; border: 1px solid var(--border);
}
.mapa-native-card h2 { border: 0; margin-bottom: 8px; }
.mapa-native-cta {
  display: inline-flex; margin-top: 16px; padding: 14px 22px; border-radius: 999px;
  background: #F5A623; color: #0b1220; font-weight: 800; text-decoration: none; border: 0; cursor: pointer;
}
.bubble-doc { display:flex; align-items:center; gap:10px; padding:8px; border-radius:10px; background:rgba(0,0,0,.12); }
.bubble-doc-ico { font-size:1.6rem; }
.bubble-doc-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.wa-wave { font-size:0.75rem; letter-spacing:1px; opacity:.75; margin-bottom:4px; font-family:monospace; }
.wa-row { width:100%; appearance:none; background:transparent; border:0; text-align:left; color:inherit; }
.chat-contact-item.wa-row.on { background:rgba(245,166,35,.08); }

/* Aliases (product / QA): own/sent bubbles must be orange #F5A623 */
.msg-sent, .bubble-own {
  background: var(--accent-color, #F5A623) !important;
  color: #0b1220 !important;
  margin-left: auto;
}
.msg-sent .bubble-text, .msg-sent .bubble-meta, .msg-sent .bubble-status,
.bubble-own .bubble-text, .bubble-own .bubble-meta, .bubble-own .bubble-status {
  color: #0b1220 !important;
}


/* ---- Welcome before login (20260923ar) ---- */
.welcome-card h2 { margin-top: 0; color: var(--accent, #F5A623); }
.welcome-card p { color: var(--muted, #94a3b8); line-height: 1.45; }
.welcome-card .btn-ok { width: 100%; margin-top: 8px; }

/* ---- Minera Bank indisponível ---- */
.bank-indisponivel {
  position: fixed; inset: 0; z-index: 200;
  display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(5, 10, 20, 0.92);
}
.bank-indisponivel.oculto { display: none !important; }
.bank-indisponivel-card {
  max-width: 420px; width: 100%;
  background: var(--card, #1e293b); border-radius: 16px;
  padding: 24px; box-shadow: 0 12px 40px rgba(0,0,0,.45);
}
.bank-indisponivel-card h2 { margin-top: 0; color: #F5A623; font-size: 1.25rem; }
.bank-indisponivel-card p { color: var(--muted, #94a3b8); line-height: 1.5; }
.bank-indisponivel-card .btn-ok { width: 100%; margin-top: 12px; }

/* ---- Admin Grok drawer ---- */
.btn-grok-bot {
  position: fixed; right: 16px; bottom: 88px; z-index: 120;
  background: #F5A623; color: #0b1220; border: 0; border-radius: 999px;
  padding: 12px 18px; font-weight: 700; box-shadow: 0 6px 20px rgba(245,166,35,.35);
  cursor: pointer;
}
.btn-grok-bot:hover { filter: brightness(1.05); }
.grok-drawer {
  position: fixed; inset: 0; z-index: 180;
  background: rgba(0,0,0,.55); display: flex; justify-content: flex-end;
}
.grok-drawer.oculto { display: none !important; }
.grok-drawer-panel {
  width: min(420px, 100%); height: 100%; overflow: auto;
  background: var(--card, #0f172a); padding: 16px 18px 32px;
  box-shadow: -8px 0 28px rgba(0,0,0,.4);
}
.grok-drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.grok-drawer-head h2 { margin: 0; font-size: 1.15rem; }
.grok-history { display: flex; flex-direction: column; gap: 10px; margin-top: 8px; }
.grok-hist-item {
  background: rgba(255,255,255,.04); border-radius: 10px; padding: 10px;
}
.grok-hist-item pre {
  white-space: pre-wrap; margin: 6px 0 0; font-family: inherit; font-size: .9rem;
}
.olx-banner-img { max-height: 48px; width: auto; border-radius: 8px; margin-bottom: 6px; display: block; }
.olx-banner-slide--full { padding: 0; position: relative; min-height: 0; height: 100%; }
.olx-banner-fullimg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  /* contain: nunca corta. Arte 16:6 (letterbox no upload) preenche a moldura. */
  object-fit: contain !important;
  object-position: center center;
  display: block; border: 0; background: #0b1220;
}
.olx-banner a.olx-banner-slide { text-decoration: none; color: inherit; }
.olx-banner-dots {
  position: absolute; left: 0; right: 0; bottom: 8px;
  display: flex; justify-content: center; gap: 6px; z-index: 2;
  pointer-events: none;
}
.olx-banner-dots .olx-banner-dot {
  pointer-events: auto;
  width: 8px; height: 8px; border-radius: 50%; border: 0; padding: 0;
  background: rgba(255,255,255,.45); cursor: pointer;
  box-shadow: 0 1px 3px rgba(0,0,0,.35);
}
.olx-banner-dots .olx-banner-dot.on {
  background: #F5A623; transform: scale(1.15);
}
.olx-banner-track { touch-action: pan-y; }
.admin-log-list { margin: 0; padding-left: 18px; }
.promo-form { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }


/* ===== Minera Bank glassmorphism 20260923ar ===== */
body.pagina-financeiro {
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(245,166,35,0.22), transparent 55%),
    radial-gradient(900px 500px at 100% 0%, rgba(56, 120, 200, 0.28), transparent 50%),
    linear-gradient(165deg, #07111f 0%, #0f1b33 42%, #1a2744 72%, #2a1f14 100%) !important;
  min-height: 100vh;
}
body.pagina-financeiro #card-caixa.caixa-bank-card,
body.pagina-financeiro .caixa-bank-card {
  background: rgba(15, 23, 42, 0.28) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 20px 50px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
  overflow: hidden;
}
body.pagina-financeiro .nb-strip {
  background: linear-gradient(135deg, rgba(15,23,42,0.35) 0%, rgba(245,166,35,0.18) 55%, rgba(15,23,42,0.25) 100%) !important;
  color: #f8fafc !important;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
body.pagina-financeiro .nb-av {
  background: rgba(245,166,35,0.22) !important;
  color: #fde68a !important;
  border: 1px solid rgba(245,166,35,0.5) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12);
}
body.pagina-financeiro .nb-ico-btn {
  background: rgba(255,255,255,0.10) !important;
  color: #fde68a !important;
  border: 1px solid rgba(255,255,255,0.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12);
}
body.pagina-financeiro .nb-hello {
  color: #fff;
  text-shadow: 0 2px 12px rgba(0,0,0,0.25);
  margin-top: 0 !important;
}
body.pagina-financeiro .nb-saldo {
  background: linear-gradient(145deg, rgba(15,23,42,0.55), rgba(30,41,59,0.35)) !important;
  border: 1px solid rgba(245,166,35,0.22) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.1);
  backdrop-filter: blur(20px) saturate(1.25);
  -webkit-backdrop-filter: blur(20px) saturate(1.25);
  color: #fff !important;
}
body.pagina-financeiro .nb-saldo-label { color: rgba(226,232,240,0.85) !important; }
body.pagina-financeiro .nb-saldo-valor {
  background: linear-gradient(90deg, #fff 0%, #fde68a 100%);
  -webkit-background-clip: text; background-clip: text;
  color: transparent; /* soft amber sheen, not flat black */
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.35));
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
  body.pagina-financeiro .nb-saldo-valor { color: #fff !important; background: none; }
}
body.pagina-financeiro .nb-circle .nci {
  background: linear-gradient(160deg, rgba(255,255,255,0.16), rgba(15,23,42,0.35)) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.2);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
body.pagina-financeiro .nb-card,
body.pagina-financeiro .emp-opt-card {
  background: rgba(15, 23, 42, 0.38) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,0.22);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
body.pagina-financeiro .nb-inner-head {
  background: rgba(11, 18, 32, 0.55) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
body.pagina-financeiro .caixa-lock-panel {
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 16px;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.35);
}
body.pagina-financeiro .nb-dock {
  background: linear-gradient(135deg, rgba(245,166,35,0.95), rgba(196,125,18,0.9)) !important;
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 28px rgba(245,166,35,0.35), inset 0 1px 0 rgba(255,255,255,0.35);
}
body.pagina-financeiro .olx-banner {
  border-radius: 14px; overflow: hidden;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(15,23,42,0.35);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
body.pagina-financeiro .bank-indisponivel-card {
  background: rgba(15,23,42,0.65) !important;
  border: 1px solid rgba(255,255,255,0.14);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
html[data-theme="light"] body.pagina-financeiro {
  background:
    radial-gradient(1000px 500px at 0% 0%, rgba(245,166,35,0.2), transparent 55%),
    linear-gradient(165deg, #e8eef8 0%, #d9e4f5 50%, #f5e6c8 100%) !important;
}
html[data-theme="light"] body.pagina-financeiro .nb-strip,
html[data-theme="light"] body.pagina-financeiro .nb-saldo,
html[data-theme="light"] body.pagina-financeiro .nb-card {
  color: #0f172a;
}

/* ===== 20260923ar/i — Fale/FAB clear + WA chat mobile shell ===== */
:root { --kb-inset: 0px; --composer-h: 58px; }

.wa-row { min-height: 72px; box-sizing: border-box; }
.wa-av { width: 56px; height: 56px; }

/* Composer: WA order, compact circles (no min-width blow-up) */
.wa-composer.chat-form {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  margin: 0;
  border-radius: 0;
  border: 0;
  border-top: 1px solid var(--border, #334155);
  background: #0b1220;
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
}
.wa-composer .wa-comp-btn,
.wa-composer.chat-form .wa-comp-btn {
  width: 40px;
  height: 40px;
  min-width: 40px !important;
  max-width: 40px;
  padding: 0 !important;
  border-radius: 50% !important;
  flex-shrink: 0;
}
.wa-composer .wa-comp-pill {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  height: 40px;
  max-height: 120px;
  border-radius: 20px;
  background: #111827;
  border: 1px solid var(--border);
  padding: 0 2px 0 0;
  box-sizing: border-box;
}
.wa-composer .wa-comp-pill .wa-comp-input {
  flex: 1;
  min-width: 0;
  height: 100%;
  max-height: 120px;
  border-radius: 20px;
  padding: 8px 6px 8px 14px !important;
  border: 0 !important;
  background: transparent !important;
  color: #f8fafc;
  font-size: 16px; /* iOS: avoid zoom */
  outline: none;
  box-shadow: none !important;
}
.wa-composer .wa-comp-in-emoji {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 1.2rem;
  flex-shrink: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  padding: 0;
  line-height: 1;
}
.wa-composer .wa-comp-in-emoji:active { opacity: 0.7; }
.wa-composer .wa-comp-cam,
.wa-composer .wa-comp-plus {
  background: transparent;
  color: #e2e8f0;
  font-size: 1.35rem;
}
.wa-composer .wa-comp-btn.mic {
  background: #25D366;
  color: #fff;
  width: 48px;
  height: 48px;
  min-width: 48px !important;
  max-width: 48px;
  font-size: 1.25rem;
}
#btn-chat-enviar.wa-comp-btn.mic {
  font-size: 1.15rem;
}
.wa-composer .wa-comp-btn.send,
#btn-chat-enviar.wa-comp-btn.send {
  background: #25D366;
  color: #fff;
  width: 48px;
  height: 48px;
  min-width: 48px !important;
  max-width: 48px;
  font-size: 1.15rem;
}
/* Câmera só no sheet Anexar (+); mic + enviar sempre na barra */


.wa-attach-sheet .chat-msg-sheet-panel {
  padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  max-height: min(70vh, 520px);
  overflow-y: auto;
  width: min(100%, 420px);
  margin: 0 auto;
}
@media (max-width: 420px) {
  .wa-attach-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .wa-attach-item .ai { width: 48px; height: 48px; font-size: 1.25rem; }
}

/* Mobile-first chat viewport (390×844 / 360–412) */
@media (max-width: 800px) {
  body.pagina-chat {
    height: 100%;
    max-width: 100vw;
    overflow: hidden;
    padding-bottom: 0;
  }
  body.pagina-chat.has-bottom-nav:not(.chat-thread-open) {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }
  body.pagina-chat .container.wide {
    max-width: 100%;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
  }
  .chat-wa-layout {
    display: flex;
    flex-direction: column;
    height: 100dvh;
    max-height: 100dvh;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body.pagina-chat.has-bottom-nav:not(.chat-thread-open) .chat-wa-layout {
    height: calc(100dvh - 72px - env(safe-area-inset-bottom, 0px));
    max-height: calc(100dvh - 72px - env(safe-area-inset-bottom, 0px));
  }
  body.pagina-chat.chat-thread-open .chat-wa-layout {
    height: 100dvh;
    max-height: 100dvh;
  }
  .chat-contacts-pane,
  .chat-thread-pane {
    flex: 1;
    min-height: 0;
    height: 100%;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
  }
  .chat-contatos-list { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; }
  .chat-thread-active {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    height: 100%;
  }
  .wa-thread-head.chat-thread-head {
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 5;
    padding-top: max(8px, env(safe-area-inset-top, 0px));
  }
  .chat-thread-pane .chat-msgs {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 10px;
    padding-bottom: calc(var(--composer-h, 58px) + 12px);
  }
  /* Composer stuck above keyboard via --kb-inset from visualViewport */
  .wa-composer.chat-form {
    position: fixed;
    left: 0;
    right: 0;
    bottom: var(--kb-inset, 0px);
    z-index: 40;
    width: 100%;
    max-width: 100vw;
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  }
  body.pagina-chat.chat-thread-open .wa-composer.chat-form {
    /* no bottom-nav under thread */
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  }
  .wa-rec-overlay,
  .chat-rec-bar.wa-rec-overlay {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(var(--composer-h, 58px) + var(--kb-inset, 0px));
    z-index: 41;
  }
  .chat-reply-bar,
  .chat-media-preview,
  .chat-agendar-row {
    position: relative;
    z-index: 6;
    margin: 0 8px 6px;
  }
  .chat-msg-sheet {
    z-index: 1200;
  }
}

@media (min-width: 801px) {
  .wa-composer.chat-form {
    position: sticky;
    bottom: 0;
  }
}

/* ===== 20260923ar — WA composer pixel order + Conversas list ===== */
/* Structure: + | pill[input… emoji] | camera | mic/send */
.wa-composer.chat-form {
  align-items: center;
  gap: 4px;
  padding: 6px 6px calc(6px + env(safe-area-inset-bottom, 0px));
}
.wa-composer .wa-comp-btn.wa-comp-plus,
.wa-composer .wa-comp-btn.wa-comp-cam {
  width: 40px;
  height: 40px;
  min-width: 40px !important;
  background: transparent !important;
  border: 0 !important;
  color: #f1f5f9;
}
.wa-composer .wa-comp-btn.mic {
  box-shadow: 0 2px 8px rgba(37, 211, 102, 0.35);
}
.wa-unread {
  background: #25D366;
  color: #fff;
}
.wa-chip.on {
  background: #25D366;
  color: #fff;
}
.wa-row-name { font-weight: 700; }
.wa-list-head { padding: 10px 14px 2px; }
.chat-contacts-pane {
  background: #000;
}
body.pagina-chat .chat-contacts-pane {
  background: #0b1220;
}
@media (max-width: 800px) {
  .wa-composer.chat-form {
    gap: 2px;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  }
  .wa-composer .wa-comp-pill { height: 42px; border-radius: 21px; }
  .wa-composer .wa-comp-btn.mic {
    width: 48px; height: 48px; min-width: 48px !important; max-width: 48px;
  }
  .wa-title { font-size: 1.85rem; }
  .wa-search { border-radius: 22px; height: 42px; }
  .wa-av { width: 56px; height: 56px; }
  .wa-row { padding: 10px 14px; gap: 14px; }
}

/* ===== 20260923ar — Slim WA iOS thread header (no roles, call pill) ===== */
/* ===== 20260923ar — Perfil mobile + share WA + audio harden ===== */
.wa-thread-head.chat-thread-head {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 56px;
  height: 56px;
  padding: 0 8px 0 4px;
  margin: 0;
  background: #0b0b0b;
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-sizing: border-box;
}
.wa-back-chev.chat-back {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 36px;
  width: auto;
  height: 40px;
  padding: 0 4px;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  color: #fff;
  font-weight: 400;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow: none;
}
.wa-back-chev .wa-back-ico {
  font-size: 1.85rem;
  line-height: 1;
  font-weight: 300;
  transform: translateY(-1px);
}
.wa-back-chev .wa-back-unread {
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  min-width: 0.9em;
}
.wa-back-chev .wa-back-unread.oculto { display: none; }
.wa-av.wa-av-thread,
.wa-thread-head .wa-av {
  width: 36px !important;
  height: 36px !important;
  font-size: 0.82rem !important;
  flex-shrink: 0;
}
.wa-thread-info.chat-thread-head-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
}
.wa-thread-info .wa-thread-name,
.wa-thread-info strong#chat-com-nome {
  display: block;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #f8fafc;
}
/* Roles never expand header height */
#chat-com-papel,
.wa-thread-info .wa-thread-papel,
.wa-thread-info .sub {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.wa-call-btns.chat-thread-head-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  margin-left: auto;
}
.wa-call-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(60, 60, 67, 0.72);
  border: 1px solid rgba(255,255,255,.08);
}
.wa-call-pill .wa-call-ico {
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: #f8fafc;
  font-size: 1.05rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  border-radius: 50%;
}
.wa-call-pill .wa-call-ico:active { opacity: 0.65; }
.wa-menu-btn {
  width: 36px;
  height: 36px;
  border: 0;
  background: transparent;
  color: #f8fafc;
  font-size: 1.25rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 50%;
  line-height: 1;
}
.wa-menu-btn:active { opacity: 0.65; }

/* Bubble chrome: less stacked name+full timestamp */
.bubble .bubble-meta {
  font-size: 0.72rem;
  font-weight: 700;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bubble .bubble-status {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  font-size: 0.68rem;
  margin-top: 2px;
}
.bubble .bubble-clock {
  opacity: 0.75;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 800px) {
  .wa-back-chev.chat-back { display: inline-flex; }
  .wa-thread-head.chat-thread-head {
    height: auto;
    min-height: 56px;
    padding-top: max(4px, env(safe-area-inset-top, 0px));
    padding-bottom: 6px;
    padding-left: 2px;
    padding-right: 6px;
  }
}
@media (min-width: 801px) {
  .wa-thread-head.chat-thread-head { padding-left: 10px; }
}


/* ===== 20260923ar — Perfil mobile shell + Compartilhar WA ===== */
body.pagina-perfil {
  padding: 0 0 88px;
  background: #0b1220;
}
body.pagina-perfil .container.wide {
  max-width: 480px;
  padding: 12px 12px 24px;
  margin: 0 auto;
}
body.pagina-perfil #app-nav,
body.pagina-perfil > .container > .header-row {
  display: none !important;
}
body.pagina-perfil .perfil-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 4px 12px;
  position: sticky;
  top: 0;
  z-index: 20;
  background: linear-gradient(180deg, rgba(11,18,32,0.98), rgba(11,18,32,0.85));
  backdrop-filter: blur(8px);
}
body.pagina-perfil .perfil-topbar-nome {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 700;
  color: #e2e8f0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 70vw;
}
body.pagina-perfil .perfil-topbar #btn-sair {
  display: inline-flex !important;
  flex-shrink: 0;
  margin: 0;
  opacity: 1 !important;
  visibility: visible !important;
}
body.pagina-perfil .perfil-topbar #btn-sair.oculto {
  display: inline-flex !important;
}
body.pagina-perfil .card {
  border-radius: 16px;
  margin: 0 0 12px;
  padding: 14px 14px 16px;
}
body.pagina-perfil .perfil-hero-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  border: 1px solid rgba(245,166,35,0.25);
}
.perfil-hero-av {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #F5A623;
  color: #0b1220;
  font-weight: 800;
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.perfil-hero-nome {
  margin: 0 0 2px;
  font-size: 1.15rem;
  line-height: 1.25;
}
.perfil-hero-sub { margin: 0; }
.card-compartilhar {
  border: 1px solid rgba(37, 211, 102, 0.35);
  background: linear-gradient(180deg, rgba(37,211,102,0.08), transparent);
}
.card-compartilhar h2 { margin-top: 0; }
.compartilhar-codigo-line {
  margin: 8px 0 12px;
  font-size: 0.95rem;
}
.compartilhar-lbl { opacity: 0.75; margin-right: 4px; }
.btn-wa-share,
.btn-wa-share-lg {
  background: #25D366 !important;
  color: #062816 !important;
  border: none !important;
  font-weight: 800;
}
.btn-wa-share:hover,
.btn-wa-share-lg:hover { filter: brightness(1.06); }
.btn-wa-share-lg {
  display: block;
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  font-size: 1.02rem;
  margin-bottom: 8px;
}
#btn-copiar-link-perfil {
  display: block;
  width: 100%;
  text-align: center;
  opacity: 0.9;
}
html[data-theme="light"] body.pagina-perfil {
  background: #f1f5f9;
}
html[data-theme="light"] body.pagina-perfil .perfil-topbar {
  background: linear-gradient(180deg, rgba(241,245,249,0.98), rgba(241,245,249,0.85));
}
html[data-theme="light"] body.pagina-perfil .perfil-topbar-nome { color: #0f172a; }
html[data-theme="light"] body.pagina-perfil .perfil-hero-card {
  background: #fff;
  border-color: rgba(245,166,35,0.35);
}

/* Mic: keep round glyph while recording — timer on overlay */
#btn-audio[data-recording="1"] {
  background: #7f1d1d;
  color: #fecaca;
  box-shadow: 0 0 0 3px rgba(239,68,68,0.35);
}
.bubble-audio-dl {
  display: inline-block;
  margin-top: 6px;
  font-size: 0.78rem;
}


/* ===== 20260923ar — quick Favoritos|Mapa|Serviços|Banco + lote teor/midia ===== */
.lotes-tabs {
    display: flex;
    gap: 8px;
    margin: 0 0 14px;
    flex-wrap: wrap;
}
.lotes-tab {
    appearance: none;
    border: 1px solid var(--border);
    background: #111827;
    color: #94a3b8;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 0.85rem;
    font-weight: 650;
    cursor: pointer;
}
.lotes-tab.on {
    color: #0b1220;
    background: #F5A623;
    border-color: #F5A623;
}
.lotes-empty {
    text-align: center;
    padding: 28px 12px;
    color: var(--muted);
}
.lotes-empty .sub { margin-top: 6px; }
body.pagina-lote-detalhe #app-nav,
body.pagina-lote-detalhe .nav-chips.nav-secondary {
    display: none !important;
}
html[data-theme="light"] .bn-item { color: #64748b; }
html[data-theme="light"] .bn-item.on { color: #F5A623; }
html[data-theme="light"] .lotes-tab {
    background: #fff;
    color: #64748b;
}


/* ===== 20260923ar — lote midia preview + teor/cobre ===== */
.lote-midia-preview {
  display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px;
}
.lote-midia-thumb {
  width: 64px; height: 64px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--border); background: #0f172a;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.7rem; color: #94a3b8;
}
.lote-midia-thumb.primary { border-color: var(--accent-color); }
.lote-midia-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lote-midia-thumb.video { font-weight: 700; color: #fde68a; }
.lote-field-wrap { margin: 0 0 8px; }
.svc-fchip-ico { margin-right: 2px; }
html[data-theme="light"] .olx-qcard { background: transparent; color: #0f172a; }
html[data-theme="light"] .olx-qcard .qi-wrap {
  background: rgba(255,255,255,.85); border-color: rgba(15,23,42,.08);
  box-shadow: 0 4px 12px rgba(15,23,42,.08);
}
html[data-theme="light"] .olx-qcard.q-fav { color: #9f1239; }
html[data-theme="light"] .olx-qcard.q-mapa { color: #075985; }
html[data-theme="light"] .olx-qcard.q-serv { color: #92400e; }
html[data-theme="light"] .olx-qcard.q-banco { color: #92400e; }
html[data-theme="light"] .olx-qcard.q-maq { color: #3730a3; }
html[data-theme="light"] .lote-midia-thumb { background: #f8fafc; }



/* ===== 20260923ar — restore market quotes strip ===== */
.pagina-inicio #card-cotacoes.cotacoes-card {
    margin: 8px 0 10px;
    background: #0b1220;
    border: 1px solid rgba(245, 166, 35, 0.22);
}
.pagina-inicio .cotacoes-card .cotacoes-strip-title {
    color: #F5A623;
}


/* ===== 20260923ar — quick cards: no flat fill, intuitive themed surfaces ===== */

/* ===== LIGHT THEME TEXT FIX 20260923ar ===== */
/* Nomes/títulos/preços com cor clara fixa sumiam no fundo claro */
html[data-theme="light"] .olx-card-title,
html[data-theme="light"] .olx-card-price,
html[data-theme="light"] .olx-card-body,
html[data-theme="light"] .olx-card-loc {
  color: #0f172a;
}
html[data-theme="light"] .olx-card-price { color: #b45309; }
html[data-theme="light"] .olx-card {
  background: #fff;
  border-color: #e2e8f0;
}
html[data-theme="light"] .olx-banner-slide strong { color: #fff; /* banner escuro ok */ }
html[data-theme="light"] .wa-thread-info strong#chat-com-nome,
html[data-theme="light"] .wa-thread-info,
html[data-theme="light"] #chat-com-nome {
  color: #0f172a !important;
}
html[data-theme="light"] body.pagina-perfil .perfil-hero-nome,
html[data-theme="light"] body.pagina-perfil .perfil-hero-sub,
html[data-theme="light"] .perfil-hero-nome {
  color: #0f172a;
}
html[data-theme="light"] .credito-nome,
html[data-theme="light"] .svc-nome,
html[data-theme="light"] h1, html[data-theme="light"] h2, html[data-theme="light"] h3 {
  color: #0f172a;
}
html[data-theme="light"] .auth-header h1,
html[data-theme="light"] .auth-header p,
html[data-theme="light"] .welcome-card h2,
html[data-theme="light"] .welcome-card p {
  color: #0f172a;
}
html[data-theme="light"] .welcome-card p { color: #334155; }
html[data-theme="light"] .sub,
html[data-theme="light"] .msg,
html[data-theme="light"] label,
html[data-theme="light"] legend {
  color: #334155;
}
html[data-theme="light"] .nb-circle,
html[data-theme="light"] .nb-circle .nci {
  color: #b45309;
}
html[data-theme="light"] .nb-saldo-label,
html[data-theme="light"] .nb-saldo-valor {
  color: #0f172a !important;
  background: none !important;
  -webkit-text-fill-color: #0f172a;
  filter: none;
}
html[data-theme="light"] .cotacao-card,
html[data-theme="light"] .cotacao-card strong,
html[data-theme="light"] .cotacao-card span {
  color: #0f172a;
}
html[data-theme="light"] .bottom-nav,
html[data-theme="light"] .bn-item { color: #64748b; }
html[data-theme="light"] .bn-item.on { color: #d97706; }

/* Theme picker (welcome + perfil) */
.tema-picker {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 14px 0 6px;
}
.tema-picker legend {
  grid-column: 1 / -1;
  font-size: 0.85rem;
  font-weight: 700;
  margin-bottom: 2px;
  color: var(--text-color);
}
.tema-opt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 10px;
  border-radius: 14px;
  border: 1.5px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text-color);
  cursor: pointer;
  font-weight: 700;
  font-size: 0.88rem;
  line-height: 1.2;
  position: relative;
  overflow: visible;
}
.tema-opt .tema-ico {
  display: block;
  font-size: 1.45rem;
  line-height: 1;
  position: static;
  margin: 0;
}
.tema-opt .tema-lbl {
  display: block;
  position: static;
  font-size: 0.9rem;
  font-weight: 800;
  color: inherit;
}
.tema-opt[aria-pressed="true"],
.tema-opt.on {
  border-color: var(--accent-color);
  box-shadow: 0 0 0 2px rgba(245,166,35,.28);
  background: rgba(245,166,35,.12);
}
html[data-theme="light"] .tema-opt {
  background: #fff;
  color: #0f172a;
}
html[data-theme="light"] .tema-opt.on {
  background: #fff7ed;
  border-color: #d97706;
}
.prefs-tema-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 8px;
}


/* ---- Anti zoom automático (toque/double-tap/input) ----
 * viewport: maximum-scale=1, user-scalable=no. manipulation = sem double-tap zoom
 * e sem atraso de 300 ms. O lightbox (touch-action: none) faz a própria pinça. */
html, body {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  touch-action: manipulation;
}
button, a, label, summary, [role="button"], [role="tab"],
.olx-qcard, .olx-tab, .fchip, .wa-chip, .bn-item, .nav-chips .chip,
.btn-sm, .btn-ok, .btn-ghost, .btn-primary-lg, .lotes-tab, .maq-sheet-opt, .maq-mkt-banner-clear,
.wa-comp-btn, .wa-attach-item, .tema-opt {
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
/* iOS dá zoom em input < 16px — trava escala da página no foco */
input, select, textarea, [contenteditable], [contenteditable="true"], [contenteditable="plaintext-only"],
.wa-comp-input, .olx-search, .mkt-busca {
  font-size: 16px !important;
  max-height: none;
}

/* ---- Voltar global (telas fora da barra principal) ---- */
.app-back-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px 4px;
  position: sticky;
  top: 0;
  z-index: 40;
  background: linear-gradient(180deg, var(--bg, #0b1220) 70%, transparent);
}
.app-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(245,166,35,.45);
  background: rgba(245,166,35,.16);
  color: #fde68a;
  font-weight: 800;
  font-size: 0.95rem;
  cursor: pointer;
  touch-action: manipulation;
  box-shadow: 0 4px 14px rgba(0,0,0,.28);
}
.app-back-btn .ab-ico {
  font-size: 1.35rem;
  line-height: 1;
  font-weight: 900;
}
.app-back-btn:active { transform: scale(.97); }
html[data-theme="light"] .app-back-btn {
  background: rgba(245,166,35,.2);
  color: #92400e;
  border-color: rgba(146,64,14,.35);
}
html[data-theme="light"] .app-back-bar {
  background: linear-gradient(180deg, var(--bg, #f8fafc) 70%, transparent);
}
body.pagina-inicio .app-back-bar,
body.pagina-chat:not(.chat-thread-open) .app-back-bar,
body.pagina-perfil .app-back-bar,
body.pagina-lotes .app-back-bar {
  /* abas raiz da bottom-nav: sem barra Voltar extra */
  display: none !important;
}


/* ===== 20260923ar — Maquinário Comprar|Vender sheet ===== */
.maquinario-sheet .maq-sheet-panel { gap: 14px; }
.maq-sheet-opts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.maq-sheet-opt {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  text-align: left;
  padding: 16px 14px;
  border-radius: 14px;
  border: 1px solid rgba(129,140,248,.35);
  background:
    radial-gradient(120% 90% at 20% 10%, rgba(99,102,241,.22), transparent 55%),
    linear-gradient(160deg, rgba(30,41,59,.85), rgba(15,23,42,.95));
  color: #e2e8f0;
  font: inherit;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
  transition: transform .12s ease, border-color .12s ease;
}
.maq-sheet-opt:active { transform: scale(.98); }
.maq-sheet-opt:hover,
.maq-sheet-opt:focus-visible {
  border-color: #F5A623;
  outline: none;
}
.maq-sheet-opt-ico {
  font-size: 1.65rem;
  line-height: 1;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: rgba(245,166,35,.14);
  border: 1px solid rgba(245,166,35,.35);
  flex-shrink: 0;
}
.maq-sheet-opt-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.maq-sheet-opt-body strong {
  font-size: 1.12rem;
  color: #fff;
}
.maq-sheet-opt-sub {
  font-size: 0.86rem;
  color: var(--muted, #94a3b8);
  line-height: 1.35;
}
.maq-sheet-cancel {
  width: 100%;
  margin-top: 2px;
}
.maq-mkt-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 16px 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(129,140,248,.4);
  background: linear-gradient(135deg, rgba(99,102,241,.18), rgba(15,23,42,.6));
  color: #e2e8f0;
  font-size: 0.9rem;
}
.maq-mkt-banner-txt { flex: 1; min-width: 0; line-height: 1.35; }
.maq-mkt-banner-txt strong { color: #F5A623; }
.maq-mkt-banner-clear {
  flex-shrink: 0;
  border: 1px solid rgba(245,166,35,.45);
  background: rgba(245,166,35,.12);
  color: #F5A623;
  border-radius: 999px;
  padding: 6px 12px;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}
.maq-mkt-banner-clear:active { transform: scale(.97); }


/* Maquinário — observação / propaganda */
#wrap-maq-obs textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
  border-radius: 12px;
  padding: 12px;
  font-size: 16px;
  line-height: 1.4;
  border: 1px solid rgba(148,163,184,.35);
  background: rgba(15,23,42,.55);
  color: inherit;
  touch-action: manipulation;
}
html[data-theme="light"] #wrap-maq-obs textarea {
  background: #fff;
  border-color: #cbd5e1;
}


/* Bank top actions — same language as Pix/Depositar circles */
.nb-ico-btn {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,0.16) !important;
  background: rgba(30, 41, 59, 0.40) !important;
  color: #F5A623 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 4px 14px rgba(0,0,0,0.22);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.nb-ico-btn .nb-ico-svg,
.nb-ico-btn .nb-ico-svg,
.nb-ico-svg,
.nb-ico-svg {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  flex-shrink: 0;
  pointer-events: none;
}
body.pagina-financeiro .nb-ico-btn {
  background: rgba(30, 41, 59, 0.42) !important;
  color: #F5A623 !important;
  border: 1px solid rgba(245,166,35,0.35) !important;
}
body.pagina-financeiro .nb-strip-right {
  gap: 10px;
}

/* ---- Lightbox de fotos (lightbox.js) — tela cheia acima de tudo ---- */
.lote-detalhe-gallery img, img[data-lightbox] { cursor: zoom-in; }
.lote-detalhe-gallery img:focus-visible, img[data-lightbox]:focus-visible { outline: 3px solid #F5A623; outline-offset: 2px; }
.mlb {
  position: fixed; inset: 0; z-index: 2147483000;
  background: rgba(0, 0, 0, 0.96);
  touch-action: none; overscroll-behavior: contain;
  -webkit-user-select: none; user-select: none;
  -webkit-tap-highlight-color: transparent;
  width: 100vw; height: 100vh; height: 100dvh;
}
.mlb[hidden] { display: none !important; }
.mlb-stage {
  position: absolute;
  top: env(safe-area-inset-top, 0px); bottom: env(safe-area-inset-bottom, 0px);
  left: env(safe-area-inset-left, 0px); right: env(safe-area-inset-right, 0px);
  overflow: hidden; touch-action: none;
}
.mlb-img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  max-width: 100vw; max-height: 100vh; max-height: 100dvh;
  object-fit: contain; transform-origin: 50% 50%; will-change: transform;
  touch-action: none; -webkit-user-drag: none; user-select: none;
  cursor: zoom-in;
}
.mlb.mlb-zoomed .mlb-img { cursor: grab; }
.mlb-img.mlb-loading { opacity: 0; }
.mlb-spinner {
  position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px;
  border: 4px solid rgba(255, 255, 255, 0.2); border-top-color: #F5A623; border-radius: 50%;
  animation: mlb-spin 0.8s linear infinite; pointer-events: none;
}
.mlb-spinner[hidden] { display: none; }
@keyframes mlb-spin { to { transform: rotate(360deg); } }
.mlb-err {
  position: absolute; left: 16px; right: 16px; top: 50%; transform: translateY(-50%);
  text-align: center; color: #e2e8f0; font-size: 1rem; margin: 0; pointer-events: none;
}
.mlb-err[hidden] { display: none; }
.mlb-counter {
  position: absolute; top: calc(env(safe-area-inset-top, 0px) + 14px); left: 50%; transform: translateX(-50%);
  padding: 6px 14px; border-radius: 999px; background: rgba(15, 23, 42, 0.72); color: #fff;
  font-size: 0.95rem; font-weight: 700; letter-spacing: 0.02em; pointer-events: none;
}
.mlb.mlb-single .mlb-counter, .mlb.mlb-single .mlb-nav { display: none; }
.mlb-btn {
  position: absolute; display: flex; align-items: center; justify-content: center;
  min-width: 48px; min-height: 48px; width: 48px; height: 48px; padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 50%;
  background: rgba(15, 23, 42, 0.78); color: #fff; line-height: 1; cursor: pointer;
  touch-action: manipulation;
}
.mlb-btn:focus-visible { outline: 3px solid #F5A623; outline-offset: 2px; }
.mlb-close {
  top: calc(env(safe-area-inset-top, 0px) + 8px); right: calc(env(safe-area-inset-right, 0px) + 8px);
  font-size: 2rem;
}
.mlb-nav { top: 50%; margin-top: -24px; font-size: 2.2rem; }
.mlb-prev { left: calc(env(safe-area-inset-left, 0px) + 10px); }
.mlb-next { right: calc(env(safe-area-inset-right, 0px) + 10px); }
.mlb-nav:disabled { opacity: 0.3; cursor: default; }
/* Setas só onde há mouse; no toque usa-se o swipe */
@media (hover: none), (pointer: coarse) { .mlb-nav { display: none; } }

/* ---- Perfil: Meus anúncios (editar / vendido / excluir) ---- */
.card-meus-anuncios.oculto { display: none !important; }
.card-meus-anuncios .ma-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.card-meus-anuncios .ma-head h2 { margin: 0; border: 0; padding: 0; }
.card-meus-anuncios .ma-novo { width: auto; min-height: 44px; padding: 10px 14px; display: inline-flex; align-items: center; border-radius: 12px; text-decoration: none; white-space: nowrap; }
.card-meus-anuncios .ma-head + .sub { margin-top: 8px; } /* "+ Anunciar" (44px) não cobre a 1ª linha do subtítulo */
.ma-lista { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.ma-item {
  display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 10px 12px;
  padding: 10px; border-radius: 14px; background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(245, 166, 35, 0.22); min-width: 0;
}
html[data-theme="light"] .ma-item { background: #fff7ea; }
.ma-thumb {
  width: 76px; height: 76px; border-radius: 12px; overflow: hidden; background: #1e293b;
  display: flex; align-items: center; justify-content: center; font-size: 1.8rem; text-decoration: none;
}
.ma-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ma-info { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ma-titulo { font-weight: 800; color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.ma-codigo { margin: 0; font-size: 0.82rem; opacity: 0.75; overflow-wrap: anywhere; }
.ma-preco { margin: 0; font-weight: 800; color: #F5A623; }
.ma-status { align-self: flex-start; margin-top: 2px; }
.ma-acoes { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.ma-btn {
  flex: 1 1 calc(33% - 8px); min-width: 96px; min-height: 44px; width: auto; margin: 0;
  padding: 8px 10px; border-radius: 12px; font-size: 0.9rem; font-weight: 700; line-height: 1.15;
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  text-decoration: none; cursor: pointer; touch-action: manipulation;
  background: #1e293b; color: #F5A623; border: 1px solid rgba(245, 166, 35, 0.55);
}
.ma-btn-vendido { background: #F5A623; color: #0f172a; border-color: #F5A623; }
.ma-btn-excluir { background: transparent; color: #fca5a5; border-color: #7f1d1d; }
.ma-btn:disabled { opacity: 0.55; cursor: progress; }
html[data-theme="light"] .ma-btn { background: #fff; }
html[data-theme="light"] .ma-btn-vendido { background: #F5A623; }
.ma-empty { text-align: center; padding: 12px 4px 4px; }
.ma-empty p { margin: 0 0 10px; }
.ma-empty-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; width: auto; padding: 10px 18px; border-radius: 12px; text-decoration: none; }
body.modo-ui-admin #card-meus-anuncios, body.pagina-admin #card-meus-anuncios { display: none !important; }


/* ---- Card de anúncio compartilhado (anuncio-card.js): Início = Lotes ---- */
.olx-feed.feed-lote-cards { display: block; }
.olx-feed.feed-lote-cards .lote-cards { min-width: 0; }
.lote-card { min-width: 0; }
a.lote-img { text-decoration: none; color: inherit; overflow: hidden; }
.lote-codigo a { color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.lote-card .lote-heart { z-index: 2; }
/* Card inteiro clicável (anuncio-card.js): feedback de toque */
.lote-card { cursor: pointer; -webkit-tap-highlight-color: transparent; }

/* ---- Perfil: ⚙️ Configurações (Editar perfil + Preferências) recolhível ---- */
body.pagina-perfil .perfil-config { padding: 0; overflow: hidden; }
.perfil-config-toggle {
  width: 100%; min-height: 56px; margin: 0; padding: 12px 16px;
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto;
  column-gap: 10px; align-items: center; text-align: left;
  background: transparent; border: 0; border-radius: 16px; color: inherit; cursor: pointer;
  touch-action: manipulation;
}
.perfil-config-toggle:focus-visible { outline: 3px solid #F5A623; outline-offset: -3px; }
.perfil-config-toggle .pct-lbl { grid-column: 1; grid-row: 1; font-size: 1.05rem; font-weight: 800; }
.perfil-config-toggle .pct-sub { grid-column: 1; grid-row: 2; font-size: 0.8rem; font-weight: 500; opacity: 0.7; }
.perfil-config-toggle .pct-chev {
  grid-column: 2; grid-row: 1 / span 2; width: 36px; height: 36px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(245, 166, 35, 0.14); color: #F5A623; font-size: 1.1rem;
  transition: transform 0.2s ease;
}
.perfil-config.open .pct-chev { transform: rotate(180deg); }
.perfil-config-panel { padding: 0 14px 16px; border-top: 1px solid rgba(245, 166, 35, 0.2); animation: pct-in 0.18s ease-out; }
.perfil-config-panel[hidden] { display: none !important; }
@keyframes pct-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.perfil-config-sec { padding-top: 14px; }
.perfil-config-sec + .perfil-config-sec { margin-top: 12px; border-top: 1px solid rgba(148, 163, 184, 0.18); }
.perfil-config-sec h2 { font-size: 1rem; margin: 0 0 6px; border: 0; padding: 0; }

/* ---- Avisos de mensagem: lembrete ao abrir, badge na aba Chat, card de permissão ---- */
.bottom-nav .bn-item .bn-icon { position: relative; }
.bn-badge {
  position: absolute; top: -6px; left: 60%; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; background: #ef4444; color: #fff; font-size: 0.65rem; font-weight: 800;
  line-height: 18px; text-align: center; box-shadow: 0 0 0 2px #0b1220; pointer-events: none;
}
.bn-badge.oculto { display: none !important; }
.notif-lembrete {
  position: fixed; z-index: 1150;
  top: calc(env(safe-area-inset-top, 0px) + 8px);
  left: calc(env(safe-area-inset-left, 0px) + 10px); right: calc(env(safe-area-inset-right, 0px) + 10px);
  max-width: 560px; margin: 0 auto;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 12px 14px; border-radius: 16px;
  background: #111827; color: #f1f5f9; border: 1px solid #F5A623;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.55);
  animation: nl-in 0.25s ease-out;
}
@keyframes nl-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.notif-lembrete .nl-txt { flex: 1 1 180px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.notif-lembrete .nl-txt strong { font-size: 0.98rem; }
.notif-lembrete .nl-txt span { font-size: 0.82rem; color: #cbd5e1; overflow-wrap: anywhere; }
.notif-lembrete .nl-acoes { display: flex; gap: 8px; margin-left: auto; }
.notif-lembrete .nl-depois, .notif-lembrete .nl-ver {
  min-height: 44px; padding: 10px 14px; border-radius: 12px; font-weight: 700; font-size: 0.9rem;
  display: inline-flex; align-items: center; justify-content: center; width: auto; margin: 0;
  text-decoration: none; cursor: pointer;
}
.notif-lembrete .nl-depois { background: transparent; color: #e2e8f0; border: 1px solid #475569; }
.notif-lembrete .nl-ver { background: #F5A623; color: #0f172a; border: 0; }
html[data-theme="light"] .notif-lembrete { background: #fff; color: #0f172a; }
html[data-theme="light"] .notif-lembrete .nl-txt span { color: #475569; }
html[data-theme="light"] .notif-lembrete .nl-depois { color: #334155; border-color: #cbd5e1; }
.notif-perm-card {
  margin: 0 16px 14px; padding: 12px 14px; border-radius: 14px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: rgba(245, 166, 35, 0.1); border: 1px solid rgba(245, 166, 35, 0.4);
}
.notif-perm-card .npc-txt { flex: 1 1 180px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.notif-perm-card .npc-txt span { font-size: 0.82rem; opacity: 0.8; }
.notif-perm-card .npc-acoes { display: flex; gap: 8px; margin-left: auto; }
.notif-perm-card button {
  min-height: 44px; width: auto; margin: 0; padding: 8px 14px; border-radius: 12px; font-weight: 700; font-size: 0.9rem;
}
.notif-perm-card .npc-nao { background: transparent; color: inherit; border: 1px solid #475569; }
.notif-perm-card .npc-sim { background: #F5A623; color: #0f172a; border: 0; }
.notif-perm-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  margin: 12px 0; padding: 12px; border-radius: 12px; background: rgba(15, 23, 42, 0.45);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
html[data-theme="light"] .notif-perm-row { background: #f8fafc; }
.notif-perm-row .npr-txt { flex: 1 1 160px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.notif-perm-row .npr-st { font-size: 0.82rem; opacity: 0.8; }
.notif-perm-row .npr-btn {
  min-height: 44px; min-width: 96px; width: auto; margin: 0; padding: 8px 14px; border-radius: 999px;
  font-weight: 700; background: #F5A623; color: #0f172a; border: 0;
}
.notif-perm-row .npr-btn:disabled { background: #334155; color: #cbd5e1; cursor: default; }
.notif-perm-row .npr-btn.on:disabled { background: rgba(74, 222, 128, 0.18); color: #4ade80; }
.notif-perm-row .npr-help { flex-basis: 100%; margin: 0; font-size: 0.8rem; }
.notif-perm-row .npr-btn.som-off { background: #334155; color: #cbd5e1; }
.notif-perm-row + .notif-perm-row { margin-top: 0; }

/* ---- Card "Pix de apoio" (vaquinha voluntária) na entrada do app ---- */
.apoio-pix-modal { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: flex-end; justify-content: center; }
.apoio-pix-modal.apm-armando, .apoio-pix-modal.apm-armando * { pointer-events: none !important; }
.apoio-pix-modal .apm-backdrop { position: absolute; inset: 0; background: rgba(2, 6, 23, 0.62); animation: apm-fade 0.2s ease-out; }
.apoio-pix-modal .apm-card {
  position: relative; width: 100%; max-width: 480px; margin: 0 10px calc(12px + env(safe-area-inset-bottom, 0px));
  padding: 22px 18px 16px; border-radius: 20px; background: #111827; color: #f1f5f9;
  border: 1px solid rgba(245, 166, 35, 0.5); box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.5);
  text-align: center; animation: apm-up 0.25s ease-out; max-height: calc(100dvh - 24px); overflow-y: auto;
}
@media (min-width: 700px) { .apoio-pix-modal { align-items: center; } .apoio-pix-modal .apm-card { margin-bottom: 0; } }
@keyframes apm-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes apm-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.apoio-pix-modal .apm-x {
  position: absolute; top: 6px; right: 6px; width: 44px; height: 44px; min-width: 44px; padding: 0; margin: 0;
  border-radius: 50%; border: 0; background: transparent; color: #cbd5e1; font-size: 1.8rem; line-height: 1; cursor: pointer;
}
.apoio-pix-modal .apm-ico { font-size: 2rem; margin-bottom: 4px; }
.apoio-pix-modal h2 { margin: 0 0 8px; font-size: 1.2rem; border: 0; padding: 0; color: #F5A623; }
.apoio-pix-modal .apm-txt { margin: 0 0 12px; font-size: 0.92rem; line-height: 1.4; color: #cbd5e1; }
.apoio-pix-modal .apm-chave {
  display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; margin-bottom: 12px; border-radius: 12px;
  background: rgba(245, 166, 35, 0.1); border: 1px dashed rgba(245, 166, 35, 0.55);
}
.apoio-pix-modal .apm-chave span { font-size: 0.75rem; opacity: 0.8; }
.apoio-pix-modal .apm-chave strong { font-size: 1rem; overflow-wrap: anywhere; user-select: all; }
.apoio-pix-modal .apm-chave small { font-size: 0.75rem; opacity: 0.75; }
.apoio-pix-modal .apm-copiar {
  width: 100%; min-height: 48px; margin: 0 0 8px; border: 0; border-radius: 14px;
  background: #F5A623; color: #0f172a; font-weight: 800; font-size: 1rem; cursor: pointer;
}
.apoio-pix-modal .apm-depois {
  width: 100%; min-height: 44px; margin: 0; border-radius: 14px; background: transparent;
  border: 1px solid #475569; color: #e2e8f0; font-weight: 700; cursor: pointer;
}
html[data-theme="light"] .apoio-pix-modal .apm-card { background: #fff; color: #0f172a; }
html[data-theme="light"] .apoio-pix-modal .apm-txt { color: #475569; }
html[data-theme="light"] .apoio-pix-modal .apm-depois { color: #334155; border-color: #cbd5e1; }

/* ===== 20260925e — Chat tempo real: ticks, fila, pular p/ fim, não lidas, composer multilinha ===== */
.bubble .tk { font-size: 0.78rem; font-weight: 800; letter-spacing: -2px; line-height: 1; margin-left: 2px; padding-right: 2px; }
.bubble.mine .bubble-status .tk,
.bubble.sent .bubble-status .tk { color: rgba(11, 18, 32, 0.6) !important; }
.bubble.mine .bubble-status .tk-lida,
.bubble.sent .bubble-status .tk-lida { color: #1d4ed8 !important; }
.bubble .tk-pend, .bubble .tk-ag { letter-spacing: 0; font-weight: 400; }
.bubble.mine .bubble-status .tk-falhou { color: #b91c1c !important; letter-spacing: 0; }
.bubble.pending { opacity: 0.92; }
.bubble.bubble-failed { outline: 2px solid rgba(185, 28, 28, 0.55); }
.bubble-retry {
  display: block; width: 100%; margin-top: 6px; padding: 6px 10px; border: 0; border-radius: 8px;
  background: rgba(11, 18, 32, 0.12); color: #7f1d1d; font-weight: 700; font-size: 0.8rem; text-align: left; cursor: pointer;
}
.wa-row-prev .tk { font-weight: 800; letter-spacing: -2px; margin-right: 4px; color: #94a3b8; }
.wa-row-prev .tk-lida { color: #60a5fa; }
.wa-row-prev .tk-pend { letter-spacing: 0; font-weight: 400; }
.wa-row-prev { display: flex; align-items: center; min-width: 0; }
.wa-row-prev-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.wa-row-typing { display: none; color: #F5A623; font-weight: 700; font-style: italic; }
.wa-row-prev.digitando .wa-row-prev-txt,
.wa-row-prev.digitando .tk { display: none; }
.wa-row-prev.digitando .wa-row-typing { display: inline; }
.wa-thread-status {
  margin: 0; font-size: 0.78rem; line-height: 1.2; color: #F5A623; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-topo { display: flex; justify-content: center; padding: 4px 0 2px; min-height: 22px; }
.chat-topo span {
  font-size: 0.72rem; color: #94a3b8; background: rgba(30, 41, 59, 0.85);
  border-radius: 8px; padding: 3px 10px;
}
.chat-naolidas-div { display: flex; justify-content: center; margin: 4px 0; }
.chat-naolidas-div span {
  background: rgba(245, 166, 35, 0.16); color: #F5A623; border: 1px solid rgba(245, 166, 35, 0.4);
  font-size: 0.75rem; font-weight: 700; border-radius: 10px; padding: 4px 14px;
}
.chat-thread-active { position: relative; }
.chat-jump {
  position: absolute; right: 18px; bottom: 96px; z-index: 30;
  width: 42px; height: 42px; border-radius: 50%; border: 1px solid #334155;
  background: #1e293b; color: #f8fafc; font-size: 1.2rem; font-weight: 800; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45); touch-action: manipulation;
}
.chat-jump.oculto { display: none; }
.chat-jump-n {
  position: absolute; top: -6px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px;
  border-radius: 10px; background: #F5A623; color: #0b1220; font-size: 0.7rem; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
}
.chat-jump-n.oculto { display: none; }
@media (max-width: 800px) {
  .chat-jump { position: fixed; right: 12px; bottom: calc(var(--composer-h, 58px) + var(--kb-inset, 0px) + 12px); }
}

/* Composer multilinha: pill cresce (até ~5 linhas) em vez de altura fixa */
.wa-composer.chat-form { align-items: flex-end; }
.wa-composer .wa-comp-pill,
.wa-composer.chat-form .wa-comp-pill {
  height: auto !important; min-height: 42px; max-height: none; align-items: flex-end; border-radius: 21px;
}
.wa-composer .wa-comp-pill textarea.wa-comp-input {
  display: block; height: 40px; min-height: 40px; max-height: 140px !important;
  resize: none; overflow-y: auto; line-height: 1.35; padding: 9px 6px 9px 14px !important;
  font-family: inherit; font-size: 16px !important; white-space: pre-wrap; word-break: break-word;
  scrollbar-width: none;
}
.wa-composer .wa-comp-pill textarea.wa-comp-input::-webkit-scrollbar { display: none; }
.wa-composer .wa-comp-in-emoji { align-self: flex-end; margin-bottom: 3px; }
.wa-composer .wa-comp-btn { align-self: flex-end; }
.bubble-text { white-space: pre-wrap; overflow-wrap: anywhere; }

/* ===== 20260925e — Conversa estilo "Grok": tela cheia, topo flutuante translúcido, bolhas cinza ===== */
.chat-thread-active {
  /* cores = tokens do app (style.css :root / [data-theme=light]); layout no estilo do print */
  --gk-bg: var(--bg-color); --gk-recv: var(--card-bg); --gk-txt: var(--text-color); --gk-muted: var(--muted);
  --gk-sent: #F5A623; --gk-sent-txt: #0b1220; --gk-sent-muted: rgba(11, 18, 32, 0.62);
  --gk-circ: color-mix(in srgb, var(--card-bg) 88%, transparent); --gk-borda: var(--border); --gk-pill: var(--bg-elevated);
  --gk-ico: var(--accent-color); --gk-in: var(--accent-color); --gk-in-txt: #0b1220;
}
html[data-theme="light"] .chat-thread-active {
  --gk-sent: #fde2b4; --gk-sent-txt: #0f172a; --gk-sent-muted: #78716c;
  --gk-circ: color-mix(in srgb, #ffffff 90%, transparent); --gk-in-txt: #ffffff;
}
.chat-thread-active { position: relative; background: var(--gk-bg); color: var(--gk-txt); overflow: hidden; }
.chat-thread-active .chat-msgs {
  background: var(--gk-bg) !important; background-image: none !important; border-radius: 0;
  padding: calc(72px + env(safe-area-inset-top, 0px)) 14px 12px !important; gap: 12px;
}
/* topo flutuante: sem barra sólida, conteúdo rola por baixo */
.chat-thread-active .wa-thread-head.gk-head {
  position: absolute !important; top: 0; left: 0; right: 0; z-index: 25;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: max(10px, env(safe-area-inset-top, 0px)) 12px 18px;
  background: linear-gradient(to bottom, var(--gk-bg) 0%, color-mix(in srgb, var(--gk-bg) 70%, transparent) 55%, transparent 100%) !important;
  border: 0 !important; box-shadow: none !important; pointer-events: none;
}
.gk-head > * { pointer-events: auto; }
.gk-circ {
  width: 44px; height: 44px; min-width: 44px; border-radius: 50%; flex-shrink: 0; position: relative;
  border: 1px solid var(--gk-borda); background: var(--gk-circ); color: var(--gk-ico); box-shadow: var(--shadow-elev);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer;
  font-size: 1.35rem; line-height: 1; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
}
.gk-circ:active { transform: scale(0.94); }
.gk-back .wa-back-unread {
  position: absolute; top: -4px; right: -6px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px;
  background: #F5A623; color: #0b1220; font-size: 0.68rem; font-weight: 800; display: inline-flex; align-items: center; justify-content: center;
}
.gk-back .wa-back-unread.oculto { display: none; }
.gk-pill {
  flex: 0 1 auto; min-width: 0; max-width: calc(100% - 120px); height: 44px; margin: 0 auto;
  display: inline-flex; align-items: center; gap: 8px; padding: 0 16px 0 5px; border-radius: 22px;
  border: 1px solid var(--gk-borda); background: var(--gk-circ); color: var(--gk-txt); box-shadow: var(--shadow-elev);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); cursor: pointer; text-align: left;
}
.gk-av-wrap { position: relative; flex-shrink: 0; width: 34px; height: 34px; }
.gk-pill .wa-av.wa-av-thread {
  width: 34px !important; height: 34px !important; min-width: 34px; font-size: 0.78rem !important;
  border-radius: 50%; background: #F5A623 !important; color: #0b1220 !important; display: flex; align-items: center; justify-content: center; font-weight: 800;
}
.gk-dot {
  position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 50%;
  background: #22c55e; border: 2px solid var(--gk-pill);
}
.gk-dot.oculto { display: none; }
.gk-pill-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.gk-pill .wa-thread-name { font-size: 1rem; font-weight: 700; color: var(--gk-txt) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gk-pill .wa-thread-status { font-size: 0.72rem; font-weight: 600; color: #22c55e; }
.gk-pill .wa-thread-status.ativo { color: #F5A623; }
.chat-thread-active #chat-head-menu { position: absolute; top: calc(62px + env(safe-area-inset-top, 0px)); left: 50%; transform: translateX(-50%); right: auto; z-index: 30; }
.chat-thread-active #chat-lote-ctx {
  position: absolute; z-index: 24; top: calc(60px + env(safe-area-inset-top, 0px)); left: 50%; transform: translateX(-50%);
  max-width: calc(100% - 32px); margin: 0; padding: 4px 12px; border-radius: 12px; font-size: 0.75rem;
  background: rgba(245, 166, 35, 0.16); color: #F5A623; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-thread-active #chat-lote-ctx.oculto { display: none; }

/* bolhas */
.chat-thread-active .bubble {
  max-width: 86%; border-radius: 20px !important; padding: 10px 14px !important; box-shadow: none !important;
  font-size: 16px; line-height: 1.45; border: 0 !important;
}
.chat-thread-active .bubble.theirs { background: var(--gk-recv) !important; color: var(--gk-txt) !important; margin-right: auto; }
html[data-theme="light"] .chat-thread-active .bubble.theirs { border: 1px solid var(--gk-borda) !important; }
.chat-thread-active .bubble.mine, .chat-thread-active .bubble.sent {
  background: var(--gk-sent) !important; color: var(--gk-sent-txt) !important; margin-left: auto; border-radius: 22px !important; max-width: 80%;
}
.chat-thread-active .bubble .bubble-text { color: var(--gk-txt) !important; font-size: 16px; line-height: 1.45; }
.chat-thread-active .bubble.mine .bubble-text, .chat-thread-active .bubble.sent .bubble-text { color: var(--gk-sent-txt) !important; }
.chat-thread-active .bubble .bubble-meta { color: #F5A623 !important; font-size: 0.75rem; }
.chat-thread-active .bubble.theirs .bubble-status { color: var(--gk-muted) !important; }
.chat-thread-active .bubble.mine .bubble-status, .chat-thread-active .bubble.sent .bubble-status,
.chat-thread-active .bubble.mine .bubble-status .tk, .chat-thread-active .bubble.sent .bubble-status .tk { color: var(--gk-sent-muted) !important; }
.chat-thread-active .bubble.mine .bubble-status .tk-lida, .chat-thread-active .bubble.sent .bubble-status .tk-lida { color: #1d4ed8 !important; }
.chat-thread-active .bubble.mine .bubble-status .tk-falhou { color: #b91c1c !important; }
.chat-thread-active .bubble.mine .bubble-quote-name { color: #7c2d12 !important; }
.chat-thread-active .bubble.mine .bubble-quote { border-left-color: #0b1220; background: rgba(11, 18, 32, 0.1); }
.chat-thread-active .bubble.mine .bubble-quote-text { color: var(--gk-sent-muted) !important; }
.chat-thread-active .bubble-retry { color: #ef4444; background: rgba(239, 68, 68, 0.12); }
.chat-thread-active .bubble-quote { border-left: 3px solid #F5A623; background: rgba(127, 127, 127, 0.14); border-radius: 10px; }
.chat-thread-active .bubble-quote-name { color: #F5A623 !important; }
.chat-thread-active .bubble-quote-text { color: var(--gk-muted) !important; }
.chat-thread-active .wa-day-div span, .chat-thread-active .chat-topo span { background: var(--gk-recv); color: var(--gk-muted); border: 0; }

/* composer: [+] [ pill: texto … (mic | enviar) ] */
.chat-thread-active .wa-composer.gk-composer {
  display: flex !important; align-items: flex-end !important; gap: 10px !important;
  background: var(--gk-bg) !important; border: 0 !important;
  padding: 8px 12px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
}
.gk-composer .wa-comp-plus.gk-circ { width: 46px; height: 46px; min-width: 46px; background: var(--gk-pill); font-size: 1.5rem; box-shadow: none; }
.chat-thread-active .gk-composer .gk-comp-pill {
  flex: 1; min-width: 0; display: flex; align-items: flex-end; gap: 6px;
  min-height: 46px; height: auto !important; border-radius: 23px !important; padding: 4px 5px 4px 0 !important;
  background: var(--gk-pill) !important; border: 1px solid var(--gk-borda) !important;
}
.chat-thread-active .gk-composer .gk-comp-pill textarea.wa-comp-input {
  flex: 1; min-width: 0; color: var(--gk-txt) !important; background: transparent !important;
  min-height: 36px; height: 36px; padding: 7px 4px 7px 16px !important;
}
.gk-composer textarea.wa-comp-input::placeholder { color: var(--gk-muted); }
.gk-in-btn {
  width: 38px; height: 38px; min-width: 38px; border-radius: 50%; border: 0; padding: 0; flex-shrink: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
}
.gk-in-btn.mic { background: var(--gk-in); color: var(--gk-in-txt); }
.gk-in-btn.mic.recording, .gk-in-btn.mic[data-recording] { background: #ef4444; color: #fff; }
.gk-in-btn.mic.btn-ok { background: var(--ok); color: #0b1220; }
.gk-in-btn.send { background: var(--gk-in); color: var(--gk-in-txt); display: none; }
.gk-composer.tem-texto .gk-in-btn.send { display: inline-flex; }
.gk-composer.tem-texto .gk-in-btn.mic:not([data-recording]) { display: none; }
.chat-thread-active .chat-jump { background: var(--gk-circ); color: var(--gk-ico); border: 1px solid var(--gk-borda); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }

/* Amigos */
.gk-amigos-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.gk-amigos-title { font-weight: 800; font-size: 1.1rem; margin: 0; }
.gk-amigos-lista { max-height: 50vh; overflow-y: auto; margin: 8px 0; }
.gk-amigo { display: flex; align-items: center; gap: 10px; padding: 8px 2px; border-bottom: 1px solid var(--border-subtle, rgba(148,163,184,.15)); }
.gk-amigo .wa-av { width: 40px !important; height: 40px !important; min-width: 40px; font-size: 0.85rem; }
.gk-amigo-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.gk-amigo-txt strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gk-amigo-txt .sub { font-size: 0.75rem; }
.gk-amigos-sheet { z-index: 1300 !important; }

/* Celular: conversa ocupa 100% da área visível (some barra de baixo, topo, avisos, botões flutuantes) */
@media (max-width: 800px) {
  body.pagina-chat.chat-thread-open { overflow: hidden !important; }
  body.pagina-chat.chat-thread-open #bottom-nav,
  body.pagina-chat.chat-thread-open .bottom-nav,
  body.pagina-chat.chat-thread-open #app-back-bar,
  body.pagina-chat.chat-thread-open .app-back-bar,
  body.pagina-chat.chat-thread-open #modo-ui-sticky,
  body.pagina-chat.chat-thread-open #app-nav,
  body.pagina-chat.chat-thread-open #user-label,
  body.pagina-chat.chat-thread-open #minera-welcome-strip,
  body.pagina-chat.chat-thread-open #minera-pwa-install,
  body.pagina-chat.chat-thread-open #notif-lembrete,
  body.pagina-chat.chat-thread-open #notif-perm-card,
  body.pagina-chat.chat-thread-open #apoio-pix-modal,
  body.pagina-chat.chat-thread-open #share-pos-cadastro,
  body.pagina-chat.chat-thread-open .olx-fab,
  body.pagina-chat.chat-thread-open .chat-contacts-pane { display: none !important; }
  body.pagina-chat.chat-thread-open .chat-thread-active {
    position: fixed !important; left: 0; right: 0; top: var(--vvtop, 0px);
    height: var(--vvh, 100dvh) !important; max-height: var(--vvh, 100dvh); width: 100%; z-index: 900;
    display: flex; flex-direction: column;
  }
  body.pagina-chat.chat-thread-open .chat-thread-active .chat-msgs {
    flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important;
    padding-bottom: 12px !important;
  }
  body.pagina-chat.chat-thread-open .chat-thread-active .wa-composer.chat-form {
    position: relative !important; bottom: auto !important; left: auto; right: auto; flex-shrink: 0; z-index: 26;
  }
  body.pagina-chat.chat-thread-open .chat-thread-active .chat-jump { position: absolute; bottom: calc(var(--composer-h, 64px) + 14px); right: 14px; }
  body.pagina-chat.chat-thread-open .chat-thread-active .chat-reply-bar,
  body.pagina-chat.chat-thread-open .chat-thread-active .chat-media-preview,
  body.pagina-chat.chat-thread-open .chat-thread-active .chat-agendar-row { flex-shrink: 0; }
  body.pagina-chat.chat-thread-open .chat-thread-active .chat-rec-bar.wa-rec-overlay { position: absolute; bottom: var(--composer-h, 64px); }
  body.pagina-chat.chat-thread-open #chat-msg.msg:empty { display: none; }
}
/* folhas (Amigos / Anexar / ações) com as cores do tema */
body.pagina-chat .chat-msg-sheet-panel { background: var(--card-bg); color: var(--text-color); border-color: var(--border); }
body.pagina-chat .chat-msg-sheet-panel .chat-msg-sheet-item,
body.pagina-chat .wa-attach-item { color: var(--text-color); }
body.pagina-chat .wa-attach-item .ai { background: var(--bg-elevated); border: 1px solid var(--border); }
html[data-theme="light"] body.pagina-chat .chat-msg-sheet-panel { box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.12); }
.gk-amigos-title { color: var(--text-color); }
.gk-amigo-txt strong { color: var(--text-color); }

/* Perfil → card Gestor financeiro (gestor.html) */
.card-gestor .gestor-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.card-gestor .gestor-acoes a { display: flex; align-items: center; justify-content: center; min-height: 52px; border-radius: 14px;
    text-decoration: none; font-weight: 700; font-size: 1rem; text-align: center; padding: 8px; }
.card-gestor .gestor-abrir { grid-column: 1 / -1; background: var(--bg-elevated); color: var(--text-color); border: 1px solid var(--border); }
.card-gestor .gestor-resumo { margin-top: 6px; font-size: 0.9rem; color: var(--label); }
/* Fechar/ghost legível no Claro (painéis do chat) */
html[data-theme="light"] body.pagina-chat .btn-ghost { color: var(--text-color); border-color: #cbd5e1; background: #ffffff; font-weight: 700; }
html[data-theme="light"] body.pagina-chat .btn-ghost:hover { background: #f1f5f9; }
body.pagina-chat .chat-msg-sheet-panel .btn-ghost { width: 100%; min-height: 44px; margin-top: 6px; }

/* ===== Foto de perfil (avatar.js / avatar-editor.js, SQL 47) ===== */
.mav { overflow: hidden; position: relative; }
.mav.mav-on { background: var(--bg-elevated, #1e293b); padding: 0; }
.mav .mav-img { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: 50%; }
.mav.mav-empresa { background: #fff; }
.mav.mav-empresa .mav-img { object-fit: contain; padding: 8%; box-sizing: border-box; }
.mav-xs, .mav-sm, .mav-md {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  border-radius: 50%; background: #334155; color: #F5A623; font-weight: 800; line-height: 1;
}
.mav-xs { width: 22px; height: 22px; font-size: 0.6rem; }
.mav-sm { width: 30px; height: 30px; font-size: 0.72rem; }
.mav-md { width: 40px; height: 40px; font-size: 0.9rem; }
html[data-theme="light"] .mav-xs, html[data-theme="light"] .mav-sm, html[data-theme="light"] .mav-md { background: #e2e8f0; color: #b45309; }
.lote-anunciante { display: flex; align-items: center; gap: 6px; min-width: 0; }
.lote-anunciante > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lote-vendedor { display: flex; align-items: center; gap: 10px; min-width: 0; overflow-wrap: anywhere; }
.admin-user-cel { display: inline-flex; align-items: center; gap: 8px; }
.chat-dir-item > .wa-av { width: 40px; height: 40px; font-size: 0.85rem; }
.chat-dir-item > .chat-dir-txt { flex: 1; min-width: 0; overflow-wrap: anywhere; }

/* Perfil hero: avatar tocável */
.perfil-hero-av-btn {
  position: relative; flex-shrink: 0; padding: 0; margin: 0; border: 0; background: none;
  border-radius: 50%; cursor: pointer; min-width: 52px; min-height: 52px; -webkit-tap-highlight-color: transparent;
}
.perfil-hero-av-btn:focus-visible { outline: 2px solid var(--accent-color, #F5A623); outline-offset: 3px; }
.perfil-hero-cam {
  position: absolute; right: -4px; bottom: -4px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--card-bg, #1e293b); border: 2px solid var(--accent-color, #F5A623);
  display: flex; align-items: center; justify-content: center; font-size: 11px; line-height: 1;
}
.perfil-hero-link {
  background: none; border: 0; padding: 6px 0 0; margin: 0; color: var(--accent-color, #F5A623);
  font-weight: 700; font-size: 0.85rem; cursor: pointer; min-height: 32px;
}

/* Editor */
.av-editor { position: fixed; inset: 0; z-index: 10050; display: flex; align-items: flex-end; justify-content: center; }
.av-editor.oculto { display: none; }
.av-ed-backdrop { position: absolute; inset: 0; background: rgba(2, 6, 23, 0.62); }
.av-ed-panel {
  position: relative; width: 100%; max-width: 480px; max-height: calc(100dvh - 24px); overflow-y: auto;
  background: var(--card-bg, #0f172a); color: var(--text-color, #f8fafc);
  border: 1px solid var(--border, rgba(71,85,105,.4)); border-bottom: 0;
  border-radius: 18px 18px 0 0; padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -10px 30px rgba(0,0,0,.35); box-sizing: border-box;
}
@media (min-width: 640px) { .av-editor { align-items: center; } .av-ed-panel { border-radius: 18px; border-bottom: 1px solid var(--border, rgba(71,85,105,.4)); } }
.av-ed-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.av-ed-head h3 { margin: 0; font-size: 1.05rem; border: 0; padding: 0; }
.av-ed-x {
  width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--bg-elevated, #1e293b);
  color: var(--text-color, #f8fafc); font-size: 1.4rem; line-height: 1; cursor: pointer; flex-shrink: 0;
}
.av-ed-acoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.av-ed-acao {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 72px; padding: 8px 4px; border-radius: 14px; cursor: pointer; text-align: center;
  background: var(--bg-elevated, #1e293b); color: var(--text-color, #f8fafc);
  border: 1px solid var(--border, rgba(71,85,105,.4)); font-size: 0.8rem; font-weight: 700; line-height: 1.2;
  font-family: inherit; box-sizing: border-box; min-width: 0;
}
.av-ed-acao .ai { font-size: 1.35rem; }
.av-ed-acao:active { border-color: var(--accent-color, #F5A623); }
.av-ed-sub { margin: 14px 0 8px; color: var(--muted, #94a3b8); font-size: 0.85rem; }
.av-ed-grade { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.av-preset {
  aspect-ratio: 1 / 1; min-height: 48px; width: 100%; padding: 0; border-radius: 50%; overflow: hidden; cursor: pointer;
  border: 2px solid transparent; background: var(--bg-elevated, #1e293b); box-sizing: border-box;
}
.av-preset img { width: 100%; height: 100%; display: block; }
.av-preset.on, .av-preset:focus-visible { border-color: var(--accent-color, #F5A623); outline: none; }
.av-ed-area {
  position: relative; width: 260px; height: 260px; max-width: 100%; margin: 0 auto; border-radius: 12px; overflow: hidden;
  touch-action: none; background: #0b1220; cursor: grab; user-select: none; -webkit-user-select: none;
}
.av-ed-area canvas { width: 100%; height: 100%; display: block; }
.av-ed-mascara {
  position: absolute; inset: 0; pointer-events: none; border-radius: 50%;
  box-shadow: 0 0 0 200px rgba(2, 6, 23, 0.55); border: 2px solid rgba(255,255,255,.85);
}
.av-ed-zoom { display: flex; align-items: center; gap: 10px; margin: 14px auto 4px; max-width: 280px; font-size: 0.9rem; }
.av-ed-zoom input[type="range"] { flex: 1; min-width: 0; accent-color: var(--accent-color, #F5A623); height: 32px; }
.av-ed-botoes { display: flex; gap: 10px; margin-top: 12px; }
.av-ed-botoes > button { flex: 1; min-height: 46px; }
#av-ed-msg:empty { display: none; }
#av-ed-msg { margin: 10px 0 0; font-size: 0.85rem; }
body.av-editor-aberto { overflow: hidden; }
#av-ed-msg.av-info { color: var(--muted, #94a3b8); }

/* Financeiro: '$ Empréstimos' (#nb-dock) ficava atrás da barra inferior (360x780,
   Caixa bloqueado). O card do Caixa usa backdrop-filter/filter (vidro + blur),
   o que prende position:fixed ao card, e o card tem overflow:hidden (sticky
   também não funciona). Solução: botão no fluxo, centralizado ao fim da tela
   inicial do Caixa; o padding inferior da página (barra + safe-area) garante
   que ele nunca fica sob a barra. */
body.pagina-financeiro .nb-dock,
.nb-dock {
  position: relative; left: auto; bottom: auto; transform: none;
  width: max-content; max-width: calc(100% - 24px);
  margin: 16px auto calc(8px + env(safe-area-inset-bottom, 0px)); z-index: 1; min-height: 44px;
}

/* Caixa bloqueado no tema Claro: o painel era forçado a vidro escuro, mas o texto
   herdava cores do Claro (título #0f172a sobre fundo escuro = invisível).
   No Claro o painel vira vidro claro com texto escuro de alto contraste. */
html[data-theme="light"] body.pagina-financeiro .caixa-lock-panel,
html[data-theme="light"] .caixa-lock-panel {
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid rgba(15, 23, 42, 0.12);
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
  color: #0f172a;
}
html[data-theme="light"] .caixa-lock-panel h3 { color: #0f172a; }
html[data-theme="light"] .caixa-lock-panel p,
html[data-theme="light"] .caixa-lock-panel .sub { color: #475569; }
html[data-theme="light"] .caixa-lock-panel strong { color: #0f172a; }
html[data-theme="light"] .caixa-lock-panel label { color: #334155; }
html[data-theme="light"] .caixa-lock-panel .msg.erro { color: #b91c1c; }
html[data-theme="light"] .caixa-lock-panel .msg.ok { color: #15803d; }
html[data-theme="light"] .caixa-lock-panel .btn-link, html[data-theme="light"] .caixa-lock-panel a { color: #b45309; }

/* Lote-detalhe: barra do topo legível no Claro e "Negociar no chat" como botão de verdade */
html[data-theme="light"] body.pagina-lote-detalhe .nb-inner-head {
  background: var(--bg-color, #f1f5f9);
  border-bottom-color: var(--border, #e2e8f0);
}
html[data-theme="light"] body.pagina-lote-detalhe .nb-inner-head h2 { color: var(--text-color, #0f172a); }
html[data-theme="light"] body.pagina-lote-detalhe .btn-voltar-round {
  background: var(--card-bg, #fff); color: var(--text-color, #0f172a); border: 1px solid var(--border, #e2e8f0);
}
body.pagina-lote-detalhe #detalhe a.btn-ok {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 46px; padding: 0 20px; border-radius: 12px; text-decoration: none;
  background: #F5A623; color: #0b1220; font-weight: 800; font-size: 0.95rem; line-height: 1.2;
  box-shadow: 0 6px 18px rgba(245, 166, 35, 0.28); max-width: 100%; box-sizing: border-box;
}
body.pagina-lote-detalhe #detalhe a.btn-ok:active { filter: brightness(0.95); }
html[data-theme="light"] body.pagina-lote-detalhe #detalhe a.btn-ok { background: #F5A623; color: #0b1220; }

/* Chat (lista de conversas) no tema Claro: o painel estava fixo em #0b1220 */
html[data-theme="light"] body.pagina-chat .chat-contacts-pane { background: var(--bg-color, #f1f5f9); }