/* CZ Claude additions on top of CZ 1.1's own app.css - only what the AngularJS libraries used to provide
   (toastr, confirm boxes, the autocomplete dropdown). CZ palette only (3D design §1). */
#toasts { position: fixed; top: 12px; right: 12px; z-index: 100000; width: 300px; }
.cz-toast { background: #333333; color: #ffffff; padding: 10px 14px; margin-bottom: 8px; border-left: 6px solid #fff200; box-shadow: 0 2px 8px rgba(0,0,0,.4); font-size: 13px; opacity: .97; }
.cz-toast.error { border-left-color: #000000; background: #000000; }
.cz-confirm-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 99999; display: flex; align-items: center; justify-content: center; }
.cz-confirm { background: #ffffff; color: #212529; border: 2px solid #333333; padding: 18px 20px; min-width: 320px; max-width: 520px; font-size: 14px; }
.cz-confirm .buttons { margin-top: 14px; text-align: right; }
.cz-confirm .buttons button { margin-left: 8px; }
.ac-container { position: absolute; z-index: 1000; background: #ffffff; border: 1px solid #767676; max-height: 220px; overflow-y: auto; min-width: 100%; box-shadow: 0 2px 6px rgba(0,0,0,.3); }
.ac-container .ac-menu-item { padding: 3px 8px; cursor: pointer; font-size: 13px; white-space: nowrap; }
.ac-container .ac-menu-item:hover, .ac-container .ac-menu-item.active { background: #fff87f; }
.pointer { cursor: pointer; }
.cz-ws-off { position: fixed; bottom: 8px; left: 8px; background: #000000; color: #fff200; padding: 4px 10px; font-size: 12px; z-index: 100000; }
#detail-page .tags-list.active { background: #333333; color: #ffffff; }
#detail-page .tags-list.inactive { background: #eeeeee; color: #333333; }
.modal { display: none; position: fixed; inset: 0; z-index: 1050; background: rgba(0,0,0,.4); overflow: auto; }
.modal.show { display: block; }

/* quote editor drag */
#quote-editor tr.dndDraggingSource { opacity: .4; }
#quote-editor tr[draggable="true"] td.comment { cursor: grab; }

/* quote editor item-style settings: the emoji picker (CZ 1.1 uses emoji-mart, which loads from a CDN) */
#emoji-picker { position: fixed; z-index: 2000; width: 330px; max-height: 300px; overflow-y: auto; background: #ffffff; color: #212529; border: 1px solid #767676; box-shadow: 0 2px 8px rgba(0,0,0,.35); padding: 8px; display: flex; flex-wrap: wrap; gap: 4px; }
#emoji-picker span.e { font-size: 20px; width: 32px; height: 32px; line-height: 32px; text-align: center; }
#emoji-picker span.e:hover { background: #fff87f; }
#emoji-picker .custom { width: 100%; display: flex; gap: 4px; margin-top: 6px; }
#emoji-picker .custom input { flex: 1; }
#editor-setting-panel { box-shadow: 0 2px 8px rgba(0,0,0,.35); color: #212529; }

/* TECH-70 / TECH-71 field limits: the counter near an insurer limit and a refused field (CZ palette: black text, dashed line) */
.cz-limit { font-size: 10px; color: #414042; margin-left: 4px; white-space: nowrap; }
.cz-bad { outline: 2px dashed #212529 !important; background: #FFFBB2 !important; }
.cz-bad-msg { font-size: 11px; color: #212529; background: #fff200; padding: 1px 6px; margin-top: 2px; display: inline-block; }
/* TECH-74 part 3: the copy-quote panel's title text in the dark text colour */
#detail-page .copy-quote-panel { color: #212529; }
/* UI-60: the warning tape (UI-58) on an empty excess box of an authorised job; the tick removes it */
.cz-excess-tick { display: block; font-size: 11px; color: #212529; margin-top: 2px; cursor: pointer; }