/*
 * Gestão de Loteamentos — camada do sistema sobre o tema (Bootstrap 5.3 + tema em assets/tema).
 * As cores vêm das variáveis do tema (--bs-primary etc.), então funcionam também no modo escuro.
 */

/* ---------- Marca (texto) na barra lateral ---------- */
.marca-texto { display: flex; align-items: center; gap: .55rem; font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.05rem; color: var(--pe-emphasis-color); text-decoration: none; white-space: nowrap; overflow: hidden; }
.marca-texto .marca-icone { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--pe-primary); color: #fff; font-size: 1.05rem; }
.marca-texto .marca-nome { overflow: hidden; text-overflow: ellipsis; }
[data-sidebar=icon] .pe-app-sidebar:not(:hover) .marca-nome { display: none; }

/* ---------- Busca no cabeçalho ---------- */
.busca-global { position: relative; width: 340px; }
.busca-global i { position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--pe-secondary-color); }
.busca-global input { padding-left: 2.3rem; border-radius: 50rem; background: var(--pe-tertiary-bg); border-color: transparent; }
.busca-global input:focus { background: var(--pe-body-bg); }

/* ---------- Cabeçalho de página ---------- */
.cabecalho { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin: 1rem 0 1.25rem; }
.cabecalho h1 { font-family: 'Poppins', sans-serif; font-size: 1.2rem; font-weight: 600; margin: 0; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.cabecalho h1 > i.bi { color: var(--pe-primary); }
.cabecalho .sub { color: var(--pe-secondary-color); font-size: .85rem; margin-top: .15rem; }

/* ---------- Cartões e indicadores ---------- */
.card-header { font-family: 'Poppins', sans-serif; font-weight: 600; }
.kpi { padding: 1.15rem 1.25rem; position: relative; overflow: hidden; }
.kpi .rot { color: var(--pe-secondary-color); font-size: .8rem; font-weight: 500; }
.kpi .val { font-family: 'Poppins', sans-serif; font-size: 1.45rem; font-weight: 700; margin-top: .2rem; color: var(--pe-emphasis-color); line-height: 1.25; word-break: break-word; }
.kpi .det { font-size: .78rem; color: var(--pe-secondary-color); margin-top: .15rem; }
.kpi::after { content: ''; position: absolute; right: -18px; top: -18px; width: 64px; height: 64px; border-radius: 50%; background: var(--pe-primary-bg-subtle); opacity: .7; }

/* ---------- Tabelas ---------- */
.table { margin-bottom: 0; }
.table > thead th { font-weight: 600; font-size: .78rem; color: var(--pe-secondary-color); white-space: nowrap; background: var(--pe-tertiary-bg); }
.table td { vertical-align: middle; }
.card > .table-responsive:last-child .table, .card > .table:last-child { margin-bottom: 0; }

/* ---------- Formulários ---------- */
.form-label { font-weight: 500; font-size: .84rem; margin-bottom: .3rem; }
.secao-form { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: .92rem; color: var(--pe-primary); border-bottom: 1px dashed var(--pe-border-color); padding-bottom: .4rem; margin: 1.1rem 0 .3rem; }

/* ---------- Abas ---------- */
.nav-tabs .nav-link { color: var(--pe-secondary-color); font-weight: 500; }
.nav-tabs .nav-link.active { color: var(--pe-primary); font-weight: 600; }

/* ---------- Listas de dados ---------- */
.dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .7rem 1.2rem; }
.dl-grid div small { display: block; color: var(--pe-secondary-color); font-size: .74rem; }
.dl-grid div span { font-weight: 500; }

/* ---------- Espelho de vendas ---------- */
.mapa-quadra { margin-bottom: 1.2rem; }
.mapa-quadra h6 { font-weight: 700; margin-bottom: .45rem; }
.mapa-lotes { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 6px; }
.lote-cel { border-radius: 8px; padding: .45rem .35rem; text-align: center; font-size: .78rem; color: #fff; cursor: pointer; text-decoration: none; line-height: 1.2; border: 2px solid transparent; transition: transform .1s; }
.lote-cel b { display: block; font-size: .95rem; }
.lote-cel:hover { border-color: var(--pe-emphasis-color); color: #fff; transform: translateY(-1px); }
.lote-disponivel { background: #18a538; } .lote-reservado { background: #f2a51a; } .lote-vendido { background: #3d79f2; }
.lote-quitado { background: #0aa2c0; } .lote-escriturado { background: #343a40; } .lote-bloqueado, .lote-permuta, .lote-caucionado { background: #9aa5a0; }
.legenda span { display: inline-flex; align-items: center; gap: .35rem; margin-right: 1rem; font-size: .8rem; }
.legenda i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }

/* ---------- Linha do tempo ---------- */
.timeline { border-left: 2px solid var(--pe-border-color); padding-left: 1rem; }
.timeline .item { position: relative; margin-bottom: .9rem; }
.timeline .item::before { content: ''; position: absolute; left: -1.38rem; top: .3rem; width: 10px; height: 10px; border-radius: 50%; background: var(--pe-primary); }

/* ---------- Documentos ---------- */
.tabela-doc { width: 100%; border-collapse: collapse; font-size: .85rem; }
.tabela-doc th, .tabela-doc td { border: 1px solid #999; padding: 3px 6px; }
.documento { background: #fff; color: #000; max-width: 820px; margin: 0 auto; padding: 2.5rem 3rem; font-family: 'Times New Roman', serif; font-size: 12pt; line-height: 1.55; text-align: justify; }
.documento h2 { font-size: 14pt; } .documento h3 { font-size: 12pt; margin-top: 1rem; }
.text-money { font-variant-numeric: tabular-nums; }

/* ---------- Tom Select no tema ---------- */
.ts-wrapper.form-select .ts-control, .ts-wrapper .ts-control { background-color: var(--pe-body-bg); color: var(--pe-body-color); border-color: var(--pe-border-color); }
.ts-dropdown { background: var(--pe-body-bg); color: var(--pe-body-color); border-color: var(--pe-border-color); }
.ts-dropdown .active { background: var(--pe-primary-bg-subtle); color: var(--pe-emphasis-color); }

/* ---------- Avisos no topo ---------- */
.app-avisos .alert { margin-bottom: .75rem; }

/* ---------- Impressão ---------- */
@media print {
    .pe-app-sidebar, .app-header, .footer, .no-print, .alert, .sidebar-backdrop { display: none !important; }
    .app-wrapper { margin: 0 !important; padding: 0 !important; }
    .card { border: 0; box-shadow: none; }
    body { background: #fff; font-size: 11pt; }
}

/* Cartões dentro de grades: o espaçamento vem do gutter da linha */
.row > [class*="col"] > .card { margin-bottom: 0; }
.row.mb-3 > [class*="col"] > .card, .row.mb-4 > [class*="col"] > .card { margin-bottom: 0; }

/* ---------- Leitura automática (IA) ---------- */
.leitura-ia { border: 1px dashed var(--pe-primary); border-radius: .75rem; padding: 1rem 1.1rem; background: var(--pe-primary-bg-subtle); transition: background .15s; }
.leitura-ia.arrastando { background: var(--pe-body-bg); border-style: solid; }
.leitura-ia.lendo { opacity: .85; }
.leitura-ia-icone { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: var(--pe-primary); color: #fff; font-size: 1.25rem; flex: 0 0 42px; }
.campo-ia, .ts-wrapper.campo-ia .ts-control { background-color: var(--pe-warning-bg-subtle) !important; border-color: var(--pe-warning) !important; }
.tabela-importacao input.form-control-sm { min-width: 70px; padding: .2rem .4rem; }
.tabela-importacao tr.ignorar td { opacity: .45; }
.tabela-importacao tr.ignorar td:first-child { opacity: 1; }

/* ---------- Logo da marca (Configurações > Aparência) ---------- */
.marca-logo { display: block; height: var(--logo-h, 36px); width: auto; max-width: var(--logo-w, 190px); object-fit: contain; object-position: left center; }
[data-bs-theme=dark] .marca-logo-clara, [data-bs-theme=light] .marca-logo-escura { display: none; }
.marca-mini { display: none; }
.marca-icone-img { width: 34px; height: 34px; object-fit: contain; display: block; }
.marca-icone.marca-icone-livre { background: transparent; }
[data-sidebar=icon] .pe-app-sidebar:not(:hover) .marca-com-logo .marca-logo { display: none; }
[data-sidebar=icon] .pe-app-sidebar:not(:hover) .marca-com-logo .marca-mini { display: block; }
.marca-com-logo .marca-mini .marca-icone { width: 34px; height: 34px; }
.marca-login { display: inline-flex; justify-content: center; }
.marca-login .marca-logo { height: var(--logo-h, 64px); max-width: min(var(--logo-w, 280px), 100%); object-position: center; }
.auth-marca .marca-login .marca-icone { width: 46px; height: 46px; }

/* ---------- Mapa de disponibilidade (Google Maps) ---------- */
.mapa-lotes-area { position: relative; width: 100%; height: 72vh; min-height: 420px; border-radius: .6rem; overflow: hidden; background: var(--pe-tertiary-bg); }
.mapa-rotulo { position: absolute; transform: translate(-50%, -50%); pointer-events: none; white-space: nowrap; font-family: 'Inter', sans-serif; text-shadow: 0 0 3px rgba(0,0,0,.9), 0 0 2px rgba(0,0,0,.9); color: #fff; }
.mapa-rotulo-lote { font-size: 11px; font-weight: 700; }
.mapa-rotulo-quadra { font-size: 13px; font-weight: 800; letter-spacing: .02em; }
.mapa-balao { font-size: 13px; line-height: 1.45; min-width: 190px; color: #222; }
.mapa-balao .badge { color: #fff; }
.mapa-legenda { display: flex; flex-wrap: wrap; gap: .4rem .9rem; font-size: .82rem; }
.mapa-legenda label { display: inline-flex; align-items: center; gap: .35rem; cursor: pointer; user-select: none; }
.mapa-legenda i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.mapa-legenda input { margin: 0; }
.mapa-aviso { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 2rem; }

#listaLotes .item-lote.active small { color: inherit !important; opacity: .85; }