<iframe id="landingFrame" src="landing.html" style="border:0;width:100%;height:900px;" title="Sticker Quick Quote"></iframe>.container-reset{box-sizing:border-box}
*{box-sizing:border-box}
/* Landing page uses white background to match request */
body{margin:0;min-height:100vh;background:transparent;color:#222222}
.wrap{width:100%;max-width:none;margin:0;padding:0;box-sizing:border-box}

/* Position the main content at the absolute top-left of the viewport for landing page */
html, body { height: 100%; }
body { margin: 0 !important; padding: 0 !important; background: transparent !important; }
main.wrap { position: fixed !important; top: 0 !important; left: 0 !important; margin: 0 !important; padding: 0 !important; background: transparent !important; z-index: 1000; }

/* Remove any top margins on direct children so nothing creates a gap */
main.wrap > * { margin-top: 0 !important; }
.form-card { margin: 0 !important; }

/* When embedded in an iframe, allow the landing content to fill the iframe viewport */
.embedded html, .embedded body { height: 100% !important; }
.embedded main.wrap { position: relative !important; top: auto !important; left: auto !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; }
.embedded .two-col { grid-template-columns: 1fr; height: 100%; }
.embedded .form-card { height: 100%; overflow:auto; box-shadow: none; border-radius: 0; }
.embedded .upload-row { align-items:flex-start; }

/* Force-remove any global background or decorative pseudo elements from other stylesheets */
html, body, #app, .container, .main-content { background: transparent !important; }
body::before, body::after, .container::before, .container::after { display: none !important; content: none !important; }

/* Ensure no top spacing remains from other CSS */
html, body, main.wrap { margin: 0 !important; padding: 0 !important; }
.two-col{display:grid;grid-template-columns:minmax(120px,320px) minmax(0,1fr);gap:18px;align-items:start}
.preview-col{display:flex;flex-direction:column;align-items:flex-start}
.preview-box{max-width:100%;width:100%;box-sizing:border-box}


.upload-row{display:flex;gap:12px;padding-bottom:6px;flex-wrap:nowrap !important;align-items:flex-start}
/* Non-wrapping and proportional scaling: blocks keep aspect ratio and scale both width and height */
.upload-row .upload-block{flex:0 1 33.333% !important;min-width:0 !important;max-width:33.333% !important;box-sizing:border-box}
.upload-row .upload-block .preview-box{width:100%;aspect-ratio:1/1;position:relative;background:#f6f6f6;overflow:hidden}
.upload-row .upload-block .preview-box img{width:100%;height:100%;object-fit:contain;display:block}
.upload-row .upload-block .preview-placeholder{color:#888;text-align:center;padding:8px;display:flex;align-items:center;justify-content:center;height:100%}

.file-input{display:none}
header h1{margin:0;font-size:1.6rem;color:var(--accent)}
.preview-col{display:flex;flex-direction:column}
.preview-box{background:#f8f8f8;border:1px solid #e6e6e6;padding:12px;border-radius:8px;min-height:220px;display:flex;align-items:center;justify-content:center}
.preview-placeholder{color:#666;text-align:center}
.form-card{background:#ffffff;border:1px solid #e6e6e6;padding:18px;border-radius:10px;margin-top:12px;color:#222;min-width:0}
/* Ensure form controls are interactive and sit above decorative layers */
.form-card{position:relative;z-index:50;pointer-events:auto}
.form-card select, .form-card input, .form-card button {position:relative;z-index:60}
.row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
label{flex:1;display:flex;flex-direction:column;font-size:0.9rem;color:var(--muted)}
input,select{margin-top:6px;padding:8px;border-radius:8px;border:1px solid #d7d7d7;background:#fff;color:#222}
.price-panel{margin-top:12px;background:rgba(255,255,255,0.02);padding:12px;border-radius:8px;text-align:center}
.price{font-size:1.6rem;color:#8B0000;margin-top:6px}
.breakdown{font-size:0.85rem;color:#666;margin-top:6px}
 .actions{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:12px;flex-wrap:nowrap}
 .primary{background:#8B0000;color:#fff;padding:10px 16px;border-radius:8px;border:0;cursor:pointer;position:relative;z-index:5;pointer-events:auto}
 /* Ensure checkout buttons use Bebas Neue to match site theme */
 .request-proof{display:inline-flex;flex-direction:row;align-items:center;gap:6px;color:var(--muted);font-size:0.95rem;white-space:nowrap;margin:0;flex:0 0 auto !important;padding:0;cursor:pointer}
 .request-proof input{width:16px;height:16px;border-radius:3px;margin:0;pointer-events:auto;position:relative;z-index:2}
 .request-proof span{line-height:1}
 .actions > .request-proof{margin-right:4px}
.primary, #checkoutBtn { font-family: 'Bebas Neue', sans-serif; }
fieldset.delivery{border:1px solid rgba(255,255,255,0.03);padding:8px;border-radius:8px}

/* Modal styles (matching checkout popup) */
.modal{position:fixed;inset:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:9999}
.modal-content{background:white;color:#2a2a2a;padding:15px 20px;border-radius:12px;max-width:600px;width:90%;max-height:90vh;overflow-y:auto;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 12px 30px rgba(0,0,0,0.35);border:1px solid rgba(0,0,0,0.08)}
.option-tabs{display:flex;margin-bottom:15px;border-bottom:2px solid #e0e0e0}
.tab-btn{padding:10px 20px;border:none;background:none;cursor:pointer;font-size:0.95rem;font-weight:600;color:#666;transition:all 0.3s ease;border-bottom:3px solid transparent}
.tab-btn.active{color:#8B0000;border-bottom-color:#8B0000;padding-bottom:8px;border-bottom-style:solid;border-bottom-width:3px}
.form-group{margin-bottom:12px}
.form-group label{display:block;margin-bottom:4px;font-weight:600;color:#2a2a2a;font-size:0.9rem}
.form-group input, .form-group select{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px;background:white;color:#2a2a2a}
.monospace{background:#f0f0f0;padding:12px;border-radius:6px;font-family:monospace;margin-bottom:15px}
.production-notice{background:#fff3cd;border:1px solid #ffeaa7;color:#856404;padding:12px;border-radius:6px;font-size:0.8rem;margin-top:15px}

/* Override generic .preview-box rules for upload-row so they can scale proportionally */
.upload-row .upload-block .preview-box{
	min-height:0 !important;
	display:block !important;
	height:auto !important;
	padding:0 !important;
	aspect-ratio:1/1 !important;
	background:#f6f6f6 !important;
}

.upload-row .upload-block .preview-box img{position:relative;display:block;width:100%;height:100%;object-fit:contain}

