/* ── Formal Quote View ── */
.formal-quote-view{display:none;flex:1;overflow-y:auto;padding:32px 24px;background:linear-gradient(160deg,#f0f4ff 0%,#f8f9fb 60%,#eef3ff 100%)}
.formal-quote-view.active{display:block}
.formal-quote-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:20px;
  align-items:start;
  max-width:1160px;
  margin:0 auto;
}

/* ── Paper ── */
.formal-paper{
  position:relative;
  width:100%;
  background:#ffffff;
  color:#202124;
  border:1px solid rgba(26,115,232,.14);
  border-radius:28px;
  box-shadow:0 4px 6px rgba(60,64,67,.06),0 12px 36px rgba(60,64,67,.10),0 2px 0 rgba(26,115,232,.06);
  overflow:hidden;
}
/* Blue header stripe */
.formal-paper::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:168px;
  background:linear-gradient(135deg,#1a73e8 0%,#1967d2 50%,#1558b0 100%);
  z-index:0;
}
.formal-inner{position:relative;z-index:1;display:grid;gap:0}

/* ── Top action bar (inside blue area) ── */
.formal-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  padding:14px 20px 0;
}
.formal-actions .btn{
  background:rgba(255,255,255,.18) !important;
  border:1px solid rgba(255,255,255,.32) !important;
  color:#fff !important;
  backdrop-filter:blur(6px);
}
.formal-actions .btn:hover{background:rgba(255,255,255,.28) !important}
.formal-actions .btn-primary-google{
  background:rgba(255,255,255,.95) !important;
  color:#1a73e8 !important;
  border-color:transparent !important;
}

/* ── Header row (brand + company) inside blue ── */
.formal-header-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:20px;
  align-items:center;
  padding:8px 24px 18px;
}
.formal-brand{
  display:grid;
  gap:2px;
}
.formal-brand-title{
  font-size:42px;
  line-height:.9;
  letter-spacing:-.07em;
  font-weight:800;
  color:#fff;
}
.formal-brand-sub{
  font-size:10px;
  letter-spacing:.36em;
  font-weight:800;
  color:rgba(255,255,255,.78);
  padding-left:3px;
  text-transform:uppercase;
}
/* Company data inside the blue header */
.formal-company-inline{
  display:flex;
  flex-wrap:wrap;
  gap:6px 20px;
  align-items:center;
}
.formal-company-inline-item{
  display:flex;
  align-items:baseline;
  gap:5px;
  font-size:11px;
  line-height:1.3;
  color:rgba(255,255,255,.82);
}
.formal-company-inline-label{
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
}
.formal-company-inline-value{
  color:rgba(255,255,255,.92);
  font-weight:500;
}
.formal-topbar-badge{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 12px;border-radius:999px;
  background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);
  color:#fff;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  backdrop-filter:blur(8px);align-self:start;white-space:nowrap;
}

/* ── Body area (white) ── */
.formal-body-area{
  padding:20px 24px 24px;
  display:grid;
  gap:16px;
}

/* ── Row 1: Client + Doc card + Company ── */
.formal-row1{
  display:grid;
  grid-template-columns:1fr minmax(180px,220px);
  gap:14px;
  align-items:stretch;
}
.formal-client-meta,
.formal-doc-card,
.formal-company{
  border-radius:18px;
  border:1px solid rgba(60,64,67,.10);
  background:#fff;
  box-shadow:0 2px 8px rgba(60,64,67,.06),0 1px 2px rgba(60,64,67,.04);
}
.formal-client-meta{
  display:grid;
  gap:6px;
  padding:16px 18px;
  align-content:center;
}
.formal-kicker{
  font-size:10px;font-weight:800;letter-spacing:.14em;
  color:#1a73e8;text-transform:uppercase;
}
.formal-client-name{
  font-size:19px;line-height:1.05;font-weight:800;
  color:#202124;text-transform:uppercase;letter-spacing:-.04em;
}
.formal-client-extra{font-size:12px;color:#5f6368;margin-top:2px}
.formal-doc-card{
  padding:16px 18px;
  display:grid;gap:8px;
  align-content:center;
  justify-items:center;
  text-align:center;
  background:linear-gradient(160deg,#f8fbff 0%,#fff 100%);
}
.formal-doc-tag{
  display:inline-flex;align-items:center;justify-content:center;
  padding:5px 11px;border-radius:999px;
  background:rgba(26,115,232,.09);color:#1a73e8;
  font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
}
.formal-doc-title{
  font-size:22px;line-height:1;font-weight:300;
  color:#5f6368;letter-spacing:-.02em;
}
.formal-doc-sub{font-size:11px;color:#80868b;line-height:1.4}
.formal-company{
  display:grid;gap:8px;
  padding:16px 18px;
  align-content:center;
}
.formal-company-title,
.formal-section-title{
  font-size:10px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:#5f6368;
}
.formal-company-grid{display:grid;gap:5px}
.formal-company-row{
  display:grid;grid-template-columns:66px 1fr;gap:8px;
  align-items:start;font-size:11.5px;line-height:1.35;color:#3c4043;
}
.formal-company-label{color:#80868b;font-weight:700}
.formal-company-value strong{color:#202124}
.formal-vline{display:none}

/* ── Row 2: Product + Pricing side by side ── */
.formal-row2{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr);
  gap:14px;
  align-items:start;
}
.formal-body{
  display:grid;gap:10px;
  padding:18px 20px;
  border-radius:18px;
  border:1px solid rgba(60,64,67,.10);
  background:#fff;
  box-shadow:0 2px 8px rgba(60,64,67,.06);
}
.formal-product-chip{
  display:inline-flex;align-items:center;width:max-content;
  padding:5px 10px;border-radius:999px;
  background:rgba(26,115,232,.08);color:#1a73e8;
  font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
}
.formal-product-title{
  font-size:19px;font-weight:800;color:#202124;
  text-transform:uppercase;letter-spacing:-.04em;
}
.formal-desc{
  white-space:pre-line;font-size:12px;
  line-height:1.65;color:#3c4043;
}
.formal-aside-stack{display:grid;gap:12px}
.formal-center-note{
  display:grid;gap:6px;
  padding:14px 16px;
  border-radius:18px;
  background:linear-gradient(160deg,#f8fbff,#fff);
  border:1px solid rgba(26,115,232,.10);
  box-shadow:0 2px 8px rgba(60,64,67,.05);
}
.formal-note-label{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#5f6368}
.formal-center-note p{font-size:12.5px;line-height:1.55;color:#3c4043}
.formal-pricing{
  display:grid;gap:8px;
  padding:16px;
  border-radius:18px;
  background:linear-gradient(160deg,#f0f7ff,#fafcff);
  border:1px solid rgba(26,115,232,.16);
  box-shadow:0 4px 16px rgba(26,115,232,.08);
}
.formal-pricing-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.formal-pricing-title{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#5f6368}
.formal-pricing-badge{padding:4px 9px;border-radius:999px;background:#e8f0fe;color:#1a73e8;font-size:10px;font-weight:800}
.formal-pricing-line{
  display:flex;justify-content:space-between;align-items:flex-start;
  gap:12px;font-size:13px;color:#3c4043;
}
.formal-pricing-line strong{color:#202124}
.formal-pricing-line.muted{color:#80868b}
.formal-pricing-line.muted s{color:#b3261e;text-decoration-color:#ea4335;text-decoration-thickness:2px}
.formal-pricing-total{
  margin-top:4px;padding-top:10px;
  border-top:1px solid rgba(26,115,232,.14);
  display:grid;gap:2px;
  font-size:11px;color:#5f6368;font-weight:700;letter-spacing:.08em;
}
.formal-pricing-total strong{
  font-size:22px;line-height:1.05;
  color:#1a73e8;letter-spacing:-.05em;
}

/* ── Row 3: Bank + Terms ── */
.formal-bottom{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.formal-bank,
.formal-terms{
  display:grid;gap:10px;
  padding:16px 18px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(60,64,67,.10);
  box-shadow:0 2px 8px rgba(60,64,67,.05);
  font-size:12px;line-height:1.5;color:#3c4043;
}
.formal-bank-grid{display:grid;gap:7px}
.formal-bank-row{display:grid;grid-template-columns:96px 1fr;gap:8px}
.formal-bank-label{font-weight:700;color:#80868b}
.formal-bank-value strong,.formal-terms strong{font-weight:800;color:#202124}
.formal-payment-box{
  margin-top:2px;padding:10px 12px;
  border-radius:14px;background:#f0f7ff;
  border:1px solid rgba(26,115,232,.10);
  display:grid;gap:5px;
}
.formal-payment-title{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#5f6368}
.formal-payment-methods{font-weight:800;color:#202124}
.formal-payment-note{font-size:12px;color:#3c4043}
.formal-terms-list{display:grid;gap:8px}
.formal-terms-list p{
  position:relative;padding-left:14px;margin:0;
}
.formal-terms-list p::before{
  content:"";position:absolute;left:0;top:.68em;
  width:6px;height:6px;border-radius:999px;
  background:#1a73e8;transform:translateY(-50%);
}

/* ── Side panel ── */
.formal-sidepanel{position:sticky;top:12px;display:grid;gap:12px}
.formal-sidecard{
  background:linear-gradient(180deg,color-mix(in srgb, var(--surface) 96%, transparent),color-mix(in srgb, var(--surface2) 98%, transparent));
  border:1px solid var(--border);
  border-radius:20px;
  padding:16px;
  box-shadow:0 8px 24px rgba(60,64,67,.08);
}
.formal-sidecard .formal-quick-rail{display:grid;margin-bottom:0;padding:0;border:none;background:transparent;box-shadow:none}
.formal-sidecard .formal-preview-box{background:var(--surface);}
.formal-sidecard-title{font-size:10px;font-weight:800;color:var(--faint);text-transform:uppercase;letter-spacing:.12em}
.formal-sidecard-sub{font-size:11px;color:var(--muted);line-height:1.45;margin-top:3px}
@page{size:A4 portrait;margin:4mm}
@media print{
  html,body{
    width:210mm !important;
    min-height:297mm !important;
    height:auto !important;
    overflow:visible !important;
    font-size:11px !important;
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
    background:#fff !important;
    margin:0 !important;
    padding:0 !important;
  }
  body{padding:0 !important}
  .app{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
    background:#fff !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }
  .topbar,.sidebar,.panel,.items-header,.formal-sidepanel,.formal-actions{display:none !important}
  .main,.formal-quote-view,.formal-quote-wrap{
    display:block !important;
    overflow:visible !important;
    background:#fff !important;
    padding:0 !important;
    margin:0 !important;
    max-width:none !important;
  }

  .formal-paper{
    width:202mm !important;
    min-height:289mm !important;
    height:289mm !important;
    margin:0 auto !important;
    border:none !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    overflow:hidden !important;
    background:#fff !important;
  }
  .formal-paper::before{
    height:35mm !important;
    border-radius:0 !important;
    background:linear-gradient(135deg,#1a73e8 0%,#1967d2 52%,#1558b0 100%) !important;
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
  }
  .formal-inner{
    min-height:289mm !important;
    height:289mm !important;
    display:grid !important;
    grid-template-rows:auto 1fr !important;
    gap:0 !important;
  }

  /* cabeçalho azul */
  .formal-header-row{
    padding:3.2mm 5.2mm 4.2mm !important;
    gap:6mm !important;
    align-items:start !important;
  }
  .formal-brand-title{font-size:27px !important;line-height:.92 !important}
  .formal-brand-sub{font-size:6.8px !important;letter-spacing:.28em !important}
  .formal-topbar-badge{
    font-size:6.8px !important;
    padding:2.2px 7px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.16) !important;
    border:1px solid rgba(255,255,255,.28) !important;
    color:#fff !important;
  }
  .formal-company-inline{
    gap:1.6mm 4.2mm !important;
    flex-wrap:wrap !important;
    align-content:start !important;
  }
  .formal-company-inline-item{gap:1.2mm !important}
  .formal-company-inline-label{font-size:6.5px !important;color:rgba(255,255,255,.72) !important}
  .formal-company-inline-value,.formal-company-inline-item{font-size:7.9px !important;color:#fff !important}

  /* corpo distribuído na folha */
  .formal-body-area{
    min-height:254mm !important;
    height:254mm !important;
    padding:7.2mm 5.2mm 5.4mm !important;
    display:grid !important;
    grid-template-rows:minmax(27mm,auto) minmax(101mm,1fr) minmax(75mm,auto) !important;
    gap:3.2mm !important;
    align-content:stretch !important;
  }

  .formal-row1,
  .formal-row2,
  .formal-bottom{
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }

  /* linha 1 */
  .formal-row1{grid-template-columns:1fr 49mm !important;gap:3.4mm !important;align-items:stretch !important}
  .formal-client-meta,
  .formal-doc-card,
  .formal-body,
  .formal-center-note,
  .formal-pricing,
  .formal-bank,
  .formal-terms{
    border-radius:8px !important;
    box-shadow:none !important;
    break-inside:avoid !important;
    page-break-inside:avoid !important;
  }
  .formal-client-meta{
    padding:4.8mm 5.1mm !important;
    gap:1.9mm !important;
    align-content:center !important;
    background:#fff !important;
    border:1px solid rgba(60,64,67,.14) !important;
  }
  .formal-doc-card{
    padding:4.4mm 4.5mm !important;
    background:linear-gradient(160deg,#f6faff 0%,#ffffff 100%) !important;
    border:1px solid rgba(26,115,232,.12) !important;
  }
  .formal-kicker{font-size:7.2px !important}
  .formal-client-name{font-size:17.2px !important;line-height:1.02 !important}
  .formal-client-extra{font-size:9.2px !important;line-height:1.34 !important}
  .formal-doc-tag{font-size:7px !important;padding:2.4px 7px !important}
  .formal-doc-title{font-size:20.5px !important;line-height:1 !important}
  .formal-doc-sub{font-size:8.5px !important;line-height:1.4 !important}

  /* linha 2 */
  .formal-row2{grid-template-columns:1fr 49mm !important;gap:3.4mm !important;align-items:stretch !important}
  .formal-body{
    height:100% !important;
    padding:4.9mm 5.1mm !important;
    gap:2.6mm !important;
    align-content:start !important;
    background:#fff !important;
    border:1px solid rgba(60,64,67,.14) !important;
  }
  .formal-product-chip{font-size:7px !important;padding:2.4px 7px !important}
  .formal-product-title{font-size:14.6px !important;line-height:1.08 !important}
  .formal-desc{font-size:9.2px !important;line-height:1.55 !important}
  .formal-aside-stack{
    height:100% !important;
    grid-template-rows:auto 1fr !important;
    gap:3.4mm !important;
  }
  .formal-center-note{
    padding:4.2mm !important;
    gap:1.8mm !important;
    background:linear-gradient(160deg,#f8fbff,#fff) !important;
    border:1px solid rgba(26,115,232,.12) !important;
  }
  .formal-note-label{font-size:7px !important}
  .formal-center-note p{font-size:8.9px !important;line-height:1.46 !important}
  .formal-pricing{
    padding:4.3mm !important;
    gap:2mm !important;
    align-content:start !important;
    background:linear-gradient(160deg,#eef5ff,#f9fbff) !important;
    border:1px solid rgba(26,115,232,.18) !important;
  }
  .formal-pricing-title{font-size:7px !important}
  .formal-pricing-badge{font-size:6.9px !important;padding:2.2px 6px !important}
  .formal-pricing-line{font-size:8.9px !important;line-height:1.38 !important;gap:2mm !important}
  .formal-pricing-total{padding-top:1.8mm !important;margin-top:1.8mm !important;gap:.8mm !important}
  .formal-pricing-total strong{font-size:16.8px !important;line-height:1.02 !important}

  /* linha 3 */
  .formal-bottom{grid-template-columns:1fr 1fr !important;gap:3.4mm !important;align-items:stretch !important}
  .formal-bank,
  .formal-terms{
    height:100% !important;
    padding:4.6mm 5mm !important;
    gap:2.5mm !important;
    font-size:8.8px !important;
    line-height:1.48 !important;
    background:#fff !important;
    border:1px solid rgba(60,64,67,.14) !important;
  }
  .formal-section-title{font-size:7.1px !important}
  .formal-bank-grid{gap:1.3mm !important}
  .formal-bank-row{grid-template-columns:21mm 1fr !important;gap:1.8mm !important}
  .formal-bank-label{font-size:8px !important}
  .formal-bank-value{font-size:8.8px !important;line-height:1.42 !important}
  .formal-payment-box{
    margin-top:1mm !important;
    padding:2.6mm 3mm !important;
    border-radius:6px !important;
    gap:1.1mm !important;
    background:#eef5ff !important;
    border:1px solid rgba(26,115,232,.14) !important;
  }
  .formal-payment-title{font-size:6.9px !important}
  .formal-payment-methods{font-size:8.8px !important}
  .formal-payment-note{font-size:8.2px !important;line-height:1.42 !important}
  .formal-terms-list{gap:1.6mm !important}
  .formal-terms-list p{padding-left:3.4mm !important;font-size:8.8px !important;line-height:1.48 !important}
  .formal-terms-list p::before{top:.6em !important;width:3px !important;height:3px !important}
}


@media (max-width:1180px){
  .formal-quote-wrap{grid-template-columns:minmax(0,1fr)}
  .formal-sidepanel{position:static}
}
@media (max-width:980px){
  .formal-quote-view{padding:16px}
  .formal-row1,.formal-row2,.formal-bottom{grid-template-columns:1fr}
}
@media (max-width:760px){
  .formal-brand-title{font-size:36px}
  .formal-company-row,.formal-bank-row,.formal-pricing-line{grid-template-columns:1fr;display:grid}
  .formal-client-name{font-size:18px}
  .formal-doc-title{font-size:22px}
  .formal-body,.formal-bank,.formal-terms,.formal-pricing,.formal-client-meta,.formal-doc-card,.formal-company{padding:16px}
}
