/* Celular: a maioria dos prestadores usa a ORC no telefone, na obra.
   Barra de menu embaixo (alcance do polegar), total do orçamento sempre visível,
   agenda compacta e campos de 16 px (o iPhone não dá zoom ao tocar). */
.tabbar, .mais, .ob-barra { display: none; }

@media (max-width: 760px) {
  /* Topo enxuto: Assistente e Sair ficam em "Mais" */
  #plano-chip, #eu-chip, #btn-assist, #btn-sair { display: none; }
  .nav .wrap { height: 56px; }

  /* Menu: some o de cima, entra a barra de baixo */
  .menu { display: none; }
  .tabbar {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    background: rgba(12, 16, 25, .97); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
    border-top: 1px solid var(--line-strong);
    padding: 6px max(6px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-left, 0px));
  }
  .tabbar button {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-height: 54px; padding: 6px 2px; border: 0; border-radius: 12px; background: none;
    color: var(--muted); font-family: var(--body); font-weight: 700; font-size: .72rem; cursor: pointer;
  }
  .tabbar svg { width: 24px; height: 24px; }
  .tabbar [aria-current="page"] { color: var(--accent-2); background: rgba(0, 163, 255, .1); }
  .tabbar [data-view="orcamento"] svg { background: var(--accent); color: var(--accent-ink); border-radius: 8px; padding: 2px; }

  .mais:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 39; background: rgba(3, 6, 12, .55); }
  .mais-caixa {
    position: absolute; left: 10px; right: 10px; bottom: calc(80px + env(safe-area-inset-bottom, 0px));
    display: grid; gap: 4px; padding: 8px; border-radius: 16px;
    background: var(--surface); border: 1px solid var(--line-strong); box-shadow: 0 20px 60px rgba(0, 0, 0, .55);
  }
  .mais-caixa button {
    display: flex; align-items: center; gap: 12px; min-height: 54px; padding: 10px 14px; border: 0; border-radius: 10px;
    background: none; color: var(--text); font-family: var(--body); font-weight: 600; font-size: 1rem; text-align: left; cursor: pointer;
  }
  .mais-caixa button:active { background: rgba(0, 163, 255, .1); }
  .mais-caixa svg { width: 22px; height: 22px; color: var(--accent-2); flex: none; }

  main.app { padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }
  body > footer { padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important; }

  /* Toque: campos de 16 px e botões altos */
  .input, select, textarea { font-size: 16px !important; }
  .btn { min-height: 46px; }
  .btn-sm { min-height: 40px; }
  .tela { margin: 16px 0 14px; }
  .tela h1 { font-size: 1.45rem; }
  .tela p { font-size: .95rem; }

  /* Novo orçamento */
  .ob-sec { padding: 14px; }
  .ob-sec > header { margin-bottom: 12px; }
  .ob-cat { max-height: none; overflow: visible; grid-template-columns: minmax(0, 1fr); }
  .ob-tipo { padding: 14px; }
  .ob-mais { border-style: dashed; text-align: center; align-items: center; }
  .ob-modos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ob-slide { grid-template-columns: minmax(0, 1fr) 104px; }
  .ob-un { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ob-un .field:first-child { grid-column: 1 / -1; }
  .ob-step button { width: 44px; height: 44px; }
  .ob-step-l button { width: 48px; height: 46px; }
  .ob-grid { padding-bottom: 76px; }
  .ob-barra:not([hidden]) {
    display: flex; justify-content: space-between; align-items: center; gap: 12px;
    position: fixed; left: 0; right: 0; bottom: calc(66px + env(safe-area-inset-bottom, 0px)); z-index: 35;
    padding: 10px max(16px, env(safe-area-inset-right, 0px)) 10px max(16px, env(safe-area-inset-left, 0px));
    background: var(--surface-2); border-top: 1px solid var(--accent); box-shadow: 0 -10px 30px rgba(0, 0, 0, .35);
  }
  .ob-barra small { display: block; color: var(--muted); font-size: .75rem; }
  .ob-barra b { font-family: var(--mono); font-size: 1.3rem; font-weight: 500; color: var(--accent-2); }
  .ob-barra .btn { min-width: 128px; }

  /* Agenda compacta: bolinhas no lugar dos nomes, toque no dia para ver detalhes */
  .ag-cal { padding: 6px; overflow: visible; }
  .ag-mes { min-width: 0; }
  .ag-cels, .ag-sem { gap: 3px; }
  .ag-sem span { padding: 2px; text-align: center; font-size: .62rem; }
  .ag-cel { min-height: 52px; padding: 5px 4px; border-radius: 8px; align-items: center; }
  .ag-tag, .ag-mais { display: none; }
  .ag-chips { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 3px; }
  .ag-chip { font-size: 0; width: 8px; height: 8px; padding: 0; border: 0 !important; border-radius: 50%; background: var(--c); }
  .ag-chip.prov { background: transparent; box-shadow: inset 0 0 0 1.5px var(--c); }
  .ag-cel.t-livre:not(.passado):not(.fora)::after { content: ""; position: absolute; right: 4px; top: 5px; width: 5px; height: 5px; border-radius: 50%; background: var(--ok); }
  .ag-semana { grid-template-columns: minmax(0, 1fr); min-width: 0; }
  .ag-col { min-height: 0; }
  .ag-nav h2 { font-size: 1.1rem; width: 100%; margin: 6px 0 0; order: -1; }
  .ag-dir { width: 100%; }
  .ag-modos { flex: 1; }
  .ag-modos button { flex: 1; }
  .ag-legenda { gap: 6px 10px; }
  .ag-acoes .btn { flex: 1 1 calc(50% - 6px); justify-content: center; }
  .ag-folga { flex-wrap: wrap; }
  .ag-folga .input { flex: 1 1 100%; }

  /* Orçamentos e contratos */
  .dc { padding: 14px; }
  .dc-topo .btn { width: 100%; }
  .dc-abas { width: 100%; }
  .dc-abas button { flex: 1; padding: 10px 6px; }
  .dc-acoes .btn { flex: 1 1 calc(50% - 8px); justify-content: center; }
  .dc-acoes .dc-wa { flex-basis: 100%; }
  .dc-canc { margin-left: 0; width: 100%; text-align: center; padding: 10px; }
  .dc-valor { font-size: 1.2rem; }
  .dc-aprovar .input { max-width: none; }

  /* Preços e empresa */
  .pr-i .unit .input { padding-right: 58px; }
  .plano-box .btn { width: 100%; }

  /* Assistente em tela cheia, com folga para a barra do sistema */
  .modal { padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
}