:root{--zbr-ink:#111827;--zbr-muted:#667085;--zbr-line:#e5e7eb;--zbr-soft:#f5f7fa;--zbr-card:#fff;--zbr-accent:#1f6f78;--zbr-accent-dark:#15545c;--zbr-danger:#b42318;--zbr-radius:16px;--zbr-shadow:0 18px 48px rgba(16,24,40,.10)}
*{box-sizing:border-box}html,body.zbr-wp-app{margin:0;min-height:100%;background:#f4f6f8;color:var(--zbr-ink)}body.zbr-wp-app{padding:0;font-family:Barlow,Arial,sans-serif}.zbr-wp-shell{width:100%;max-width:1540px;margin:0 auto;padding:28px}.zbr-app-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin:0 0 22px;padding:28px 32px;background:linear-gradient(130deg,#101828 0%,#1d2939 62%,#1f6f78 145%);border-radius:20px;color:#fff;box-shadow:0 16px 42px rgba(16,24,40,.16)}.zbr-app-kicker{margin:0 0 5px;color:#89d1d6;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.zbr-app-intro h1{margin:0;font:600 clamp(28px,3vw,44px)/1.08 "Barlow Condensed",Arial,sans-serif;color:#fff}.zbr-app-intro p{max-width:650px;margin:9px 0 0;color:#d0d5dd;font-size:16px;line-height:1.5}.zbr-steps{display:flex;align-items:center;gap:7px;flex:0 0 auto}.zbr-step{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#d0d5dd;font-size:12px;font-weight:700;white-space:nowrap;transition:.25s}.zbr-step span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff}.zbr-step.is-active{border-color:#70c5cb;background:rgba(112,197,203,.14);color:#fff}.zbr-step.is-active span{background:#70c5cb;color:#102a2d}.zbr-loading{display:flex;align-items:center;justify-content:center;gap:12px;min-height:280px;background:#fff;border:1px solid var(--zbr-line);border-radius:var(--zbr-radius);color:var(--zbr-muted)}.zbr-loading-spinner{width:24px;height:24px;border:3px solid #e4e7ec;border-top-color:var(--zbr-accent);border-radius:50%;animation:zbr-spin .8s linear infinite}@keyframes zbr-spin{to{transform:rotate(360deg)}}
.garment-designer-app{width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;color:var(--zbr-ink)!important}.garment-designer-app:not(.active){height:auto!important;min-height:110px}.garment-designer-app:not(.active) .garment-list-wrapper{display:grid;place-items:center;min-height:110px;padding:24px;background:var(--zbr-card);border:1px solid var(--zbr-line);border-radius:var(--zbr-radius);box-shadow:0 8px 24px rgba(16,24,40,.05)}
.garment-designer-app button:not(.designer-app-swatch-small):not(.designer-app-swatch-large),.garment-designer-app .designer-app-button,.garment-designer-app .button{min-height:46px!important;height:auto!important;padding:12px 19px!important;border:1px solid transparent!important;border-radius:10px!important;background:var(--zbr-ink)!important;color:#fff!important;font-weight:700!important;line-height:1.2!important;box-shadow:none!important;cursor:pointer!important;transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease!important}.garment-designer-app button:not(.designer-app-swatch-small):not(.designer-app-swatch-large):hover,.garment-designer-app .designer-app-button:hover,.garment-designer-app .button:hover{background:var(--zbr-accent)!important;color:#fff!important;transform:translateY(-1px);box-shadow:0 8px 18px rgba(31,111,120,.18)!important}.garment-designer-app button:disabled{opacity:.55;cursor:not-allowed!important;transform:none!important}.garment-designer-app button:focus-visible,.garment-designer-app a:focus-visible,.garment-designer-app input:focus-visible,.garment-designer-app textarea:focus-visible,.garment-designer-app select:focus-visible{outline:3px solid rgba(31,111,120,.25)!important;outline-offset:2px!important}
.garment-list-wrapper{position:relative}.garment-list-wrapper>.designer-app-button{min-width:190px}.garment-list{display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin:14px 0 0!important}.garment-list-field{width:auto!important;height:auto!important;min-height:44px!important;border:1px solid var(--zbr-line)!important;border-radius:10px!important;background:#fff!important;overflow:hidden}.garment-list-field:hover,.garment-list-field.active-garment{border-color:var(--zbr-accent)!important;background:#edf7f7!important;box-shadow:0 5px 16px rgba(16,24,40,.06)!important}.garment-label{padding:11px 14px!important;font-size:15px!important}.garment-close-button{padding:11px 13px!important;color:var(--zbr-danger)!important;text-decoration:none!important}
.garment-control-wrapper{min-width:0!important}.garment-control{margin:14px 0 30px!important;padding:22px!important;border:1px solid var(--zbr-line)!important;border-radius:var(--zbr-radius)!important;background:var(--zbr-card)!important;box-shadow:var(--zbr-shadow)!important}.garment-design-control{display:grid!important;grid-template-columns:auto minmax(260px,1fr) auto!important;align-items:center!important;gap:22px!important;padding:0 0 20px!important;border-bottom:1px solid var(--zbr-line)}.design-thumbnail-wrapper{width:112px!important;padding:8px!important;background:var(--zbr-soft)!important;border:1px solid var(--zbr-line)!important;overflow:visible!important}.design-thumbnail-button{display:flex!important;flex-direction:column!important;align-items:center!important;gap:7px!important;width:94px!important;min-height:132px!important;padding:0 0 9px!important;background:#fff!important;color:var(--zbr-ink)!important;border:1px solid var(--zbr-line)!important;border-radius:10px!important;overflow:hidden!important}.design-thumbnail-button:hover{background:#f6fbfb!important;color:var(--zbr-ink)!important;border-color:var(--zbr-accent)!important}.design-thumbnail{width:94px!important}.design-thumbnail-label{display:block!important;padding:0 6px!important;color:var(--zbr-ink)!important;font-size:13px!important;font-weight:700!important;line-height:1.2!important;text-align:center!important;white-space:normal!important}.colours-list{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;gap:10px!important}.colour-wrapper{gap:11px!important;min-width:0;padding:7px 10px;border:1px solid var(--zbr-line);border-radius:10px;background:#fff;font-size:15px!important}.designer-app-swatch-small{width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;border-radius:9px!important;border:2px solid #fff!important;box-shadow:0 0 0 1px #d0d5dd,0 3px 7px rgba(16,24,40,.12)!important}.views-list{align-items:center!important;justify-content:flex-end!important;gap:7px!important}.view-button{min-width:78px}.view-button.active{background:var(--zbr-accent)!important}
.views-wrapper{margin-top:22px}.garment-view.garment-view-customisable{display:grid!important;grid-template-columns:minmax(230px,300px) minmax(0,1fr)!important;gap:22px!important}.view-control-wrapper{order:1!important;padding:18px;border:1px solid var(--zbr-line);border-radius:14px;background:var(--zbr-soft)}.design-canvas-wrapper{order:2!important;overflow:hidden!important;min-width:0;border:1px solid var(--zbr-line)!important;border-radius:14px!important;background:linear-gradient(45deg,#f7f8fa 25%,transparent 25%),linear-gradient(-45deg,#f7f8fa 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f7f8fa 75%),linear-gradient(-45deg,transparent 75%,#f7f8fa 75%)!important;background-size:24px 24px!important;background-position:0 0,0 12px,12px -12px,-12px 0!important}.inputs-wrapper{gap:12px!important;margin:0 0 16px!important}.text-input-wrapper{gap:8px!important}.text-input,.garment-designer-app input,.garment-designer-app select,.garment-designer-app textarea{border:1px solid #d0d5dd!important;border-radius:9px!important;background:#fff!important;color:var(--zbr-ink)!important;box-shadow:0 1px 2px rgba(16,24,40,.04)!important}.text-input{height:46px!important;padding:10px 12px!important}.image-previews-list{padding:10px 0!important;gap:10px!important}.image-preview-wrapper{width:74px!important;height:74px!important}.image-preview{border-radius:10px!important}.form{max-width:760px!important;margin:28px auto!important;padding:28px!important;gap:20px!important;border:1px solid var(--zbr-line)!important;border-radius:var(--zbr-radius)!important;background:#fff!important;box-shadow:0 12px 34px rgba(16,24,40,.07)!important}.form-header h3{margin:0!important;color:var(--zbr-ink)!important;font-size:29px!important}.form-field{gap:7px!important}.form-field label{order:1!important;color:#344054;font-size:14px;font-weight:700}.form-field input,.form-field select,.form-field textarea{order:2!important;min-height:48px;padding:12px 14px!important;border:1px solid #d0d5dd!important}.form-field textarea{min-height:120px;resize:vertical}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--zbr-accent)!important;box-shadow:0 0 0 4px rgba(31,111,120,.10)!important}.form-field input::placeholder,.form-field textarea::placeholder{color:#98a2b3!important;opacity:1!important}
.modal.modal-active{padding:28px!important;background:rgba(16,24,40,.72)!important;backdrop-filter:blur(8px)}.modal-box{width:min(1180px,100%)!important;height:auto!important;max-height:calc(100vh - 56px)!important;padding:0!important;border:0!important;border-radius:20px!important;background:#fff!important;box-shadow:0 30px 90px rgba(0,0,0,.28)!important;overflow:hidden}.modal-header{align-items:center!important;padding:22px 26px!important;border-bottom:1px solid var(--zbr-line)!important}.modal-title{margin:0!important;color:var(--zbr-ink)!important;font-size:clamp(26px,3vw,38px)!important}.modal-close-button{position:static!important;min-width:46px!important;width:46px!important;height:46px!important;padding:0!important;border-radius:50%!important;background:#f2f4f7!important;color:#344054!important}.modal-content{padding:22px!important}.modal-categories-content,.modal-garment-content,.modal-design-content,.modal-colour-content{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(155px,1fr))!important;gap:16px!important;padding:2px!important}.category-thumbail-button,.garment-thumbail-button,.design-thumbail-button,.swatch-button{gap:10px!important;padding:12px!important;border:1px solid var(--zbr-line)!important;border-radius:14px!important;background:#fff!important;color:var(--zbr-ink)!important;text-align:center;box-shadow:none!important}.category-thumbail-button:hover,.garment-thumbail-button:hover,.design-thumbail-button:hover,.swatch-button:hover{border-color:var(--zbr-accent)!important;background:#f6fbfb!important;color:var(--zbr-ink)!important;transform:translateY(-2px)!important;box-shadow:0 10px 22px rgba(16,24,40,.10)!important}.category-thumbnail-wrapper,.garment-thumbnail-wrapper,.design-thumbnail-wrapper{overflow:hidden;border-radius:10px;background:var(--zbr-soft)}.category-thumbnail,.category-hover-thumbnail,.garment-thumbnail,.garment-hover-thumbnail,.design-thumbnail,.design-hover-thumbnail{width:100%;height:100%;object-fit:contain}.modal-colour-content .swatch-button{aspect-ratio:auto!important}.modal-colour-content .designer-app-swatch-large{border-radius:10px!important}.modal-typeface-content{gap:7px!important}.modal-typeface-content .typeface{padding:14px 18px!important;border:1px solid var(--zbr-line)!important;border-radius:10px!important;font-size:26px!important}.modal-typeface-content .typeface:hover,.modal-typeface-content .typeface-selected{background:#edf7f7!important;border-color:var(--zbr-accent)!important}.modal-submit-content .summary-wrapper{padding:0 4px}.garment-preview{overflow:hidden;border:1px solid var(--zbr-line)!important;border-radius:14px!important;box-shadow:none!important}.submit-form{flex-direction:row!important;justify-content:flex-end!important;margin:18px 0 0!important;padding:18px 0 0!important;border:0!important;border-top:1px solid var(--zbr-line)!important;border-radius:0!important;box-shadow:none!important}
@media(max-width:980px){.zbr-app-intro{align-items:flex-start;flex-direction:column}.garment-design-control{grid-template-columns:auto 1fr!important}.views-list{grid-column:1/-1;justify-content:flex-start!important}.garment-view.garment-view-customisable{grid-template-columns:1fr!important}.view-control-wrapper{order:2!important}.design-canvas-wrapper{order:1!important}}
@media(max-width:680px){.zbr-wp-shell{padding:12px}.zbr-app-intro{margin-bottom:12px;padding:22px;border-radius:15px}.zbr-app-intro p{font-size:14px}.zbr-steps{width:100%;overflow-x:auto;padding-bottom:3px}.zbr-step{padding:7px 9px}.garment-control{padding:12px!important;border-radius:13px!important}.garment-design-control{grid-template-columns:1fr!important}.design-thumbnail-wrapper{width:100%!important}.views-list{grid-column:auto}.colours-list{grid-template-columns:1fr!important}.modal.modal-active{padding:0!important}.modal-box{height:100%!important;max-height:100vh!important;border-radius:0!important}.modal-header{padding:16px}.modal-content{padding:14px}.modal-categories-content,.modal-garment-content,.modal-design-content,.modal-colour-content{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.form{padding:20px!important;margin-top:18px!important}.form-row,.submit-form{flex-direction:column!important}.form-row>*{width:100%}.zbr-wp-app canvas{max-width:100%!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
