/* Clear, touch-friendly quotation form layout. */
body.quote-modal-open{overflow:hidden}
.quote-form-modal .modal-head{position:relative;align-items:flex-start}
.quote-form-modal .modal-head>div:first-child{min-width:0}
.quote-form-modal .modal-head p{max-width:48rem}
.quote-info{display:none}
.quote-form-modal .modal-body{min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-padding-top:12px;scroll-padding-bottom:24px}
.quote-form-modal .modal-footer{position:relative;flex-shrink:0}
.quote-form-guide{margin:0 0 16px;padding:12px 12px 10px;border:1px solid var(--line,#e6ece9);border-radius:12px;background:var(--surface-muted,#f6f9f7)}
.quote-form-guide-title{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.quote-form-guide-title strong{font-size:12px;color:var(--ink,#1d2d32)}
.quote-form-guide-title span{font-size:10px;line-height:1.35;color:var(--muted,#7f8f91)}
.quote-step-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.quote-step-button{min-height:42px;border:1px solid var(--line,#dce6e1);border-radius:9px;background:var(--surface,#fff);color:var(--ink,#26373b);display:flex;align-items:center;justify-content:center;gap:5px;padding:6px 7px;font:600 10px var(--display,inherit);cursor:pointer;touch-action:manipulation}
.quote-step-button:hover,.quote-step-button:focus-visible{border-color:var(--accent,#188a69);box-shadow:0 0 0 3px rgba(24,138,105,.12);outline:0}
.quote-step-button.is-active{background:var(--accent,#188a69);border-color:var(--accent,#188a69);color:#fff}
.quote-step-number{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(24,138,105,.11);color:var(--accent,#188a69);font-size:10px}
.quote-step-button.is-active .quote-step-number{background:rgba(255,255,255,.22);color:#fff}
.quote-form-modal .form-field label{line-height:1.35}
.quote-form-modal .company-autofill{position:relative;align-items:flex-start;padding:25px 12px 11px;min-height:78px}
.quote-form-modal .quote-preview-kicker{position:absolute;top:8px;left:12px;font-size:9px;font-weight:700;letter-spacing:.45px;text-transform:uppercase;color:var(--accent,#188a69)}
.quote-form-modal .rich-editor{scroll-margin-top:12px}
.quote-form-modal .rich-toolbar{gap:6px;padding:8px;background:var(--surface-muted,#f6f9f7)}
.quote-form-modal .rich-toolbar-caption{width:100%;font-size:10px;font-weight:700;color:var(--muted,#7f8f91);letter-spacing:.2px}
.quote-form-modal .rich-tool{min-width:42px;min-height:42px;padding:7px 9px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:5px;touch-action:manipulation}
.quote-form-modal .rich-font-size{min-height:42px;min-width:155px;padding:7px 10px;font-size:14px;touch-action:manipulation}
.quote-form-modal .rich-editor-surface{min-height:12rem;max-height:28rem;padding:13px 14px;font-size:16px;line-height:1.6;scroll-margin-bottom:140px}
.quote-form-modal .rich-editor-surface:empty:before{content:attr(data-placeholder);color:#9aa7a7}
.quote-form-modal .line-items-wrap{scroll-margin-top:12px}
.quote-form-modal .terms-document{min-height:112px!important;font-size:16px}
.quote-form-modal.keyboard-open .modal-footer{display:none!important}
.quote-form-modal.keyboard-open .quote-form-guide{display:none}
.quote-form-modal.keyboard-open .modal-head{padding-top:7px;padding-bottom:7px}
.quote-form-modal.keyboard-open .modal-head p{display:none}
.quote-form-modal .rich-toolbar,.quote-form-modal .rich-tool,.quote-form-modal .rich-font-size,.quote-form-modal .rich-editor-surface{color:var(--ink,#17242b)}
.quote-form-modal .rich-toolbar{background:var(--surface,#fff);border-color:var(--line,#e9edef)}
.quote-form-modal .rich-tool{background:transparent;color:var(--ink,#17242b);border:1px solid transparent}
.quote-form-modal .rich-font-size{background:var(--surface,#fff);color:var(--ink,#17242b);border-color:var(--line,#e9edef)}
.quote-form-modal .rich-editor-surface{background:var(--surface,#fff);border-color:var(--line,#e9edef);caret-color:var(--accent,#188568);-webkit-overflow-scrolling:touch}
:root[data-theme="dark"] .quote-form-modal .rich-toolbar,:root[data-theme="dark"] .quote-form-modal .rich-font-size,:root[data-theme="dark"] .quote-form-modal .rich-editor-surface{background:#111916;color:#e8efeb;border-color:#35433c}
:root[data-theme="dark"] .quote-form-modal .rich-tool{color:#e8efeb}
@media(max-width:680px){
  .quote-form-modal{max-height:calc(100dvh - env(safe-area-inset-bottom,0px) - 8px)!important;border-radius:14px 14px 0 0}
  .quote-form-modal .modal-head{padding:10px 14px 8px;gap:8px;align-items:center}
  .quote-form-modal .modal-head h2{font-size:20px;line-height:1.15}
  .quote-form-modal .modal-head p{display:none}
  .quote-form-modal .quote-info{display:block;margin-top:4px;font-size:11px;color:var(--muted,#859198)}
  .quote-form-modal .quote-info summary{display:inline-flex;align-items:center;min-height:28px;color:var(--accent,#188568);font-weight:700;cursor:pointer;list-style:none}
  .quote-form-modal .quote-info summary::-webkit-details-marker{display:none}
  .quote-form-modal .quote-info summary::before{content:'ⓘ';margin-right:5px;font-size:13px}
  .quote-form-modal .quote-info p{display:block;margin:5px 0 0;line-height:1.4;color:var(--muted,#859198)}
  .quote-form-modal .close-button{width:42px;height:42px;min-width:42px;min-height:42px}
  .quote-form-guide{margin-left:-2px;margin-right:-2px;padding:11px 10px}
  .quote-form-guide-title{display:block}.quote-form-guide-title span{display:block;margin-top:3px}
  .quote-step-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .quote-step-button{justify-content:flex-start;padding-left:10px;font-size:11px}
  .quote-form-modal .modal-body{padding:14px 16px calc(24px + env(safe-area-inset-bottom));overscroll-behavior:contain}
  .quote-form-modal .form-grid{gap:15px 10px}
  .quote-form-modal .form-field label{font-size:12px}
  .quote-form-modal .form-field input,.quote-form-modal .form-field select,.quote-form-modal .form-field textarea{min-height:48px;height:48px;font-size:16px}
  .quote-form-modal .form-field textarea,.quote-form-modal .terms-document{height:auto;min-height:104px!important;padding-top:11px}
  .quote-form-modal .rich-toolbar{gap:4px;padding:6px;align-items:center}
  .quote-form-modal .rich-toolbar-caption{flex:1 0 100%;font-size:10px}
  .quote-form-modal .rich-tool-text{display:none}
  .quote-form-modal .rich-toolbar-divider{display:none}
  .quote-form-modal .rich-tool{min-width:38px;min-height:40px;padding:6px 8px;font-size:16px}
  .quote-form-modal .rich-font-size{flex:1 1 100%;order:4;min-width:0;width:100%;min-height:42px;font-size:16px}
  .quote-form-modal .rich-editor-surface{min-height:12rem;max-height:none;overflow:auto}
  .quote-form-modal .modal-footer{padding:10px 16px calc(10px + env(safe-area-inset-bottom));gap:8px}
  .quote-form-modal .modal-actions{width:100%;margin-left:0}.quote-form-modal .modal-actions .button{min-height:46px;flex:1;font-size:14px}
}
@media(max-width:390px){
  .quote-form-modal .rich-tool{min-width:39px;padding:7px 6px}.quote-form-modal .rich-tool-text{display:none}
  .quote-form-modal .rich-font-size{order:4}
}

/* Android WebView can expose the physical pixel width instead of the CSS
   breakpoint width. The app marks the root with invoicey-android, so keep the
   compact quotation layout reliable on real Android devices as well. */
@media screen {
  html.invoicey-android .quote-form-modal{max-height:calc(var(--android-viewport-height,100dvh) - var(--android-system-bottom,0px) - 22px)!important;border-radius:14px 14px 0 0}
  html.invoicey-android .quote-form-modal .modal-head{padding:10px 14px 8px;gap:8px;align-items:center}
  html.invoicey-android .quote-form-modal .modal-head h2{font-size:20px;line-height:1.15}
  html.invoicey-android .quote-form-modal .modal-head p{display:none}
  html.invoicey-android .quote-form-modal .quote-info{display:block;margin-top:4px;font-size:11px;color:var(--muted,#859198)}
  html.invoicey-android .quote-form-modal .quote-info summary{display:inline-flex;align-items:center;min-height:28px;color:var(--accent,#188568);font-weight:700;cursor:pointer;list-style:none}
  html.invoicey-android .quote-form-modal .quote-info summary::-webkit-details-marker{display:none}
  html.invoicey-android .quote-form-modal .quote-info summary::before{content:'ⓘ';margin-right:5px;font-size:13px}
  html.invoicey-android .quote-form-modal .quote-info p{display:block;margin:5px 0 0;line-height:1.4;color:var(--muted,#859198)}
  html.invoicey-android .quote-form-modal .close-button{width:42px;height:42px;min-width:42px;min-height:42px}
  html.invoicey-android .quote-form-modal .quote-form-guide{margin-left:-2px;margin-right:-2px;padding:11px 10px}
  html.invoicey-android .quote-form-modal .quote-form-guide-title{display:block}
  html.invoicey-android .quote-form-modal .quote-form-guide-title span{display:block;margin-top:3px}
  html.invoicey-android .quote-form-modal .quote-step-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  html.invoicey-android .quote-form-modal .quote-step-button{justify-content:flex-start;padding-left:10px;font-size:11px}
  html.invoicey-android .quote-form-modal .modal-body{padding:14px 16px calc(24px + env(safe-area-inset-bottom));overscroll-behavior:contain}
  html.invoicey-android .quote-form-modal .form-grid{gap:15px 10px}
  html.invoicey-android .quote-form-modal .form-field label{font-size:12px}
  html.invoicey-android .quote-form-modal .form-field input,
  html.invoicey-android .quote-form-modal .form-field select,
  html.invoicey-android .quote-form-modal .form-field textarea{min-height:48px;height:48px;font-size:16px}
  html.invoicey-android .quote-form-modal .form-field textarea,
  html.invoicey-android .quote-form-modal .terms-document{height:auto;min-height:104px!important;padding-top:11px}
  html.invoicey-android .quote-form-modal .rich-toolbar{gap:4px;padding:6px;align-items:center}
  html.invoicey-android .quote-form-modal .rich-toolbar-caption{flex:1 0 100%;font-size:10px}
  html.invoicey-android .quote-form-modal .rich-tool-text{display:none}
  html.invoicey-android .quote-form-modal .rich-toolbar-divider{display:none}
  html.invoicey-android .quote-form-modal .rich-tool{min-width:38px;min-height:40px;padding:6px 8px;font-size:16px}
  html.invoicey-android .quote-form-modal .rich-font-size{flex:1 1 100%;order:4;min-width:0;width:100%;min-height:42px;font-size:16px}
  html.invoicey-android .quote-form-modal .rich-editor-surface{min-height:12rem;max-height:none;overflow:auto}
  html.invoicey-android .quote-form-modal .modal-footer{padding:10px 16px calc(10px + env(safe-area-inset-bottom));gap:8px}
  html.invoicey-android .quote-form-modal .modal-actions{width:100%;margin-left:0}
  html.invoicey-android .quote-form-modal .modal-actions .button{min-height:46px;flex:1;font-size:14px}
}

/* When the IME is open, use the browser's dynamic visual viewport for the
   modal itself. The Android shell's initial viewport estimate can be shorter
   than the post-keyboard viewport, which otherwise clips the focused field at
   the modal's bottom edge. */
@media screen {
  html.invoicey-android .quote-form-modal.keyboard-open {
    height:calc(100dvh - var(--android-system-bottom,0px) - 4px)!important;
    max-height:calc(100dvh - var(--android-system-bottom,0px) - 4px)!important;
  }
  html.invoicey-android .quote-form-modal.keyboard-open .modal-body {
    min-height:0!important;
    overflow:auto!important;
  }
}
