/* The chemical list uses the shared report archive page heading. */
[data-web-chemicals="true"] .web-chemicals { width: 100%; padding-bottom: 40px; font-family: Inter, system-ui, sans-serif; }
[data-web-chemicals="true"] .web-chemicals * { box-sizing: border-box; min-width: 0; }
[data-web-chemicals="true"] .web-chemicals button { cursor: pointer; }
[data-web-chemicals="true"] .web-chemicals button:disabled { cursor: default; opacity: .6; }
[data-web-chemicals="true"] .web-chemicals :is(button, input, select):focus-visible { outline: 3px solid #4a9be9; outline-offset: 2px; }

[data-web-chemicals="true"] .web-chemicals-grid { display: grid; grid-template-columns: minmax(0, 31fr) minmax(0, 69fr); gap: 18px; align-items: stretch; }
[data-web-chemicals="true"] .web-chemicals-panel { padding: 19px; border: 1px solid #d4e5f2; border-radius: 9px; background: #fff; box-shadow: 0 2px 6px #20456808; }
[data-web-chemicals="true"] .web-chemicals-panel-heading { display: flex; align-items: center; gap: 15px; min-height: 50px; margin-bottom: 17px; }
[data-web-chemicals="true"] .web-chemicals-panel-icon, [data-web-chemicals="true"] .web-chemicals-row-icon { display: grid; place-items: center; flex: none; background: #e6f3ff; color: #1672d8; }
[data-web-chemicals="true"] .web-chemicals-panel-icon { width: 48px; height: 48px; border-radius: 12px; font-size: 20px; }
[data-web-chemicals="true"] .web-chemicals-panel-heading h2 { margin: 0; color: #142b4b; font-size: 19px; font-weight: 750; line-height: 1.2; }
[data-web-chemicals="true"] .web-chemicals-panel-heading p { margin: 4px 0 0; color: #71839f; font-size: 12px; line-height: 1.35; }
[data-web-chemicals="true"] .web-chemicals-count { flex: none; margin-left: auto; padding: 7px 12px; border-radius: 9px; background: #e9f3ff; color: #3b5d86; font-size: 11px; font-weight: 650; white-space: nowrap; }

[data-web-chemicals="true"] .web-chemicals-form { display: flex; flex-direction: column; }
[data-web-chemicals="true"] .web-chemicals-form label { margin: 0 0 7px; color: #19375d; font-size: 12px; font-weight: 700; }
[data-web-chemicals="true"] .web-chemicals-form label:not(:first-child) { margin-top: 16px; }
[data-web-chemicals="true"] .web-chemicals-form label span { color: #ee4153; }
.app-view-shell[data-web-chemicals="true"] .web-chemical-control { width: 100%; height: 38px; padding: 0 12px; border: 1px solid #cfe0ef !important; border-radius: 7px !important; background: #fff !important; box-shadow: none !important; color: #142b4b !important; font-size: 12px; font-weight: 500; outline: none; }
.app-view-shell[data-web-chemicals="true"] .web-chemical-control::placeholder { color: #8297b2; opacity: 1; }
.app-view-shell[data-web-chemicals="true"] .web-chemical-control:focus { border-color: #4a9be9 !important; box-shadow: 0 0 0 3px #4a9be922 !important; }
[data-web-chemicals="true"] .web-chemicals-error { margin: 12px 0 0; color: #c93243; font-size: 12px; }
[data-web-chemicals="true"] .web-chemicals-submit { display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; height: 43px; margin-top: 24px; border: 1px solid #1977da; border-radius: 8px; background: #2183d9; color: #fff; font-size: 13px; font-weight: 750; box-shadow: 0 3px 8px #2183d91c; }
[data-web-chemicals="true"] .web-chemicals-submit:hover:not(:disabled) { background: #166cc5; }
[data-web-chemicals="true"] .web-chemicals-submit i { font-size: 16px; }
[data-web-chemicals="true"] .web-chemicals-cancel { align-self: center; margin-top: 12px; padding: 7px 10px; color: #50739b; font-size: 12px; font-weight: 700; }
[data-web-chemicals="true"] .web-chemicals-cancel:hover { color: #145fae; }
[data-web-chemicals="true"] .web-chemicals-permission { padding: 15px; border-radius: 7px; background: #f2f8fc; color: #52708e; font-size: 12px; }

[data-web-chemicals="true"] .web-chemicals-search { display: flex; align-items: center; gap: 10px; width: 100%; height: 38px; margin-bottom: 10px; padding: 0 12px; border: 1px solid #cfe0ef; border-radius: 7px; color: #6d8aa9; }
[data-web-chemicals="true"] .web-chemicals-search:focus-within { border-color: #4a9be9; box-shadow: 0 0 0 3px #4a9be922; }
.app-view-shell[data-web-chemicals="true"] .web-chemicals-search input { flex: 1; width: 100%; height: 100%; padding: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; outline: 0 !important; color: #142b4b; font-size: 12px; }
.app-view-shell[data-web-chemicals="true"] .web-chemicals-search input::placeholder { color: #8297b2; }
[data-web-chemicals="true"] .web-chemicals-list { display: flex; flex-direction: column; gap: 6px; }
[data-web-chemicals="true"] .web-chemicals-row { display: flex; align-items: center; gap: 13px; min-height: 52px; padding: 6px 10px; border: 1px solid #d4e5f2; border-radius: 8px; background: #fff; }
[data-web-chemicals="true"] .web-chemicals-row-icon { width: 36px; height: 36px; border-radius: 10px; font-size: 16px; }
[data-web-chemicals="true"] .web-chemicals-row-main { flex: 1; overflow: hidden; }
[data-web-chemicals="true"] .web-chemicals-row-main strong { display: block; overflow: hidden; color: #172e50; font-size: 12px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
[data-web-chemicals="true"] .web-chemicals-row-main small { display: block; overflow: hidden; margin-top: 3px; color: #71839f; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
[data-web-chemicals="true"] .web-chemicals-row-main small span { padding: 0 7px; color: #9aadc0; }
[data-web-chemicals="true"] .web-chemicals-method { flex: 0 1 150px; max-width: 150px; padding: 6px 10px; border-radius: 9px; background: #d9f2ff; color: #0874d2; font-size: 11px; line-height: 1.2; text-align: center; white-space: nowrap; }
[data-web-chemicals="true"] .web-chemicals-method.method-1, [data-web-chemicals="true"] .web-chemicals-method.method-4 { background: #daf4e9; color: #168c63; }
[data-web-chemicals="true"] .web-chemicals-method.method-2, [data-web-chemicals="true"] .web-chemicals-method.method-3 { background: #fff4d9; color: #c98506; }
[data-web-chemicals="true"] .web-chemicals-method.method-5 { background: #efe6ff; color: #814fe7; }
[data-web-chemicals="true"] .web-chemicals-method.method-other { background: #eef3f8; color: #56718e; }
[data-web-chemicals="true"] .web-chemicals-actions { display: flex; align-items: center; gap: 7px; margin-left: auto; }
[data-web-chemicals="true"] .web-chemicals-actions button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; padding: 0 13px; border-radius: 8px; font-size: 11px; font-weight: 700; white-space: nowrap; }
[data-web-chemicals="true"] .web-chemicals-edit { background: #ecf5ff; color: #0871d4; }
[data-web-chemicals="true"] .web-chemicals-edit:hover:not(:disabled) { background: #dceeff; }
[data-web-chemicals="true"] .web-chemicals-delete { background: #fff0f1; color: #ec3445; }
[data-web-chemicals="true"] .web-chemicals-delete:hover:not(:disabled) { background: #ffe0e3; }
[data-web-chemicals="true"] .web-chemicals-empty { display: grid; place-items: center; min-height: 145px; margin: 0; border: 1px dashed #cfe0ef; border-radius: 8px; color: #71839f; font-size: 12px; text-align: center; }
[data-web-chemicals="true"] .web-chemicals-loading { display: flex; flex-direction: column; gap: 6px; }
[data-web-chemicals="true"] .web-chemicals-loading span { height: 52px; border: 1px solid #e5eef6; border-radius: 8px; background: linear-gradient(100deg, #f3f8fc 0%, #e9f3fa 50%, #f3f8fc 100%); }

@media (max-width: 1120px) {
    [data-web-chemicals="true"] .web-chemicals-grid { grid-template-columns: minmax(300px, 36fr) minmax(0, 64fr); }
    [data-web-chemicals="true"] .web-chemicals-row { flex-wrap: wrap; }
    [data-web-chemicals="true"] .web-chemicals-row-main { flex-basis: calc(100% - 50px); }
    [data-web-chemicals="true"] .web-chemicals-method { margin-left: 49px; }
}
@media (max-width: 760px) {
    [data-web-chemicals="true"] .web-chemicals-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    [data-web-chemicals="true"] .web-chemicals-panel { padding: 15px; }
    [data-web-chemicals="true"] .web-chemicals-panel-heading { gap: 10px; }
    [data-web-chemicals="true"] .web-chemicals-panel-heading h2 { font-size: 17px; }
    [data-web-chemicals="true"] .web-chemicals-count { padding: 6px 8px; font-size: 10px; }
}
@media (max-width: 440px) {
    [data-web-chemicals="true"] .web-chemicals-row { gap: 8px; }
    [data-web-chemicals="true"] .web-chemicals-row-main { flex-basis: calc(100% - 44px); }
    [data-web-chemicals="true"] .web-chemicals-method { margin-left: 0; max-width: none; }
    [data-web-chemicals="true"] .web-chemicals-actions { gap: 5px; }
    [data-web-chemicals="true"] .web-chemicals-actions button { padding: 0 9px; }
}

/* The production shell and breadcrumb retain their existing positioning. */
[data-web-chemicals="true"] .web-history-heading { display:flex; align-items:center; gap:15px; margin-bottom:15px; }
[data-web-chemicals="true"] .web-history-heading-icon { display:grid; place-items:center; flex:none; width:56px; height:56px; border-radius:13px; background:#e4f1ff; color:#1466d8; font-size:24px; }
[data-web-chemicals="true"] .web-history-heading h1 { color:#142b4b; font-size:27px; font-weight:750; line-height:1.15; }
[data-web-chemicals="true"] .web-history-heading p { margin-top:4px; color:#71839f; font-size:12px; }
[data-web-chemicals="true"] .web-chemicals-form-panel{scroll-margin-top:calc(var(--production-topbar-height,64px) + 16px);}
@media(max-width:699px){[data-web-chemicals="true"] .web-history-heading h1{font-size:23px;}[data-web-chemicals="true"] .web-history-heading-icon{width:46px;height:46px;font-size:20px;}}