
/* Chemical-Mandi R60 — site-wide static header, balanced login and notification UI */
:root{--cm-header-h:84px}
html,body{max-width:100%;overflow-x:hidden}
body{padding-top:var(--cm-header-h)!important}
body>.topbar, body>header.topbar, header.topbar{
 position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:15000!important;
 width:100%!important;min-height:var(--cm-header-h)!important;box-sizing:border-box!important;
 background:#fff!important;
}
.topbar .brand,.topbar nav,.topbar .topbar-actions{min-width:0}
.cm-r60-notify{
 position:relative;display:inline-flex;align-items:center;justify-content:center;
 width:44px;height:44px;border:1px solid #d9e2ef;border-radius:12px;background:#fff;cursor:pointer
}
.cm-r60-notify-badge{
 position:absolute;right:-5px;top:-7px;min-width:21px;height:21px;padding:0 5px;border-radius:999px;
 display:flex;align-items:center;justify-content:center;background:#c2410c;color:#fff;font-size:12px;font-weight:800
}
.cm-r60-notify-panel{
 position:fixed;z-index:16000;top:calc(var(--cm-header-h) + 8px);right:20px;
 width:min(430px,calc(100vw - 24px));max-height:min(560px,calc(100dvh - var(--cm-header-h) - 28px));
 overflow:auto;background:#fff;border:1px solid #fed7aa;border-radius:16px;box-shadow:0 22px 60px rgba(15,23,42,.2);
 padding:12px
}
.cm-r60-notify-panel[hidden]{display:none!important}
.cm-r60-notify-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 6px 10px}
.cm-r60-notification{border:1px solid #e2e8f0;border-radius:12px;padding:12px;margin:8px 0;background:#fff}
.cm-r60-notification.unread{background:#fff7ed;border-color:#fdba74}
.cm-r60-notification h4{margin:0 0 5px;color:#24364e}
.cm-r60-notification p{margin:0 0 8px;color:#64748b;font-size:.9rem}
.cm-r60-notification-actions{display:flex;gap:8px;flex-wrap:wrap}
.cm-r60-notification-actions a,.cm-r60-notification-actions button{
 border:1px solid #fb923c;border-radius:9px;padding:7px 11px;background:#fff;color:#9a3412;font-weight:700;text-decoration:none;cursor:pointer
}
.cm-r60-notification-actions .primary{background:linear-gradient(90deg,#c92f18,#ff7a18);color:#fff;border:0}

/* Login: wider, centred, all four rounded corners visible, equal panels and spacing */
body.login-page, body:has(.login-shell){padding-top:var(--cm-header-h)!important}
.login-shell{
 width:min(1460px,calc(100vw - 48px))!important;
 max-width:none!important;margin:28px auto!important;
 border-radius:28px!important;overflow:hidden!important;
 padding:24px!important;box-sizing:border-box!important;
 display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
 gap:24px!important;align-items:stretch!important;
}
.login-shell>*{min-width:0!important;height:100%!important;box-sizing:border-box!important;border-radius:22px!important}
.login-visual,.login-panel,.login-card,.login-form-panel{
 width:100%!important;max-width:none!important;min-width:0!important;height:100%!important;
 border-radius:22px!important;box-sizing:border-box!important
}

/* R60 RFQ ID blank before commit */
#rfqTitle:disabled,#rfqTitle[readonly]{color:#476b9b}
@media(max-width:900px){
 :root{--cm-header-h:74px}
 .login-shell{grid-template-columns:1fr!important;width:min(760px,calc(100vw - 24px))!important;padding:14px!important;gap:14px!important}
}

/* R61 overrides are loaded after this file in HTML. */

/* R456: View acknowledges; Close only dismisses */
.cm-r60-notification-actions button.primary{background:linear-gradient(90deg,#c92f18,#ff7a18);color:#fff;border:0}
.cm-r60-notification-actions button:disabled{opacity:.6;cursor:wait}
.cm-r456-error{color:#b91c1c;font-weight:700;margin:8px 4px}
