/* 90-manual.css — manual do sistema e ícones de ajuda
   Extraído de index.html por split_css.py.
   O NÚMERO no nome é a posição na cascata: os arquivos são
   carregados em ordem alfabética de nome, e é essa ordem que
   decide quem ganha o desempate entre regras de mesma
   especificidade. Não renumere sem conferir o que passa a
   sobrescrever o quê. */
    /* ════════════════════════════════════════════
       MANUAL DO SISTEMA — Modal + Ícones contextuais ⓘ
    ════════════════════════════════════════════ */
    #manual-overlay {
      position: fixed; inset: 0;
      background: rgba(8, 11, 17, 0.78);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
      z-index: 10000;
      display: none;
      align-items: center; justify-content: center;
      padding: 32px;
    }
    #manual-overlay.open { display: flex; }
    .manual-modal {
      width: min(1180px, 100%);
      height: min(820px, 100%);
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 8px;
      display: grid;
      grid-template-rows: auto 1fr;
      overflow: hidden;
      box-shadow: 0 20px 60px rgba(0,0,0,0.6);
    }
    .manual-head {
      display: flex; align-items: center; gap: 12px;
      padding: 14px 20px;
      border-bottom: 1px solid var(--border);
      background: var(--surface);
    }
    .manual-head-title {
      font-family: var(--body);
      font-size: 15px; font-weight: 600;
      color: var(--text);
      letter-spacing: 0.02em;
    }
    .manual-head-sub {
      font-family: var(--display);
      font-size: 11px; color: var(--muted);
      letter-spacing: 0.14em; text-transform: uppercase;
    }
    .manual-head-close {
      margin-left: auto;
      background: transparent;
      border: 1px solid var(--border);
      color: var(--muted);
      width: 28px; height: 28px;
      border-radius: 4px;
      cursor: pointer;
      font-size: 14px;
      transition: all 0.15s;
    }
    .manual-head-close:hover { color: #ef9a9a; border-color: #ef9a9a; }
    .manual-body {
      display: grid;
      grid-template-columns: 240px 1fr;
      overflow: hidden;
    }
    .manual-nav {
      border-right: 1px solid var(--border);
      background: var(--surface);
      padding: 16px 0;
      overflow-y: auto;
    }
    .manual-nav-group {
      font-family: var(--display);
      font-size: 10px;
      color: rgba(255,255,255,.62);
      letter-spacing: 0.18em;
      text-transform: uppercase;
      padding: 12px 18px 6px;
    }
    .manual-nav-item {
      display: block;
      padding: 8px 18px;
      font-family: var(--body);
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      border-left: 2px solid transparent;
      transition: all 0.12s;
      text-decoration: none;
    }
    .manual-nav-item:hover {
      color: var(--text);
      background: rgba(255,255,255,0.03);
    }
    .manual-nav-item.active {
      color: #29b6f6;
      border-left-color: #29b6f6;
      background: rgba(41,182,246,0.06);
    }
    .manual-content {
      padding: 26px 36px 60px;
      overflow-y: auto;
      font-family: var(--body);
      color: var(--text);
      line-height: 1.6;
    }
    .manual-section { display: none; }
    .manual-section.active { display: block; }
    .manual-section h2 {
      font-family: var(--body);
      font-size: 22px; font-weight: 600;
      margin-bottom: 6px;
      letter-spacing: -0.01em;
    }
    .manual-section h3 {
      font-family: var(--body);
      font-size: 15px; font-weight: 600;
      margin-top: 26px; margin-bottom: 10px;
      color: #dde8f8;
      padding-bottom: 6px;
      border-bottom: 1px solid var(--border);
    }
    .manual-section h4 {
      font-family: var(--body);
      font-size: 13px; font-weight: 600;
      margin-top: 16px; margin-bottom: 6px;
      color: #b9c8de;
    }
    .manual-section p { font-size: 13.5px; color: #b9c8de; margin-bottom: 10px; }
    .manual-section .manual-lead {
      font-size: 12px; color: var(--muted);
      font-family: var(--display);
      letter-spacing: 0.1em;
      text-transform: uppercase;
      margin-bottom: 18px;
    }
    .manual-section ul { list-style: none; padding-left: 0; }
    .manual-section li {
      font-size: 13px;
      color: #b9c8de;
      padding: 4px 0 4px 16px;
      position: relative;
    }
    .manual-section li::before {
      content: '·';
      position: absolute; left: 4px; top: 4px;
      color: #29b6f6;
      font-weight: bold;
    }
    .manual-section code {
      font-family: var(--display);
      font-size: 11.5px;
      background: rgba(41,182,246,0.08);
      color: #80cbc4;
      padding: 1px 6px;
      border-radius: 3px;
      letter-spacing: 0.02em;
    }
    .manual-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-left: 3px solid #29b6f6;
      border-radius: 4px;
      padding: 14px 16px;
      margin: 12px 0;
    }
    .manual-card.eu       { border-left-color: #ef9a9a; }
    .manual-card.quadra   { border-left-color: #81c784; }
    .manual-card.setor    { border-left-color: #38bdf8; }
    .manual-card.distrito { border-left-color: #ffd54f; }
    .manual-card.lote     { border-left-color: #38bdf8; }
    .manual-card-title {
      font-family: var(--body);
      font-size: 14px; font-weight: 600;
      margin-bottom: 4px;
      color: var(--text);
    }
    .manual-card-sub {
      font-family: var(--display);
      font-size: 10.5px;
      color: var(--muted);
      letter-spacing: 0.12em;
      text-transform: uppercase;
      margin-bottom: 8px;
    }
    .manual-card dl {
      display: grid;
      grid-template-columns: 130px 1fr;
      gap: 4px 14px;
      font-size: 12.5px;
      margin-top: 6px;
    }
    .manual-card dt {
      font-family: var(--display);
      font-size: 11px;
      color: var(--muted);
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding-top: 2px;
    }
    .manual-card dd { color: #b9c8de; }
    .manual-table {
      width: 100%;
      border-collapse: collapse;
      margin: 10px 0;
      font-size: 12.5px;
    }
    .manual-table th, .manual-table td {
      text-align: left;
      padding: 8px 10px;
      border-bottom: 1px solid var(--border);
      vertical-align: top;
    }
    .manual-table th {
      font-family: var(--display);
      font-size: 10.5px;
      color: var(--muted);
      letter-spacing: 0.12em;
      text-transform: uppercase;
      font-weight: 500;
      background: var(--surface);
    }
    .manual-table td { color: #b9c8de; }
    .manual-tag {
      display: inline-block;
      font-family: var(--display);
      font-size: 10px;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 2px 7px;
      border-radius: 3px;
      background: rgba(125,133,144,0.12);
      color: var(--muted);
      margin-right: 4px;
    }
    .manual-tag.geo  { background: rgba(129,199,132,0.12); color: #81c784; }
    .manual-tag.csv  { background: rgba(56,189,248,0.12);  color: #38bdf8; }
    .manual-tag.json { background: rgba(255,213,79,0.12);  color: #ffd54f; }
    .manual-tag.calc { background: rgba(179,136,255,0.12); color: #b388ff; }
    .manual-link-section {
      color: #29b6f6;
      cursor: pointer;
      text-decoration: none;
      border-bottom: 1px dashed rgba(41,182,246,0.4);
    }
    .manual-link-section:hover { color: #38bdf8; }

    /* Busca dentro do Manual */
    .manual-search-wrap {
      padding: 12px 14px 10px;
      border-bottom: 1px solid var(--border);
      position: sticky; top: 0;
      background: var(--surface);
      z-index: 2;
    }
    .manual-search-row {
      position: relative;
    }
    .manual-search-icon {
      position: absolute;
      left: 10px; top: 50%;
      transform: translateY(-50%);
      color: var(--muted);
      font-size: 12px;
      pointer-events: none;
    }
    .manual-search-input {
      width: 100%;
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 4px;
      padding: 7px 28px 7px 28px;
      color: var(--text);
      font-family: var(--body);
      font-size: 13px;
      outline: none;
      transition: border-color 0.15s;
    }
    .manual-search-input:focus { border-color: #29b6f6; }
    .manual-search-input::placeholder { color: rgba(255,255,255,.5); }
    .manual-search-clear {
      position: absolute;
      right: 8px; top: 50%;
      transform: translateY(-50%);
      background: transparent;
      border: none;
      color: var(--muted);
      cursor: pointer;
      font-size: 14px;
      padding: 2px 6px;
      display: none;
    }
    .manual-search-clear.show { display: block; }
    .manual-search-clear:hover { color: #ef9a9a; }
    .manual-search-status {
      font-family: var(--display);
      font-size: 10px;
      color: var(--muted);
      letter-spacing: 0.1em;
      text-transform: uppercase;
      margin-top: 6px;
      min-height: 12px;
    }
    .manual-search-status.empty { color: #ef9a9a; }

    .manual-nav-item { position: relative; }
    .manual-nav-count {
      position: absolute;
      right: 12px;
      top: 50%;
      transform: translateY(-50%);
      font-family: var(--display);
      font-size: 10px;
      background: rgba(41,182,246,0.15);
      color: #29b6f6;
      padding: 1px 6px;
      border-radius: 3px;
      line-height: 1.4;
    }
    mark.manual-mark {
      background: rgba(255, 213, 79, 0.32);
      color: #ffe082;
      padding: 0 2px;
      border-radius: 2px;
    }
    mark.manual-mark.current {
      background: rgba(255, 213, 79, 0.7);
      color: #1d1f23;
      box-shadow: 0 0 0 1px #ffd54f;
    }

    /* Ícone ⓘ contextual — pequeno, ao lado de títulos de seção/painel */
    .info-dot {
      display: inline-flex;
      align-items: center; justify-content: center;
      width: 14px; height: 14px;
      border-radius: 50%;
      border: 1px solid rgba(255,255,255,.45);
      color: var(--muted);
      font-family: var(--display);
      font-size: 9px;
      font-weight: bold;
      cursor: pointer;
      margin-left: 6px;
      flex-shrink: 0;
      transition: all 0.15s;
      background: transparent;
      vertical-align: middle;
    }
    .info-dot:hover {
      color: #29b6f6;
      border-color: #29b6f6;
      background: rgba(41,182,246,0.1);
    }
    /* Alinhamento da coluna de toggles. Nem todo item tem "?", e sem isso o
       switch dos que não têm avança para a direita e a coluna fica serrilhada.
       28px = gap do .sb-item (8) + margin-left do dot (6) + largura dele (14). */
    .sb-item > .sw:last-child { margin-right: 28px; }


  /* ── Toggle de evolução IPTU (IPTU pago × Valor m²) ── */
  .iptu-evo-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 8px;
  }
  .iptu-evo-btn {
    flex: 1;
    font-family: var(--display);
    font-size: 9.5px;
    letter-spacing: 0.08em;
    color: var(--muted);
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 6px;
    padding: 5px 6px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
  }
  .iptu-evo-btn:hover { background: rgba(255,255,255,0.08); color: var(--text); }
  .iptu-evo-btn.active {
    background: rgba(251,113,133,0.16);
    border-color: rgba(251,113,133,0.45);
    color: #fb7185;
    font-weight: 700;
  }
  /* Variante âmbar para o accordion ITBI */
  .iptu-evo.itbi .iptu-evo-btn.active {
    background: rgba(245,158,11,0.16);
    border-color: rgba(245,158,11,0.45);
    color: #ffb74d;
  }