/* A123 · compact notices, isolated from form feedback and permission dialogs.
   This early, scoped layer keeps the status colors above generic card paint. */
@layer eco-notifications {
 @media screen {
  :root {
   --eco-notice-info:#245e99;--eco-notice-success:#236b4b;--eco-notice-error:#ad3541;--eco-notice-warning:#9b531b;
   --eco-notice-width:min(320px,calc(100vw - max(12px,env(safe-area-inset-left,0px)) - max(12px,env(safe-area-inset-right,0px))));
  }
  :root:is([data-eco-vision="dark"],[data-theme="dark"]:not([data-eco-vision="light"])) {
   --eco-notice-info:#235785;--eco-notice-success:#246448;--eco-notice-error:#993442;--eco-notice-warning:#8b4a1c;
  }
  body :is(#ecoAppUpdate,#toastContainer>.toast) {
   --eco-notice-bg:var(--eco-notice-info);
   box-sizing:border-box!important;min-width:0!important;min-height:0!important;max-width:100%!important;
   margin:0!important;padding:12px 14px!important;border:1px solid rgba(255,255,255,.3)!important;border-radius:16px!important;
   background-color:var(--eco-notice-bg)!important;background-image:linear-gradient(135deg,rgba(255,255,255,.075),transparent 68%)!important;
   color:#fff!important;box-shadow:0 10px 25px rgba(16,29,47,.24),0 2px 5px rgba(16,29,47,.12),inset 0 1px rgba(255,255,255,.1)!important;
   font-family:inherit!important;font-size:13px!important;font-weight:600!important;line-height:1.4!important;
   letter-spacing:0!important;text-align:left!important;text-shadow:none!important;overflow-wrap:anywhere;
   backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important;transform:none!important;
   animation:ecoNoticeIn .24s cubic-bezier(.2,.75,.25,1) both!important;
  }
  body #ecoAppUpdate {
   position:fixed!important;right:max(12px,env(safe-area-inset-right,0px))!important;left:auto!important;top:auto!important;
   bottom:calc(94px + env(safe-area-inset-bottom,0px))!important;z-index:1200!important;
   width:var(--eco-notice-width)!important;max-width:var(--eco-notice-width)!important;display:grid!important;gap:7px!important;
  }
  body #ecoAppUpdate[hidden] {display:none!important}
  body #ecoAppUpdate #ecoAppUpdateReview[hidden] {display:none!important}
  body #ecoAppUpdate>strong {display:block!important;margin:0!important;color:#fff!important;font-size:14px!important;font-weight:700!important;line-height:1.35!important;text-shadow:none!important}
  body #ecoAppUpdate>p {margin:0!important;color:#f2f7ff!important;font-size:12.5px!important;font-weight:400!important;line-height:1.45!important}
  body #ecoAppUpdate>.toolbar {display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:7px!important;margin:3px 0 0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
  body :is(#ecoAppUpdate button,#toastContainer>.toast .toast-undo) {
   box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
   flex:0 0 auto!important;width:auto!important;min-width:0!important;min-height:36px!important;height:auto!important;margin:0!important;padding:7px 11px!important;
   border:1px solid rgba(255,255,255,.45)!important;border-radius:10px!important;background:rgba(255,255,255,.1)!important;
   color:#fff!important;box-shadow:none!important;font-family:inherit!important;font-size:12px!important;font-weight:650!important;line-height:1.3!important;
   letter-spacing:0!important;text-shadow:none!important;white-space:normal!important;transform:none!important;
   transition:background-color .16s ease,border-color .16s ease!important;
  }
  body #ecoAppUpdate #ecoAppUpdateApply {background:#f8fbff!important;color:#194b79!important;border-color:#f8fbff!important}
  body :is(#ecoAppUpdate button,#toastContainer>.toast .toast-undo):hover:not(:disabled) {background:rgba(255,255,255,.2)!important;border-color:rgba(255,255,255,.7)!important}
  body #ecoAppUpdate #ecoAppUpdateApply:hover:not(:disabled) {background:#e7f0fa!important}
  body :is(#ecoAppUpdate button,#toastContainer>.toast .toast-undo):focus-visible {outline:3px solid #fff!important;outline-offset:3px!important}
  body #ecoAppUpdate button:disabled {opacity:.65!important;cursor:wait!important}
  body #toastContainer {
   position:fixed!important;top:max(14px,env(safe-area-inset-top,0px))!important;right:max(12px,env(safe-area-inset-right,0px))!important;left:auto!important;bottom:auto!important;
   z-index:99999!important;display:flex!important;flex-direction:column!important;gap:8px!important;
   box-sizing:border-box!important;width:var(--eco-notice-width)!important;max-width:var(--eco-notice-width)!important;min-width:0!important;
   max-height:calc(100dvh - 28px)!important;margin:0!important;padding:0!important;pointer-events:none!important;
  }
  body #toastContainer>.toast {display:flex!important;align-items:flex-start!important;gap:9px!important;width:100%!important;pointer-events:auto!important;cursor:pointer!important}
  body #toastContainer>.toast.toast-success {--eco-notice-bg:var(--eco-notice-success)}
  body #toastContainer>.toast.toast-error {--eco-notice-bg:var(--eco-notice-error)}
  body #toastContainer>.toast.toast-warning {--eco-notice-bg:var(--eco-notice-warning)}
  body #toastContainer>.toast.toast-info {--eco-notice-bg:var(--eco-notice-info)}
  body #toastContainer>.toast .toast-icon {
   display:grid!important;place-items:center!important;flex:0 0 21px!important;width:21px!important;height:21px!important;min-width:21px!important;
   margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:rgba(255,255,255,.12)!important;
   color:#fff!important;box-shadow:none!important;filter:none!important;font-size:16px!important;line-height:1!important;
  }
  body #toastContainer>.toast .toast-icon svg {width:17px!important;height:17px!important;color:inherit!important;filter:none!important}
  body #toastContainer>.toast .toast-body {flex:1 1 auto!important;min-width:0!important;color:#fff!important;font-size:13px!important;font-weight:600!important;line-height:1.4!important}
  body #toastContainer>.toast .toast-body small {display:block!important;margin-top:3px!important;color:#f4f7fb!important;font-size:12px!important;font-weight:400!important;line-height:1.4!important;opacity:1!important}
  body #toastContainer>.toast .toast-undo {min-height:32px!important;padding:6px 9px!important}
  body #toastContainer>.toast.hiding {pointer-events:none!important;animation:ecoNoticeOut .26s ease-in forwards!important}
  @keyframes ecoNoticeIn {from{opacity:0;translate:18px 0}to{opacity:1;translate:0 0}}
  @keyframes ecoNoticeOut {from{opacity:1;translate:0 0}to{opacity:0;translate:18px 0}}
  /* Modern browsers can animate display changes while hidden stays immediate
     in the DOM. Older browsers retain the same actions and a short entrance. */
  @supports (transition-behavior:allow-discrete) {
   body #ecoAppUpdate {opacity:1!important;translate:0 0!important;animation:none!important;transition:opacity .22s ease,translate .22s cubic-bezier(.2,.75,.25,1),display .22s allow-discrete!important}
   body #ecoAppUpdate[hidden] {opacity:0!important;translate:18px 0!important}
   @starting-style {body #ecoAppUpdate:not([hidden]) {opacity:0!important;translate:18px 0!important}}
  }
  @media(max-width:600px) {
   :root {--eco-notice-width:calc(100vw - max(12px,env(safe-area-inset-left,0px)) - max(12px,env(safe-area-inset-right,0px)))}
   body :is(#ecoAppUpdate button,#toastContainer>.toast .toast-undo) {min-height:40px!important}
  }
  @media(prefers-reduced-motion:reduce) {
   body :is(#ecoAppUpdate,#toastContainer>.toast,#toastContainer>.toast.hiding) {animation:none!important;transition:none!important;translate:0 0!important}
   body #toastContainer>.toast.hiding {opacity:0!important}
  }
 }
 @media print {body :is(#ecoAppUpdate,#toastContainer) {display:none!important}}
}