/* Sample requests on the product page (1.6.0). The window reuses the enquiry window's frame and
   fields (.cptp-enquiry-modal, .cptp-enquiry-form); only the sample parts are styled here. */
.cptp-sample-modal__dialog { width: min(100%, 720px); }
.cptp-sample-picked { margin: 0 0 18px; padding: 16px; border: 1px solid var(--cp-line, #dfe5e7); border-radius: 8px; background: var(--cp-soft, #f4f6f6); }
.cptp-sample-picked__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; color: var(--cp-navy, #021d49); }
.cptp-sample-count { color: var(--cp-muted, #66747d); font-size: 13px; }
.cptp-sample-list,
.cptp-sample-results { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.cptp-sample-list li,
.cptp-sample-results li { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.cptp-sample-list li { display: flex; align-items: center; gap: 12px; padding: 8px 0 !important; border-top: 1px solid var(--cp-line, #dfe5e7); }
.cptp-sample-list li:first-child { border-top: 0; }
.cptp-sample-swatch { flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid var(--cp-line, #dfe5e7); border-radius: 6px; background: #e6eaec center / cover no-repeat; }
.cptp-sample-label { flex: 1; min-width: 0; display: grid; gap: 1px; text-align: left; }
.cptp-sample-label strong { color: var(--cp-navy, #021d49); font-size: 15px; line-height: 1.25; }
.cptp-sample-label span { color: var(--cp-muted, #66747d); font-size: 13px; line-height: 1.3; }
.cptp-sample-remove { flex: 0 0 auto; padding: 6px 10px; border: 1px solid var(--cp-line, #dfe5e7); border-radius: 6px; background: #fff; color: var(--cp-navy, #021d49); font-size: 13px; font-weight: 600; cursor: pointer; }
.cptp-sample-remove:hover,
.cptp-sample-remove:focus-visible { border-color: var(--cp-navy, #021d49); }
.cptp-sample-empty { color: var(--cp-muted, #66747d); font-size: 14px; padding: 8px 0 !important; }
.cptp-sample-note { min-height: 18px; margin: 8px 0 0; color: var(--cp-navy, #021d49); font-size: 13px; font-weight: 600; }
.cptp-sample-add { margin: 0 0 22px; }
.cptp-sample-add label { display: grid; gap: 6px; color: var(--cp-navy, #021d49); font-weight: 600; }
.cptp-sample-add label > span { font-size: 13px; }
.cptp-sample-search { width: 100%; min-height: 44px; margin: 0 !important; padding: 10px 12px !important; border: 1px solid var(--cp-field, #c9d3d6) !important; border-radius: 6px !important; background: #fff !important; color: var(--cp-text, #182632) !important; font-size: 16px !important; }
.cptp-sample-search:focus { border-color: var(--cp-navy, #021d49) !important; outline: 0; box-shadow: 0 0 0 3px rgba(2, 29, 73, .12); }
.cptp-sample-results { max-height: 232px; margin-top: 8px !important; overflow-y: auto; border: 1px solid var(--cp-line, #dfe5e7); border-radius: 6px; background: #fff; }
.cptp-sample-results li { border-top: 1px solid var(--cp-line, #dfe5e7); }
.cptp-sample-results li:first-child { border-top: 0; }
.cptp-sample-results li.cptp-sample-empty { padding: 12px !important; }
.cptp-sample-results button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px 12px; border: 0; background: #fff; cursor: pointer; text-align: left; }
.cptp-sample-results button:hover,
.cptp-sample-results button:focus-visible { background: var(--cp-soft, #f4f6f6); }
.cptp-sample-results button:disabled { cursor: default; opacity: .55; }
.cptp-sample-results .cptp-sample-swatch { flex-basis: 36px; width: 36px; height: 36px; }
.cptp-sample-addword { flex: 0 0 auto; color: var(--cp-teal-text, #00837a); font-size: 13px; font-weight: 700; }
.cptp-sample-form__heading { margin: 0 0 14px; color: var(--cp-navy, #021d49); font-size: 20px; line-height: 1.2; }
.cptp-sample-form .cptp-enquiry-form__message textarea { min-height: 76px; }
.cptp-sample-form .cptp-enquiry-form__footer a { color: var(--cp-navy, #021d49); text-decoration: underline; }

/* The choice, kept in view while browsing: bottom left, clear of the back-to-top button on the right. */
.cptp-sample-pill { position: fixed; left: 18px; bottom: 18px; z-index: 900; padding: 12px 16px; border: 0; border-radius: 999px; background: var(--cp-navy, #021d49); color: #fff; font-size: 14px; font-weight: 600; line-height: 1; box-shadow: 0 6px 18px rgba(2, 29, 73, .28); cursor: pointer; }
.cptp-sample-pill[hidden] { display: none !important; }
.cptp-sample-pill:hover,
.cptp-sample-pill:focus-visible { background: #0a2c66; }
.cptp-sample-pill__count { margin-left: 2px; color: var(--cp-teal, #00c4b4); }

@media (max-width: 640px) {
  .cptp-sample-picked { padding: 12px; }
  .cptp-sample-results { max-height: 196px; }
  .cptp-sample-pill { left: 12px; bottom: 12px; }
}

/* Address suggestions (1.6.3): the list hangs under the Street address box, inside the window. */
.cptp-sample-form label.cptp-sample-address { position: relative; }
.cptp-sample-form label.cptp-sample-address small { display: block; margin-top: 4px; color: var(--cp-muted, #66747d); font-size: 12px; font-weight: 400; line-height: 1.35; }
/* 1.7.2: "display: block" above beats the hidden attribute, so the hint showed from the start and stayed when Google
   refused. It is hidden for as long as the script keeps the attribute on it. */
.cptp-sample-form label.cptp-sample-address small[hidden] { display: none; }
/* 1.7.2: when the hint does show, the box beside it keeps its own height instead of stretching to fill the row. */
.cptp-sample-form .cptp-enquiry-form__grid > label { align-content: start; }
.cptp-sample-form .cptp-address-list { position: absolute; z-index: 6; left: 0; right: 0; max-height: 264px; overflow-y: auto; margin: 0; padding: 4px 0; list-style: none; text-align: left; background: #fff; border: 1px solid var(--cp-line, #dfe5e7); border-radius: 6px; box-shadow: 0 10px 24px rgba(2, 29, 73, .14); }
.cptp-sample-form .cptp-address-list[hidden] { display: none; }
.cptp-sample-form .cptp-address-list li { margin: 0; padding: 9px 12px; color: var(--cp-text, #182632); font-size: 14px; font-weight: 400; line-height: 1.35; cursor: pointer; }
.cptp-sample-form .cptp-address-list li:hover,
.cptp-sample-form .cptp-address-list li.is-active { background: var(--cp-soft, #f4f6f6); }
.cptp-sample-form .cptp-address-list li.cptp-address-by { padding: 6px 12px 4px; border-top: 1px solid var(--cp-line, #dfe5e7); color: var(--cp-muted, #66747d); font-size: 11px; text-align: right; cursor: default; background: none; }

/* The window on pages that are not product pages (1.7.0): its wrapper only carries the product page's colours and type, it takes no room. */
.cptp-sample-everywhere { background: none; }
/* On a product page the theme's own product-page rules shape the window's boxes and Send button. Those rules do
   not reach other pages, so the same look is set here for the window only. */
#top .cptp-sample-everywhere .cptp-btn { box-sizing: border-box; min-height: 48px; padding: 0 22px; border: 1.5px solid transparent; border-radius: 6px; font-size: 16px; line-height: 1.2; font-weight: 600; opacity: 1; transition: background-color .18s ease, border-color .18s ease, color .18s ease; }
#top .cptp-sample-everywhere .cptp-btn--primary { background: var(--cp-teal); border-color: var(--cp-teal); color: var(--cp-navy) !important; }
#top .cptp-sample-everywhere .cptp-btn--primary:hover { background: var(--cp-teal-hover, #00ad9f); border-color: var(--cp-teal-hover, #00ad9f); color: var(--cp-navy) !important; opacity: 1; }
#top .cptp-sample-everywhere .cptp-enquiry-modal__dialog { border-radius: 8px; }
#top .cptp-sample-everywhere .cptp-enquiry-form :is(input, textarea, select) { border-radius: 6px; }
@media only screen and (max-width: 767px) {
	#top .cptp-sample-everywhere .cptp-btn { width: 100%; }
}
