/* Alpha Print Pricing – front end */
.app-has-options form.cart .quantity { display: none !important; }
.app-has-options form.cart { display: block !important; }
.app-wrap { --app-muted: color-mix(in srgb, var(--app-text) 55%, transparent); --app-line: color-mix(in srgb, var(--app-text) 14%, transparent); --app-soft: color-mix(in srgb, var(--app-primary) 8%, var(--app-bg));
	container-type: inline-size; color: var(--app-text); margin: 0 0 1.5em; width: 100%; clear: both; font-size: 15px; }
.app-wrap *, .app-wrap *::before { box-sizing: border-box; }
.app-wrap { display: grid; gap: 24px; grid-template-columns: 1fr; }
@container (min-width: 760px) { .app-wrap > .app-options { grid-column: 1; } }
@media (min-width: 1024px) { .app-wrap.app-wide { grid-template-columns: minmax(0, 1fr) 320px; } }

.app-options { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.app-group { background: var(--app-bg); border: 1px solid var(--app-line); border-radius: var(--app-radius); padding: 18px; }
.app-layout-compact .app-group { padding: 12px; border: 0; border-bottom: 1px solid var(--app-line); border-radius: 0; }
.app-group[hidden] { display: none; }
.app-group-head { display: flex; gap: 4px; align-items: baseline; margin-bottom: 12px; }
.app-group-label { font-weight: 700; font-size: 1.05em; }
.app-req { color: var(--app-primary); }
.app-help { color: var(--app-muted); font-size: .9em; margin: -6px 0 12px; }

.app-choices { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@container (min-width: 520px) {
	.app-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.app-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.app-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.app-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
.app-cols-1 { grid-template-columns: 1fr; }
.app-choice { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px;
	padding: 12px 10px; border: 2px solid var(--app-line); border-radius: var(--app-radius); background: var(--app-bg); transition: border-color .15s, background .15s, transform .1s; position: relative; }
.app-choice:hover { border-color: color-mix(in srgb, var(--app-primary) 50%, transparent); }
.app-choice:focus-visible { outline: 2px solid var(--app-primary); outline-offset: 2px; }
.app-choice.is-active { border-color: var(--app-primary); background: var(--app-soft); }
.app-choice.is-active::after { content: "✓"; position: absolute; top: 6px; right: 8px; width: 18px; height: 18px; border-radius: 50%; background: var(--app-primary); color: var(--app-bg); font-size: 11px; line-height: 18px; text-align: center; }
.app-choice img { width: 100%; max-height: 90px; object-fit: contain; margin-bottom: 4px; }
.app-opt-label { font-weight: 600; }
.app-opt-desc { color: var(--app-muted); font-size: .82em; }
.app-opt-price { white-space: nowrap; font-size: .82em; font-weight: 600; color: var(--app-primary); }
.app-radios .app-choice { flex-direction: row; flex-wrap: wrap; justify-content: space-between; text-align: left; padding: 10px 14px; }

.app-input { width: 100%; padding: 10px 12px; border: 1px solid var(--app-line); border-radius: calc(var(--app-radius) * .6); background: var(--app-bg); color: var(--app-text); font: inherit; }
.app-input:focus { outline: 2px solid var(--app-primary); border-color: transparent; }
.app-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.app-chip { all: unset; cursor: pointer; padding: 6px 14px; border: 1px solid var(--app-line); border-radius: 999px; font-weight: 600; }
.app-chip.is-active { background: var(--app-primary); color: var(--app-bg); border-color: var(--app-primary); }

.app-size { display: flex; align-items: flex-end; gap: 10px; }
.app-dim { flex: 1; display: flex; flex-direction: column; gap: 4px; font-size: .9em; }
.app-dim small { color: var(--app-muted); }
.app-x { padding-bottom: 12px; color: var(--app-muted); }

.app-matrix-wrap { overflow-x: auto; margin: 0; }
.app-matrix { width: 100%; border-collapse: separate; border-spacing: 4px; margin: 0; }
.app-matrix th, .app-matrix td { border: 0 !important; padding: 0; text-align: center; background: none; }
.app-matrix thead th { padding: 6px; font-size: .85em; font-weight: 700; }
.app-matrix thead small { display: block; font-weight: 400; color: var(--app-muted); }
.app-matrix tbody th { text-align: left; padding: 0 8px; font-weight: 700; white-space: nowrap; }
.app-cell { all: unset; box-sizing: border-box; cursor: pointer; display: block; width: 100%; padding: 10px 6px; border-radius: calc(var(--app-radius) * .6); background: var(--app-soft); font-weight: 600; text-align: center; transition: background .15s, color .15s; white-space: nowrap; }
.app-cell:hover { background: color-mix(in srgb, var(--app-primary) 20%, var(--app-bg)); }
.app-cell.is-active { background: var(--app-primary); color: var(--app-bg); }
.app-na { color: var(--app-muted); font-size: .85em; }

.app-drop { border: 2px dashed var(--app-line); border-radius: var(--app-radius); padding: 22px; text-align: center; cursor: pointer; display: flex; flex-direction: column; gap: 4px; transition: border-color .15s, background .15s; }
.app-drop:hover, .app-drop.is-over { border-color: var(--app-primary); background: var(--app-soft); }
.app-drop small { color: var(--app-muted); }
.app-file-status { margin-top: 8px; font-size: .9em; }
.app-file-ok { color: #1a7f37; font-weight: 600; }
.app-link { all: unset; cursor: pointer; text-decoration: underline; color: var(--app-muted); }
.app-later { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: .9em; }

.app-summary { background: var(--app-bg); border: 2px solid var(--app-primary); border-radius: var(--app-radius); padding: 18px; align-self: start; box-shadow: 0 10px 30px -15px color-mix(in srgb, var(--app-text) 40%, transparent); }
.app-sticky .app-summary { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 20px); z-index: 5; }
.app-summary-title { margin: 0 0 12px; font-size: 1.1em; }
.app-lines { list-style: none; margin: 0 0 12px; padding: 0; font-size: .9em; }
.app-lines li { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px dashed var(--app-line); }
.app-l-k { color: var(--app-muted); }
.app-l-v { font-weight: 600; text-align: right; }
.app-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.app-dates div { background: var(--app-soft); border-radius: calc(var(--app-radius) * .6); padding: 8px 10px; display: flex; flex-direction: column; font-size: .85em; }
.app-dates span { color: var(--app-muted); }
.app-totals { margin-bottom: 12px; }
.app-t-row { display: flex; justify-content: space-between; align-items: baseline; padding: 3px 0; }
.app-t-vat { color: var(--app-muted); font-size: .9em; }
.app-t-main strong { font-size: 1.7em; color: var(--app-primary); }
.app-t-each { text-align: right; color: var(--app-muted); font-size: .85em; }
.app-warn { color: #b42318; font-size: .85em; margin: 0 0 10px; }
.app-muted { color: var(--app-muted); }
.app-summary .single_add_to_cart_button { width: 100%; float: none !important; margin: 0 !important; background: var(--app-primary) !important; color: var(--app-bg) !important; border-radius: calc(var(--app-radius) * .6) !important; padding: 14px !important; font-weight: 700; }
.app-summary .single_add_to_cart_button:disabled { opacity: .5; cursor: not-allowed; }

.app-mobile-bar { display: none; }
@media (max-width: 767px) {
	.app-mobile-bar:not([hidden]) { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); background: var(--app-bg); border-top: 1px solid var(--app-line); box-shadow: 0 -6px 20px -10px color-mix(in srgb, var(--app-text) 40%, transparent); transform: translateY(110%); transition: transform .25s; }
	.app-mobile-bar.is-shown { transform: none; }
	.app-mobile-bar div { display: flex; flex-direction: column; line-height: 1.1; }
	.app-mobile-bar small { color: var(--app-muted); }
	.app-mobile-bar strong { font-size: 1.3em; color: var(--app-primary); }
	.app-bar-btn { all: unset; cursor: pointer; background: var(--app-primary); color: var(--app-bg); padding: 12px 18px; border-radius: calc(var(--app-radius) * .6); font-weight: 700; }
	.app-bar-btn:disabled { opacity: .5; }
	.app-sticky .app-summary { position: static; }
}
.app-hidden { display: none; }
.app-from { font-size: .7em; font-weight: 400; opacity: .7; }

/* Dynamic tier totals and an unframed option layout. */
.app-cell { min-height: 58px; }
.app-cell strong, .app-cell small { display: block; }
.app-cell small { font-size: .75em; font-weight: 400; margin-top: 3px; }
.app-cell:disabled { opacity: .45; cursor: not-allowed; }
.app-cell:focus-visible { outline: 2px solid var(--app-primary); outline-offset: 2px; }
.app-lines li { flex-wrap: wrap; }
.app-l-k { flex: 1; min-width: 70px; }
.app-l-v { flex: 1; overflow-wrap: anywhere; }
.app-l-amount { text-align: right; min-width: 65px; font-weight: 600; }
.app-group { border: 0; border-bottom: 1px solid var(--app-line); border-radius: 0; padding: 0 0 18px; }
.app-input, .app-choice { overflow-wrap: anywhere; }
@media (prefers-reduced-motion: reduce) { .app-wrap *, .app-mobile-bar { transition: none; } }

/* Theme-safe sizing: the product column, not the viewport, determines layout. */
.app-wrap { --app-on-primary: #fff; --app-success: #1a7f37; --app-danger: #b42318; min-width: 0; max-width: 100%; line-height: 1.5; letter-spacing: 0; }
.app-wrap *, .app-wrap *::after { box-sizing: border-box; }
.app-wrap :is(.app-group, .app-summary, .app-summary-body, .app-choices, .app-totals) { min-width: 0; max-width: 100%; }
.app-wrap :is(.app-opt-label, .app-opt-desc, .app-help, .app-file-status, .app-group-label, .app-dates strong) { min-width: 0; overflow-wrap: anywhere; white-space: normal; line-height: 1.5; }
.app-wrap .app-group-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; }
.app-wrap .app-help { margin: 0 0 12px; }
.app-wrap .app-choice { min-width: 0; min-height: 48px; height: auto; font: inherit; line-height: 1.5; white-space: normal; }
.app-wrap .app-choice:not(.app-radios .app-choice) { padding-top: 28px; }
.app-wrap .app-opt-price { white-space: normal; overflow-wrap: anywhere; line-height: 1.4; }
.app-wrap .app-radios .app-choice { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; flex-wrap: nowrap; gap: 3px; padding: 10px 16px; border: 1px solid var(--app-primary); border-radius: 999px; color: var(--app-primary); background: var(--app-bg); position: relative; }
.app-wrap .app-radios .app-choice.is-active { background: var(--app-primary); color: var(--app-on-primary); }
.app-wrap .app-radios .app-choice.is-active::after { content: none; }
.app-wrap .app-radios .app-choice.is-active :is(.app-opt-desc, .app-opt-price) { color: var(--app-on-primary); }
.app-wrap .app-radio-input { position: absolute; width: 1px; height: 1px; opacity: 0; margin: 0; padding: 0; }
.app-wrap .app-radios .app-choice:has(.app-radio-input:focus-visible) { outline: 2px solid var(--app-primary); outline-offset: 3px; }
.app-wrap .app-input { min-width: 0; max-width: 100%; height: auto; min-height: 44px; line-height: 1.5; }
.app-wrap .app-dim { min-width: 0; }
.app-wrap .app-matrix-wrap { max-width: 100%; min-width: 0; overflow-x: auto; padding: 4px; }
.app-wrap .app-matrix { min-width: 410px; width: 100%; table-layout: fixed; }
.app-wrap .app-matrix th:first-child { width: 64px; }
.app-wrap .app-matrix :is(th, td) { vertical-align: middle; line-height: 1.4; }
.app-wrap .app-matrix thead th { overflow-wrap: anywhere; white-space: normal; }
.app-wrap .app-cell { height: auto; min-height: 64px; white-space: normal; overflow-wrap: anywhere; font: inherit; font-size: .88em; line-height: 1.4; background: var(--app-soft) !important; color: var(--app-text) !important; }
.app-wrap .app-cell.is-active, .app-wrap .app-chip.is-active { background: var(--app-primary) !important; color: var(--app-on-primary) !important; }
.app-wrap .app-drop { font: inherit; color: var(--app-text) !important; background: var(--app-bg) !important; width: 100%; min-height: 64px; height: auto; padding: 12px 16px; border: 1px solid var(--app-primary); border-radius: 6px; align-items: center; white-space: normal; line-height: 1.5; }
.app-wrap .app-drop:focus-visible { outline: 2px solid var(--app-primary); outline-offset: 3px; }
.app-wrap .app-drop small { overflow-wrap: anywhere; }
.app-wrap .app-later { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.app-wrap .app-later input { margin: 4px 0 0; }
.app-wrap .app-file-ok { color: var(--app-success); }
.app-wrap .app-warn { color: var(--app-danger); }
.app-wrap .app-lines { margin: 0 0 12px !important; padding: 0 !important; }
.app-wrap .app-lines li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 2px 10px; margin: 0; }
.app-wrap :is(.app-l-k, .app-l-v, .app-l-amount) { min-width: 0; overflow-wrap: anywhere; }
.app-wrap .app-l-amount { grid-column: 2; }
.app-wrap .app-dates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.app-wrap .app-t-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.app-wrap .app-t-row strong { white-space: nowrap; }
.app-wrap .app-summary .single_add_to_cart_button { height: auto !important; min-height: 48px; white-space: normal !important; line-height: 1.5 !important; color: var(--app-on-primary) !important; }
.app-wrap .app-mobile-bar:not([hidden]) { min-width: 0; }
.app-wrap .app-mobile-bar div { min-width: 0; }
.app-wrap .app-bar-btn { color: var(--app-on-primary); min-height: 44px; flex-shrink: 0; white-space: normal; text-align: center; line-height: 1.4; max-width: 55%; }
@container (max-width: 380px) { .app-wrap .app-choices { grid-template-columns: 1fr; } .app-wrap .app-t-main strong { font-size: 1.4em; } }
@media (max-width: 767px) { .app-has-options { padding-bottom: calc(90px + env(safe-area-inset-bottom)); } }
