/* ══════════════════════════════════════════════════════
   SOLVIX — Responsive Module
   Desktop first → tablet → mobile premium
   ══════════════════════════════════════════════════════ */

/* ── Tablet ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .hdr { padding: 0 14px; height: calc(54px + var(--sat)); padding-top: var(--sat); }
  .hdr-brand-text { font-size: 18px; letter-spacing: 2px; }
  .hdr-logo { height: 34px; }
  .hdr-user { gap: 8px; font-size: 12px; }
  .hdr-nome { display: none; }
  #hdr-plano { display: none; }
  .app-body { padding: 12px 10px 100px; } /* espaço para bottom nav */
  .panel { padding: 16px 14px; }
  .tabs { display: none !important; } /* substituída pelo bottom nav no mobile */
  .dt th, .dt td { padding: 8px 10px; font-size: 12px; white-space: nowrap; }
}

/* ── Mobile premium ──────────────────────────────────── */
@media (max-width: 600px) {
  .g2, .g3 { grid-template-columns: 1fr; }
  .inv-grid { grid-template-columns: 1fr 1fr; }

  /* Bottom-sheet modal — sobe do fundo */
  .modal-bg { align-items: flex-end; }
  .modal {
    width: 100%; max-width: 100%;
    border-radius: 20px 20px 0 0;
    max-height: 92vh;
    padding: 20px 18px 32px;
    animation: slideUp .28s cubic-bezier(.32,.72,0,1);
  }
  .modal::before {
    content: '';
    display: block;
    width: 40px; height: 4px;
    background: #3a3a3a;
    border-radius: 2px;
    margin: 0 auto 18px;
  }

  .steps { gap: 0; }
  .sl { font-size: 8px; }
  .sn { width: 24px; height: 24px; font-size: 11px; }

  /* Cards de resumo financeiro em 2 colunas */
  #fin-resumo-cards, #adp-cards { grid-template-columns: 1fr 1fr !important; }

  /* Tabelas viram cards empilhados */
  .dt-mobile-cards thead { display: none; }
  .dt-mobile-cards tbody tr {
    display: block;
    background: #1a1a1a;
    border: 1px solid #2a2a2a;
    border-radius: 10px;
    margin-bottom: 8px;
    padding: 12px 14px;
  }
  .dt-mobile-cards tbody td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    border: none;
    font-size: 13px;
  }
  .dt-mobile-cards tbody td::before {
    content: attr(data-label);
    font-size: 11px;
    color: #666;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    flex-shrink: 0;
    margin-right: 8px;
  }
  .dt-mobile-cards tbody td:last-child {
    padding-top: 10px;
    margin-top: 6px;
    border-top: 1px solid #2a2a2a;
    justify-content: flex-end;
    gap: 6px;
  }
  .dt-mobile-cards tbody td:last-child::before { display: none; }

  /* Botões mais largos para toque fácil */
  .btn-p { font-size: 15px; padding: 14px 20px; }
  .btn-sm { padding: 10px 16px; font-size: 13px; }
}

@media (max-width: 480px) {
  .slvx-box { padding: 32px 22px; }
  #fin-resumo-cards, #adp-cards { grid-template-columns: 1fr 1fr !important; }
}

/* ── Desktop largo ───────────────────────────────────── */
@media (min-width: 1080px) {
  .app-body { padding: 32px 24px; }
  .panel { padding: 32px; }
  .tabs { gap: 10px; margin-bottom: 28px; }
  .tab { padding: 10px 22px; font-size: 14px; }
  .dt th, .dt td { padding: 11px 16px; font-size: 14px; }
}

/* ── Bottom nav (só mobile) ─────────────────────────── */
/* ══ BOTTOM NAV PREMIUM ══════════════════════════════════════════ */
#bottom-nav {
  display: none;
}

@media (max-width: 768px) {

  /* Espaço para o nav flutuante não cobrir conteúdo */
  #scr-app .app-body { padding-bottom: 96px; }

  #bottom-nav {
    display: flex;
    position: fixed;
    bottom: 12px;
    left: 14px; right: 14px;
    background: rgba(10, 10, 14, 0.92);
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 28px;
    height: 64px;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    z-index: 200;
    align-items: stretch;
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    box-shadow: 0 16px 48px rgba(0,0,0,.6), 0 1px 0 rgba(255,255,255,.05) inset, 0 0 0 1px rgba(255,255,255,.04);
  }

  /* Itens normais */
  .bn-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    position: relative;
    padding: 8px 4px 6px;
    -webkit-tap-highlight-color: transparent;
    transition: opacity .12s;
    border-radius: 26px;
  }
  .bn-item:active { opacity: .6; transform: scale(.96); }

  /* Ícone inativo */
  .bn-icon {
    font-size: 20px;
    color: #2e2e42;
    line-height: 1;
    transition: color .2s;
  }

  /* Label inativo */
  .bn-label {
    font-size: 9px;
    color: #2e2e42;
    letter-spacing: .3px;
    font-weight: 500;
    font-family: 'Outfit', sans-serif;
    transition: color .2s;
  }

  /* Estado ativo — dourado premium */
  .bn-item.active .bn-icon  { color: #F5B700; }
  .bn-item.active .bn-label { color: #F5B700; font-weight: 700; }

  /* Bolinha dourada + glow */
  .bn-item.active::after {
    content: '';
    position: absolute;
    bottom: 4px;
    left: 50%; transform: translateX(-50%);
    width: 4px; height: 4px;
    background: #F5B700;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(245,183,0,.7);
  }

  /* FAB central — Nova Proposta */
  .bn-fab-wrap {
    flex: 1.2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    padding-top: 0;
  }

  .bn-fab {
    width: 50px; height: 50px;
    border-radius: 16px;
    background: linear-gradient(145deg, #F5C842, #D4A017, #B8860B);
    border: none;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px;
    cursor: pointer;
    position: absolute;
    top: 50%; transform: translateY(-50%);
    box-shadow:
      0 0 0 2.5px rgba(10,10,14,.92),
      0 0 0 4px rgba(245,183,0,.2),
      0 6px 24px rgba(245,183,0,.35),
      0 0 40px rgba(245,183,0,.1);
    -webkit-tap-highlight-color: transparent;
    transition: transform .15s cubic-bezier(.16,1,.3,1), box-shadow .15s;
  }
  .bn-fab:active {
    transform: translateY(-50%) scale(.90);
    box-shadow: 0 0 0 2.5px rgba(10,10,14,.92), 0 0 0 4px rgba(245,183,0,.15), 0 3px 12px rgba(245,183,0,.25);
  }

  .bn-fab-label {
    font-size: 9px;
    color: #D4A017;
    font-weight: 700;
    font-family: 'Outfit', sans-serif;
    position: absolute;
    bottom: 5px;
    left: 50%; transform: translateX(-50%);
    white-space: nowrap;
    letter-spacing: .2px;
  }

  /* Badge de notificação */
  .bn-badge {
    position: absolute;
    top: 6px; right: calc(50% - 16px);
    width: 6px; height: 6px;
    background: #e65100;
    border-radius: 50%;
    border: 1.5px solid rgba(14,14,14,.96);
    box-shadow: 0 0 4px rgba(230,81,0,.6);
  }
}

/* ── Drawer "Mais" ───────────────────────────────────── */
/* ══ DRAWER PREMIUM ═══════════════════════════════════════════════ */

#more-drawer-bg {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 300;
}
#more-drawer-bg.open { display: block; }

#more-drawer {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  background: var(--card);
  border-radius: 28px 28px 0 0;
  border-top: 1px solid var(--border2);
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  box-shadow: 0 -20px 60px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  z-index: 301;
  transform: translateY(100%);
  transition: transform .3s cubic-bezier(.32,.72,0,1);
  overflow: hidden;
  max-height: 92vh;
}
#more-drawer.open { transform: translateY(0); }

/* Orbs ambientes */
.drw-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}
.drw-orb-top {
  top: -80px; left: -60px;
  width: 240px; height: 240px;
  background: radial-gradient(circle, rgba(168,85,247,.13) 0%, transparent 70%);
}
.drw-orb-bottom {
  bottom: -50px; right: -40px;
  width: 180px; height: 180px;
  background: radial-gradient(circle, rgba(245,183,0,.08) 0%, transparent 70%);
}

/* Scroll interior */
.drw-inner {
  position: relative;
  z-index: 1;
  padding: 0 14px 28px;
  overflow-y: auto;
  max-height: 92vh;
  -webkit-overflow-scrolling: touch;
}

/* Handle */
.drw-handle {
  width: 34px; height: 3px;
  background: rgba(255,255,255,.12);
  border-radius: 2px;
  margin: 12px auto 16px;
}

/* Header */
.drw-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  padding: 0 2px;
}
.drw-logo {
  font-size: 20px; font-weight: 800;
  color: #F5B700; letter-spacing: -1px; line-height: 1;
  font-family: 'Outfit', sans-serif;
}
.drw-logo-sub {
  font-size: 10.5px; color: #2e2e45;
  font-weight: 400; margin-top: 2px; letter-spacing: .3px;
  font-family: 'Outfit', sans-serif;
}
.drw-close-btn {
  width: 32px; height: 32px; border-radius: 9px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  display: flex; align-items: center; justify-content: center;
  color: #4a4a6a; cursor: pointer;
  transition: background .15s, color .15s;
  flex-shrink: 0;
}
.drw-close-btn:active { background: rgba(255,255,255,.1); color: #888; }

/* Profile card */
.drw-profile {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, rgba(35,18,75,.85), rgba(18,12,42,.7));
  border: 1px solid rgba(168,85,247,.22);
  border-radius: 18px;
  padding: 13px 15px;
  margin-bottom: 20px;
  display: flex; align-items: center; gap: 13px;
  cursor: pointer;
  box-shadow: 0 4px 28px rgba(168,85,247,.10), inset 0 1px 0 rgba(255,255,255,.05);
  -webkit-tap-highlight-color: transparent;
  transition: transform .15s, box-shadow .15s;
}
.drw-profile:active { transform: scale(.985); box-shadow: 0 2px 14px rgba(168,85,247,.08); }
.drw-profile-glow {
  position: absolute; top: -30px; left: -20px;
  width: 100px; height: 100px; border-radius: 50%;
  background: radial-gradient(circle, rgba(168,85,247,.2) 0%, transparent 70%);
  pointer-events: none;
}
.drw-avatar-wrap { position: relative; flex-shrink: 0; }
.drw-avatar {
  width: 50px; height: 50px; border-radius: 50%;
  background: linear-gradient(135deg, #2d1b6b, #1a0e3d);
  border: 2px solid rgba(245,183,0,.45);
  box-shadow: 0 0 0 3px rgba(245,183,0,.08), 0 0 22px rgba(168,85,247,.22);
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 800; color: #F5B700;
  font-family: 'Outfit', sans-serif;
}
.drw-avatar-dot {
  position: absolute; bottom: 1px; right: 1px;
  width: 11px; height: 11px; border-radius: 50%;
  background: #22C55E;
  border: 2px solid #090b10;
  box-shadow: 0 0 10px rgba(34,197,94,.65);
}
.drw-profile-info { flex: 1; min-width: 0; }
.drw-profile-name {
  font-size: 15px; font-weight: 700;
  color: #F6F7FB; letter-spacing: -.3px;
  line-height: 1.2; margin-bottom: 3px;
  font-family: 'Outfit', sans-serif;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.drw-profile-role {
  display: flex; align-items: center; gap: 4px; margin-bottom: 2px;
  font-size: 11.5px; font-weight: 700; color: #F5B700; letter-spacing: .1px;
  font-family: 'Outfit', sans-serif;
}
.drw-profile-empresa {
  font-size: 10.5px; color: #2e2e45; font-weight: 400;
  font-family: 'Outfit', sans-serif;
}
.drw-profile-chev { color: #2e2e45; flex-shrink: 0; }

/* Group labels */
.drw-group-label {
  font-size: 9px; font-weight: 700;
  color: #252535; letter-spacing: 2.2px;
  text-transform: uppercase;
  padding: 0 13px; margin-bottom: 6px; margin-top: 4px;
  font-family: 'Outfit', sans-serif;
}
.drw-group {
  display: flex; flex-direction: column; gap: 2px;
  margin-bottom: 16px;
}

/* Nav items */
.drw-item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 13px;
  border-radius: 13px;
  border: none; border-left: 2.5px solid transparent;
  background: transparent;
  width: 100%; text-align: left; cursor: pointer;
  font-family: 'Outfit', sans-serif;
  color: inherit;
  transition: background .14s, transform .12s, border-color .14s;
  -webkit-tap-highlight-color: transparent;
  position: relative; overflow: hidden;
}
.drw-item:active {
  background: rgba(255,255,255,.04);
  transform: scale(.985);
}
.drw-item.drw-active {
  background: rgba(245,183,0,.09);
  border-left: 2.5px solid #F5B700;
  box-shadow: 0 0 0 1px rgba(245,183,0,.1), inset 0 1px 0 rgba(255,255,255,.04);
}
.drw-item-icon {
  width: 36px; height: 36px; border-radius: 10px; flex-shrink: 0;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.05);
  display: flex; align-items: center; justify-content: center;
  color: #4a4a6a;
  transition: background .14s, color .14s, box-shadow .14s;
}
.drw-active .drw-item-icon {
  background: rgba(245,183,0,.15);
  border-color: rgba(245,183,0,.22);
  color: #F5B700;
  box-shadow: 0 0 14px rgba(245,183,0,.14);
}
.drw-item-text { flex: 1; min-width: 0; }
.drw-item-label {
  font-size: 14px; font-weight: 500;
  color: #c4c4d0; letter-spacing: -.2px;
  line-height: 1.2; margin-bottom: 2px;
}
.drw-active .drw-item-label { color: #F6F7FB; font-weight: 700; }
.drw-item-sub {
  font-size: 11px; color: #303048; font-weight: 400; letter-spacing: .1px;
}
.drw-item-chev { color: #202030; flex-shrink: 0; }
.drw-active .drw-item-chev { color: #F5B700; }

/* Logout */
.drw-logout {
  background: rgba(239,68,68,.07) !important;
  border: 1px solid rgba(239,68,68,.13) !important;
  border-radius: 13px !important;
  border-left: 1px solid rgba(239,68,68,.13) !important;
  margin-bottom: 14px;
  transition: background .15s, transform .12s, border-color .15s !important;
}
.drw-logout:active {
  background: rgba(239,68,68,.13) !important;
  transform: scale(.985) !important;
}
.drw-logout-icon {
  background: rgba(239,68,68,.12) !important;
  border-color: rgba(239,68,68,.22) !important;
  color: #f87171 !important;
}
.drw-logout-label { font-size: 14px; font-weight: 600; color: #f87171; letter-spacing: -.2px; line-height: 1.2; margin-bottom: 2px; }
.drw-logout-sub   { color: rgba(248,113,113,.45) !important; }
.drw-logout-chev  { color: rgba(248,113,113,.3) !important; }

/* Premium banner */
.drw-premium {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 13px; border-radius: 15px;
  background: linear-gradient(135deg, rgba(90,30,160,.3), rgba(60,20,120,.18));
  border: 1px solid rgba(168,85,247,.22);
  box-shadow: 0 4px 22px rgba(168,85,247,.07);
  margin-bottom: 14px;
}
.drw-premium-icon {
  width: 34px; height: 34px; border-radius: 9px; flex-shrink: 0;
  background: rgba(168,85,247,.16);
  border: 1px solid rgba(168,85,247,.27);
  display: flex; align-items: center; justify-content: center;
}
.drw-premium-text { flex: 1; min-width: 0; }
.drw-premium-title {
  font-size: 13px; font-weight: 600; color: #ddd0ff;
  letter-spacing: -.1px; font-family: 'Outfit', sans-serif;
  margin-bottom: 2px;
}
.drw-premium-sub {
  font-size: 10.5px; color: #5a4080; font-weight: 400;
  font-family: 'Outfit', sans-serif;
}
.drw-premium-badge {
  display: flex; align-items: center; gap: 5px;
  background: rgba(168,85,247,.18);
  border: 1px solid rgba(168,85,247,.3);
  border-radius: 20px; padding: 4px 10px; flex-shrink: 0;
}
.drw-premium-badge span {
  font-size: 10.5px; font-weight: 700; color: #A855F7;
  font-family: 'Outfit', sans-serif;
}
.drw-premium-badge svg {
  background: #A855F7; border-radius: 50%;
  width: 13px; height: 13px;
  padding: 2px;
}

/* Version */
.drw-version {
  font-size: 10.5px; color: #1a1a28;
  text-align: center; letter-spacing: .4px; font-weight: 400;
  font-family: 'Outfit', sans-serif;
}

/* Light mode overrides */
body.light-mode #more-drawer {
  background: rgba(253,253,255,.97);
  border-top-color: rgba(0,0,0,.08);
  box-shadow: 0 -20px 60px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.9);
}
body.light-mode .drw-orb-top  { background: radial-gradient(circle, rgba(245,183,0,.09) 0%, transparent 70%); }
body.light-mode .drw-orb-bottom { background: radial-gradient(circle, rgba(168,85,247,.06) 0%, transparent 70%); }
body.light-mode .drw-logo-sub  { color: #9ca3af; }
body.light-mode .drw-close-btn { background: rgba(0,0,0,.06); border-color: rgba(0,0,0,.08); color: #9ca3af; }
body.light-mode .drw-profile {
  background: linear-gradient(135deg, rgba(245,183,0,.07), rgba(168,85,247,.04));
  border-color: rgba(245,183,0,.18);
  box-shadow: 0 2px 14px rgba(245,183,0,.08);
}
body.light-mode .drw-avatar     { background: linear-gradient(135deg,#2d1b6b,#1a0e3d); }
body.light-mode .drw-avatar-dot { border-color: #ffffff; }
body.light-mode .drw-profile-name { color: #111827; }
body.light-mode .drw-profile-empresa { color: #9ca3af; }
body.light-mode .drw-profile-chev { color: #d1d5db; }
body.light-mode .drw-group-label { color: #c4c4d0; }
body.light-mode .drw-item-icon  { background: rgba(0,0,0,.05); border-color: rgba(0,0,0,.07); color: #9ca3af; }
body.light-mode .drw-item-label { color: #374151; }
body.light-mode .drw-item-sub   { color: #d1d5db; }
body.light-mode .drw-item-chev  { color: #e5e7eb; }
body.light-mode .drw-item:active { background: rgba(0,0,0,.04); }
body.light-mode .drw-active { background: rgba(245,183,0,.11); }
body.light-mode .drw-active .drw-item-label { color: #111827; }
body.light-mode .drw-logout { background: rgba(239,68,68,.06) !important; }
body.light-mode .drw-premium {
  background: linear-gradient(135deg, rgba(168,85,247,.08), rgba(168,85,247,.03));
}
body.light-mode .drw-premium-title { color: #7c3aed; }
body.light-mode .drw-premium-sub   { color: #a78bfa; }
body.light-mode .drw-version { color: #d1d5db; }

/* ── Animação slideUp para modais ───────────────────── */
@keyframes slideUp {
  from { transform: translateY(40px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

/* ── Swipe para fechar modais (indicador visual) ─────── */
@media (max-width: 600px) {
  .modal-bg.active { cursor: pointer; }
}

/* ── Header simplificado no mobile ──────────────────────────────── */
@media (max-width: 768px) {
  .hdr-busca-wrap { display: none !important; }
  .hdr-tema-btn   { display: none !important; }
  #btn-logout     { display: none !important; }
}

/* ── Elementos só visíveis no mobile ──────────────────────────── */
.home-mobile-only { display: none; }
@media (max-width: 768px) {
  .home-mobile-only { display: flex; }
}

/* ── Home Premium — aplicado em todas as telas ──────────────────── */
#t-home {
  background: #0D0D0D;
  min-height: 100%;
}
#home-wrap {
  max-width: 600px;
  margin: 0 auto;
  padding: 20px 16px 80px;
}
/* Botão sair mobile — flex só no mobile */
@media (max-width: 768px) {
  .home-mobile-only { display: flex !important; }
}
/* No desktop, o home-wrap tem padding maior */
@media (min-width: 769px) {
  #home-wrap { padding: 32px 24px 40px; }
  /* Grid 2 colunas para os cards de métricas no desktop */
  #home-metrics { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
}

/* ── Home premium — escala mobile ──────────────────────────────── */
@media (max-width: 600px) {
  #home-wrap { padding: 0 2px 80px; }
  #home-hero { border-radius: 16px !important; }
  #home-metrics { gap: 7px !important; }
  #home-chart-wrap { border-radius: 14px !important; }
  #home-chart { max-height: 80px !important; }
  #home-actions { gap: 7px !important; }
  #home-ranking { border-radius: 10px !important; }
}

/* Scrollbar oculta nas ações rápidas */
#home-actions::-webkit-scrollbar { display: none; }

/* SVG outline na bottom nav herda cor do pai */
.bn-icon svg, .bn-icon { stroke: currentColor; }
@media (max-width: 768px) {
  .bn-icon svg { display: block; }
  .bn-item.active .bn-icon svg { stroke: #F5B700; }
}

/* ── Proposta — botões de navegação (mobile-first) ─────────────── */
.prop-nav-row {
  display: flex;
  gap: 10px;
  margin-top: 18px;
  align-items: center;
}
/* Botão "Voltar" fica à esquerda, tamanho fixo */
.prop-nav-row .btn-o {
  flex: 0 0 auto;
  white-space: nowrap;
}
/* Botão "Próximo / Revisar" ocupa o resto */
.prop-btn-next {
  flex: 1;
  text-align: center;
}
/* Botão "Gerar PDF" — maior, destaque */
.prop-btn-pdf {
  flex: 1;
  font-size: 16px !important;
  padding: 13px 16px !important;
  text-align: center;
}

/* Pós-PDF: WhatsApp + Email lado a lado, empilham em telas muito pequenas */
.prop-pos-pdf-btns {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}
.prop-btn-wpp,
.prop-btn-email {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 1;
  min-width: 140px;
  padding: 13px 16px;
  border: none;
  border-radius: 10px;
  font-family: 'Outfit', sans-serif;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.prop-btn-wpp   { background: #25D366; color: #fff; }
.prop-btn-email { background: linear-gradient(135deg,#8B6914,#D4A017); color: #000; }

/* Em telas muito pequenas (<360px), empilha verticalmente */
@media (max-width: 360px) {
  .prop-pos-pdf-btns { flex-direction: column; }
  .prop-btn-wpp,
  .prop-btn-email { flex: none; width: 100%; }
}

/* inv-grid: nunca ultrapassa a tela em mobile */
@media (max-width: 768px) {
  .inv-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }
}
@media (max-width: 480px) {
  .inv-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Proposta — botão "Sair" (só mobile, quando bottom nav está oculto) ── */
.prop-sair-wrap {
  display: none; /* oculto no desktop */
  margin-bottom: 12px;
}
.prop-sair-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: none;
  border: none;
  color: #888;
  font-family: 'Outfit', sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 4px 0;
}
.prop-sair-btn:active { color: #D4A017; }

@media (max-width: 768px) {
  .prop-sair-wrap { display: block; }

  /* Sem o bottom nav, a proposta não precisa do padding-bottom extra */
  #t-proposta .app-body,
  #t-proposta ~ * .app-body,
  #t-proposta .panel {
    padding-bottom: 24px;
  }
}

/* ── Spinner de processamento de foto ─────────────────────────── */
.foto-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid rgba(212,160,23,.2);
  border-top-color: #D4A017;
  border-radius: 50%;
  animation: fotospin .7s linear infinite;
  flex-shrink: 0;
}
@keyframes fotospin {
  to { transform: rotate(360deg); }
}