/* Item edit modal — screen styles. Owned by ONE porting agent so screens can be built in parallel without racing on main.css. Loads AFTER main.css, so a bare class here beats a bare class there — but an ID rule in main.css still wins. Check the cascade before assuming a rule applies. Tokens, the .tip tooltip system and the chart series live in main.css and must not be redefined here. */ /* ══ EDIT ITEM — ported from design/ui/EditItem.dc.html ════════════════════ The markup inside #edit-modal .modal is generated by _edMount() in edit-modal.js (header / body / footer contents only — the three nodes stay so ui-refresh.js keeps its section-rail observers). Everything here is scoped to #edit-modal. Cascade notes, each grepped in main.css first: · .modal (0,1,0) ×2 and #edit-modal .modal.has-rail (1,2,0) — restated at (1,1,0)/(1,2,0) here; later source order wins the tie on the ID rule. · .modal-hdr paints var(--accent) (sage) and is a row flex — restated. · .modal-body .es:not(:last-child) (0,3,0) draws a rule + padding under every section; #edit-modal .modal-body .es (1,2,0) clears it. · input/select/textarea (0,0,1), :focus (0,1,1), :hover:not(:focus) (0,2,1) — every field restated at (1,2,1) so the board's 30px / #D2DAE3 / radius-8 control wins. .cb-input keeps its !important padding-right. · .field-review is !important (amber) — overridden with !important at a higher specificity: empty fields are dashed #DBE1E8 on #FBFCFD. · label.lbl (0,1,1) is bold/dark; #edit-modal label.lbl (1,1,1) wins. · .ns-ext-badge#ns-fill-badge (1,1,0) — #edit-modal #ns-fill-badge (2,0,0). · .ed-rail-item / .ed-rail (ID rule in main.css) — restated with the ID. · .cert-* (0,1,0) ×2 blocks — restated under #ed-certs. · The .tip system is main.css's; only its anchor is shifted inside the field grid (.ed-grid3) so bubbles start at the label, not centred on it, which keeps first-column bubbles inside the scroll box. · #3D4854 and #6E7F5C are used as ink/accent here, never as chart values. */ /* ── Frame: 1272 × 820 board, grid = [rail | body], rows = hdr / body / foot ── */ #edit-modal .modal{width:1272px;max-width:100%;height:min(840px,94vh);max-height:94vh;border-radius:18px;border:none;background:#fff; box-shadow:0 26px 64px rgba(18,24,30,.30),0 2px 10px rgba(18,24,30,.18);overflow:hidden;display:flex;flex-direction:column;} #edit-modal .modal.has-rail{display:grid;grid-template-columns:174px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;width:1272px;} #edit-modal .modal.has-rail .modal-hdr{grid-column:1/-1;grid-row:1;} #edit-modal .modal.has-rail .modal-footer{grid-column:1/-1;grid-row:3;} #edit-modal .modal.has-rail .modal-body{grid-row:2;grid-column:2;} #edit-modal [hidden]{display:none!important;} #edit-modal .ed-vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;} #edit-modal .ed-hide{display:none!important;} #edit-modal .ed-sp{flex:1;min-width:0;} /* ── Header: row A identity, row B worksection + where/who/what ── */ #edit-modal .modal-hdr{position:relative;z-index:5;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:10px; padding:12px 22px 11px;background:#fff;border-bottom:1px solid #E8EDF2;flex-shrink:0;} #edit-modal .ed-hdr-a{display:flex;align-items:flex-end;gap:16px;min-height:44px;} #edit-modal .ed-hdr-b{display:flex;align-items:center;gap:12px;min-height:30px;flex-wrap:wrap;} #edit-modal .ed-idwrap{width:104px;flex-shrink:0;} #edit-modal .ed-idwrap .lbl{margin-bottom:3px;} #edit-modal #ed-id{font-family:var(--font-mono);font-size:12.5px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;} #edit-modal #ed-id-warn{font-size:10.5px;color:#7A4245;font-weight:500;margin-top:4px;white-space:nowrap;} #edit-modal .ed-product-wrap{flex:1;min-width:160px;display:flex;} #edit-modal .modal #ed-product{height:32px;padding:0 7px;margin-left:-7px;border:1px solid transparent;border-radius:8px;background:transparent; font-family:var(--font-display);font-size:20px;font-weight:400;letter-spacing:-.4px;color:#2A323A;box-shadow:none;} #edit-modal .modal #ed-product:hover{background:#F7F7F7;border-color:transparent;} #edit-modal .modal #ed-product:focus{background:#fff;border-color:#D2DAE3;box-shadow:0 0 0 3px rgba(42,50,58,.06);} #edit-modal .modal #ed-product::placeholder{color:#A8AEB6;font-family:var(--font-display);} #edit-modal .ed-seg{display:inline-flex;align-items:center;background:#F1EDE6;border-radius:9999px;padding:3px;height:30px;box-sizing:border-box;flex-shrink:0;position:relative;} #edit-modal .ed-seg-b{height:24px;border:none;background:transparent;border-radius:9999px;padding:0 13px;font-family:var(--font);font-size:12px;font-weight:500;color:#6B7480;cursor:pointer;white-space:nowrap;line-height:24px;} #edit-modal .ed-seg-b.on{background:#fff;font-weight:600;color:#2A323A;box-shadow:0 1px 2px rgba(0,0,0,.08);} #edit-modal .ed-seg-b:focus-visible{outline:2px solid #2A323A;outline-offset:1px;} #edit-modal .ed-st-wrap{position:relative;display:inline-flex;flex-shrink:0;} #edit-modal .ed-st-wrap::after{content:'▼';position:absolute;right:11px;top:50%;transform:translateY(-50%);font-size:8px;opacity:.6;pointer-events:none;} #edit-modal .modal .ed-st-wrap select{appearance:none;-webkit-appearance:none;height:30px;width:auto;border:none;border-radius:9999px;padding:0 26px 0 12px; font-size:12px;font-weight:600;cursor:pointer;background:#EFEFF1;color:#5A6169;box-shadow:none;transition:none;} #edit-modal .modal .ed-st-wrap select:focus{box-shadow:0 0 0 3px rgba(42,50,58,.08);} #edit-modal .ed-st-wrap[data-st="not-started"] select{background:#FDE7E7;color:#8A1C1C;} #edit-modal .ed-st-wrap[data-st="drafted"] select{background:#FFF4D6;color:#7A4A00;} #edit-modal .ed-st-wrap[data-st="reviewed"] select{background:#E8F0FE;color:#0D3B8A;} #edit-modal .ed-st-wrap[data-st="approved"] select{background:#DFF5E1;color:#1B5E20;} #edit-modal .ed-st-wrap[data-st="issued"] select{background:#D4E7FB;color:#0B2A66;} #edit-modal .ed-st-wrap[data-st="on-hold"] select{background:#EFEFF1;color:#5A6169;} #edit-modal .modal-close{width:30px;height:30px;flex-shrink:0;border:none;background:#F7F7F7;border-radius:8px;font-size:15px;line-height:1;color:#6B7480;opacity:1; display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .12s;} #edit-modal .modal-close:hover{background:#EFEFF1;color:#2A323A;opacity:1;} #edit-modal .ed-vr{width:1px;height:20px;background:#E8EDF2;flex-shrink:0;} #edit-modal .ed-hdr-b .lbl{margin:0;} #edit-modal .modal .ed-inp-m{width:170px;flex:0 1 170px;min-width:110px;} /* Worksection picker button + popover */ #edit-modal .ed-ws{position:static;} #edit-modal .ed-ws-btn{height:30px;max-width:400px;display:inline-flex;align-items:center;gap:9px;background:#fff;border:none;border-radius:9px;padding:0 12px; font-family:var(--font);font-size:12.5px;font-weight:500;color:#2A323A;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.07);transition:box-shadow .12s;} #edit-modal .ed-ws-btn:hover{box-shadow:0 2px 5px rgba(0,0,0,.13),0 0 0 1px rgba(0,0,0,.11);} #edit-modal .ed-ws-btn[disabled]{opacity:.55;cursor:default;box-shadow:0 0 0 1px rgba(0,0,0,.06);} #edit-modal .ed-ws-btn.ed-ws-empty .ed-ws-title,#edit-modal .ed-ws-btn[disabled] .ed-ws-title{color:#6B7480;font-weight:500;} #edit-modal .ed-ws-btn.ed-ws-unknown{box-shadow:0 1px 2px rgba(0,0,0,.1),0 0 0 1px #D9A0A2;} #edit-modal .ed-ws-btn.ed-ws-unknown .ed-ws-title{color:#7A4245;} #edit-modal .ed-ws-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;} #edit-modal .ed-caret{font-size:8px;opacity:.45;flex-shrink:0;} #edit-modal .ws-chip{font-family:var(--font-mono);font-size:11px;color:#2A323A;background:#F7F7F7;border:1px solid #E8EDF2;border-radius:6px;padding:1px 8px;line-height:16px;white-space:nowrap;flex-shrink:0;} #edit-modal .ed-ws-pop{display:none;position:absolute;left:22px;top:calc(100% - 4px);width:460px;max-width:calc(100% - 44px);background:#fff;border:1px solid #D2DAE3;border-radius:14px; box-shadow:0 12px 34px rgba(18,24,30,.18);padding:12px;z-index:30;} #edit-modal .ed-ws-pop.open{display:block;} #edit-modal .ed-ws-top{display:flex;align-items:center;gap:10px;margin-bottom:6px;} #edit-modal .modal #ed-ws-search{flex:1;min-width:0;height:32px;} #edit-modal .ed-ws-top .lbl{margin:0;flex-shrink:0;} #edit-modal .modal #ed-nscode{width:78px;flex-shrink:0;font-family:var(--font-mono);font-size:12.5px;letter-spacing:.04em;text-align:center;} #edit-modal #ed-nscode-warn{font-size:10.5px;color:#7A4245;font-weight:500;margin:2px 0 6px;line-height:1.4;} #edit-modal .ed-ws-list{max-height:min(360px,46vh);overflow-y:auto;margin:4px -4px 0;padding:0 4px;} #edit-modal .ed-ws-g{font-family:var(--font-mono);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:#6B7480;padding:8px 8px 4px;} #edit-modal .ed-ws-row{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;font-size:12.5px;color:#2A323A;cursor:pointer;} #edit-modal .ed-ws-row:hover{background:#F7F7F7;} #edit-modal .ed-ws-row.on{font-weight:600;background:#F1EDE6;} #edit-modal .ed-ws-c{font-family:var(--font-mono);font-size:11px;color:#6B7480;flex-shrink:0;} #edit-modal .ed-ws-row.on .ed-ws-c{color:#2A323A;} #edit-modal .ed-ws-t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} #edit-modal .ed-ws-n{font-family:var(--font-mono);font-size:10px;color:#9BA3AC;flex-shrink:0;} #edit-modal .ed-ws-ok{color:#6E7F5C;font-size:12px;flex-shrink:0;} #edit-modal .ed-ws-none{font-size:12px;color:#6B7480;padding:10px 8px;} /* ── Rail (built by ui-refresh.js; styled here) ── */ #edit-modal .modal.has-rail .ed-rail{grid-row:2;grid-column:1;border-right:none;background:#fff;padding:20px 0 20px 22px;display:flex;flex-direction:column;gap:4px;overflow-y:auto;} #edit-modal .ed-rail::before{content:'Sections';font-family:var(--font-mono);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:#9BA3AC;padding:0 6px;margin-bottom:6px;line-height:12px;} #edit-modal .ed-rail-item{position:relative;flex-shrink:0;height:36px;line-height:34px;padding:0 10px 0 22px;border:1px solid transparent;border-radius:9px; font-family:var(--font);font-size:12.5px;font-weight:500;color:#2A323A;background:none;text-align:left;cursor:pointer;} #edit-modal .ed-rail-item:hover{color:#2A323A;background:#F7F7F7;} #edit-modal .ed-rail-item.active{background:#fff;border-color:#D2DAE3;box-shadow:0 1px 2px rgba(0,0,0,.06);font-weight:600;color:#2A323A;} #edit-modal .ed-rail-item.active::before{content:'';position:absolute;left:10px;top:8px;width:3px;height:18px;border-radius:2px;background:#837D68;} /* ── Body: main column + 336px aside, one scroll box ── */ #edit-modal .modal-body{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:18px;align-items:start;align-content:start; padding:20px 22px 20px 18px;overflow-y:auto;overflow-x:hidden;background:#fff;} #edit-modal .modal:not(.has-rail) .modal-body{padding-left:22px;} #edit-modal .ed-main{min-width:0;} #edit-modal .ed-aside{min-width:0;display:flex;flex-direction:column;gap:12px;} #edit-modal .modal-body .es{margin:0;padding:0;border:none;} #edit-modal .ed-card{background:#fff;border:1px solid #E8EDF2;border-radius:14px;padding:14px;box-shadow:0 1px 3px rgba(42,50,58,.04),0 4px 14px rgba(42,50,58,.06);} #edit-modal .ed-card-main{padding:16px;} #edit-modal .ed-main .es + .es{border-top:1px solid #E8EDF2;margin-top:14px;padding-top:12px;} #edit-modal .ed-sec-row{display:flex;align-items:center;gap:9px;min-height:22px;margin-bottom:12px;} #edit-modal .es-hdr{display:inline;font-family:var(--font-display);font-size:17px;font-weight:500;letter-spacing:-.3px;text-transform:none;color:#2A323A; background:none;border:none;padding:0;margin:0;white-space:normal;overflow:visible;line-height:22px;} #edit-modal .ed-aside .es-hdr{font-size:15px;letter-spacing:-.2px;} #edit-modal .ed-main .es + .es .es-hdr{font-family:var(--font-mono);font-size:9px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:#6B7480;line-height:12px;} #edit-modal .ed-main .es + .es .ed-sec-row{margin-bottom:6px;min-height:24px;} #edit-modal .ed-sub{border-top:1px solid #E8EDF2;margin-top:14px;padding-top:12px;} #edit-modal .ed-sub-t{display:inline-block;font-family:var(--font-mono);font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:#6B7480;margin-bottom:6px;cursor:help;line-height:12px;} #edit-modal .ed-empty{font-size:12.5px;color:#6B7480;line-height:1.5;padding:2px 0 4px;} #edit-modal #ns-fill-badge{font-family:var(--font-mono);font-size:10.5px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:#4D4936;background:#D8D5C9;border-radius:20px;padding:3px 11px;cursor:help;white-space:nowrap;} #edit-modal #ns-fill-badge.ns-fill-ok{background:#E4EADF;color:#4D5A3E;} #edit-modal #ns-fill-badge:empty{display:none;} /* Field grid */ #edit-modal .ed-grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:9px 12px;} #edit-modal .ed-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;} #edit-modal .ed-span2{grid-column:1/-1;} #edit-modal .nsf,#edit-modal .nsf-u{margin:0;min-width:0;} #edit-modal label.lbl,#edit-modal .lbl{display:block;width:max-content;max-width:100%;font-family:var(--font-mono);font-size:9px;font-weight:500;letter-spacing:.09em; text-transform:uppercase;color:#6B7480;margin:0 0 4px;line-height:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} #edit-modal label.lbl.tip,#edit-modal .lbl.tip{cursor:help;overflow:visible;} #edit-modal .field-review-label{color:#6B7480;font-weight:500;} /* Bubbles inside the grid start at the label (not centred on it) so the first column's bubble stays inside the scroll box. */ #edit-modal .ed-grid3 .tip::after,#edit-modal .ed-idwrap .tip::after,#edit-modal .ed-ws-btn.tip::after{left:0;transform:none;} #edit-modal .ed-grid3 .tip::before,#edit-modal .ed-idwrap .tip::before,#edit-modal .ed-ws-btn.tip::before{left:14px;transform:none;} /* Controls — the board's 30px / #D2DAE3 / radius 8 field */ #edit-modal .modal input:not([type=checkbox]):not([type=radio]):not([type=file]),#edit-modal .modal select,#edit-modal .modal textarea{ width:100%;height:30px;padding:0 10px;border:1px solid #D2DAE3;border-radius:8px;background:#fff;color:#2A323A; font-family:var(--font);font-size:12.5px;font-weight:400;box-shadow:none;transition:border-color .12s,box-shadow .12s,background .12s;} #edit-modal .modal textarea{height:auto;min-height:62px;padding:8px 10px;line-height:1.5;font-size:11.5px;resize:vertical;} #edit-modal .modal input:hover:not(:focus),#edit-modal .modal select:hover:not(:focus),#edit-modal .modal textarea:hover:not(:focus){border-color:#C3CBD4;} #edit-modal .modal input:focus,#edit-modal .modal select:focus,#edit-modal .modal textarea:focus{outline:none;border-color:#2A323A;background:#fff;box-shadow:0 0 0 3px rgba(42,50,58,.08);} #edit-modal .modal input::placeholder,#edit-modal .modal textarea::placeholder{color:#A8AEB6;} #edit-modal .modal select{padding-right:26px;} /* Empty field = dashed; filled = solid (replaces the amber review state) */ #edit-modal .field-review{border:1px dashed #DBE1E8!important;background:#FBFCFD!important;} #edit-modal .field-review:focus{border-style:solid!important;border-color:#2A323A!important;background:#fff!important;} #edit-modal .nsf-done input,#edit-modal .nsf-done select,#edit-modal .nsf-done .cb-input{border-color:#D2DAE3;} #edit-modal .nsf-flag{display:none;} /* Combo box (renderComboBox) */ #edit-modal .combo{width:100%;} #edit-modal .cb-toggle{width:30px;border-left:none;border-radius:0 8px 8px 0;background:transparent;color:#6B7480;font-size:10px;font-weight:400;} #edit-modal .cb-toggle:hover{background:#F7F7F7;} #edit-modal .cb-panel{border:1px solid #D2DAE3;border-radius:10px;box-shadow:0 12px 34px rgba(18,24,30,.18);padding:6px;max-height:240px;} #edit-modal .cb-options{padding:0;} #edit-modal .cb-opt{padding:7px 8px;border-radius:8px;border-left:none;font-size:12.5px;color:#2A323A;} #edit-modal .cb-opt:hover{background:#F7F7F7;border-left-color:transparent;} #edit-modal .cb-opt.selected{background:#F1EDE6;font-weight:600;color:#2A323A;} #edit-modal .cb-empty{border-top:1px dashed #E8EDF2;color:#6B7480;} /* Paste to fill + Extra notes */ #edit-modal .modal #ns-paste-box{min-height:46px;} #edit-modal .ns-paste-msg{font-size:10.5px;color:#6B7480;line-height:1.45;margin-top:5px;min-height:0;} #edit-modal .ns-paste-msg:empty{display:none;} #edit-modal .modal-body .btn-ghost{height:24px;padding:0 12px;border:none;border-radius:9999px;background:#fff;color:#2A323A;font-family:var(--font);font-size:11.5px;font-weight:500; letter-spacing:0;box-shadow:0 1px 2px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.07);white-space:nowrap;cursor:pointer;line-height:24px;} #edit-modal .modal-body .btn-ghost:hover{background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.13),0 0 0 1px rgba(0,0,0,.11);} /* Photo card */ #edit-modal .ed-photo-row{display:flex;gap:10px;min-height:88px;} #edit-modal #edit-photo-preview{flex-shrink:0;} #edit-modal #edit-photo-preview .photo-thumb,#edit-modal #edit-photo-preview .photo-ph{width:116px;height:88px;border-radius:9px;border:1px solid #EFEFF1;background:#F7F7F7;object-fit:cover; display:flex;align-items:center;justify-content:center;color:#C1C0C2;font-size:0;cursor:pointer;} #edit-modal #edit-photo-preview .photo-ph:hover{border-color:#D2DAE3;color:#C1C0C2;background:#F1F1F1;} #edit-modal .ed-photo-btns{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;} #edit-modal .ed-photo-btn{height:26px;display:inline-flex;align-items:center;justify-content:center;gap:5px;width:100%;padding:0 10px;border:none;border-radius:9999px;background:#fff;color:#2A323A; font-family:var(--font);font-size:11.5px;font-weight:500;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.07);white-space:nowrap;box-sizing:border-box;} #edit-modal .ed-photo-btn:hover{box-shadow:0 2px 5px rgba(0,0,0,.13),0 0 0 1px rgba(0,0,0,.11);} #edit-modal .ed-pz{margin-top:8px;min-height:26px;padding:5px 10px;border:1px dashed #D2DAE3;border-radius:8px;font-size:11px;line-height:1.4;color:#9BA3AC;background:#FBFCFD;outline:none;cursor:text;} #edit-modal .ed-pz:focus{border-color:#2A323A;color:#2A323A;background:#fff;} #edit-modal .ed-urlrow{display:none;gap:6px;margin-top:8px;} #edit-modal .ed-urlrow.open{display:flex;} #edit-modal .modal .ed-urlrow input{height:26px;font-size:11.5px;flex:1;min-width:0;} /* Certificates card (markup from certs.js, reshaped by _edPolishCerts) */ #edit-modal #ed-certs > .es{background:#fff;border:1px solid #E8EDF2;border-radius:14px;padding:14px;box-shadow:0 1px 3px rgba(42,50,58,.04),0 4px 14px rgba(42,50,58,.06);} #edit-modal .ed-cert-count{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.06em;color:#6B7480;cursor:help;} #edit-modal .ed-cert-count:empty{display:none;} #ed-certs .cert-row{display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;padding:5px 0;margin:0;border-radius:0;background:none;border-bottom:1px solid #F0EDE6;min-height:30px;} #ed-certs .cert-row:last-child{border-bottom:none;} #ed-certs .cert-row-off{opacity:.5;} #ed-certs .es:not(.ed-certs-all) .cert-row-off{display:none;} #edit-modal .ed-certs-more{display:block;margin-top:8px;background:none;border:none;padding:0;font-family:var(--font);font-size:11px;color:#837D68;cursor:pointer;} #edit-modal .ed-certs-more:hover{color:#4D4936;} #edit-modal .ed-certs-none{font-size:12px;color:#6B7480;padding:2px 0 4px;} #ed-certs .cert-row-off:hover{opacity:.85;} #edit-modal .modal #ed-certs .cert-status{appearance:none;-webkit-appearance:none;width:auto;height:22px;flex-shrink:0;padding:0 18px 0 9px;border:none;border-radius:9999px; font-family:var(--font);font-size:10.5px;font-weight:600;line-height:22px;cursor:pointer;color:#5A6169;box-shadow:none; background:#EFEFF1 url("data:image/svg+xml;utf8,") no-repeat right 6px center;} #edit-modal .modal #ed-certs .cert-status:focus{box-shadow:0 0 0 3px rgba(42,50,58,.08);} #edit-modal .modal #ed-certs .cert-status-required{background-color:#FFF4D6;color:#7A4A00;} #edit-modal .modal #ed-certs .cert-status-received{background-color:#DFF5E1;color:#1B5E20;} #edit-modal .modal #ed-certs .cert-status-na,#edit-modal .modal #ed-certs .cert-status-none{background-color:#EFEFF1;color:#5A6169;} #ed-certs .cert-info{flex:1;min-width:0;} #ed-certs .cert-label{font-size:12px;font-weight:500;color:#2A323A;line-height:1.25;cursor:help;} #ed-certs .cert-label a{font-size:10px;font-weight:500;color:#837D68;text-decoration:none;margin-left:4px;} #ed-certs .cert-label a:hover{color:#4D4936;} #edit-modal .modal #ed-certs .cert-ref{order:10;flex:1 1 calc(100% - 93px);width:auto;min-width:0;margin-left:93px;height:24px;font-size:11px;padding:0 8px;} #edit-modal .modal #ed-certs .cert-ref:placeholder-shown:not(:focus){border-style:dashed;background:#FBFCFD;} #ed-certs .cert-attach{flex-shrink:0;width:auto;height:auto;border:none;border-radius:0;background:none;font-size:11px;color:#837D68;opacity:1;cursor:pointer;white-space:nowrap;} #ed-certs .cert-attach:hover{color:#4D4936;background:none;border:none;} #ed-certs .cert-file{flex-shrink:0;max-width:110px;background:none;border:none;padding:0;font-size:11px;font-weight:500;gap:3px;} #ed-certs .cert-file a{color:#837D68;} #ed-certs .cert-file a:hover{color:#4D4936;} #ed-certs .cert-file-x{color:#9BA3AC;} #ed-certs .cert-file-x:hover{color:#7A4245;} #edit-modal .modal-body #ed-certs .btn-ghost{height:22px;padding:0 9px;font-size:10.5px;line-height:22px;} /* ── Footer ── */ #edit-modal .modal-footer{height:58px;padding:0 22px;border-top:1px solid #E8EDF2;background:#fff;display:flex;align-items:center;justify-content:flex-start;gap:14px;flex-shrink:0;} #edit-modal .ed-meta{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:#9BA3AC;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;} #edit-modal .modal-footer .btn-ghost{background:#fff;color:#2A323A;border:none;border-radius:9999px;padding:8px 15px;font-family:var(--font);font-size:12.5px;font-weight:500;letter-spacing:0; box-shadow:0 1px 2px rgba(0,0,0,.1),0 0 0 1px rgba(0,0,0,.07);cursor:pointer;} #edit-modal .modal-footer .btn-ghost:hover{background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.13),0 0 0 1px rgba(0,0,0,.11);} #edit-modal .modal-footer .btn{background:#2A323A;color:#FCFBF9;border:none;border-radius:9999px;padding:8px 18px;font-family:var(--font);font-size:12.5px;font-weight:600;letter-spacing:0; box-shadow:0 1px 2px rgba(0,0,0,.2),0 0 0 1px rgba(0,0,0,.1);cursor:pointer;} #edit-modal .modal-footer .btn:hover:not(:disabled){background:#3D4854;box-shadow:0 2px 6px rgba(0,0,0,.22),0 0 0 1px rgba(0,0,0,.12);} /* ── Narrow viewports: aside drops below the main column; rail hides ── */ @media (max-width:1080px){ #edit-modal .modal-body{grid-template-columns:minmax(0,1fr);} #edit-modal .ed-aside{display:grid;grid-template-columns:1fr 1fr;align-items:start;} #edit-modal .ed-aside #ed-certs{grid-column:1/-1;} } @media (max-width:860px){ #edit-modal .modal.has-rail{grid-template-columns:0 minmax(0,1fr);} #edit-modal .modal.has-rail .ed-rail{display:none;} #edit-modal .modal.has-rail .modal-body{padding-left:22px;} #edit-modal .ed-aside{grid-template-columns:1fr;} #edit-modal .ed-ws-pop{width:calc(100% - 44px);} }