/* The quote list (includes/quote-list.php): buttons, the Quote link and the quote page. Theme-independent; brand red
   in --tvsh-red. */
:root { --tvsh-red: #d2232a; --tvsh-red-deep: #a8181e; }
.tvsh-quote input[type=text], .tvsh-quote input[type=email], .tvsh-quote input[type=tel], .tvsh-quote input[type=number], .tvsh-quote textarea {
	font: inherit; font-size: 14px; border: 1px solid #ccc; border-radius: 6px; padding: 10px 12px; max-width: 100%; background: #fff; color: #222;
}
.tvsh-quote .tvsh-send { display: inline-flex; align-items: center; justify-content: center; background: var(--tvsh-red); color: #fff; border: 0; border-radius: 30px; font: inherit; font-weight: 700; cursor: pointer; }
.tvsh-quote .tvsh-send:hover { background: var(--tvsh-red-deep); }
.tvsh-quote-link { display: inline-flex; align-items: center; gap: 6px; color: inherit; text-decoration: none; font-weight: 600; }
.tvsh-quote-float { display: none; position: fixed; left: 16px; bottom: 16px; z-index: 9990; background: #fff; color: #222; border: 2px solid var(--tvsh-red); border-radius: 30px; padding: 10px 16px; box-shadow: 0 4px 14px rgba(0,0,0,.18); }
.tvsh-quote-float.has-items { display: inline-flex; }
.tvsh-icon-badge { position: relative; display: inline-flex; }
.tvsh-badge { position: absolute; top: -8px; right: -10px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--tvsh-red); color: #fff; font-size: 10px; line-height: 16px; text-align: center; font-weight: 700; }
.tvsh-badge[hidden] { display: none; }
.tvsh-add-quote, .tvsh-cart-to-quote, .tvsh-btn-ghost {
	display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-family: inherit; font-weight: 700; font-size: 15px;
	background: #fff !important; color: var(--tvsh-red) !important; border: 2px solid var(--tvsh-red) !important; border-radius: 30px !important; padding: 8px 20px; transition: background .15s, color .15s;
}
.tvsh-add-quote:hover, .tvsh-cart-to-quote:hover, .tvsh-btn-ghost:hover { background: var(--tvsh-red) !important; color: #fff !important; }
.tvsh-add-quote:disabled { opacity: .45; cursor: not-allowed; background: #fff !important; color: var(--tvsh-red) !important; }
.woocommerce ul.products li.product .tvsh-add-quote { align-self: center; margin-top: 8px; font-size: 14px; padding: 7px 18px; }
.woocommerce ul.products li.product .tvsh-quote-status { font-size: 11px; min-height: 0; margin: 6px 10px 0; }
.tvsh-quote-buy { margin: 4px 0 18px; }
.tvsh-add-quote--wide { width: 100%; max-width: 330px; height: 46px; font-size: 16px; }
.tvsh-quote-status { font-size: 13px; margin: 8px 0 0; min-height: 1.2em; }
.tvsh-quote-status a, .tvsh-quote-buy a { font-weight: 700; text-decoration: underline; }
.tvsh-quote-hint { font-size: 12px; color: #6b6b6b; margin: 6px 0 0; }
.tvsh-cart-to-quote { width: 100%; margin-top: 10px; padding: 12px 20px; font-size: 16px; }

.tvsh-quote { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 30px; align-items: start; }
.tvsh-quote-table { width: 100%; border: 1px solid #dedede; border-collapse: collapse; font-size: 13px; }
.tvsh-quote-table th { text-align: left; padding: 10px; border-bottom: 1px solid #dedede; font-size: 13px; }
.tvsh-quote-table td { padding: 10px; border-bottom: 1px solid #eee; vertical-align: middle; }
.tvsh-quote-table tr.is-gone { background: #fdf0f0; }
.tvsh-quote-table tr.is-gone img { opacity: .5; filter: grayscale(1); }
.tvsh-q-img { width: 76px; }
.tvsh-q-img img { width: 64px; height: 64px; object-fit: contain; display: block; border: 1px solid #eee; }
.tvsh-q-name a { font-weight: 600; }
.tvsh-q-name small { display: block; color: #6b6b6b; font-size: 12px; }
.tvsh-q-qty input { width: 70px; text-align: center; }
.tvsh-q-total { font-weight: 700; color: var(--tvsh-red); white-space: nowrap; }
.tvsh-q-remove .remove { border: 0; background: none; color: var(--tvsh-red); font-size: 22px; cursor: pointer; line-height: 1; }
.tvsh-q-remove { white-space: nowrap; }
.tvsh-to-cart { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-right: 6px; border: 1px solid #dedede; border-radius: 999px; background: #fff; color: #333; cursor: pointer; vertical-align: middle; }
.tvsh-to-cart:hover { border-color: var(--tvsh-red); color: var(--tvsh-red); }
.tvsh-to-cart:disabled { opacity: .5; cursor: wait; }
.tvsh-quote__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 14px 4px; }
.tvsh-quote__foot a { font-weight: 700; font-size: 14px; }
/* The VAT split under the list, as on the quote itself (Keith, 4 Nov). */
.tvsh-totals { margin: 0 0 0 auto; min-width: 260px; }
.tvsh-totals div { display: flex; justify-content: space-between; gap: 24px; font-size: 14px; color: #6b6b6b; padding: 2px 0; }
.tvsh-totals dt, .tvsh-totals dd { margin: 0; }
.tvsh-totals .tvsh-totals__save { color: var(--tvsh-red-deep); font-weight: 700; }
.tvsh-totals .tvsh-totals__total { color: #222; font-weight: 700; font-size: 16px; align-items: baseline; border-top: 1px solid #dedede; margin-top: 4px; padding-top: 8px; }
.tvsh-totals__total dd { font-size: 24px; color: var(--tvsh-red); }
.tvsh-quote__form { background: #f5f5f5; border: 1px solid #eee; border-radius: 5px; padding: 22px; position: sticky; top: 100px; /* clear of a fixed theme header */ }
.tvsh-quote__form h2 { font-size: 20px; margin: 0 0 14px; }
.tvsh-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; background: #fff; border: 1px solid #ddd; border-radius: 30px; padding: 4px; margin-bottom: 14px; }
.tvsh-seg button { border: 0; background: none; border-radius: 30px; padding: 9px; font-family: inherit; font-weight: 700; font-size: 14px; cursor: pointer; }
.tvsh-seg button[aria-checked="true"] { background: #000; color: #fff; }
.tvsh-field { display: block; margin: 0 0 12px; font-size: 13px; font-weight: 600; }
.tvsh-field b { color: var(--tvsh-red); }
.tvsh-field input, .tvsh-field textarea { display: block; width: 100%; margin-top: 4px; }
.tvsh-field input[aria-invalid="true"] { border-color: var(--tvsh-red); }
.tvsh-field small { display: block; font-weight: 400; color: #6b6b6b; font-size: 12px; margin-top: 3px; }
.tvsh-err { display: block; font-style: normal; font-size: 12px; font-weight: 700; color: var(--tvsh-red); margin-top: 4px; }
.tvsh-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tvsh-two--wide { grid-template-columns: 1fr 9rem; }
.tvsh-check { display: flex; align-items: center; gap: 8px; font-size: 13px; margin: 4px 0 12px; }
.tvsh-check input { accent-color: var(--tvsh-red); width: 16px; height: 16px; }
.tvsh-quote__more { border-top: 1px solid #ddd; padding-top: 14px; margin-top: 4px; }
.tvsh-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.tvsh-alert { background: #fdecec; color: #a8181e; font-weight: 700; font-size: 13px; border-radius: 5px; padding: 10px 12px; }
.tvsh-alert a, .tvsh-link { color: inherit; text-decoration: underline; background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.tvsh-send { width: 100%; height: 52px; margin-top: 6px; font-size: 17px !important; }
.tvsh-send:disabled { opacity: .6; cursor: not-allowed; }
/* "Your quote … emailed": above the list, popping in when it's made (Keith, 4 Nov). Same green as the quote page. */
.tvsh-sent { background: #e3f3e6; color: #1d6b32; border-radius: 14px; padding: 12px 16px; margin: 0 0 20px; font-weight: 600; scroll-margin-top: 120px; }
.tvsh-sent.is-new { animation: tvsh-pop .35s cubic-bezier(.34, 1.56, .64, 1) both; }
@keyframes tvsh-pop { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .tvsh-sent.is-new { animation: none; } }
.tvsh-quote-empty { background: #f5f5f5; border-radius: 5px; padding: 36px; text-align: center; }
/* The list with the three buttons under it, the details beside them (on phones: list, details, buttons). */
.tvsh-quote { grid-template-areas: "list form" "go form"; grid-template-rows: auto 1fr; } /* the tall form's extra height goes under the buttons */
.tvsh-quote__list { grid-area: list; }
.tvsh-quote__form { grid-area: form; }
.tvsh-quote__go { grid-area: go; }
.tvsh-go { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tvsh-go .tvsh-send { margin-top: 0; padding: 0 12px; font-size: 16px !important; }
.tvsh-quote .tvsh-send--pay { order: 1; }
.tvsh-quote .tvsh-send--email { order: 2; background: #1f2328; }
.tvsh-quote .tvsh-send--email:hover { background: #000; }
.tvsh-quote .tvsh-send--pdf { order: 3; background: #fff; color: #1f2328; box-shadow: inset 0 0 0 1px #ccc; }
.tvsh-quote .tvsh-send--pdf:hover { background: #fff; box-shadow: inset 0 0 0 1px #1f2328; }
/* Phones: each line stacks, picture and name, then quantity, total and the basket / remove buttons. */
@media (max-width: 600px) {
	.tvsh-quote-table tbody tr { display: grid; grid-template-columns: 60px minmax(0, 1fr) auto auto; grid-template-areas: "img name name name" "img qty total remove"; column-gap: 10px; row-gap: 6px; align-items: center; padding: 12px 0; border-bottom: 1px solid #eee; }
	.tvsh-quote-table tbody td { display: block; padding: 0 !important; border: 0 !important; }
	.tvsh-quote-table .tvsh-q-img { grid-area: img; align-self: start; }
	.tvsh-quote-table .tvsh-q-name { grid-area: name; }
	.tvsh-quote-table .tvsh-q-qty { grid-area: qty; }
	.tvsh-quote-table .tvsh-q-total { grid-area: total; }
	.tvsh-quote-table .tvsh-q-remove { grid-area: remove; white-space: nowrap; }
}
@media (max-width: 900px) {
	.tvsh-quote { grid-template-columns: minmax(0, 1fr); grid-template-areas: "list" "form" "go"; grid-template-rows: none; }
	.tvsh-go { grid-template-columns: 1fr; }
	.tvsh-quote__form { position: static; }
	.tvsh-quote-table thead { display: none; }
	.tvsh-q-img { width: 60px; }
}
.tvsh-quote, .tvsh-quote *, .tvsh-quote *::before, .tvsh-quote *::after { box-sizing: border-box; }
.tvsh-two > * { min-width: 0; }
/* Theme-proof (6 Nov, live): themes style every button, table, link and label (Hello Elementor's reset: pink buttons,
   table borders and stripes; Elementor kits: black buttons, 17px text, lighter headings), and those rules beat the
   ones above. These restate the design with enough weight to win. */
.tvsh-quote-app, .tvsh-quote { font-size: 15px; line-height: 1.6; }
.tvsh-quote .tvsh-quote-table { margin: 0; }
.tvsh-quote .tvsh-quote-table th, .tvsh-quote .tvsh-quote-table td { border-top: 0; line-height: 1.6; }
.tvsh-quote .tvsh-quote-table.tvsh-quote-table thead tr th { border-top: 0; }
.tvsh-quote .tvsh-quote-table tbody > tr > td { background-color: transparent; }
.tvsh-quote .tvsh-quote-table a { color: #000; font-size: 13px; text-decoration: none; }
.tvsh-quote .tvsh-quote__foot a { color: #000; font-size: 14px; line-height: 1.6; text-decoration: none; }
.tvsh-quote .tvsh-to-cart, .tvsh-quote .tvsh-to-cart:focus { display: inline-flex; padding: 1px 6px; border: 1px solid #dedede; border-radius: 999px; background: #fff; color: #333; font-size: 13.333px; line-height: normal; }
.tvsh-quote .tvsh-to-cart:hover { background: #fff; border-color: var(--tvsh-red); color: var(--tvsh-red); }
.tvsh-quote .tvsh-q-remove .remove, .tvsh-quote .tvsh-q-remove .remove:hover, .tvsh-quote .tvsh-q-remove .remove:focus { padding: 1px 6px; border: 0; border-radius: 0; background: none; color: var(--tvsh-red); font-size: 22px; line-height: 1; }
.tvsh-quote .tvsh-quote__form h2 { font-weight: 700; line-height: 1.25; }
.tvsh-seg.tvsh-seg button, .tvsh-seg.tvsh-seg button:hover, .tvsh-seg.tvsh-seg button:focus { background: transparent; color: #000; border: 0; box-shadow: none; border-radius: 30px; line-height: normal; }
.tvsh-seg.tvsh-seg button:hover { background: #f2f2f2; }
.tvsh-seg.tvsh-seg button[aria-checked="true"], .tvsh-seg.tvsh-seg button[aria-checked="true"]:hover, .tvsh-seg.tvsh-seg button[aria-checked="true"]:focus { background: #000; color: #fff; }
.tvsh-seg.tvsh-seg button:focus-visible { outline: 2px solid var(--tvsh-red); outline-offset: 2px; }
.tvsh-quote .tvsh-field, .tvsh-quote .tvsh-check { line-height: 1.6; }
.tvsh-quote .tvsh-check { font-weight: 600; }
.tvsh-quote .tvsh-check input { margin: 3px 3px 3px 4px; }
.tvsh-quote .tvsh-quote__more strong { font-weight: 900; }
.tvsh-quote input[type=text], .tvsh-quote input[type=email], .tvsh-quote input[type=tel], .tvsh-quote input[type=number], .tvsh-quote textarea { line-height: 1.6; }
.tvsh-quote .tvsh-send--pay:focus { background: var(--tvsh-red); color: #fff; }
.tvsh-quote .tvsh-send--email:focus { background: #1f2328; color: #fff; }
.tvsh-quote .tvsh-send--pdf:focus, .tvsh-quote .tvsh-send--pdf:hover { background: #fff; color: #1f2328; }
