:root { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; color:#222d38; background: #fff; }
* { box-sizing: border-box; }
html,body {margin:0;padding:0; overflow-x:hidden;}
body {font-size:14px; -webkit-text-size-adjust:100%;}
.widget { padding: 9px 8px 18px; width:100%; }
.intro {font-size:12px;color:#657484; margin:0 0 14px;line-height:1.5;}
.rows { display:flex; flex-direction:column; gap:12px; }
.item { position:relative; border:1px solid #dbe2e8; border-radius:9px; padding:11px; background:#fff; }
.item-heading {display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.row-number {font-size:12px;font-weight:700;color:#4b5d6d;}
.remove {border:none;background:transparent;color:#9d3838;padding:3px 5px;font-size:12px;cursor:pointer;}
.remove:focus-visible,.suggestion:focus-visible,button:focus-visible {outline:3px solid #8bbce7;outline-offset:2px;}
.fields {display:flex; gap:8px; align-items:flex-start; width:100%;}
.product-col {flex:1 1 auto; min-width:0;position:relative;}
.qty-col {flex:0 0 76px;min-width:0;}
label {display:block;font-size:12px;font-weight:700;margin-bottom:5px;color:#3c4c59;}
input {width:100%;min-width:0;border:1px solid #b7c4cf;border-radius:6px; height:40px; padding:7px 9px; background:#fff;color:#17222b;font-size:14px;outline:none;}
input:focus {border-color:#397cba;box-shadow:0 0 0 2px rgba(57,124,186,.15);}
input::placeholder {color:#8795a2;}
.qty-input {text-align:center;padding:7px 3px; font-variant-numeric:tabular-nums;}
.suggestions {display:none;position:absolute;z-index:1000;left:0;right:0;top:65px;background:#fff;border:1px solid #b7c4cf;border-radius:7px;box-shadow:0 8px 24px rgba(25,48,70,.14);max-height:260px;overflow-y:auto;overscroll-behavior:contain;}
.suggestions.open {display:block;}
.suggestion {display:block;text-align:left;width:100%;border:0;border-bottom:1px solid #ecf0f3;background:#fff;color:#202b35;cursor:pointer;padding:9px 10px;line-height:1.4;font-size:13px;white-space:normal;overflow-wrap:anywhere;}
.suggestion:last-child {border-bottom:0;}
.suggestion:hover,.suggestion.active {background:#eaf4ff;}
.suggestion .sku {display:block;font-size:11px;color:#4e6678;font-weight:700;letter-spacing:.01em;margin-bottom:1px;}
.suggestion.custom {background:#f4f7f9;color:#254b67;font-weight:600;}
.suggestion.custom:hover,.suggestion.custom.active {background:#e4eff7;}
.more-results {padding:7px 10px; font-size:11px;color:#617183;background:#f7f9fb;}
.caption {min-height:17px;font-size:11px;color:#637481; margin:5px 0 0;}
.caption.catalog {color:#247048;}
.caption.custom {color:#756124;}
.error {display:none;color:#a32929;font-size:11px;font-weight:600;margin-top:5px;}
.error.show {display:block;}
.actions {padding-top:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.add-btn {border:1px solid #154d79;border-radius:7px;background:#fff;color:#154d79;font-weight:700;font-size:13px;padding:11px 14px;cursor:pointer;}
.add-btn:hover {background:#eef6fc;}
.summary {color:#64727c;font-size:12px;}
.status {font-size:12px;line-height:1.5;color:#556879;margin:10px 0 0;}
.status.error {color:#a32929;display:block;}
.preview-box {background:#f2f7fb;border:1px solid #d5e3ec;padding:12px;border-radius:8px;margin-top:18px;}
.preview-box summary {font-size:12px;font-weight:700;cursor:pointer;color:#235277;}
.preview-box pre {font-family:inherit;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6;font-size:12px;margin:11px 0 0;}
@media(max-width:360px){.widget{padding:6px 4px 15px}.item{padding:8px}.qty-col{flex-basis:66px}.fields{gap:5px}input{font-size:13px}}