/* JOBIX_V148_MOBILE_CUSTOMER_STATE_POLISH
   Mobile public quote state/copy polish after SMS delivery.
   Fixes signed/paid messaging, customer-facing status labels, CTA hierarchy, and mobile service card labels.
*/
:root{--jx148-blue:#2563eb;--jx148-green:#16a34a;--jx148-emerald:#0f766e;--jx148-ink:#0f172a;--jx148-muted:#64748b;--jx148-line:#dbe7f4;--jx148-soft:#eef6ff;--jx148-card:#ffffff;}

/* Text/SMS action button: make it feel intentional, not like a grey utility. */
.actions button[name="send_sms"],
.actions .btn.sms,
.actions a[href*="sms"],
.actions.no-print button[name="send_sms"],
.actions.no-print .btn.sms,
button[data-action*="sms"],
button[data-jobix-action*="sms"],
.jx-text-quote,
.jx-text-invoice{
  background:linear-gradient(135deg,#0ea5e9,#2563eb)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 10px 22px rgba(37,99,235,.22)!important;
}
.actions button[name="send_sms"]:before,
.actions .btn.sms:before,
.actions a[href*="sms"]:before,
.jx-text-quote:before,
.jx-text-invoice:before{content:"💬 ";font-weight:900;}

/* Public quote/customer portal state polish. */
.jx148-state-banner{
  display:flex;align-items:flex-start;gap:12px;background:#ecfdf5;border:1px solid #bbf7d0;color:#14532d;border-radius:18px;padding:14px 16px;margin:0 0 14px;box-shadow:0 10px 24px rgba(21,128,61,.06);
}
.jx148-state-banner .jx148-icon{width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:#dcfce7;color:#166534;font-weight:900;flex:0 0 34px;}
.jx148-state-banner strong{display:block;font-size:16px;line-height:1.15;color:#052e16;margin-bottom:3px;}
.jx148-state-banner span{display:block;font-size:13px;line-height:1.35;color:#166534;}
.jx148-state-banner.needs-payment{background:#eff6ff;border-color:#bfdbfe;color:#1e3a8a;}
.jx148-state-banner.needs-payment .jx148-icon{background:#dbeafe;color:#1d4ed8;}
.jx148-state-banner.needs-payment strong{color:#1e3a8a}.jx148-state-banner.needs-payment span{color:#1e40af;}
.jx148-state-banner.pending{background:#fff7ed;border-color:#fed7aa;color:#7c2d12;}
.jx148-state-banner.pending .jx148-icon{background:#ffedd5;color:#c2410c;}
.jx148-state-banner.pending strong{color:#7c2d12}.jx148-state-banner.pending span{color:#9a3412;}

.jx148-success-card h2,.jx148-next-card h2{letter-spacing:-.04em;}
.jx148-success-card .btn.success{background:#16a34a!important;color:#fff!important;border:0!important;box-shadow:0 10px 22px rgba(22,163,74,.18)!important;}
.jx148-paid-chip{display:inline-flex;align-items:center;gap:8px;background:#dcfce7;color:#166534;border:1px solid #bbf7d0;border-radius:999px;padding:11px 16px;font-weight:900;}
.jx148-paid-chip:before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:999px;background:#16a34a;color:#fff;font-size:13px;}

/* Customer-facing status labels should read like customer status, not backend status. */
.jx16-document.quote .jx16-meta-row strong,
.jx16-document.invoice .jx16-meta-row strong{font-weight:900;}

@media screen and (max-width:760px){
  body.jx148-public-quote-body{background:#eaf3ff!important;}
  .jx244-page,.jx246-page,.jx247-page{padding:10px!important;}
  .jx244-topbar{
    background:rgba(238,245,255,.98)!important;
    backdrop-filter:blur(12px)!important;
    box-shadow:0 8px 24px rgba(15,23,42,.08)!important;
  }
  .jx244-brand small{font-size:10px!important;color:#718096!important;font-weight:700!important;}
  .jx244-logo-mini{width:48px!important;height:48px!important;border-radius:16px!important;font-size:18px!important;}
  .jx244-pill{font-size:12px!important;padding:9px 12px!important;max-width:54vw!important;overflow:hidden!important;text-overflow:ellipsis!important;}

  /* Make the hero less tall and less repetitive after the SMS click-through. */
  .jx244-hero,.jx246-hero{
    padding:17px!important;
    border-radius:22px!important;
    box-shadow:0 14px 36px rgba(15,23,42,.07)!important;
  }
  .jx244-kicker{font-size:12px!important;letter-spacing:.24em!important;}
  .jx244-hero h1,.jx246-hero h1{font-size:32px!important;line-height:1.05!important;margin:6px 0 8px!important;}
  .jx244-hero p,.jx246-hero p{font-size:16px!important;line-height:1.42!important;color:#475569!important;}
  .jx244-contact-card{
    padding:14px!important;border-radius:18px!important;
    display:grid!important;grid-template-columns:1fr!important;gap:5px!important;
  }
  .jx244-contact-card strong{font-size:18px!important;}
  .jx244-contact-card span{font-size:14px!important;word-break:break-word!important;}

  /* Sticky action bar: primary action first and touch-friendly. */
  .jx248-simple-toolbar,.jx14-public-actions{
    gap:8px!important;padding:10px!important;border-radius:18px!important;
    box-shadow:0 -10px 26px rgba(15,23,42,.10)!important;
  }
  .jx248-simple-toolbar .btn,.jx14-public-actions .btn{min-height:44px!important;border-radius:999px!important;font-size:14px!important;font-weight:900!important;}
  .jx248-simple-toolbar .btn.primary,.jx14-public-actions .btn.primary{background:#2563eb!important;color:#fff!important;}

  /* Mobile service cards with visible labels instead of unlabeled numbers. */
  .jx16-table .jx16-table-row{position:relative;border:1px solid var(--jx148-line)!important;border-radius:20px!important;background:#fff!important;margin:10px 0!important;padding:18px!important;box-shadow:0 10px 24px rgba(15,23,42,.05)!important;}
  .jx16-table .jx16-table-row>div{display:grid!important;grid-template-columns:auto 1fr!important;gap:9px!important;align-items:start!important;border:0!important;}
  .jx16-table .jx16-table-row>div::before{content:"";font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#64748b;font-weight:900;min-width:92px;}
  .jx16-table .jx16-table-row>div:nth-child(1)::before{content:"Service";}
  .jx16-table .jx16-table-row>div:nth-child(2)::before{content:"Description";}
  .jx16-table .jx16-table-row>div:nth-child(3)::before{content:"Qty";}
  .jx16-table.priced .jx16-table-row>div:nth-child(4)::before{content:"Unit price";}
  .jx16-table.priced .jx16-table-row>div:nth-child(5)::before{content:"Total";}
  .jx16-item-name strong{font-size:18px!important;line-height:1.2!important;}
  .jx16-item-desc{font-size:14px!important;line-height:1.42!important;color:#475569!important;}

  /* Reduce duplicate brand weight inside the document on mobile. */
  .jx16-company-block{align-items:center!important;}
  .jx16-company-block h1{font-size:27px!important;}
  .jx16-company-block p{font-size:13px!important;line-height:1.35!important;color:#475569!important;}

  /* Cleaner post-approval panels. */
  .jx246-embedded-panel,.jx244-card{border-radius:22px!important;padding:18px!important;}
  .jx246-embedded-panel h2,.jx244-card h2{font-size:30px!important;line-height:1.05!important;letter-spacing:-.065em!important;}
  .jx246-embedded-panel p,.jx244-card p{font-size:17px!important;line-height:1.45!important;}
  .jx148-state-banner{margin:0 0 12px!important;}

  /* Signature card should not look awkward on narrow screens. */
  .jx16-signature-summary{border-radius:18px!important;padding:16px!important;}
  .jx16-signature-line{min-width:0!important;overflow:hidden!important;}
  .jx16-signature-line img{max-width:100%!important;object-fit:contain!important;}
}

@media screen and (max-width:420px){
  .jx244-hero h1,.jx246-hero h1{font-size:30px!important;}
  .jx246-embedded-panel h2,.jx244-card h2{font-size:28px!important;}
  .jx16-table .jx16-table-row>div{grid-template-columns:1fr!important;gap:3px!important;}
  .jx16-table .jx16-table-row>div::before{min-width:0!important;}
}