/* Plus Printing – Product Builder */
.ppb, .ppb-preview { --ppb-navy: #13293D; --ppb-blue: #0A6CAB; --ppb-blue-dk: #07507F; --ppb-tint: #E8F2F9; --ppb-grey: #F5F7FA; --ppb-line: #E3E8EE; --ppb-text: #4A5565; }
.ppb {
	display: flex; flex-direction: column; gap: 22px; margin: 0; font-family: inherit; color: var(--ppb-text); }
.ppb fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.ppb legend { display: flex; align-items: center; gap: 10px; padding: 0; margin: 0 0 12px; font-size: 16px; font-weight: 700; color: var(--ppb-navy); }
.ppb legend em, .ppb-notes-label em { font-style: normal; font-weight: 500; color: var(--ppb-text); font-size: 14px; }
.ppb-num { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ppb-navy); color: #fff; font-size: 13px; font-weight: 700; flex: none; }
.ppb-chosen { font-weight: 500; color: var(--ppb-text); font-size: 15px; }
.ppb-chosen:not(:empty)::before { content: "· "; }
.ppb-hint, .ppb-small { margin: -4px 0 12px; font-size: 14px; }
.ppb-small { margin: 8px 0 0; font-size: 13px; }

/* colour swatches */
.ppb-swatches { display: flex; flex-wrap: wrap; gap: 10px; }
.ppb-swatch { position: relative; cursor: pointer; margin: 0; }
.ppb-swatch input, .ppb-seg input { position: absolute; opacity: 0; pointer-events: none; }
.ppb-dot { display: block; width: 38px; height: 38px; border-radius: 50%; background: var(--c); box-shadow: inset 0 0 0 1px rgba(19, 41, 61, .18); outline: 2px solid transparent; outline-offset: 3px; transition: outline-color .15s; }
.ppb-swatches--img img { display: block; width: 64px; height: 64px; object-fit: contain; background: #fff; border-radius: 10px; border: 1px solid var(--ppb-line); padding: 4px; outline: 2px solid transparent; outline-offset: 2px; transition: outline-color .15s; }
.ppb-swatch:hover .ppb-dot, .ppb-swatch:hover img { outline-color: var(--ppb-line); }
.ppb-swatch input:checked + .ppb-dot, .ppb-swatch input:checked + img { outline-color: var(--ppb-blue); }
.ppb-swatch input:focus-visible + .ppb-dot, .ppb-swatch input:focus-visible + img { outline-color: var(--ppb-navy); }

/* segmented choice (adult / youth, print position) */
.ppb-seg { display: inline-flex; background: var(--ppb-grey); border: 1px solid var(--ppb-line); border-radius: 10px; padding: 4px; gap: 4px; }
.ppb-seg label { position: relative; margin: 0; cursor: pointer; }
.ppb-seg span { display: block; padding: 10px 22px; border-radius: 7px; font-weight: 600; font-size: 15px; color: var(--ppb-navy); transition: background .15s, color .15s; }
.ppb-seg input:checked + span { background: #fff; color: var(--ppb-blue); box-shadow: 0 1px 3px rgba(19, 41, 61, .14); }
.ppb-seg input:focus-visible + span { outline: 2px solid var(--ppb-navy); }
.ppb-seg--sm span { padding: 7px 14px; font-size: 14px; }

/* sizes */
.ppb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 10px; }
.ppb-cell { display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 0; padding: 10px 8px; border: 1px solid var(--ppb-line); border-radius: 10px; background: #fff; }
.ppb-cell:focus-within { border-color: var(--ppb-blue); box-shadow: 0 0 0 3px var(--ppb-tint); }
.ppb-size { font-weight: 700; color: var(--ppb-navy); font-size: 14px; text-align: center; line-height: 1.2; }
.ppb .ppb-cell input { width: 100%; max-width: 70px; height: 38px; padding: 4px 6px; text-align: center; font-size: 16px; font-weight: 600; color: var(--ppb-navy); border: 1px solid var(--ppb-line); border-radius: 7px; background: var(--ppb-grey); -moz-appearance: textfield; }
.ppb .ppb-cell input::-webkit-outer-spin-button, .ppb .ppb-cell input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ppb-each { font-size: 12px; }

/* artwork */
.ppb-preview { background: #fff; border: 1px solid var(--ppb-line); border-radius: 14px; padding: 16px; margin-bottom: 12px; }
.ppb-preview canvas { display: block; width: 100%; max-width: 420px; height: auto; margin: 0 auto; touch-action: none; }
.ppb-preview canvas.is-dragging { cursor: grabbing !important; }
.ppb-drag-hint { margin: 8px 0 0; text-align: center; font-size: 13px; }
.ppb-drag-hint[hidden] { display: none; }
.ppb-place { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.ppb-place[hidden] { display: none; }
.ppb-scale { display: flex; align-items: center; gap: 10px; margin: 0; font-weight: 600; font-size: 14px; color: var(--ppb-navy); }
.ppb-scale input { accent-color: var(--ppb-blue); width: 140px; }
.ppb-drop { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; margin: 0; padding: 20px 16px; border: 2px dashed #C3CEDA; border-radius: 12px; text-align: center; cursor: pointer; font-size: 14px; background: #fff; transition: border-color .15s, background .15s; }
.ppb-drop:hover, .ppb-drop:focus-within { border-color: var(--ppb-blue); background: var(--ppb-tint); }
.ppb-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.ppb-drop strong { display: block; color: var(--ppb-blue); font-size: 15px; }
.ppb-file-name { font-weight: 600; color: var(--ppb-navy); word-break: break-all; }
.ppb-remove { margin-top: 8px; padding: 0; border: 0; background: none; color: var(--ppb-blue); font-weight: 600; font-size: 14px; text-decoration: underline; cursor: pointer; }
.ppb-remove[hidden] { display: none; }
.ppb-notes-label { display: block; margin: 16px 0 6px; font-weight: 700; font-size: 15px; color: var(--ppb-navy); }
.ppb textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--ppb-line); border-radius: 8px; font: inherit; font-size: 15px; color: var(--ppb-navy); }
.ppb textarea:focus { border-color: var(--ppb-blue); outline: none; box-shadow: 0 0 0 3px var(--ppb-tint); }

/* summary */
.ppb-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-radius: 12px; background: var(--ppb-grey); border: 1px solid var(--ppb-line); }
.ppb-total { display: flex; flex-direction: column; gap: 2px; }
.ppb-count { font-size: 14px; }
.ppb-sum { font-size: 22px; font-weight: 800; color: var(--ppb-navy); min-height: 1.2em; }
.woocommerce .ppb button.ppb-submit, .ppb button.ppb-submit.button.alt { flex: none; padding: 15px 28px; border: 0; border-radius: 8px; background: var(--ppb-blue); color: #fff; font-weight: 700; font-size: 15px; cursor: pointer; transition: background .15s; }
.woocommerce .ppb button.ppb-submit:hover, .ppb button.ppb-submit.button.alt:hover { background: var(--ppb-blue-dk) !important; color: #fff !important; }
.woocommerce .ppb button.ppb-submit:disabled, .woocommerce .ppb button.ppb-submit.disabled, .ppb button.ppb-submit.button.alt:disabled { background: #9FB3C4 !important; color: #fff !important; opacity: 1 !important; cursor: not-allowed; }
.ppb-error { margin: 0; padding: 10px 14px; border-radius: 8px; background: #FDECEC; color: #9B1C1C; font-size: 14px; }
.ppb-error[hidden] { display: none; }

@media (max-width: 600px) {
	.ppb-grid { grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 8px; }
	.ppb-swatches--img img { width: 56px; height: 56px; }
	.ppb-summary { flex-direction: column; align-items: stretch; }
	.ppb .ppb-submit { width: 100%; }
	.ppb-seg { display: flex; } .ppb-seg label { flex: 1; } .ppb-seg span { text-align: center; padding: 10px 12px; }
}

/* front / back */
.ppb-preview { position: relative; }
.ppb-side-tabs { position: absolute; top: 14px; left: 50%; transform: translateX(-50%); z-index: 2; background: #fff; }
.ppb-side-tabs .ppb-tick { font-style: normal; color: #1F8A4C; }
.ppb-preview canvas { padding-top: 44px; box-sizing: content-box; }
.ppb-preview--gallery { margin: 0 0 24px; padding: 24px; border-radius: 18px; }
.ppb-preview--gallery canvas { max-width: 520px; }
.ppb-side { display: flex; flex-direction: column; gap: 10px; padding: 16px; margin-bottom: 12px; border: 1px solid var(--ppb-line); border-radius: 12px; background: #fff; }
.ppb-side.has-file { border-color: #B8D6EC; background: #FBFDFF; }
.ppb-side-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.ppb-side-head strong { color: var(--ppb-navy); font-size: 15px; }
.ppb-side-tools { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ppb-side-tools[hidden] { display: none; }
.ppb-side .ppb-remove { margin: 0; }
.ppb-side .ppb-drop { padding: 16px; }
@media (max-width: 600px) { .ppb-preview--gallery { padding: 12px; } }

/* theme button styles must not leak into the small text buttons */
.ppb button.ppb-remove, .ppb button.ppb-remove:hover, .ppb button.ppb-remove:focus { padding: 0; border: 0; background: none; box-shadow: none; color: var(--ppb-blue); font-size: 14px; font-weight: 600; text-decoration: underline; }
.ppb button.ppb-remove:hover { color: var(--ppb-blue-dk); }

/* names and numbers */
.ppb-check { display: flex; align-items: center; gap: 10px; margin: 0; font-weight: 600; color: var(--ppb-navy); cursor: pointer; }
.ppb-check input { width: 20px; height: 20px; accent-color: var(--ppb-blue); }
.ppb-nn-body { margin-top: 14px; }
.ppb-nn-body[hidden] { display: none; }
.ppb-nn-rows { display: flex; flex-direction: column; gap: 8px; max-height: 420px; overflow-y: auto; padding-right: 4px; }
.ppb-nn-row { display: grid; grid-template-columns: minmax(70px, 1fr) 2fr 80px; gap: 8px; align-items: center; }
.ppb-nn-size { font-weight: 700; font-size: 14px; color: var(--ppb-navy); }
.ppb .ppb-nn-row input { height: 42px; padding: 6px 10px; border: 1px solid var(--ppb-line); border-radius: 8px; font-size: 15px; font-weight: 600; color: var(--ppb-navy); background: #fff; text-transform: uppercase; min-width: 0; }
.ppb .ppb-nn-row input:focus { border-color: var(--ppb-blue); outline: none; box-shadow: 0 0 0 3px var(--ppb-tint); }
.ppb .ppb-nn-num { text-align: center; }

/* the add-to-basket button: always brand blue, never WooCommerce's purple */
.woocommerce .ppb button.ppb-submit, .ppb button.ppb-submit.button.alt { background: var(--ppb-blue) !important; color: #fff !important; border: 0 !important; border-radius: 8px !important; padding: 15px 28px !important; font-weight: 700 !important; font-size: 15px !important; line-height: 1.2 !important; }

/* kits: the colourway photo is the preview */
.ppb-preview--photo { background: #fff !important; border: 1px solid var(--ppb-line); }
.ppb-preview--photo canvas { max-width: 560px; }

/* lettering */
.ppb-nn-style { display: flex; flex-direction: column; gap: 14px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--ppb-line); }
.ppb-nn-style-row { display: flex; flex-direction: column; gap: 8px; }
.ppb-nn-style-row > strong { color: var(--ppb-navy); font-size: 15px; }
.ppb-fonts { display: flex; flex-wrap: wrap; gap: 8px; }
.ppb-font { position: relative; margin: 0; cursor: pointer; }
.ppb-font input { position: absolute; opacity: 0; pointer-events: none; }
.ppb-font span { display: block; padding: 8px 14px; border: 1px solid var(--ppb-line); border-radius: 8px; background: #fff; font-size: 20px; line-height: 1.1; color: var(--ppb-navy); transition: border-color .15s, box-shadow .15s; }
.ppb-font input:checked + span { border-color: var(--ppb-blue); box-shadow: 0 0 0 2px var(--ppb-blue); }
.ppb-font input:focus-visible + span { outline: 2px solid var(--ppb-navy); outline-offset: 2px; }
.ppb-swatches--sm .ppb-dot { width: 30px; height: 30px; }
.woocommerce .ppb button.ppb-submit:hover, .ppb button.ppb-submit.button.alt:hover { background: var(--ppb-blue-dk) !important; }
.woocommerce .ppb button.ppb-submit:disabled, .ppb button.ppb-submit.button.alt:disabled { background: #9FB3C4 !important; opacity: 1 !important; cursor: not-allowed; }

/* ================= product journey ================= */
.ppb--journey { gap: 26px; }
.ppb-fixed { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 12px 16px; list-style: none; border-radius: 10px; background: var(--ppb-grey); font-size: 14px; color: var(--ppb-navy); font-weight: 600; }
.ppb-fixed span { color: var(--ppb-text); font-weight: 500; margin-right: 4px; }
.ppb-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.ppb-cards--many { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); }
.ppb-card { position: relative; margin: 0; cursor: pointer; }
.ppb-card input, .ppb-art-card input { position: absolute; opacity: 0; pointer-events: none; }
.ppb-card-body { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 14px 14px 12px; border: 1px solid var(--ppb-line); border-radius: 10px; background: #fff; transition: border-color .15s, box-shadow .15s, background .15s; }
.ppb-cards--img .ppb-card-body { align-items: center; text-align: center; }
.ppb-card-img { display: block; width: 64px; height: 64px; margin: 2px auto 6px; }
.ppb-card-title { font-weight: 700; font-size: 15px; line-height: 1.25; color: var(--ppb-navy); }
.ppb-card-price { font-size: 14px; font-weight: 600; color: var(--ppb-blue); }
.ppb-card:hover .ppb-card-body { border-color: #B8D6EC; }
.ppb-card input:checked + .ppb-card-body { border-color: var(--ppb-blue); box-shadow: 0 0 0 2px var(--ppb-blue); background: #F7FBFE; }
.ppb-card input:checked + .ppb-card-body::after { content: "✓"; position: absolute; top: 8px; right: 10px; width: 20px; height: 20px; border-radius: 50%; background: var(--ppb-blue); color: #fff; font-size: 12px; font-weight: 700; display: grid; place-items: center; }
.ppb-card input:focus-visible + .ppb-card-body { outline: 2px solid var(--ppb-navy); outline-offset: 2px; }
.ppb-card.is-off { cursor: not-allowed; }
.ppb-card.is-off .ppb-card-body { opacity: .45; background: var(--ppb-grey); }
.ppb-card.is-off .ppb-card-price { color: var(--ppb-text); font-weight: 500; }

.ppb-stepper { display: inline-flex; align-items: stretch; border: 1px solid var(--ppb-line); border-radius: 10px; overflow: hidden; background: #fff; }
.ppb .ppb-stepper input { width: 70px; height: 46px; border: 0; border-left: 1px solid var(--ppb-line); border-right: 1px solid var(--ppb-line); border-radius: 0; text-align: center; font-size: 17px; font-weight: 700; color: var(--ppb-navy); -moz-appearance: textfield; }
.ppb .ppb-stepper input::-webkit-outer-spin-button, .ppb .ppb-stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ppb button.ppb-step-btn, .ppb button.ppb-step-btn:hover, .ppb button.ppb-step-btn:focus { width: 46px; padding: 0; border: 0; border-radius: 0; background: #fff; color: var(--ppb-navy); font-size: 22px; font-weight: 600; line-height: 1; }
.ppb button.ppb-step-btn:hover { background: var(--ppb-grey); }

.ppb-art-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin-bottom: 14px; }
.ppb-art-card { position: relative; margin: 0; cursor: pointer; }
.ppb-art-body { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; height: 100%; padding: 14px; border: 1px solid var(--ppb-line); border-radius: 10px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.ppb-art-body svg { width: 26px; height: 26px; fill: var(--ppb-blue); margin-bottom: 4px; }
.ppb-art-body strong { color: var(--ppb-navy); font-size: 15px; line-height: 1.2; }
.ppb-art-body small { font-size: 13px; line-height: 1.35; color: var(--ppb-text); }
.ppb-art-card:hover .ppb-art-body { border-color: #B8D6EC; }
.ppb-art-card input:checked + .ppb-art-body { border-color: var(--ppb-blue); box-shadow: 0 0 0 2px var(--ppb-blue); background: #F7FBFE; }
.ppb-art-card input:focus-visible + .ppb-art-body { outline: 2px solid var(--ppb-navy); outline-offset: 2px; }
.ppb-art-panel[hidden] { display: none; }
.ppb-art-panel .ppb-side { margin-bottom: 8px; }
.ppb-note { margin: 0; padding: 14px 16px; border-radius: 10px; background: var(--ppb-tint); color: var(--ppb-navy); font-size: 15px; }
.ppb button.ppb-btn-designer, .ppb button.ppb-btn-designer:focus { width: 100%; padding: 16px; border: 2px dashed var(--ppb-blue); border-radius: 12px; background: #F7FBFE; color: var(--ppb-blue); font-weight: 700; font-size: 16px; cursor: pointer; }
.ppb button.ppb-btn-designer:hover { background: var(--ppb-tint); }
.ppb button.ppb-btn-designer[hidden] { display: none; }
.ppb-design-done { display: flex; align-items: center; gap: 14px; padding: 12px; border: 1px solid #B8D6EC; border-radius: 12px; background: #FBFDFF; margin-bottom: 8px; }
.ppb-design-done[hidden] { display: none; }
.ppb-design-done img { width: 72px; height: 96px; object-fit: contain; background: #fff; border: 1px solid var(--ppb-line); border-radius: 6px; flex: none; }
.ppb-design-done div { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.ppb-design-done strong { color: var(--ppb-navy); }
.ppb-design-done small { font-size: 13px; }
.ppb-design-done.is-stale { border-color: #F2B8B5; background: #FFF7F6; }
.ppb-design-done.is-stale small { color: #9B1C1C; }
.ppb button.ppb-link, .ppb button.ppb-link:hover, .ppb button.ppb-link:focus { padding: 0; border: 0; background: none; color: var(--ppb-blue); font-weight: 700; font-size: 14px; text-decoration: underline; cursor: pointer; }
.ppb-was { font-size: 13px; text-decoration: line-through; }
@media (max-width: 600px) {
	.ppb-art-cards { grid-template-columns: 1fr; }
	.ppb-art-body { flex-direction: row; align-items: center; flex-wrap: wrap; column-gap: 10px; }
	.ppb-art-body svg { margin: 0; }
	.ppb-art-body small { width: 100%; padding-left: 36px; margin-top: -4px; }
	.ppb-cards { grid-template-columns: repeat(2, 1fr); }
}

/* ================= online designer ================= */
html.ppbd-open, html.ppbd-open body { overflow: hidden !important; }
.ppbd { --n: #13293D; --b: #0A6CAB; --l: #E3E8EE; --g: #F5F7FA; position: fixed; inset: 0; z-index: 999999; display: flex; flex-direction: column; background: #EEF2F6; font-family: 'Plus Jakarta Sans', system-ui, sans-serif; color: var(--n); }
.ppbd *, .ppbd *::before, .ppbd *::after { box-sizing: border-box; }
.ppbd-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px; background: #fff; border-bottom: 1px solid var(--l); }
.ppbd-title { display: flex; flex-direction: column; min-width: 0; }
.ppbd-title strong { font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ppbd-title span { font-size: 13px; color: #4A5565; }
.ppbd-head-actions { display: flex; gap: 10px; flex: none; }
.ppbd button { font-family: inherit; cursor: pointer; }
.ppbd .ppbd-btn { padding: 11px 20px; border-radius: 8px; font-weight: 700; font-size: 15px; border: 2px solid transparent; line-height: 1.2; }
.ppbd .ppbd-btn--primary { background: var(--b); color: #fff; }
.ppbd .ppbd-btn--primary:hover { background: #07507F; }
.ppbd .ppbd-btn--ghost { background: #fff; color: var(--n); border-color: var(--l); }
.ppbd .ppbd-btn--ghost:hover { border-color: var(--n); }
.ppbd-body { flex: 1; display: flex; min-height: 0; }
.ppbd-rail { flex: none; width: 96px; display: flex; flex-direction: column; gap: 6px; padding: 12px 8px; background: #fff; border-right: 1px solid var(--l); overflow-y: auto; }
.ppbd .ppbd-tool { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 4px; border: 0; border-radius: 10px; background: transparent; color: var(--n); font-size: 12px; font-weight: 600; text-align: center; cursor: pointer; }
.ppbd .ppbd-tool:hover { background: var(--g); color: var(--b); }
.ppbd-ico svg { width: 26px; height: 26px; fill: currentColor; display: block; }
.ppbd-tool--colour input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.ppbd-hide { display: none !important; }
.ppbd-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ppbd-props { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; min-height: 58px; padding: 10px 16px; background: #fff; border-bottom: 1px solid var(--l); }
.ppbd-props.is-empty > * { display: none !important; }
.ppbd-group { display: flex; align-items: center; gap: 6px; }
.ppbd-group[hidden] { display: none; }
.ppbd select.ppbd-font { height: 38px; padding: 0 10px; border: 1px solid var(--l); border-radius: 8px; font-size: 14px; min-width: 170px; background: #fff; color: var(--n); }
.ppbd input.ppbd-size { width: 72px; height: 38px; padding: 0 8px; border: 1px solid var(--l); border-radius: 8px; font-size: 14px; }
.ppbd .ppbd-mini { min-width: 38px; height: 38px; padding: 0 10px; border: 1px solid var(--l); border-radius: 8px; background: #fff; color: var(--n); font-size: 16px; }
.ppbd .ppbd-mini:hover { border-color: var(--b); color: var(--b); }
.ppbd .ppbd-mini.is-on { background: var(--n); color: #fff; border-color: var(--n); }
.ppbd .ppbd-danger:hover { border-color: #C8102E; color: #C8102E; }
.ppbd-colours { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ppbd .ppbd-sw { width: 26px; height: 26px; padding: 0; border-radius: 50%; border: 1px solid rgba(19,41,61,.25); }
.ppbd .ppbd-sw:hover { transform: scale(1.12); }
.ppbd .ppbd-custom { width: 30px; height: 30px; padding: 0; border: 0; background: none; cursor: pointer; }
.ppbd-warn { flex-basis: 100%; padding: 8px 12px; border-radius: 8px; background: #FFF4E5; color: #8A4B00; font-size: 13px; font-weight: 600; }
.ppbd-warn[hidden] { display: none; }
.ppbd-hint { padding: 10px 16px 0; text-align: center; font-size: 13px; color: #4A5565; }
.ppbd-hint[hidden] { display: none; }
.ppbd-stage { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 0; padding: 16px; overflow: hidden; }
.ppbd-canvas { box-shadow: 0 10px 30px -12px rgba(19,41,61,.35); background: #fff; background-image: linear-gradient(45deg, #f1f3f6 25%, transparent 25%), linear-gradient(-45deg, #f1f3f6 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f1f3f6 75%), linear-gradient(-45deg, transparent 75%, #f1f3f6 75%); background-size: 16px 16px; background-position: 0 0, 0 8px, 8px -8px, -8px 0; }
.ppbd-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; padding: 10px 16px 14px; font-size: 12px; color: #4A5565; }
.ppbd-key { display: inline-flex; align-items: center; gap: 8px; }
.ppbd-key::before { content: ""; width: 22px; height: 12px; border-radius: 2px; }
.ppbd-key--bleed::before { background: rgba(210,16,46,.18); }
.ppbd-key--trim::before { height: 0; border-top: 2px solid rgba(210,16,46,.9); }
.ppbd-key--safe::before { height: 0; border-top: 2px dashed rgba(10,108,171,.9); }
.ppbd-busy { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(255,255,255,.8); font-weight: 700; font-size: 17px; }
.ppbd-busy[hidden] { display: none; }
@media (max-width: 760px) {
	.ppbd-head { padding: 10px 12px; }
	.ppbd .ppbd-btn { padding: 9px 14px; font-size: 14px; }
	.ppbd-body { flex-direction: column-reverse; }
	.ppbd-rail { width: auto; flex-direction: row; justify-content: space-around; padding: 6px; border-right: 0; border-top: 1px solid var(--l); overflow-x: auto; }
	.ppbd .ppbd-tool { padding: 8px 6px; min-width: 64px; }
	.ppbd-props { gap: 8px; padding: 8px 10px; }
	.ppbd select.ppbd-font { min-width: 130px; }
	.ppbd-legend { font-size: 11px; gap: 4px 12px; padding: 6px 8px 8px; }
}

/* garments: design online button per side */
.ppb button.ppb-side-design, .ppb button.ppb-side-design:focus { width: 100%; padding: 14px; border: 2px dashed var(--ppb-blue); border-radius: 12px; background: #F7FBFE; color: var(--ppb-blue); font-weight: 700; font-size: 15px; cursor: pointer; }
.ppb button.ppb-side-design:hover { background: var(--ppb-tint); }
.ppb button.ppb-side-design[hidden], .ppb .ppb-drop[hidden], .ppb-side[hidden], .ppb-scale[hidden] { display: none !important; }
.ppb-later-note[hidden] { display: none; }
.ppb-design .ppb-art-cards { margin-bottom: 4px; }

.ppb-art-price { color: var(--ppb-blue); font-weight: 700; white-space: nowrap; }
.ppb-design-note[hidden], .ppb-design-files[hidden] { display: none; }
.ppb-design-files { margin: 10px 0 4px; }

/* proof check */
.ppb-proof { display: flex; gap: 12px; align-items: flex-start; margin: 14px 0 0; padding: 14px 16px; border: 1px solid var(--ppb-line); border-radius: 10px; background: #fff; cursor: pointer; }
.ppb-proof[hidden] { display: none; }
.ppb-proof:has(input:checked) { border-color: var(--ppb-blue); background: #F7FBFE; }
.ppb-proof input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--ppb-blue); flex: none; }
.ppb-proof span { display: flex; flex-direction: column; gap: 3px; }
.ppb-proof strong { color: var(--ppb-navy); font-size: 15px; }
.ppb-proof small { font-size: 13px; line-height: 1.4; }

/* estimated delivery card */
.ppb-delivery { padding: 18px 20px; border: 1px solid var(--ppb-line, #E3E8EE); border-radius: 14px; background: #fff; font-size: 14px; color: #4A5565; }
.ppb-dl-head { display: flex; align-items: center; gap: 14px; }
.ppb-dl-head svg { width: 38px; height: 38px; padding: 8px; border-radius: 50%; background: #E8F2F9; fill: #0A6CAB; flex: none; }
.ppb-dl-label { display: block; font-size: 13px; }
.ppb-dl-date { display: block; font-size: 20px; line-height: 1.2; color: #13293D; font-weight: 800; }
.ppb-dl-cutoff { margin: 10px 0 0; padding: 8px 12px; border-radius: 8px; background: #E4F3EA; color: #1F5F3A; font-size: 13px; }
.ppb-dl-cutoff[hidden] { display: none; }
.ppb-dl-steps { display: flex; margin: 16px 0 12px; padding: 0; list-style: none; }
.ppb-dl-steps li { position: relative; flex: 1; min-width: 0; padding-top: 18px; text-align: center; }
.ppb-dl-steps li::before { content: ""; position: absolute; top: 5px; left: 50%; width: 100%; height: 2px; background: #D3DCE6; }
.ppb-dl-steps li:last-child::before { display: none; }
.ppb-dl-dot { position: absolute; top: 0; left: 50%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: #0A6CAB; box-shadow: 0 0 0 3px #E8F2F9; z-index: 1; }
.ppb-dl-steps li:last-child .ppb-dl-dot { background: #1F8A4C; box-shadow: 0 0 0 3px #E4F3EA; }
.ppb-dl-steps b { display: block; font-size: 12px; line-height: 1.25; color: #13293D; padding: 0 2px; }
.ppb-dl-steps small { display: block; font-size: 11px; color: #4A5565; }
.ppb-dl-foot { margin: 0; font-size: 13px; }
.ppb-dl-foot a { color: #0A6CAB; font-weight: 600; }

.ppb-art-cards:has(> :nth-child(4)) { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 600px) { .ppb-art-cards:has(> :nth-child(4)) { grid-template-columns: 1fr; } }

/* ================= my account ================= */
.ppb-acc { display: flex; flex-direction: column; gap: 32px; font-size: 15px; color: #4A5565; }
.ppb-acc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ppb-acc-head h2 { margin: 0; font-size: 22px; color: #13293D; }
.ppb-acc-head a { font-weight: 700; color: #0A6CAB; font-size: 14px; }
.ppb-acc-count { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; border-radius: 14px; background: #0A6CAB; color: #fff; font-weight: 700; font-size: 14px; margin-right: auto; }
.ppb-acc-empty { padding: 24px; border: 1px dashed #C3CEDA; border-radius: 14px; background: #fff; text-align: center; }
.ppb-acc-empty p { margin: 0 0 12px; }
.ppb-acc-order { padding: 20px 22px; margin-bottom: 14px; border: 1px solid #E3E8EE; border-radius: 16px; background: #fff; box-shadow: 0 10px 28px -22px rgba(19,41,61,.45); }
.ppb-acc-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.ppb-acc-thumbs { display: flex; flex: none; }
.ppb-acc-thumbs img { width: 56px; height: 56px; object-fit: contain; background: #fff; border: 1px solid #E3E8EE; border-radius: 10px; padding: 3px; margin-right: -12px; box-shadow: 0 0 0 3px #fff; }
.ppb-acc-thumbs--sm img { width: 42px; height: 42px; margin-right: -10px; border-radius: 8px; }
.ppb-more { display: inline-grid; place-items: center; width: 42px; height: 42px; margin-left: 14px; border-radius: 50%; background: #E8F2F9; color: #0A6CAB; font-weight: 700; font-size: 13px; }
.ppb-acc-meta { display: flex; flex-direction: column; gap: 2px; flex: 1 1 220px; min-width: 0; padding-left: 16px; }
.ppb-acc-meta strong { color: #13293D; font-size: 17px; }
.ppb-acc-meta small { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ppb-acc-actions { display: flex; gap: 8px; flex-wrap: wrap; }
a.ppb-acc-btn { display: inline-block; padding: 10px 16px; border-radius: 8px; background: #0A6CAB; color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none; line-height: 1.2; }
a.ppb-acc-btn:hover { background: #07507F; }
a.ppb-acc-btn--ghost { background: #fff; color: #13293D !important; box-shadow: inset 0 0 0 1px #D3DCE6; }
a.ppb-acc-btn--ghost:hover { background: #F5F7FA; }
.ppb-acc-steps { display: flex; margin: 20px 0 0; padding: 0; list-style: none; }
.ppb-acc-steps li { position: relative; flex: 1; min-width: 0; padding-top: 26px; text-align: center; }
.ppb-acc-steps li::before { content: ""; position: absolute; top: 9px; left: 50%; width: 100%; height: 3px; background: #E3E8EE; }
.ppb-acc-steps li:last-child::before { display: none; }
.ppb-acc-steps li.done::before { background: #0A6CAB; }
.ppb-acc-steps li > span { position: absolute; top: 0; left: 50%; width: 20px; height: 20px; margin-left: -10px; border-radius: 50%; background: #fff; border: 3px solid #D3DCE6; z-index: 1; box-sizing: border-box; }
.ppb-acc-steps li.done > span { background: #0A6CAB; border-color: #0A6CAB; }
.ppb-acc-steps li.done > span::after { content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 10px; font-weight: 700; line-height: 1; }
.ppb-acc-steps li.now > span { border-color: #0A6CAB; box-shadow: 0 0 0 5px #E8F2F9; }
.ppb-acc-steps b { display: block; font-size: 13px; line-height: 1.25; color: #8A96A3; padding: 0 2px; }
.ppb-acc-steps li.done b, .ppb-acc-steps li.now b { color: #13293D; }
.ppb-acc-steps small { display: block; font-size: 12px; }
.ppb-acc-history { border: 1px solid #E3E8EE; border-radius: 16px; background: #fff; overflow: hidden; }
a.ppb-acc-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto 150px; align-items: center; gap: 16px; padding: 14px 20px; color: inherit; text-decoration: none; border-top: 1px solid #EEF1F5; }
a.ppb-acc-row:first-child { border-top: 0; }
a.ppb-acc-row:hover { background: #F7FBFE; }
.ppb-acc-row-main { display: flex; flex-direction: column; min-width: 0; padding-left: 10px; }
.ppb-acc-row-main strong { color: #13293D; }
.ppb-acc-row-main small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.ppb-acc-row-date { font-size: 14px; white-space: nowrap; }
.ppb-acc-row-total { font-weight: 700; color: #13293D; white-space: nowrap; }
/* stage badge (history + Orders tab) */
.ppb-mini { display: inline-flex; flex-direction: column; gap: 5px; min-width: 120px; }
.ppb-mini-label { font-size: 13px; font-weight: 700; color: #0A6CAB; }
.ppb-mini.is-done .ppb-mini-label { color: #1F7A43; }
.ppb-mini.is-off .ppb-mini-label { color: #8A96A3; }
.ppb-mini-bar { display: flex; gap: 3px; }
.ppb-mini-bar i { flex: 1; height: 5px; border-radius: 3px; background: #E3E8EE; }
.ppb-mini-bar i.on { background: #0A6CAB; }
.ppb-mini.is-done .ppb-mini-bar i.on { background: #1F8A4C; }
@media (max-width: 767px) {
	.ppb-acc-order { padding: 16px; }
	.ppb-acc-meta { padding-left: 12px; flex-basis: 160px; }
	.ppb-acc-actions { width: 100%; }
	.ppb-acc-actions a { flex: 1; text-align: center; }
	.ppb-acc-steps b { font-size: 11px; }
	.ppb-acc-steps small { font-size: 10px; }
	a.ppb-acc-row { grid-template-columns: auto minmax(0, 1fr) auto; row-gap: 6px; padding: 14px 16px; }
	.ppb-acc-row-date { display: none; }
	.ppb-acc-row-status { grid-column: 2 / 4; padding-left: 10px; }
}

/* logged out: login + register side by side as cards */
.woocommerce #customer_login.u-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.woocommerce #customer_login .u-column1, .woocommerce #customer_login .u-column2 { float: none; width: auto; padding: 32px; border: 1px solid #E3E8EE; border-radius: 16px; background: #fff; }
.woocommerce #customer_login .u-column2 { background: #F7FBFE; border-color: #B8D6EC; }
.woocommerce #customer_login h2 { margin: 0 0 18px; font-size: 26px; color: #13293D; }
.woocommerce #customer_login form.login, .woocommerce #customer_login form.register { margin: 0; padding: 0; border: 0; }
.woocommerce #customer_login::before, .woocommerce #customer_login::after { display: none; }
.ppb-reg-benefits { margin: 0 0 18px; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; color: #13293D; font-weight: 600; font-size: 15px; }
.ppb-reg-benefits li { position: relative; padding-left: 28px; }
.ppb-reg-benefits li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: #0A6CAB; color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
@media (max-width: 767px) { .woocommerce #customer_login.u-columns { grid-template-columns: 1fr; } .woocommerce #customer_login .u-column1, .woocommerce #customer_login .u-column2 { padding: 22px; } }
/* the Woo widget passes Roboto down: keep the whole account area on the site font */
.elementor-widget-woocommerce-my-account .woocommerce, .elementor-widget-woocommerce-my-account .woocommerce :is(p, span, small, strong, b, a, li, td, th, label, input, button, mark, address, em, div, h1, h2, h3, h4, legend) { font-family: 'Plus Jakarta Sans', system-ui, sans-serif !important; }
.woocommerce #customer_login form.register, .woocommerce #customer_login form.login { background: transparent !important; box-shadow: none !important; padding: 0 !important; }
/* phones: account tabs become one swipeable row */
@media (max-width: 767px) {
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation ul { display: flex !important; flex-wrap: nowrap; gap: 8px; overflow-x: auto; margin: 0 -16px !important; padding: 0 16px 6px !important; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation ul li { flex: none; margin: 0 !important; }
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation ul li a { white-space: nowrap; padding: 10px 16px !important; }
}
@media (max-width: 767px) {
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation ul li, .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation ul li a { width: auto !important; min-width: 0 !important; }
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation { width: 100% !important; }
}
@media (max-width: 767px) {
	/* keep the order number on the phone layout of the orders table */
	.elementor-widget-woocommerce-my-account .woocommerce-orders-table tbody tr { display: block; padding: 6px 0 10px; border-top: 1px solid #E3E8EE; }
	.elementor-widget-woocommerce-my-account .woocommerce-orders-table tbody tr:first-child { border-top: 0; }
	.elementor-widget-woocommerce-my-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-number { display: flex !important; justify-content: space-between; align-items: center; padding: 8px 0 !important; border: 0 !important; font-size: 17px; }
	.elementor-widget-woocommerce-my-account .woocommerce-orders-table .woocommerce-orders-table__cell-order-number::before { content: "Order"; font-size: 15px; font-weight: 700; color: #4A5565; }
	/* WooCommerce's "confirm your email" notice: text, then button */
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content .woocommerce-info { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
	.elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content .woocommerce-info .button { order: 2; float: none !important; margin: 0 !important; }
}

/* ================= custom sizes ================= */
.ppb-size-step .ppb-units { margin-bottom: 14px; }
.ppb-dims { display: flex; align-items: flex-end; gap: 12px; }
.ppb-dim { flex: 1; display: flex; flex-direction: column; gap: 6px; margin: 0; position: relative; }
.ppb-dim > span { font-weight: 700; font-size: 14px; color: var(--ppb-navy); }
.ppb .ppb-dim input { height: 54px; padding: 0 48px 0 16px; border: 1px solid #D3DCE6; border-radius: 10px; font-size: 20px; font-weight: 700; color: var(--ppb-navy); background: #fff; -moz-appearance: textfield; }
.ppb .ppb-dim input:focus { border-color: var(--ppb-blue); outline: none; box-shadow: 0 0 0 3px var(--ppb-tint); }
.ppb .ppb-dim input::-webkit-outer-spin-button, .ppb .ppb-dim input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ppb-unit-label { position: absolute; right: 14px; bottom: 16px; font-style: normal; font-weight: 600; color: #8A96A3; font-size: 15px; pointer-events: none; }
.ppb-times { padding-bottom: 14px; font-size: 22px; font-weight: 700; color: #8A96A3; }
.ppb-presets { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.ppb-presets > span { font-size: 13px; font-weight: 600; color: var(--ppb-text); }
.ppb-preset-list { display: flex; flex-wrap: wrap; gap: 8px; }
.ppb button.ppb-preset, .ppb button.ppb-preset:focus { padding: 8px 14px; border: 1px solid #D3DCE6; border-radius: 40px; background: #fff; color: var(--ppb-navy); font-weight: 600; font-size: 14px; line-height: 1.2; cursor: pointer; }
.ppb button.ppb-preset:hover { border-color: var(--ppb-blue); color: var(--ppb-blue); background: #fff; }
.ppb button.ppb-preset.is-on { border-color: var(--ppb-blue); background: var(--ppb-tint); color: var(--ppb-blue); }
.ppb-size-info { margin: 14px 0 0; padding: 10px 14px; border-radius: 8px; background: var(--ppb-grey); font-size: 14px; color: var(--ppb-navy); font-weight: 600; }
.ppb-size-info.is-error { background: #FDECEC; color: #9B1C1C; }
.ppb-size-info a { color: inherit; text-decoration: underline; font-weight: 700; }
.ppb-breakdown { font-size: 12px; }
.ppb-rate { color: #4A5565; font-weight: 500; }
@media (max-width: 600px) { .ppb .ppb-dim input { height: 50px; font-size: 18px; } .ppb-dims { gap: 8px; } }

.ppb-card-title { padding-right: 22px; }

/* designer: CMYK picker + centre tools */
.ppbd .ppbd-cmyk-btn { font-size: 13px; font-weight: 700; padding: 0 12px; }
.ppbd .ppbd-sw.is-on { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #0A6CAB; }
.ppbd-grp-label { font-size: 12px; font-weight: 700; color: #4A5565; margin-right: 2px; }
.ppbd-colours[hidden] { display: none !important; }
.ppbd-key--cmyk::before { background: linear-gradient(90deg, #00AEEF 0 25%, #EC008C 25% 50%, #FFF200 50% 75%, #231F20 75%); height: 8px; }
.ppbd-picker { position: absolute; top: 132px; left: 50%; transform: translateX(-50%); z-index: 5; width: min(380px, calc(100vw - 24px)); padding: 18px; background: #fff; border: 1px solid var(--l); border-radius: 14px; box-shadow: 0 24px 60px -20px rgba(19,41,61,.45); }
.ppbd-picker[hidden] { display: none; }
.ppbd-pick-head { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.ppbd-pick-head strong { display: block; font-size: 16px; }
.ppbd-pick-head small { display: block; font-size: 12px; color: #4A5565; line-height: 1.35; }
.ppbd-chip { width: 52px; height: 52px; border-radius: 10px; border: 1px solid rgba(19,41,61,.2); flex: none; }
.ppbd-pick-row { display: grid; grid-template-columns: 18px 1fr 56px 14px; align-items: center; gap: 10px; margin: 8px 0; font-size: 14px; }
.ppbd-pick-row input[type=number] { height: 34px; padding: 0 6px; border: 1px solid var(--l); border-radius: 6px; text-align: right; font-weight: 600; }
.ppbd-rng { width: 100%; }
.ppbd-rng--c { accent-color: #00AEEF; } .ppbd-rng--m { accent-color: #EC008C; } .ppbd-rng--y { accent-color: #E5D600; } .ppbd-rng--k { accent-color: #231F20; }
.ppbd-pick-actions { display: flex; justify-content: flex-end; margin-top: 12px; }
/* keep the theme's button hover/focus colours out of the designer toolbar */
.ppbd button.ppbd-mini, .ppbd button.ppbd-mini:hover, .ppbd button.ppbd-mini:focus, .ppbd button.ppbd-mini:active { background: #fff !important; color: var(--n) !important; border: 1px solid var(--l) !important; box-shadow: none !important; }
.ppbd button.ppbd-mini:hover, .ppbd button.ppbd-mini:focus-visible { border-color: var(--b) !important; color: var(--b) !important; }
.ppbd button.ppbd-mini.is-on { background: var(--n) !important; color: #fff !important; border-color: var(--n) !important; }
.ppbd button.ppbd-tool, .ppbd button.ppbd-tool:focus, .ppbd button.ppbd-tool:active { background: transparent !important; color: var(--n) !important; box-shadow: none !important; }
.ppbd button.ppbd-tool:hover { background: var(--g) !important; color: var(--b) !important; }
.ppbd button.ppbd-sw, .ppbd button.ppbd-sw:hover, .ppbd button.ppbd-sw:focus { padding: 0 !important; }

/* garment price breaks */
.ppb-tiers { margin-top: 14px; padding: 14px 16px; border: 1px solid var(--ppb-line); border-radius: 12px; background: #fff; }
.ppb-tiers-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 10px; }
.ppb-tiers-head strong { color: var(--ppb-navy); font-size: 15px; }
.ppb-tiers-head span { font-size: 12px; }
.ppb-tier-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(72px, 1fr)); gap: 6px; }
.ppb-tier { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; border-radius: 8px; background: var(--ppb-grey); transition: background .15s, box-shadow .15s; }
.ppb-tier b { font-size: 12px; color: var(--ppb-text); font-weight: 600; }
.ppb-tier em { font-style: normal; font-size: 15px; font-weight: 800; color: var(--ppb-navy); }
.ppb-tier.is-on { background: var(--ppb-tint); box-shadow: inset 0 0 0 2px var(--ppb-blue); }
.ppb-tier.is-on em { color: var(--ppb-blue); }
.ppb-tiers-foot { margin: 10px 0 0; font-size: 13px; }
.ppb-back-later[hidden] { display: none; }

/* category link cards ([ppb_category_links]) */
.ppb-cls { display: flex; flex-direction: column; gap: 16px; }
.ppb-cls:empty { display: none; }
.ppb-cl { display: flex; align-items: center; gap: 28px; padding: 20px 28px 20px 20px; background: #FFFFFF; border: 1px solid #E3E8EE; border-radius: 14px; color: #13293D; text-decoration: none; transition: border-color .2s, box-shadow .2s; }
.ppb-cl:hover { border-color: #0A6CAB; box-shadow: 0 8px 24px rgba(19, 41, 61, .08); color: #13293D; }
.ppb-cl-pic { flex: 0 0 160px; }
.ppb-cl-pic img { display: block; width: 160px; height: 160px; object-fit: contain; border-radius: 10px; background: #FFFFFF; }
.ppb-cl-body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ppb-cl-kicker { font-size: 13px; font-weight: 600; color: #0A6CAB; }
.ppb-cl .ppb-cl-body strong { color: #13293D; font-family: 'Plus Jakarta Sans', sans-serif; font-size: 24px; line-height: 1.2; }
.ppb-cl-desc { font-size: 15px; color: #4A5565; line-height: 1.5; }
.ppb-cl-meta { font-size: 14px; color: #4A5565; }
.ppb-cl-meta .amount { font-weight: 700; color: #13293D; }
.ppb-cl-go { flex: 0 0 auto; padding: 12px 22px; border-radius: 40px; background: #0A6CAB; color: #FFFFFF; font-weight: 600; font-size: 15px; white-space: nowrap; }
.ppb-cl:hover .ppb-cl-go { background: #13293D; }
@media (max-width: 767px) {
	.ppb-cl { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; }
	.ppb-cl-pic { flex: none; }
	.ppb-cl-pic img { width: 100%; height: 180px; }
	.ppb-cl-body strong { font-size: 20px; }
	.ppb-cl-go { text-align: center; }
}

/* Banner hem/eyelet diagrams (PPB_Sizes::finish_icon) */
.ppb-card-img--finish { width: 96px; height: 64px; color: var(--ppb-navy); }
.ppb-card-img--finish .ppb-fin-edge { fill: #fff; stroke: currentColor; stroke-width: 3; }
.ppb-card-img--finish .ppb-fin-hem { fill: none; stroke: currentColor; stroke-width: 1.5; }
.ppb-card-img--finish .ppb-fin-pocket { fill: var(--ppb-tint, #E8F2F9); stroke: currentColor; stroke-width: 1.5; }
.ppb-card-img--finish circle { fill: #fff; stroke: currentColor; stroke-width: 1.6; }
.ppb-card input:checked + .ppb-card-body .ppb-card-img--finish { color: var(--ppb-blue); }
.ppb-cards--img .ppb-card-title { padding-left: 22px; }
/* designer: printed sides (double sided) */
.ppbd-pages { display: flex; justify-content: center; gap: 4px; margin: 12px auto 0; padding: 4px; background: #fff; border: 1px solid var(--l); border-radius: 10px; }
.ppbd .ppbd-page { min-width: 96px; padding: 8px 18px; border: 0; border-radius: 7px; background: transparent; color: var(--n); font-size: 14px; font-weight: 700; }
.ppbd .ppbd-page:hover { color: var(--b); }
.ppbd .ppbd-page.is-on { background: var(--b); color: #fff; }
.ppbd .ppbd-page.has-design::after { content: " ✓"; }
/* free delivery bar (basket, checkout, popup) – site colours */
.ppb-free { display: flex; align-items: center; gap: 14px; box-sizing: border-box; width: 100%; max-width: none; margin: 0 0 24px; padding: 16px 20px; border: 1px solid #E3E8EE; border-radius: 12px; background: #fff; color: #13293D; font-family: inherit; box-shadow: 0 1px 2px rgba(19,41,61,.05); }
.ppb-free p { margin: 0; }
.ppb-free-ico { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #E8F2F9; }
.ppb-free-ico svg { width: 24px; height: 24px; fill: #0A6CAB; }
.ppb-free-body { flex: 1; min-width: 0; }
.ppb-free-txt { font-size: 16px; font-weight: 800; color: #13293D; }
.ppb-free-track { height: 8px; margin: 9px 0 7px; border-radius: 99px; background: #E3E8EE; overflow: hidden; }
.ppb-free-track span { display: block; height: 100%; border-radius: 99px; background: #0A6CAB; transition: width .4s ease; }
.ppb-free-sub { font-size: 13px; color: #4A5565; }
.ppb-free.is-free { background: #E8F2F9; border-color: #CFE2F0; }
.ppb-free.is-free .ppb-free-ico { background: #0A6CAB; }
.ppb-free.is-free .ppb-free-ico svg { fill: #fff; }
/* add-to-basket popup */
.ppb-pop { position: fixed; inset: 0; z-index: 99999; display: grid; place-items: center; padding: 16px; background: rgba(19,41,61,.55); animation: ppb-fade .2s ease; }
.ppb-pop-box { position: relative; width: 100%; max-width: 460px; max-height: calc(100vh - 32px); overflow: auto; padding: 26px 24px 22px; border-radius: 16px; background: #fff; color: #13293D; box-shadow: 0 20px 50px -12px rgba(19,41,61,.45); animation: ppb-rise .25s ease; }
.ppb-pop p { margin: 0; }
.ppb-pop .ppb-pop-x, .ppb-pop button.ppb-pop-x { position: absolute; top: 10px; right: 12px; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #4A5565; font-size: 26px; line-height: 1; cursor: pointer; }
.ppb-pop .ppb-pop-x:hover, .ppb-pop button.ppb-pop-x:hover { background: #F5F7FA; color: #13293D; }
.ppb-pop-t { font-size: 20px; font-weight: 800; }
.ppb-pop-t span { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-right: 6px; border-radius: 50%; background: #0A6CAB; color: #fff; font-size: 15px; vertical-align: 2px; }
.ppb-pop-name { margin-top: 4px !important; color: #4A5565; font-size: 15px; }
.ppb-pop-mb { margin: 16px 0 0; padding: 12px 14px; border: 1px solid #CFE2F0; border-radius: 12px; background: #E8F2F9; }
.ppb-pop-mb strong { display: block; font-size: 17px; color: #13293D; }
.ppb-pop-mb span { display: block; margin-top: 3px; font-size: 14px; color: #4A5565; }
.ppb-pop-mb.is-saving { background: #0A6CAB; border-color: #0A6CAB; }
.ppb-pop-mb.is-saving strong { color: #fff; }
.ppb-pop-mb.is-saving span { color: #D6E7F3; }
.ppb-pop .ppb-free { margin: 12px 0 0; padding: 14px; box-shadow: none; }
.ppb-pop .ppb-free-ico { width: 38px; height: 38px; }
.ppb-pop-actions { display: flex; gap: 10px; margin-top: 18px; }
.ppb-pop .ppb-pop-btn, .ppb-pop button.ppb-pop-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 10px 16px; border: 2px solid #0A6CAB; border-radius: 10px; background: #0A6CAB; color: #fff; font: inherit; font-weight: 700; font-size: 15px; text-decoration: none; cursor: pointer; }
.ppb-pop .ppb-pop-btn:hover, .ppb-pop button.ppb-pop-btn:hover { background: #07507F; border-color: #07507F; color: #fff; }
.ppb-pop .ppb-pop-btn--ghost, .ppb-pop button.ppb-pop-btn--ghost { background: #fff; color: #13293D; border-color: #E3E8EE; }
.ppb-pop .ppb-pop-btn--ghost:hover, .ppb-pop button.ppb-pop-btn--ghost:hover { background: #fff; color: #13293D; border-color: #13293D; }
@keyframes ppb-fade { from { opacity: 0; } }
@keyframes ppb-rise { from { transform: translateY(12px); opacity: 0; } }
@media (max-width: 480px) { .ppb-pop-actions { flex-direction: column; } .ppb-free { align-items: flex-start; } }
.ppb-save { font-size: 14px; font-weight: 700; color: #0A6CAB; }
/* multi-buy message under the quantity box (site colours: navy #13293D, blue #0A6CAB, tint #E8F2F9) */
.ppb-mb { display: flex; align-items: flex-start; gap: 10px; margin: 18px 0 6px; padding: 12px 14px; border: 1px solid #CFE2F0; border-radius: 10px; background: #E8F2F9; color: #13293D; }
.ppb-mb > div { min-width: 0; }
.ppb-mb svg { flex: none; width: 20px; height: 20px; margin-top: 1px; fill: #0A6CAB; }
.ppb-mb-main { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 15px; font-weight: 700; line-height: 1.35; color: #13293D; }
.ppb-mb-sub { display: block; margin-top: 2px; font-size: 13px; color: #4A5565; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ppb-mb.is-saving { background: #0A6CAB; border-color: #0A6CAB; }
.ppb-mb.is-saving svg { fill: #fff; }
.ppb-mb.is-saving .ppb-mb-main { color: #fff; }
.ppb-mb.is-saving .ppb-mb-sub { color: #D6E7F3; }
.ppb-mb.is-pop { animation: ppb-mb-pop .45s ease; }
@keyframes ppb-mb-pop { 40% { transform: scale(1.02); } }
@media (prefers-reduced-motion: reduce) { .ppb-mb.is-pop { animation: none; } }
/* popup: add more of this design */
.ppb-pop .ppb-pop-more { display: flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 12px; padding: 10px 14px; border-radius: 10px; background: #0A6CAB; color: #fff; font-weight: 700; font-size: 15px; text-decoration: none; text-align: center; }
.ppb-pop .ppb-pop-more:hover { background: #07507F; color: #fff; }
.ppb-pop-mb.is-saving .ppb-pop-more { background: #fff; color: #0A6CAB; }
.ppb-pop-mb.is-saving .ppb-pop-more:hover { background: #E8F2F9; color: #07507F; }
.ppb-pop .ppb-pop-more.ppb-pop-more--ghost, .ppb-pop-mb.is-saving + .ppb-pop-more--ghost { background: #fff; color: #0A6CAB; border: 1.5px solid #0A6CAB; }
.ppb-pop .ppb-pop-more.ppb-pop-more--ghost:hover { background: #E8F2F9; color: #07507F; }
.ppb-dl-range { font-weight: 600; color: #0A6CAB; }
.ppb-mb-designs { margin: 8px 0 0; font-size: 14px; line-height: 1.45; color: #13293D; }
.ppb-mb-designs strong { font-weight: 700; }
/* Check Your Artwork (basket + checkout) */
.ppb-review { margin: 24px 0; padding: 20px; border: 1px solid #E3E8EE; border-radius: 12px; background: #F5F7FA; }
.ppb-rv-title { margin: 0 0 4px; font-size: 20px; line-height: 1.25; color: #13293D; }
.ppb-rv-intro { margin: 0 0 16px; font-size: 14px; color: #4A5565; }
.ppb-rv-list { display: grid; gap: 14px; }
.ppb-rv-item { padding: 14px; border-radius: 10px; background: #fff; border: 1px solid #E3E8EE; }
.ppb-rv-head { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin-bottom: 10px; font-size: 14px; color: #4A5565; }
.ppb-rv-head strong { font-size: 15px; color: #13293D; }
.ppb-rv-note { margin: 0; font-size: 14px; color: #13293D; }
.ppb-rv-sides { display: flex; flex-wrap: wrap; gap: 12px; }
.ppb-rv-thumb { display: flex; flex-direction: column; gap: 6px; width: 170px; padding: 8px; border: 1px solid #E3E8EE; border-radius: 10px; background: #fff; cursor: zoom-in; text-align: left; font: inherit; color: #13293D; }
.ppb-rv-thumb:hover, .ppb-rv-thumb:focus-visible { border-color: #0A6CAB; box-shadow: 0 0 0 2px #E8F2F9; }
.ppb-rv-thumb img { width: 100%; height: 170px; object-fit: contain; background: repeating-conic-gradient(#F0F2F5 0 25%, #fff 0 50%) 0 0 / 16px 16px; border-radius: 6px; }
.ppb-rv-thumb span { font-size: 13px; font-weight: 600; }
.ppb-rv-file { display: flex; flex-direction: column; gap: 4px; width: 170px; padding: 14px; border: 1px dashed #0A6CAB; border-radius: 10px; color: #13293D; text-decoration: none; }
.ppb-rv-file b { font-size: 22px; color: #0A6CAB; }
.ppb-rv-file small { font-size: 12px; color: #4A5565; word-break: break-all; }
.ppb-rv-lightbox { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 20px; background: rgba(19, 41, 61, .82); }
.ppb-rv-lb-box { position: relative; max-width: min(1000px, 100%); max-height: 100%; padding: 16px; border-radius: 12px; background: #fff; text-align: center; }
.ppb-rv-lb-box img { display: block; max-width: 100%; max-height: calc(100vh - 140px); margin: 0 auto; object-fit: contain; background: repeating-conic-gradient(#F0F2F5 0 25%, #fff 0 50%) 0 0 / 16px 16px; }
.ppb-rv-lb-box p { margin: 10px 0 0; font-weight: 600; color: #13293D; }
.ppb-rv-lb-x { position: absolute; top: 6px; right: 8px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #F5F7FA; color: #13293D; font-size: 24px; line-height: 1; cursor: pointer; }
@media (max-width: 600px) { .ppb-rv-thumb, .ppb-rv-file { width: calc(50% - 6px); } .ppb-rv-thumb img { height: 130px; } }
/* theme/Elementor button + heading styles must not leak into the artwork check */
.ppb-review .ppb-rv-title { font-size: 22px !important; line-height: 1.25 !important; margin: 0 0 4px !important; font-weight: 700 !important; }
.ppb-review button.ppb-rv-thumb, .ppb-review button.ppb-rv-thumb:hover, .ppb-review button.ppb-rv-thumb:focus { background: #fff !important; color: #13293D !important; border: 1px solid #E3E8EE !important; box-shadow: none; text-transform: none !important; letter-spacing: normal !important; padding: 8px !important; border-radius: 10px !important; }
.ppb-review button.ppb-rv-thumb:hover, .ppb-review button.ppb-rv-thumb:focus-visible { border-color: #0A6CAB !important; box-shadow: 0 0 0 2px #E8F2F9 !important; }
.ppb-rv-lightbox button.ppb-rv-lb-x, .ppb-rv-lightbox button.ppb-rv-lb-x:hover { background: #F5F7FA !important; color: #13293D !important; border: 0 !important; padding: 0 !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; font-size: 24px !important; line-height: 36px !important; }

/* Checkout: account by default, guest on request (includes/checkout-account.php) */
.ppb-acct-on .wc-block-checkout__create-account > .wc-block-components-checkbox, .ppb-acct-on .wc-block-checkout__create-account > label, .ppb-acct-on .wc-block-checkout__guest-checkout-notice { display: none !important; }
.ppb-acct { margin: 14px 0 6px; font-size: 14px; color: #4A5565; }
.ppb-acct p { margin: 0 0 8px; }
.ppb-acct__lead { color: #13293D; font-weight: 500; }
.ppb-acct a { color: #0A6CAB; font-weight: 600; }
.ppb-acct__guest, .ppb-acct-is-guest .ppb-acct__account { display: none; }
.ppb-acct-is-guest .ppb-acct__guest { display: block; }
.ppb-acct .ppb-acct__btn { display: block; width: 100%; margin-top: 14px; padding: 13px 20px; border: 1px solid #C9D3DE; border-radius: 8px; background: #fff; color: #13293D; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; transition: border-color .15s, color .15s; }
.ppb-acct .ppb-acct__btn:hover, .ppb-acct .ppb-acct__btn:focus-visible { border-color: #0A6CAB; color: #0A6CAB; background: #fff; }
.ppb-acct .ppb-acct__link { padding: 0; border: 0; background: none; color: #0A6CAB; font: inherit; font-weight: 600; text-decoration: underline; cursor: pointer; }
.ppb-acct .ppb-acct__link:hover { background: none; color: #07507F; }
