/* Shared overlay language. Print labels and specialised product/scanner layouts retain their geometry. */
@media screen{
:root{--surface-ink:#232b30;--surface-muted:#686b6d;--surface-line:#e2e0dc;--surface-accent:#285d70;--surface-radius:14px}
:is(body,body.design3[data-role]) dialog{font-family:'IBM Plex Sans',system-ui,sans-serif;color:var(--surface-ink);background:#fff;border:1px solid var(--surface-line);border-radius:var(--surface-radius);box-shadow:0 24px 80px #162b3a33;max-height:calc(100dvh - 32px);overscroll-behavior:contain}
:is(body,body.design3[data-role]) dialog::backdrop{background:#152d3c80;backdrop-filter:blur(3px)}
:is(body,body.design3[data-role]) dialog h2{font-size:20px;line-height:1.35;font-weight:600;letter-spacing:0;overflow-wrap:anywhere}
:is(body,body.design3[data-role]) dialog h3{font-size:16px;line-height:1.4;font-weight:600}
:is(body,body.design3[data-role]) dialog p{line-height:1.55;overflow-wrap:anywhere}
:is(body,body.design3[data-role]) dialog label{font-size:13px;line-height:1.4;font-weight:600}
:is(body,body.design3[data-role]) dialog input:not([type=checkbox]):not([type=radio]):not([type=file]),:is(body,body.design3[data-role]) dialog select,:is(body,body.design3[data-role]) dialog textarea{font-family:inherit;font-size:14px;line-height:1.4;border:1px solid #d8d6d1;border-radius:7px;background-color:#fff;color:var(--surface-ink);min-height:44px;padding:10px 12px;max-width:100%;box-sizing:border-box}
:is(body,body.design3[data-role]) dialog button{font-family:inherit;font-size:14px;line-height:1.35;font-weight:600;min-height:44px;box-sizing:border-box;border:1px solid #d8d6d1;border-radius:7px;padding:10px 14px;white-space:normal;overflow-wrap:anywhere;background:#fff;color:var(--surface-ink)}
:is(body,body.design3[data-role]) dialog button.primary{background:var(--surface-accent);border-color:var(--surface-accent);color:#fff}
:is(body,body.design3[data-role]) dialog button.danger{color:#ad3528;border-color:#e9bfb8;background:#fff8f6}
:is(body,body.design3[data-role]) dialog button:disabled{cursor:not-allowed;opacity:.5}
:is(body,body.design3[data-role]) dialog :is(button,input,select,textarea,a):focus-visible{outline:3px solid #609ab5;outline-offset:2px}
:is(body,body.design3[data-role]) dialog .dialoghead{padding:18px 22px;gap:16px;border-bottom:1px solid var(--surface-line);background:#fff;align-items:center}
:is(body,body.design3[data-role]) dialog .dialoghead h2{margin:0;flex:1;min-width:0}
:is(body,body.design3[data-role]) dialog .dialoghead>button,:is(body,body.design3[data-role]) dialog>.close{flex:none;width:44px;height:44px;padding:0;font-size:24px;line-height:1;border:1px solid var(--surface-line);background:#f7f6f3;border-radius:8px}
:is(body,body.design3[data-role]) dialog .pad{padding:20px 22px;scrollbar-gutter:stable}
:is(body,body.design3[data-role]) dialog .formfoot{gap:10px;flex-wrap:wrap;border-top:1px solid var(--surface-line);padding-top:16px;margin-top:18px}
:is(body,body.design3[data-role]) dialog .formnote{background:#eff4f6;color:#476171;border:1px solid #dbe7ec;border-radius:8px;font-size:13px;line-height:1.5}
:is(body,body.design3[data-role]) dialog .error,:is(body,body.design3[data-role]) dialog .field-error{font-size:13px;line-height:1.5;color:#ad3528}
:is(body,body.design3[data-role]) dialog .notificationlist{display:flex;flex-direction:column;gap:12px;max-height:calc(100dvh - 150px);background:#f7f6f3}
:is(body,body.design3[data-role]) dialog .notificationitem{padding:16px;border:1px solid var(--surface-line);border-radius:10px;background:#fff;min-width:0}
:is(body,body.design3[data-role]) dialog .notificationitem.unread{border-left:4px solid var(--surface-accent);padding-left:13px;background:#f2f7f9}
:is(body,body.design3[data-role]) dialog .notificationitem>small{display:block;color:var(--surface-muted);font-size:12px;line-height:1.5;margin-bottom:8px}
:is(body,body.design3[data-role]) dialog .notificationitem p{font-size:14px;color:var(--surface-ink);margin:0}
:is(body,body.design3[data-role]) dialog .notification-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
:is(body,body.design3[data-role]) dialog .notification-actions button{margin:0}
:is(body,body.design3[data-role]) #toast{font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:14px;line-height:1.5;background:#294e60;color:#fff;border:1px solid #ffffff33;border-radius:10px;padding:14px 18px;box-shadow:0 12px 40px #162b3a33;overflow-wrap:anywhere;max-width:min(440px,calc(100vw - 32px));z-index:200}
}
@media screen and (max-width:760px){
:is(body,body.design3[data-role]) dialog:not(.design-product-dialog):not(.logout-confirm){width:calc(100vw - 24px);max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);margin:auto;box-sizing:border-box;overflow:auto}
:is(body,body.design3[data-role]) dialog .dialoghead{padding:14px 16px;gap:10px}
:is(body,body.design3[data-role]) dialog .dialoghead h2{font-size:19px}
:is(body,body.design3[data-role]) dialog .pad{padding:16px}
:is(body,body.design3[data-role]) dialog input:not([type=checkbox]):not([type=radio]),:is(body,body.design3[data-role]) dialog select,:is(body,body.design3[data-role]) dialog textarea{font-size:16px}
:is(body,body.design3[data-role]) dialog .formfoot{padding-bottom:env(safe-area-inset-bottom);gap:8px}
:is(body,body.design3[data-role]) dialog .formfoot>button{flex:1;min-width:100px}
:is(body,body.design3[data-role]) dialog .notificationlist{max-height:calc(100dvh - 120px)}
:is(body,body.design3[data-role]) dialog .notificationitem{padding:14px}
:is(body,body.design3[data-role]) dialog .notificationitem.unread{padding-left:11px}
:is(body,body.design3[data-role]) dialog .notification-actions>button{flex:1;min-width:120px}
:is(body,body.design3[data-role]) #toast{left:16px;right:16px;bottom:calc(86px + env(safe-area-inset-bottom));max-width:none}
}
@media(prefers-reduced-motion:reduce){dialog,dialog *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

@media screen{:is(body,body.design3[data-role]) dialog .two,:is(body,body.design3[data-role]) dialog .three{align-items:end}:is(body,body.design3[data-role]) dialog input:is([type=checkbox],[type=radio]){accent-color:var(--surface-accent)}}
@media screen{body:not(.design3) dialog button.add{background:#b74e28;border-color:#b74e28;color:#fff}body:not(.design3) dialog button.add:hover{background:#9d3f20}body dialog button:hover:not(:disabled):not(.primary):not(.add):not(.danger){background:#f0f3f4}}

@media screen{:is(body,body.design3[data-role]) dialog .notification-actions button.notification-read{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#278447!important;color:#fff!important;border-color:#278447!important}:is(body,body.design3[data-role]) dialog .notification-actions button.notification-read:hover:not(:disabled){background:#206f3c!important}:is(body,body.design3[data-role]) dialog .notification-read-check{color:#111;font-size:25px;font-weight:800;line-height:1}}

@media screen{
:is(body,body.design3[data-role]) dialog .dialoghead>button,:is(body,body.design3[data-role]) dialog .formfoot>button[type=button],body.design3.small-mobile #sellerSalesBack,body.design3.small-mobile #content>button:first-child[id=sellerSalesBack]{background:#b73c32!important;border-color:#b73c32!important;color:#fff!important}
:is(body,body.design3[data-role]) dialog{box-sizing:border-box;max-width:calc(100vw - 24px)!important;overflow-x:hidden!important;overscroll-behavior:contain;touch-action:pan-y pinch-zoom}
:is(body,body.design3[data-role]) dialog[open]:has(>.dialoghead){display:flex!important;flex-direction:column;overflow:hidden!important;padding:0!important}
:is(body,body.design3[data-role]) dialog>.dialoghead{position:relative!important;flex:none!important;min-width:0;z-index:2;margin:0!important}
:is(body,body.design3[data-role]) dialog>#modalform{flex:1 1 auto;min-height:0;min-width:0;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;max-height:calc(100dvh - 110px);box-sizing:border-box;width:100%}
:is(body,body.design3[data-role]) dialog :is(.two,.tradeline,.tools,label){min-width:0;max-width:100%;box-sizing:border-box}
:is(body,body.design3[data-role]) dialog :is(input,select,textarea){min-width:0!important;max-width:100%!important}
.compact-date-button{width:100%;min-width:0;text-align:left!important;font-size:13px!important}.shared-date-calendar{width:100%;min-width:0;max-width:100%}
}
@media screen{body.design3 #logoutCancel,body.design3 .ui-dismiss-button{background:#b73c32!important;border-color:#b73c32!important;color:#fff!important}}

@media screen{
body.design3 dialog#modal.quick-login-dialog{position:fixed!important;inset:50% auto auto 50%!important;transform:translate(-50%,-50%)!important;margin:0!important;width:min(440px,calc(100vw - 24px))!important;height:auto!important;min-height:0!important;max-height:calc(100dvh - 32px)!important;border-radius:14px!important;align-self:center}
body.design3 dialog#modal.quick-login-dialog>#modalform{flex:0 1 auto!important;height:auto!important;min-height:0!important;max-height:calc(100dvh - 130px)!important;padding-bottom:16px!important}
body.design3 dialog#modal.quick-login-dialog .formfoot{position:static!important;margin-bottom:0!important;padding-bottom:0!important}
}

@media screen{body.design3 button[aria-label^="Закрыть"],body.design3 .design-detail-close{background:#b73c32!important;border-color:#b73c32!important;color:#fff!important}}

@media screen{body.design3 #stopscan,body.design3 #closetestpoint{background:#b73c32!important;border-color:#b73c32!important;color:#fff!important}}
