:root { font-family: 'Hanken Grotesk', sans-serif; color: #243f32; background: #fff; font-synthesis: none; --brand: #14683f; --muted: #53645c; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; font-size: 16px; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
p, h1, h2, h3 { margin: 0; }
img { max-width: 100%; }
[hidden] { display: none !important; }
.material-symbols-outlined { font-family: 'Material Symbols Outlined'; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1; display: inline-block; white-space: nowrap; direction: ltr; font-feature-settings: 'liga'; }
:where(button, a, input, select):focus-visible { outline: 3px solid #79b895; outline-offset: 4px; }
.site-header { max-width: 1280px; margin: auto; padding: 1.5rem 3rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.site-header img { display: block; width: 180px; height: auto; }
.demo-badge { font-size: .65rem; padding: .4rem .65rem; background: #f1f6f2; border: 1px solid #e0e9df; border-radius: 999px; color: #62775e; }
.eyebrow { display: block; margin-bottom: 1.25rem; color: #60834b; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; }
h1 { color: #173e2d; font-size: clamp(2rem, 4vw, 3.4rem); font-weight: 500; line-height: 1.1; letter-spacing: -.045em; text-wrap: balance; }
h2 { color: #234b33; font-size: 1.1rem; font-weight: 600; letter-spacing: -.025em; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; padding: .9rem 1.25rem; border: 1px solid transparent; border-radius: .75rem; font-size: .95rem; font-weight: 600; min-height: 48px; }
.primary { background: var(--staff-green); color: #fff; border-color: var(--staff-green); }
.primary:hover:not(:disabled) { background: #103c25; }
.secondary { background: #f7faf6; color: #315638; border-color: var(--staff-border); }
.secondary:hover:not(:disabled) { background: #f0f7ed; }
.small { font-size: .85rem; min-height: 42px; }
.text-link, .inline-button { color: #316a43; font-size: .875rem; background: none; border: 0; padding: .3rem 0; font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.home-view { text-align: center; padding: clamp(3rem, 6vw, 6rem) 1.5rem 5rem; background: radial-gradient(ellipse at 50% 0%, #e8f0e6, transparent 68%), #fff; }
.home-view h1 { font-size: clamp(2.6rem, 5vw, 4.6rem); }
.home-view em { font-style: normal; color: #60834b; }
.home-description { max-width: 36rem; margin: 1.5rem auto 2.5rem; line-height: 1.85; color: var(--staff-muted); font-size: 1.0625rem; }
.entry-options { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: 780px; margin-inline: auto; }
.entry-card { text-align: left; display: grid; justify-items: start; gap: 1rem; background: #fff; border: 1px solid #d9e5db; padding: 2rem; border-radius: 1.25rem; box-shadow: 0 10px 35px rgb(15 61 45 / .04); transition: border-color .2s ease, box-shadow .2s ease; }
.entry-card:hover { border-color: #80a384; box-shadow: 0 10px 35px rgb(15 61 45 / .08); }
.entry-icon { font-size: 30px; color: #447453; }
.entry-card h2 { font-size: 1.35rem; }
.entry-card p { color: var(--staff-muted); font-size: .95rem; line-height: 1.75; }
.entry-link { display: flex; justify-content: space-between; align-items: center; gap: 1.25rem; color: var(--staff-green); border-top: 1px solid #e4ece3; padding-top: 1rem; width: 100%; font-size: .875rem; font-weight: 600; margin-top: .5rem; }
.representative-card { background: #f4f7ef; }
.demo-help { color: #7c8a78; font-size: .75rem; line-height: 1.8; margin: 1.5rem auto 0; max-width: 38rem; }
.demo-help strong { font-weight: 500; }
.demo-help .inline-button { font-size: inherit; }
.page-container { max-width: 1280px; padding: 3rem 3rem 5rem; margin-inline: auto; }
.page-heading { display: flex; justify-content: space-between; align-items: center; gap: 2rem; margin-bottom: 2rem; }
.page-heading .eyebrow { margin-bottom: .75rem; }
.page-heading p { margin-top: 1rem; color: var(--staff-muted); font-size: 1.0625rem; line-height: 1.75; }
.order-purchased { border: 1px solid var(--staff-border); padding: 1.5rem; border-radius: 1rem; margin-bottom: 1.5rem; background: #f7faf6; }
.order-purchased-heading { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; }
.order-purchased-heading > .material-symbols-outlined { color: #60834b; font-size: 22px; }
.marketplace-badge, .count-badge { background: #e3efda; color: #466339; font-size: .7rem; border-radius: 999px; padding: .3rem .6rem; font-weight: 500; }
.locked-specs { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; gap: 1rem; padding: 1.25rem 0; margin: 0; }
.locked-specs dt { color: #7a8a77; font-size: .75rem; margin-bottom: .4rem; }
.locked-specs dd { margin: 0; color: #2f4a35; font-size: .95rem; font-weight: 500; }
.locked-note { display: flex; align-items: center; gap: .45rem; border-top: 1px solid #dfe8da; padding-top: .85rem; color: #74816f; font-size: .75rem; line-height: 1.6; }
.locked-note .material-symbols-outlined { font-size: 15px; flex-shrink: 0; }
.editor-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 1.5rem; align-items: start; }
.preview-panel { position: sticky; top: 1.5rem; padding: 1.25rem; border: 1px solid var(--staff-border); border-radius: 1.25rem; background: #f7faf6; overflow: hidden; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.preview-label { color: #8a9984; font-size: .7rem; }
.bag-scene { position: relative; width: 100%; margin-block: .75rem; }
.bag-image { display: block; width: 100%; height: auto; border-radius: .85rem; }
.bag-print { position: absolute; top: 38%; left: 34%; width: 32%; height: 40%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .5rem; text-align: center; overflow: hidden; }
.bag-print.paper-print { top: 38%; left: 38%; width: 30%; }
.logo-placeholder { display: flex; flex-direction: column; gap: .25rem; align-items: center; }
.logo-placeholder .material-symbols-outlined { font-size: 32px; }
.logo-placeholder strong { font-size: .75rem; font-weight: 500; letter-spacing: .04em; }
.logo-preview { display: block; object-fit: contain; max-height: 75px; max-width: 100%; }
.preview-note { font-size: .75rem; color: var(--staff-muted); line-height: 1.75; }
.editor-controls { display: grid; gap: 1rem; }
.control-panel { border: 1px solid var(--staff-border); border-radius: 1rem; padding: 1.5rem; background: #fff; display: grid; gap: 1rem; }
.control-panel > p { color: var(--staff-muted); font-size: .875rem; line-height: 1.75; }
.upload-area { position: relative; display: flex; flex-direction: column; align-items: center; gap: .65rem; text-align: center; padding: 1.5rem 1rem; border: 1px dashed var(--staff-border); border-radius: .85rem; background: #f0f7ed; cursor: pointer; }
.upload-area:focus-within { outline: 3px solid #79b895; outline-offset: 3px; }
.upload-area > .material-symbols-outlined { color: #60834b; font-size: 30px; }
.upload-area > strong { font-size: .9rem; color: #315638; }
.upload-area > span:last-of-type { font-size: .7rem; color: var(--staff-muted); }
.upload-area input { position: absolute; opacity: 0; width: 1px; height: 1px; }
#logoFileStatus { overflow-wrap: anywhere; }
.remove-button, .personalization-remove { color: #a83737; border: 0; background: transparent; padding: .35rem 0; font-size: .8rem; justify-self: end; }
.personalization-fields { display: grid; gap: 1rem; }
.personalization-row { display: grid; gap: .75rem; padding: 1rem; border: 1px solid #dbe5dd; border-radius: .75rem; background: #f6f9f7; }
.personalization-item-title { font-size: .9rem; font-weight: 600; padding-bottom: .6rem; border-bottom: 1px solid var(--staff-border); }
.personalization-field-label { display: grid; gap: .4rem; color: var(--staff-muted); font-size: .8rem; }
.personalization-row input, .personalization-row select, .access-dialog input { border: 1px solid var(--staff-border); border-radius: .5rem; background: #fff; padding: .7rem .75rem; width: 100%; min-width: 0; color: #315638; font-size: .9rem; }
.print-alignment { margin: 0; padding: .75rem 0 0; display: flex; gap: .85rem; flex-wrap: wrap; border: 0; border-top: 1px solid var(--staff-border); }
.print-alignment legend { font-size: .8rem; color: var(--staff-muted); font-weight: 500; padding: 0 .35rem 0 0; }
.print-alignment label { display: inline-flex; align-items: center; gap: .25rem; font-size: .8rem; color: var(--staff-muted); }
input[type=radio], input[type=checkbox] { accent-color: var(--staff-green); }
.print-contact-lines { width: 100%; display: flex; flex-direction: column; gap: .25rem; font-size: clamp(7px, .8vw, 10px); line-height: 1.3; }
.contact-preview-line { display: flex; align-items: center; gap: .25rem; max-width: 100%; }
.contact-preview-line > span:last-child { overflow-wrap: anywhere; min-width: 0; }
.contact-preview-icon { display: flex; width: 11px; height: 11px; flex-shrink: 0; }
.contact-preview-icon svg { width: 100%; height: 100%; }
#printContactLines[data-alignment=left] { align-items: flex-start; text-align: left; }
#printContactLines[data-alignment=center] { align-items: center; text-align: center; }
#printContactLines[data-alignment=right] { align-items: flex-end; text-align: right; }
.finish-panel { background: #ffffff; border: 1px solid var(--staff-border); border-radius: 1rem; padding: 1.5rem; display: grid; gap: 1rem; }
.confirmation { display: flex; align-items: flex-start; gap: .65rem; color: var(--staff-muted); font-size: .875rem; line-height: 1.65; }
.confirmation input { margin-top: .3rem; }
.finish-note { text-align: center; font-size: .75rem; line-height: 1.7; color: var(--staff-muted); }
[role=status] { font-size: .85rem; line-height: 1.7; color: #637958; }
#finishStatus:not(:empty), #orderAccessStatus:not(:empty), #representativeAccessStatus:not(:empty) { padding: .65rem .8rem; border-radius: .5rem; background: #f4ede2; color: #875d28; }
.state-view { min-height: 55vh; max-width: 42rem; margin-inline: auto; padding: 5rem 1.5rem; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1.25rem; }
.state-view > p { color: var(--staff-muted); font-size: 1rem; line-height: 1.8; }
.state-view .eyebrow { margin-bottom: 0; }
.state-icon { font-size: 42px; color: #9c854f; }
.success-symbol { font-size: 52px; color: #60834b; }
.loader { width: 32px; height: 32px; border: 2px solid #dce9d5; border-top-color: #60834b; border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.list-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-top: 1px solid #dce7df; padding-block: 1.25rem; }
.orders-list { display: grid; gap: .75rem; }
.representative-order { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 1rem; padding: 1.25rem; border: 1px solid #dce7df; border-radius: .85rem; align-items: center; }
.representative-order > img { border-radius: .5rem; width: 72px; height: 72px; object-fit: cover; }
.representative-order strong { font-size: 1rem; font-weight: 600; }
.representative-order p { font-size: .875rem; color: #6d8064; line-height: 1.7; margin-top: .3rem; }
.order-date { display: inline-block; font-size: .75rem; color: #8a9783; margin-top: .4rem; }
.representative-order-actions { display: grid; justify-items: end; gap: .5rem; }
.order-status { border-radius: 999px; padding: .3rem .65rem; font-size: .7rem; background: #edf2e8; color: #6d8061; }
.status-available { background: #e3f2df; color: #416b34; }
.status-expired { background: #f6ede0; color: #886537; }
.access-dialog { padding: 1.75rem; border: 1px solid #d9e4d7; border-radius: 1.25rem; width: min(450px, calc(100% - 2rem)); color: #315638; background: #fff; box-shadow: 0 25px 100px rgb(0 0 0 / .15); }
.access-dialog::backdrop { background: rgb(9 34 21 / .5); backdrop-filter: blur(5px); }
.access-dialog form { display: grid; gap: 1rem; }
.dialog-heading { display: flex; gap: .75rem; align-items: center; justify-content: space-between; }
.dialog-heading h2 { font-size: 1.35rem; }
.dialog-close { width: 32px; height: 32px; border: 1px solid #dce7df; border-radius: 50%; background: #f6faf4; color: #6a8060; font-size: 1.3rem; padding: 0; }
.access-dialog form > p { font-size: .9rem; line-height: 1.75; color: #7a8c70; }
.access-dialog label { font-size: .8rem; font-weight: 600; }
@media (max-width: 1023px) { .editor-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .locked-specs { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .site-header { padding: 1.25rem; } .site-header img { width: 150px; } .demo-badge { font-size: .6rem; padding: .3rem .5rem; } .entry-options { grid-template-columns: 1fr; } .entry-card { padding: 1.5rem; } .page-container { padding: 2rem 1.25rem 3.5rem; } .page-heading { align-items: flex-start; flex-direction: column; gap: 1rem; } .editor-layout { grid-template-columns: 1fr; } .preview-panel { position: static; } .bag-scene { max-width: 390px; margin-inline: auto; } .print-contact-lines { font-size: 10px; } .representative-order { grid-template-columns: 60px minmax(0, 1fr); padding: 1rem; } .representative-order > img { width: 60px; height: 60px; } .representative-order-actions { grid-column: 2; justify-items: start; } .state-view { padding-top: 3rem; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }

.delivery-address-panel { padding: 1.5rem; margin-bottom: 1.75rem; border: 1px solid var(--staff-border); border-radius: 1rem; background: #f7faf6; }
.delivery-address-heading { display: flex; align-items: center; gap: .65rem; margin-bottom: 1rem; }
.delivery-address-heading > span { color: #60834b; font-size: 23px; }
.delivery-address-details { display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; }
.delivery-address-details address { display: grid; gap: .3rem; font-style: normal; font-size: .9375rem; color: var(--staff-muted); overflow-wrap: anywhere; }
.delivery-address-details address strong { color: #315638; font-weight: 500; }
#deliveryAddressFeedback:not(:empty) { margin-top: 1rem; }
.address-dialog { width: min(600px, calc(100% - 2rem)); max-height: 90dvh; overflow-y: auto; }
.address-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.address-field { display: grid; gap: .45rem; }
.address-street { grid-column: 1 / -1; }
.address-state input { text-transform: uppercase; }
@media (max-width: 639px) { .delivery-address-details { flex-direction: column; align-items: flex-start; } .delivery-address-panel { padding: 1.25rem; } .address-form-grid { grid-template-columns: 1fr; } }

/* Cor da impressão */
.ink-color-options { display: flex; flex-wrap: wrap; gap: .7rem; padding: 0; margin: 1.25rem 0 0; border: 0; }
.ink-color-option { position: relative; display: flex; align-items: center; gap: .55rem; padding: .7rem .85rem; border: 1px solid #dce6dd; border-radius: .65rem; background: #fff; color: #52684d; cursor: pointer; font-size: .9rem; }
.ink-color-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ink-swatch { display: block; width: 22px; height: 22px; border: 1px solid rgb(0 0 0 / .15); border-radius: 50%; flex-shrink: 0; }
.ink-color-option:has(input:checked) { border-color: var(--staff-green); background: #f2f7ee; color: var(--staff-green); box-shadow: 0 0 0 1px var(--staff-green); }
.ink-color-option:has(input:focus-visible) { outline: 3px solid #86b59a; outline-offset: 3px; }
.ink-color-option:hover { border-color: #60834b; }
.ink-selection { color: #60834b; font-size: .85rem; margin-top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* A prévia mantém a proporção e a transparência dos pixels originais. */
.logo-preview { display: block; width: auto; height: auto; max-width: 100%; max-height: 75px; object-fit: contain; flex-shrink: 1; }

.logo-upload-choice { margin-top: 1.1rem; padding: 1.4rem 1.25rem; }
#editorView .logo-upload-choice { background: #fafcf9; border-color: #cddacf; }
#editorView .logo-upload-choice strong { color: var(--staff-green); font-size: 1rem; }
#editorView .logo-upload-choice > .material-symbols-outlined { color: #60834b; }
.logo-upload-choice > span:last-of-type { font-size: .85rem; line-height: 1.7; max-width: 28rem; }


.logo-guidance { display: flex; align-items: flex-start; gap: .7rem; margin-top: 1rem; padding: 1rem; background: #f5f8f1; border-radius: .75rem; }
.logo-guidance > .material-symbols-outlined { color: #60834b; font-size: 23px; flex-shrink: 0; }
.logo-guidance p { color: #71816f; font-size: .85rem; line-height: 1.8; }
.logo-guidance strong { display: block; color: #315638; font-weight: 500; margin-bottom: .25rem; }

/* Atalho da prévia durante a personalização no celular. */
.mobile-preview-button { display: none; }
#orderPreview { scroll-margin-top: 1rem; }
#previewTitle:focus { outline: none; }
@media (max-width: 767px) {
  .mobile-preview-button { position: fixed; z-index: 30; left: 50%; right: auto; top: calc(.75rem + env(safe-area-inset-top, 0px)); bottom: auto; transform: translateX(-50%); width: max-content; display: flex; align-items: center; gap: .75rem; padding: .5rem .85rem .5rem .5rem; max-width: calc(100vw - 2rem); border: 1px solid #cadbc5; border-radius: 1rem; background: #fff; color: var(--staff-green); box-shadow: 0 6px 28px rgb(23 62 45 / .18); text-align: left; }
  .mobile-preview-thumbnail { display: block; width: 64px; height: 64px; flex-shrink: 0; overflow: hidden; border-radius: .6rem; background: #f5f8f1; pointer-events: none; }
  .mobile-preview-copy { display: grid; gap: .2rem; }
  .mobile-preview-copy small { font-size: .7rem; color: #71816f; }
  .mobile-preview-copy strong { font-size: .85rem; font-weight: 600; }
  .mobile-preview-button > .material-symbols-outlined { font-size: 20px; }
}

.representative-order-code { display: block; color: #71816f; font-size: .75rem; overflow-wrap: anywhere; margin-top: .3rem; }
.identification-help { font-size: .85rem; line-height: 1.7; color: #71816f; }
.representative-order > div { min-width: 0; }
.representative-order > div > strong { overflow-wrap: anywhere; }
.representative-order-actions .text-link { background: none; border: 0; padding: .25rem 0; text-align: right; }

.representative-order-identity { display: flex; align-items: center; gap: .4rem; }
.representative-order-identity > strong { overflow-wrap: anywhere; min-width: 0; }
.edit-order-identification { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; padding: 0; background: transparent; border: 0; border-radius: .5rem; color: #60834b; cursor: pointer; }
.edit-order-identification:hover { background: #eef5e8; color: var(--staff-green); }
.edit-order-identification .material-symbols-outlined { font-size: 18px; }
@media (pointer: coarse) { .edit-order-identification { width: 44px; height: 44px; } }

.orders-pagination { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; }
.pagination-info { color: #71816f; font-size: .8rem; text-align: center; }
.orders-empty { color: #71816f; font-size: .9rem; line-height: 1.7; margin: 0 0 1.25rem; }
.orders-empty { padding: 1.5rem; border: 1px dashed #dce7df; border-radius: .75rem; text-align: center; }
.status-completed { color: #315638; background: #e9f4e5; }
#activeOrdersInfo { scroll-margin-top: 1rem; }
#activeOrdersInfo:focus { outline: none; }
@media(max-width: 479px) { .orders-pagination { gap: .5rem; flex-wrap: wrap; } .pagination-info { order: -1; flex-basis: 100%; } }

.active-orders-info { color: #60834b; font-size: .85rem; margin-bottom: 1rem; }

.list-toolbar .active-orders-info { margin-bottom: 0; }

.delivery-address-form{border:1px solid #d8e4dc;border-radius:14px;padding:18px;margin:8px 0;min-width:0;background:#fbfdfb}.delivery-address-form legend{padding:0 7px;color:#205e38;font-size:1rem;font-weight:650}.delivery-address-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.delivery-field{display:grid;gap:6px;min-width:0;font-size:.85rem;font-weight:600;color:#40594a}.delivery-field-recipient,.delivery-field-street,.delivery-field-reference{grid-column:1/-1}.delivery-field input,.delivery-field select{width:100%;min-width:0;font:inherit;font-size:.95rem;color:#294333;background-color:#fff;border:1px solid #c1d3c3;border-radius:10px;padding:11px 12px}.delivery-field select{appearance:none;-webkit-appearance:none;padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='m4 6 4 4 4-4' stroke='%2353645c' stroke-width='1.7' stroke-linecap='round'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat}.delivery-field-postalCode{grid-template-columns:minmax(0,1fr) auto;align-items:end}.delivery-field-postalCode>span{grid-column:1/-1}.delivery-cep-button{min-height:42px;white-space:nowrap;font-size:.8rem;border:1px solid #c8dacd;border-radius:9px;color:#23623b;background:#edf6ef;padding:8px 10px;cursor:pointer}.delivery-without-number{display:flex;align-items:center;gap:8px;font-size:.82rem;color:#4e6c59;grid-column:1/-1}.delivery-without-number input{width:18px;height:18px;accent-color:#14683f;flex-shrink:0}.delivery-address-status{font-size:.82rem;color:#687d6e;line-height:1.6;margin:10px 0}.delivery-address-status:empty{display:none}.delivery-legacy-notice{padding:12px;margin:0 0 14px;font-size:.82rem;line-height:1.6;border:1px solid #edd8af;border-radius:9px;color:#896521;background:#fff8e8;overflow-wrap:anywhere}.delivery-address-form>.remove-link{margin-top:10px}.delivery-address-form input:focus-visible,.delivery-address-form select:focus-visible{outline:3px solid #a5ce83;outline-offset:2px}.delivery-address-form input:disabled,.delivery-address-form select:disabled{opacity:.6}@media(max-width:600px){.delivery-address-form{padding:14px 12px}.delivery-address-fields{grid-template-columns:minmax(0,1fr);gap:12px}.delivery-field input,.delivery-field select{font-size:16px;min-height:44px}.delivery-cep-button{min-height:44px}.delivery-field-postalCode{grid-template-columns:minmax(0,1fr) auto}}

.structured-address-text,#representativeDeliveryAddress{white-space:pre-line;font-style:normal;line-height:1.7}

.order-item-switch { display: grid; gap: 10px; padding: 20px 0; }
.order-item-switch label { font-weight: 600; color: #173e2d; }
.order-item-switch select { width: 100%; min-width: 0; min-height: 54px; padding: 12px 44px 12px 16px; border: 1px solid #dce5df; border-radius: 12px; background-color: #fff; color: #173e2d; font: inherit; }
.order-item-switch p { margin: 0; color: #65746a; font-size: .9rem; }
.ink-color-option.is-unavailable { opacity: .45; cursor: not-allowed; }
.representative-order > div { min-width: 0; }
.representative-order p { overflow-wrap: anywhere; }
