/* ─── VUNBY Design System v2 ─── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  /* Identidade VUNBY: azul cromado + dourado cromado (13/10/2026) */
  --navy:      #0F3A8C;
  --navy-mid:  #2A5FC0;
  --navy-light:#E6EEFB;
  --gold:      #E3B23C;
  --gold-dark: #B8860B;
  --chrome-blue: linear-gradient(180deg, #6EA5EB 0%, #285FBE 35%, #0F378C 55%, #2D64BE 80%, #0A286E 100%);
  --chrome-gold: linear-gradient(180deg, #FFF0AA 0%, #EBBE3C 30%, #AA7D14 50%, #F0C850 70%, #B4870F 100%);
  --dark:      #0F1923;
  --body:      #3A4550;
  --white:     #FFFFFF;
  --gray:      #F4F6F9;
  --gray2:     #E4E8EE;
  --gray3:     #CBD2DA;
  --muted:     #5B6675;
  --red:       #E53E3E;
  --green:     #2DB56D;
  --radius-sm: 8px;
  --radius:    14px;
  --radius-lg: 20px;
  --shadow:    0 1px 4px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.07);
  --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
  --font: 'Inter', system-ui, -apple-system, sans-serif;

  /* Spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;

  /* Escala de letras (pesquisa 13/10: corpo 16–18px, nada abaixo de 14px, poucos tamanhos) */
  --fs-sm:  14px;  /* legenda, ajuda, etiquetas */
  --fs-md:  16px;  /* texto normal, campos, botões */
  --fs-lg:  18px;  /* destaque, nome de item, título de cartão */
  --fs-xl:  22px;  /* título de seção, valores */
  --fs-2xl: 28px;  /* título da página */
  --fs-num: 36px;  /* valor grande */

  /* Touch target */
  --touch: 48px;

  /* Bottom nav height */
  --nav-h: 64px;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-size: var(--fs-md);
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  background: var(--gray);
  color: var(--body);
  min-height: 100dvh;
  line-height: 1.5;
  padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px));
}

/* ─── Topbar (desktop / scroll header) ─── */
.topbar {
  background: var(--chrome-blue);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--sp-5);
  height: 56px;
  position: sticky;
  top: 0;
  z-index: 200;
  box-shadow: 0 2px 12px rgba(15,58,140,.22);
}
.topbar-logo {
  font-weight: 800;
  font-size: var(--fs-lg);
  letter-spacing: .06em;
  color: var(--white);
  text-decoration: none;
  flex-shrink: 0;
}
.topbar-logo span { color: var(--gold); }
/* "BY" e logos em dourado cromado */
.topbar-logo span, .auth-logo span, .hero-logo span {
  background: var(--chrome-gold); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.topbar-logo img { height: 30px; width: auto; display: block; }
.topbar-icon { color: rgba(255,255,255,.7); display:flex; align-items:center; padding: 8px; border-radius: 8px; transition: color .15s, background .15s; text-decoration:none; }
.topbar-icon:hover, .topbar-icon-active { color: var(--white); background: rgba(255,255,255,.13); }
.topbar-nav {
  display: flex;
  gap: 2px;
  align-items: center;
}
.topbar-nav a {
  color: rgba(255,255,255,.65);
  font-size: var(--fs-sm);
  font-weight: 600;
  text-decoration: none;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.topbar-nav a:hover,
.topbar-nav a.active {
  background: rgba(255,255,255,.13);
  color: var(--white);
}
#btn-logout {
  background: none;
  border: none;
  color: rgba(255,255,255,.5);
  font-size: var(--fs-sm);
  font-weight: 600;
  cursor: pointer;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  font-family: inherit;
  transition: background .15s, color .15s;
}
#btn-logout:hover {
  background: rgba(255,255,255,.1);
  color: var(--white);
}

/* ─── Bottom Navigation (mobile) ─── */
.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 200;
  background: var(--white);
  border-top: 1px solid var(--gray2);
  display: flex;
  height: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  box-shadow: 0 -1px 12px rgba(0,0,0,.05);
}
.bottom-nav a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  text-decoration: none;
  color: var(--muted);
  font-size: var(--fs-sm);
  font-weight: 600;
  transition: color .15s;
  padding: 8px 4px;
  -webkit-tap-highlight-color: transparent;
}
.bottom-nav a svg { transition: transform .15s; }
.bottom-nav a.active { color: var(--navy); }
.bottom-nav a.active svg { transform: scale(1.08); }
.bottom-nav a.nav-cta { color: var(--muted); }
.bottom-nav a.nav-cta .nav-icon-wrap {
  background: var(--gold);
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 10px rgba(245,192,0,.4);
  transition: transform .15s, box-shadow .15s;
}
.bottom-nav a.nav-cta:active .nav-icon-wrap { transform: scale(.93); }

/* ─── Container ─── */
.container {
  max-width: 600px;
  margin: 0 auto;
  padding: var(--sp-4) var(--sp-4) var(--sp-8);
}

/* ─── Page header ─── */
.page-header {
  padding: var(--sp-5) 0 var(--sp-4);
}
.page-header h1 {
  font-size: var(--fs-2xl);
  line-height: 1.2;
  font-weight: 800;
  color: var(--dark);
  letter-spacing: -.01em;
}
.page-header p {
  font-size: var(--fs-md);
  color: var(--muted);
  margin-top: 2px;
}

/* ─── Cards ─── */
.card {
  background: var(--white);
  border-radius: var(--radius);
  padding: var(--sp-5);
  margin-bottom: var(--sp-4);
  box-shadow: var(--shadow);
}
.card h2 {
  font-size: var(--fs-lg);
  font-weight: 800;
  color: var(--dark);
  margin-bottom: var(--sp-4);
  letter-spacing: -.01em;
}
.card h3 {
  font-size: var(--fs-lg);
  font-weight: 700;
  color: var(--dark);
  margin-bottom: var(--sp-3);
}

/* ─── Animação de entrada ─── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.anim { animation: fadeUp .22s ease both; }
.anim-1 { animation-delay: .04s; }
.anim-2 { animation-delay: .08s; }
.anim-3 { animation-delay: .12s; }
.anim-4 { animation-delay: .16s; }
.anim-5 { animation-delay: .20s; }

/* ─── Stat grid (dashboard) ─── */
.stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
}
.stat-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: var(--sp-4) var(--sp-4) var(--sp-3);
  box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.05);
  position: relative;
  overflow: hidden;
}
.stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--gray2);
}
.stat-card.accent-gold::before { background: var(--gold); }
.stat-card.accent-green::before { background: var(--green); }
.stat-card.accent-navy::before { background: var(--chrome-blue); }
.stat-label {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--muted);
  margin-bottom: var(--sp-1);
}
.stat-value {
  font-size: var(--fs-xl);
  font-weight: 800;
  color: var(--dark);
  letter-spacing: -.02em;
  line-height: 1.15;
}
.stat-value.navy { color: var(--navy); }
.stat-value.gold { color: var(--gold-dark); }
.stat-value.green { color: var(--green); }

/* ─── Hero card (radar) ─── */
.hero-card {
  background: var(--chrome-blue);
  color: var(--white);
  border-radius: var(--radius);
  padding: var(--sp-6) var(--sp-5);
  margin-bottom: var(--sp-4);
  box-shadow: 0 4px 20px rgba(15,58,140,.30);
}
.hero-card-label {
  font-size: var(--fs-sm);
  font-weight: 600;
  opacity: .85;
  margin-bottom: var(--sp-2);
}
.hero-card-value {
  font-size: var(--fs-num);
  font-weight: 800;
  color: var(--gold);
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: var(--sp-2);
}
.hero-card-sub {
  font-size: var(--fs-md);
  opacity: .85;
}

/* ─── Search bar ─── */
.search-wrap {
  position: relative;
  margin-bottom: var(--sp-4);
}
.search-wrap input {
  padding-left: 42px;
  background: var(--white);
}
.search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
  font-size: var(--fs-md);
  pointer-events: none;
}

/* ─── Filter row ─── */
.filter-row {
  display: flex;
  gap: var(--sp-2);
  margin-bottom: var(--sp-4);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.filter-row::-webkit-scrollbar { display: none; }
.filter-chip {
  flex-shrink: 0;
  min-height: 44px;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: var(--fs-sm);
  font-weight: 600;
  border: 1.5px solid var(--gray2);
  background: var(--white);
  color: var(--body);
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  white-space: nowrap;
}
.filter-chip.active {
  background: var(--chrome-blue);
  border-color: var(--navy);
  color: var(--white);
}

/* ─── Quote list row ─── */
.quote-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: var(--sp-4) 0;
  border-bottom: 1px solid var(--gray2);
  text-decoration: none;
  color: inherit;
  gap: var(--sp-3);
  transition: background .1s;
}
.quote-row:last-child { border-bottom: none; }
.quote-row-left { flex: 1; min-width: 0; }
.quote-row-title {
  font-weight: 700;
  font-size: var(--fs-md);
  color: var(--dark);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.quote-row-meta {
  font-size: var(--fs-sm);
  color: var(--muted);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.quote-row-right {
  text-align: right;
  flex-shrink: 0;
}
.quote-row-valor {
  font-size: var(--fs-md);
  font-weight: 800;
  color: var(--dark);
}

/* ─── Formulários ─── */
label {
  display: block;
  font-size: var(--fs-md);
  font-weight: 600;
  color: var(--dark);
  margin-bottom: 6px;
  margin-top: var(--sp-5);
}
label:first-child { margin-top: 0; }

input, textarea, select {
  width: 100%;
  padding: 13px var(--sp-4);
  border: 1.5px solid var(--gray2);
  border-radius: var(--radius-sm);
  font-family: var(--font);
  font-size: var(--fs-md);
  background: var(--white);
  color: var(--dark);
  transition: border-color .15s, box-shadow .15s;
  appearance: none;
  -webkit-appearance: none;
  line-height: 1.4;
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--navy);
  box-shadow: 0 0 0 3px rgba(15,58,140,.1);
}
textarea { resize: vertical; min-height: 80px; }
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A8899' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 38px;
}

/* ─── Botões ─── */
.btn-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--chrome-blue);
  color: var(--white);
  border: none;
  border-radius: var(--radius-sm);
  padding: 0 var(--sp-6);
  height: var(--touch);
  font-size: var(--fs-md);
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  width: 100%;
  transition: opacity .15s, transform .1s;
  letter-spacing: .01em;
}
.btn-primary:active { transform: scale(.98); opacity: .92; }

.btn-gold {
  background: var(--chrome-gold);
  color: var(--dark);
}
.btn-gold:active { opacity: .9; }

.btn-green {
  background: var(--green);
  color: var(--white);
}

.btn-outline {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: transparent;
  color: var(--navy);
  border: 1.5px solid var(--navy);
  border-radius: var(--radius-sm);
  padding: 0 var(--sp-5);
  height: var(--touch);
  font-size: var(--fs-md);
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s;
}
.btn-outline:hover { background: var(--navy-light); }

.btn-sm {
  height: 44px;
  padding: 0 var(--sp-4);
  font-size: var(--fs-sm);
  width: auto;
}

.btn-row {
  display: flex;
  gap: var(--sp-3);
  margin-top: var(--sp-5);
}
.btn-row .btn-primary,
.btn-row .btn-outline { flex: 1; }

/* ─── Status badges ─── */
.badge {
  display: inline-block;
  padding: 3px 9px;
  border-radius: 20px;
  font-size: var(--fs-sm);
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
}
.badge-enviado     { background: #DBEEFF; color: #0060B0; }
.badge-visualizado { background: #FFF4CC; color: #8A6000; }
.badge-sem-resposta{ background: #FFECE0; color: #C04000; }
.badge-aprovado    { background: #D1FAE5; color: #1A7A3A; }
.badge-recusado    { background: #FFE4E4; color: #C0392B; }

.flag-followup {
  display: inline-flex;
  align-items: center;
  background: var(--gold);
  color: var(--dark);
  font-size: var(--fs-sm);
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 20px;
  margin-left: 6px;
  letter-spacing: .02em;
  vertical-align: middle;
}

/* ─── Mensagens ─── */
.error   { color: var(--red); font-size: var(--fs-sm); margin-top: var(--sp-2); min-height: 18px; }
.success { color: var(--green); font-size: var(--fs-sm); margin-top: var(--sp-2); }
.muted   { color: var(--muted); font-size: var(--fs-md); }
.muted a { color: var(--navy); }

/* ─── Auth pages ─── */
.auth-outer {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: var(--gray);
  padding-bottom: 0;
}
.auth-header {
  background: var(--chrome-blue);
  padding: 40px var(--sp-5) 32px;
  text-align: center;
}
.auth-logo {
  font-size: var(--fs-2xl);
  font-weight: 800;
  color: var(--white);
  letter-spacing: .08em;
  margin-bottom: var(--sp-2);
}
.auth-logo span { color: var(--gold); }
.auth-tagline {
  font-size: var(--fs-md);
  color: rgba(255,255,255,.88);
  font-weight: 500;
}
.auth-body {
  flex: 1;
  max-width: 420px;
  width: 100%;
  margin: 0 auto;
  padding: var(--sp-5) var(--sp-4) 40px;
}
.auth-toggle {
  display: flex;
  background: var(--gray2);
  border-radius: 10px;
  margin-bottom: var(--sp-5);
  padding: 3px;
  gap: 3px;
}
.auth-toggle button {
  flex: 1;
  border: none;
  background: transparent;
  padding: 10px var(--sp-4);
  font-size: var(--fs-md);
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  color: var(--muted);
  border-radius: 8px;
  transition: all .2s;
}
.auth-toggle button.active {
  background: var(--chrome-blue);
  color: var(--white);
  box-shadow: 0 2px 8px rgba(15,58,140,.2);
}

/* ─── Orçamento público ─── */
.quote-card { background: var(--white); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.quote-header { background: var(--chrome-blue); color: var(--white); padding: var(--sp-6) var(--sp-5); }
.quote-header h1 { font-size: var(--fs-xl); font-weight: 800; margin-bottom: var(--sp-2); letter-spacing: -.01em; }
.quote-body { padding: var(--sp-5); }
.valor-grande { font-size: var(--fs-num); font-weight: 800; color: var(--navy); letter-spacing: -.02em; line-height: 1; }
.pkg-card { border: 1.5px solid var(--gray2); border-radius: var(--radius-sm); padding: var(--sp-4); margin-bottom: var(--sp-3); }
.pkg-card.destaque { border-color: var(--gold); background: #FFFBEB; }
.pkg-badge { font-size: var(--fs-sm); font-weight: 700; background: var(--gold); color: var(--dark); padding: 2px 8px; border-radius: 20px; }
.action-btns { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); margin-top: var(--sp-5); }
.btn-accept { background: var(--green); color: var(--white); border: none; border-radius: var(--radius-sm); padding: 14px; font-size: var(--fs-md); font-weight: 700; cursor: pointer; font-family: inherit; height: var(--touch); }
.btn-reject { background: var(--gray2); color: var(--muted); border: none; border-radius: var(--radius-sm); padding: 14px; font-size: var(--fs-md); font-weight: 700; cursor: pointer; font-family: inherit; height: var(--touch); }

/* ─── Pacote checkbox card ─── */
.pkg-select-card {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  border: 1.5px solid var(--gray2);
  border-radius: var(--radius-sm);
  padding: var(--sp-3) var(--sp-4);
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.pkg-select-card:has(input:checked) {
  border-color: var(--navy);
  background: var(--navy-light);
}
.pkg-select-card input[type=checkbox] {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  accent-color: var(--navy);
}
.pkg-select-info strong {
  display: block;
  font-size: var(--fs-md);
  font-weight: 700;
  color: var(--dark);
}
.pkg-select-info span {
  font-size: var(--fs-sm);
  color: var(--muted);
}

/* ─── Landing ─── */
.hero {
  background: linear-gradient(160deg, var(--navy) 0%, #005599 100%);
  color: var(--white);
  padding: 56px 20px 48px;
  text-align: center;
}
.hero-logo { font-size: var(--fs-num); font-weight: 800; letter-spacing: .06em; }
.hero-logo span { color: var(--gold); }
.hero h1 { font-size: var(--fs-2xl); font-weight: 800; margin: 18px 0 12px; line-height: 1.25; letter-spacing: -.01em; }
.hero p { font-size: var(--fs-md); opacity: .75; margin-bottom: 28px; line-height: 1.6; max-width: 380px; margin-left: auto; margin-right: auto; }
.hero .cta { display: inline-flex; gap: var(--sp-3); flex-wrap: wrap; justify-content: center; }
.hero .cta a { padding: 13px 26px; border-radius: var(--radius-sm); font-weight: 700; font-size: var(--fs-md); text-decoration: none; font-family: var(--font); }
.cta-primary { background: var(--gold); color: var(--dark); }
.cta-outline  { border: 2px solid rgba(255,255,255,.4); color: var(--white); }
.section { padding: 40px 20px; max-width: 600px; margin: 0 auto; }
.section h2 { font-size: var(--fs-xl); font-weight: 800; color: var(--navy); margin-bottom: var(--sp-5); letter-spacing: -.01em; }
.feature-list { list-style: none; display: grid; gap: var(--sp-4); }
.feature-list li { display: flex; gap: var(--sp-3); align-items: flex-start; }
.feature-list li .icon { font-size: var(--fs-xl); line-height: 1; flex-shrink: 0; }
.feature-list li p { font-size: var(--fs-md); line-height: 1.55; }
.feature-list li strong { display: block; font-weight: 700; color: var(--dark); }

/* ─── Utils ─── */
a { color: var(--navy); text-decoration: none; }
a:hover { text-decoration: underline; }
hr { border: none; border-top: 1px solid var(--gray2); margin: var(--sp-5) 0; }
.mt { margin-top: var(--sp-4); }
.mt-2 { margin-top: var(--sp-2); }
.text-center { text-align: center; }
.grid-2 { display: grid; gap: var(--sp-3); }
.divider { border: none; border-top: 1px solid var(--gray2); margin: var(--sp-3) 0; }

/* ─── Skeleton loader ─── */
@keyframes shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}
.skeleton-row { display:flex; justify-content:space-between; align-items:center; padding: var(--sp-4) 0; border-bottom: 1px solid var(--gray2); gap: var(--sp-4); }
.skeleton-row:last-child { border-bottom: none; }
.skeleton-line { height: 14px; border-radius: 7px; background: linear-gradient(90deg, var(--gray2) 25%, #e8e8e8 50%, var(--gray2) 75%); background-size: 800px 14px; animation: shimmer 1.4s infinite; }

/* ─── Error block ─── */
.error-block { text-align:center; padding: var(--sp-6) var(--sp-4); color: var(--muted); }

/* Aviso do plano (teste grátis / assinatura) */
.aviso-plano{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--dark)}
.aviso-plano p{margin:0;font-size:var(--fs-md);color:var(--muted)}
.aviso-plano-trial{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;background:#EEF4FA;border:1.5px solid #CFE0F0;font-size:var(--fs-md)}
.aviso-plano-link{font-weight:700;color:var(--navy);white-space:nowrap}
.aviso-plano-fim{background:#FFF6E5;border:1.5px solid #F5C451}
.plano-bloqueado .container > .card,.plano-bloqueado .card-acao{display:none!important}
.btn-primary:disabled{opacity:.55;cursor:not-allowed}

/* ─── Editor de itens do orçamento ─────────────────────────── */
.ie-item{border:1.5px solid var(--gray2);border-radius:var(--radius-sm);padding:var(--sp-4);margin-bottom:var(--sp-3);background:var(--white)}
.ie-item.ie-opcional{border:2px solid #2A5FC0;background:#EEF4FC}
.ie-item.ie-recomendado{border:2px solid var(--gold-dark);background:#FFF8E1}
.ie-topo{display:flex;align-items:flex-start;gap:var(--sp-2)}
.ie-num{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--navy-light);color:var(--navy);font-weight:800;font-size:var(--fs-sm);display:flex;align-items:center;justify-content:center}
.ie-topo input,.ie-topo textarea{margin:0;font-weight:600}
.ie-nums{display:grid;grid-template-columns:72px 1fr 1.3fr;gap:var(--sp-2);margin-top:var(--sp-3)}
.ie-campo{margin:0!important;display:flex;flex-direction:column;gap:4px}
.ie-campo span{font-size:var(--fs-sm);font-weight:600;color:var(--body)}
.ie-campo input,.ie-campo select{margin:0;padding-left:10px;padding-right:10px}
.ie-linha-total{text-align:right;font-size:var(--fs-md);color:var(--muted);margin-top:var(--sp-2)}
.ie-linha-total strong{color:var(--navy);font-size:var(--fs-lg)}
.ie-tipos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:var(--sp-3)}
.ie-tipo{border:2px solid var(--gray3);background:var(--white);font:inherit;font-size:var(--fs-sm);font-weight:700;color:var(--body);padding:10px 2px;border-radius:10px;cursor:pointer;min-height:48px}
.ie-tipo.ativo{color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(15,25,35,.18)}
.ie-tipo.ativo[data-tipo="incluido"]{background:var(--navy)}
.ie-tipo.ativo[data-tipo="recomendado"]{background:var(--gold-dark)}
.ie-tipo.ativo[data-tipo="opcional"]{background:#2A5FC0}
.ie-desc{min-height:48px;resize:none;field-sizing:content;line-height:1.35;overflow:hidden}
.ie-dica{font-size:var(--fs-sm);color:var(--muted);margin-top:6px}
.ie-acoes{display:flex;gap:6px;margin-top:var(--sp-3);flex-wrap:wrap}
.ie-acoes button{border:1.5px solid var(--gray2);background:var(--white);border-radius:8px;font:inherit;font-size:var(--fs-sm);font-weight:600;color:var(--body);padding:8px 14px;min-height:44px;cursor:pointer}
.ie-acoes button:disabled{opacity:.35}
.ie-acoes .ie-remover{margin-left:auto;color:var(--red);border-color:#FFD5D2}
.ie-mais{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}.ie-mais[hidden]{display:none}
.ie-mais button{border:1.5px solid var(--gray2);background:var(--gray);border-radius:8px;font:inherit;font-size:var(--fs-sm);font-weight:600;color:var(--body);padding:8px 14px;min-height:44px;cursor:pointer}.ie-mais button:disabled{opacity:.35}
.ie-add{width:100%}
.ie-vazio{text-align:center;padding:var(--sp-4) 0}
.ie-extras{margin-top:var(--sp-4)}
.ie-extras summary{font-size:var(--fs-md);font-weight:600;color:var(--navy);cursor:pointer;padding:8px 0}
.ie-taxa{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--sp-2)}
.ie-resumo{margin-top:var(--sp-4);background:var(--gray);border-radius:var(--radius-sm);padding:var(--sp-4)}
.ie-res-linha{display:flex;justify-content:space-between;font-size:var(--fs-md);padding:4px 0;color:var(--body)}
.ie-res-total{border-top:1.5px solid var(--gray2);margin-top:6px;padding-top:10px;font-size:var(--fs-lg);color:var(--dark)}
.ie-res-total strong{color:var(--navy);font-size:var(--fs-xl)}
.ie-res-nota{font-size:var(--fs-sm);color:var(--muted);margin-top:8px}
.topbar-icon{gap:6px;min-height:44px}
.topbar-icon-txt{font-size:var(--fs-sm);font-weight:600}
.badge{white-space:normal;line-height:1.35}

/* ─── Calculadora de mudança (folha em tela cheia) ─────────── */
.cm-fundo{position:fixed;inset:0;background:rgba(15,25,35,.55);z-index:10000;display:flex;align-items:flex-end;justify-content:center}
.cm-folha{background:var(--gray);width:100%;max-width:560px;height:100%;max-height:100%;display:flex;flex-direction:column;overflow:hidden}
@media(min-width:600px){.cm-fundo{align-items:center}.cm-folha{height:92vh;border-radius:var(--radius-lg)}}
.cm-topo{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;background:var(--chrome-blue);color:#fff;padding:calc(16px + env(safe-area-inset-top)) 16px 14px}
.cm-topo h2{font-size:var(--fs-xl);font-weight:800;margin:0;color:#fff}
.cm-topo p{font-size:var(--fs-md);opacity:.9;margin-top:4px}
.cm-x{background:rgba(255,255,255,.18);border:none;color:#fff;width:44px;height:44px;border-radius:50%;font-size:var(--fs-lg);cursor:pointer;flex-shrink:0}
.cm-resumo{background:#fff;border-bottom:1px solid var(--gray2);padding:12px 16px;min-height:58px}
.cm-res-vazio{color:var(--muted);font-size:var(--fs-md);padding-top:6px}
.cm-res-num{font-size:var(--fs-md);color:var(--body)}.cm-res-num strong{font-size:var(--fs-xl);color:var(--navy)}
.cm-res-veic{font-size:var(--fs-md);font-weight:700;color:var(--dark);margin-top:2px}.cm-res-veic span{font-weight:400;color:var(--muted);font-size:var(--fs-sm)}
.cm-corpo{flex:1;overflow-y:auto;padding:4px 16px 24px;-webkit-overflow-scrolling:touch}
.cm-cat{font-size:var(--fs-sm);font-weight:800;color:var(--muted);margin:20px 0 8px}
.cm-movel{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1.5px solid var(--gray2);border-radius:12px;padding:8px 8px 8px 14px;margin-bottom:6px}
.cm-movel.cm-on{border-color:var(--navy);background:var(--navy-light)}
.cm-movel-nome{font-size:var(--fs-md);font-weight:600;color:var(--dark);display:flex;flex-direction:column}
.cm-movel-nome span{font-size:var(--fs-sm);font-weight:500;color:var(--muted)}
.cm-cont{display:flex;align-items:center;gap:4px;flex-shrink:0}
.cm-cont button{width:44px;height:44px;border-radius:10px;border:1.5px solid var(--gray3);background:#fff;font-size:var(--fs-xl);font-weight:700;color:var(--navy);cursor:pointer;line-height:1}
.cm-cont span{min-width:28px;text-align:center;font-size:var(--fs-lg);font-weight:800;color:var(--dark)}
.cm-campo{display:flex;flex-direction:column;gap:4px;margin:10px 0 0!important;text-transform:none!important;letter-spacing:0!important}
.cm-campo span{font-size:var(--fs-sm);font-weight:600;color:var(--body)}
.cm-campo input{margin:0}
.cm-campo small{font-size:var(--fs-sm);color:var(--muted)}
.cm-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cm-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.cm-dica{font-size:var(--fs-sm);color:var(--muted);margin-top:8px;line-height:1.4}
.cm-outro,.cm-precos{background:#fff;border:1.5px solid var(--gray2);border-radius:12px;padding:10px 14px;margin-top:8px}
.cm-outro summary,.cm-precos summary{font-size:var(--fs-md);font-weight:700;color:var(--navy);cursor:pointer;padding:6px 0}
.cm-precos{margin-top:22px;border-color:var(--gold)}
.cm-check{display:flex!important;align-items:center;gap:8px;margin:12px 0!important;text-transform:none!important;font-size:var(--fs-md)!important;color:var(--body)!important}
.cm-check input{width:20px;height:20px;margin:0}
.cm-veic{display:grid;grid-template-columns:1fr 1fr 44px;gap:6px;align-items:end;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--gray2)}
.cm-veic>input{grid-column:1/-1;font-weight:700}
.cm-veic>input{margin:0}
.cm-rem{height:44px;border:none;background:none;color:var(--red);font-size:var(--fs-md);cursor:pointer}
.cm-rodape{background:#fff;border-top:1px solid var(--gray2);padding:10px 16px calc(12px + env(safe-area-inset-bottom))}
.cm-rodape .error{min-height:0;margin:0 0 6px}
.cm-apagar{background:none;border:none;padding:4px 0 0;font:inherit;font-size:var(--fs-sm);font-weight:600;color:var(--red);cursor:pointer;text-align:left;align-self:flex-start}

/* ─── Montar pela tabela ─────────────────────────────────── */
.mt-linha{flex-direction:column;align-items:stretch;gap:0}
.mt-topo{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mt-qtd{width:60px;height:44px;margin:0;padding:0 4px;text-align:center;font-size:var(--fs-lg);font-weight:800;border-radius:10px}
.mt-desm{display:grid;gap:8px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--gray3)}
.mt-desm>div{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mt-desm span{font-size:var(--fs-md);font-weight:600;color:var(--dark);display:flex;flex-direction:column}
.mt-desm small{font-size:var(--fs-sm);font-weight:400;color:var(--muted)}
.mt-busca{margin:12px 0 0}
.mt-usar{margin-left:6px;border:1.5px solid var(--navy);background:#fff;color:var(--navy);font:inherit;font-size:var(--fs-sm);font-weight:700;border-radius:8px;padding:6px 12px;min-height:36px;cursor:pointer}
.mt-m2{margin-top:10px;border-top:1px dashed var(--gray3);padding-top:6px}
.mt-m2 summary{font-size:var(--fs-md);font-weight:600;color:var(--navy);cursor:pointer;min-height:44px;display:flex;align-items:center}
.mt-m2-campos{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:end}
.mt-x{font-size:var(--fs-lg);font-weight:700;padding-bottom:12px}
.tb-vazia{text-align:center;padding:24px 8px}
.ie-ferramenta{margin-bottom:var(--sp-2)}
.ie-nums{grid-template-columns:64px 1.2fr 1fr}
.ie-campo select{padding-right:28px!important;padding-left:8px!important;background-position:right 6px center;font-size:var(--fs-sm)}

/* ─── Editar cliente (janela) ─────────────────────────────── */
.ec-fundo{position:fixed;inset:0;background:rgba(15,25,35,.55);z-index:10000;display:flex;align-items:flex-end;justify-content:center}
.ec-folha{background:#fff;width:100%;max-width:520px;border-radius:18px 18px 0 0;padding:20px 16px calc(20px + env(safe-area-inset-bottom))}
@media(min-width:600px){.ec-fundo{align-items:center}.ec-folha{border-radius:18px}}
.ec-folha h2{font-size:var(--fs-xl);margin:0 0 6px}
.ec-dica{font-size:var(--fs-sm);margin:10px 0 0}
.ec-btns{display:grid;grid-template-columns:1fr 2fr;gap:10px;margin-top:12px}
.btn-link-editar{background:none;border:none;color:var(--navy);font:inherit;font-size:var(--fs-md);font-weight:700;cursor:pointer;min-height:44px;padding:0 4px}
.cli-extras{margin-top:14px;border-top:1px solid var(--gray2);padding-top:6px}
.cli-extras summary{font-size:var(--fs-md);font-weight:700;color:var(--navy);cursor:pointer;min-height:44px;display:flex;align-items:center}
.cli-extras-dica{font-size:var(--fs-sm);margin-top:8px}
.ec-folha{max-height:92vh;overflow-y:auto}
.ie-res-aviso{background:#FFF8E1;border:1.5px solid #E3B23C;border-radius:10px;padding:10px 12px;margin-top:10px;font-size:var(--fs-sm);line-height:1.45;color:#5A4300}