/*
 * doccav prototypes — styles for what the rendering layer draws (chat-layout, ACT-0238).
 * Colours, sizes and type come from the skin's variables only (AM-090). The skin already styles the
 * controls; this file lays out a form body's grid, its display-only values, lists and their chips.
 */

/* ---------------------------------------------------------------- a form body: CSS grid, 64px rows (LY-086 3.3.5 B) */
.dc_body { background: var(--dc-surface); }
.dc_grid { display: grid; gap: 8px 16px; padding: 12px 16px; box-sizing: border-box; }
.dc_grid_cell { min-width: 0; position: relative; }
.dc_grid_cell > .webix_view { background: transparent; }
.dc_calc .webix_inp_static, .dc_calc input { background: var(--dc-bg-alt) !important; color: var(--dc-text) !important; font-style: italic; }

/* A display-only relationship: its label as a control's, its value a link that opens the item (LY-040 §5.2) */
.dc_fe_link { padding: 0 2px; }
.dc_fe_label { color: var(--dc-text-muted); font-size: var(--dc-font-size-ui); font-weight: 500; line-height: 22px; margin-bottom: 4px; }
.dc_link { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: top;
  color: var(--dc-brand); text-decoration: none; line-height: 30px; font-size: var(--dc-font-size); }
.dc_link:hover { text-decoration: underline; }
.dc_link:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--dc-focus); border-radius: var(--dc-radius-sm); }
.dc_fe_empty { color: var(--dc-text-muted); line-height: 30px; }
.dc_fe_content { height: 100%; box-sizing: border-box; padding: 10px 12px; font-size: var(--dc-font-size-sm); line-height: 1.45;
  color: var(--dc-text-muted); background: var(--dc-bg-alt); border-left: 3px solid var(--dc-border-strong); border-radius: var(--dc-radius-sm); }
.dc_flag { display: inline-block; font-size: var(--dc-font-size-xs); font-weight: 600; color: var(--data-red-text); background: var(--data-red-soft);
  padding: 0 6px; border-radius: var(--dc-radius-sm); line-height: 18px; vertical-align: middle; }

/* Panels and Sections: a panel's heading is a tab — its tab strip, or one tab where it has no others — and a Section's is a
   coloured band, so the two never look alike (Paul, 25 Oct 2026) */
.dc_panel_tab { border-top: 1px solid var(--dc-border) !important; }
.dc_section_head .webix_template { display: flex; align-items: center; padding: 0 16px; font-weight: 600; color: var(--dc-text);
  background: var(--dc-bg-alt); border-top: 1px solid var(--dc-border); border-bottom: 1px solid var(--dc-border); }
.dc_form_bar { border-bottom: 1px solid var(--dc-border) !important; }
.dc_cmd_btn .webix_button { display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
.dc_cmd_btn .ti { font-size: 16px; }

/* ---------------------------------------------------------------- lists */
.dc_chips_bar { border-bottom: 1px solid var(--dc-border) !important; background: var(--dc-bg) !important; }
.dc_chip_toggle .webix_button { border-radius: 14px; height: 28px; padding: 0 12px; font-size: var(--dc-font-size-sm); }
.dc_rule_icon { font-size: 15px; margin-right: 5px; vertical-align: -2px; color: var(--dc-icon); }
.dc_list_status .webix_template { display: flex; align-items: center; justify-content: flex-end; padding: 0 12px; font-size: var(--dc-font-size-xs); }
.dc_list .webix_ss_header .webix_hcell { font-weight: 600; }
.webix_view.dc_small_label .webix_el_box { font-size: var(--dc-font-size-sm); color: var(--dc-text-muted); }

/* Several related items, each a link (a stand-in until the walk designs the several-value control, ACT-0233) */
.dc_fe_links { display: block; line-height: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dc_fe_links .dc_link { line-height: inherit; }
.dc_sep { color: var(--dc-text-muted); }
.dc_standin input { font-style: italic; }

/* Rich text read: formatted, in a box the height of its cell, scrolling when longer */
.dc_fe_rich { height: 100%; display: flex; flex-direction: column; padding: 0 2px; box-sizing: border-box; }
.dc_rich_body { flex: 1; min-height: 0; overflow: auto; padding: 4px 0; font-size: var(--dc-font-size); line-height: 1.5; color: var(--dc-text); }
.dc_rich_body p { margin: 0 0 8px; }
.dc_rich_body ul, .dc_rich_body ol { margin: 0 0 8px; padding-left: 22px; }
/* The free richtext control in the skin's terms */
.dc_grid_cell .webix_richtext .webix_richtext_editor, .dc_grid_cell .webix_richtext_container { border-color: var(--dc-border); }
.dc_rt_label .webix_el_box { color: var(--dc-text-muted); font-size: var(--dc-font-size-ui); font-weight: 500; line-height: 22px !important; }

/* A required field's asterisk, Webix's own, in the label's colour rather than the error red (LY-092 §8; for AM-090) */
label.webix_required:after, legend.webix_required:after { color: inherit !important; }
.dc_req { padding-left: 4px; }

/* The help line under each field (LY-092 §8): 12px, muted, in the condensed face; a broken rule replaces it, in red */
.dc_help { height: 18px; line-height: 18px; padding: 0 2px; font-family: var(--dc-font-condensed); font-size: 12px; color: var(--dc-text-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dc_help.dc_err { color: var(--dc-error); }
.dc_help .ti { font-size: 13px; margin-right: 4px; vertical-align: -1px; }
.dc_help .dc_help_link { line-height: inherit; font-size: inherit; color: var(--dc-error); text-decoration: underline; }
.dc_invalid input, .dc_invalid .webix_inp_static { border-color: var(--dc-error) !important; box-shadow: 0 0 0 1px var(--dc-error) inset; }
.dc_cell_main { overflow: hidden; }

/* Rich text read: the same box and background as every other read-only field */
.dc_rich_body { background: var(--dc-bg); border-radius: var(--dc-radius); padding: 6px 12px; box-sizing: border-box; }

/* ---------------------------------------------------------------- a form page (LY-092 §8): title band, toolbar band, form */
.dc_title_band { background: var(--dc-surface); }
.dc_title_band .webix_template { padding: 10px 16px 6px; box-sizing: border-box; }
.dc_title_kind { font-size: 12px; line-height: 16px; color: var(--dc-text-muted); letter-spacing: .02em; }
.dc_title_row { display: flex; align-items: center; gap: 10px; height: 32px; min-width: 0; }
.dc_title { font-size: 20px; font-weight: 600; color: var(--dc-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dc_chip_status, .dc_chip_mode { flex: none; font-size: 12px; font-weight: 500; line-height: 20px; padding: 0 8px; border-radius: 10px; }
.dc_chip_status { background: var(--dc-success-tint); color: var(--dc-success); }
.dc_chip_status.dc_off { background: var(--data-amber-soft); color: var(--data-amber-text); }   /* Cancelled: amber, as its Command is */
.dc_chip_mode { background: var(--dc-warning-tint); color: var(--dc-warning-text); }
.dc_record_line { font-size: 13px; line-height: 20px; color: var(--dc-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dc_record_line .dc_dot { color: var(--dc-n400); }
.dc_versions_link { color: inherit; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; }
.dc_versions_link:hover { color: var(--dc-brand); }

/* The toolbar band: its own pale band, ruled above and below */
.dc_form_bar, .dc_form_bar.webix_toolbar { background: var(--dc-bg-alt) !important; border-top: 1px solid var(--dc-border) !important; border-bottom: 1px solid var(--dc-border) !important; }
.dc_tb_btn .webix_button { padding: 0 12px; }
.dc_tb_btn .webix_button .ti { font-size: 17px; margin-right: 6px; vertical-align: -3px; }
.dc_tb_danger .webix_button, .dc_tb_danger .webix_button .ti { color: var(--dc-error); }
.dc_tb_off .webix_button { opacity: .5; cursor: not-allowed; }
.dc_tb_div .webix_template { padding: 0; display: flex; align-items: center; justify-content: center; background: transparent; }
.dc_tb_div .webix_template span { width: 1px; height: 22px; background: var(--dc-border-strong); }

/* Versions, beside the form */
.dc_versions { border-left: 1px solid var(--dc-border) !important; }
.dc_versions_bar { border-bottom: 1px solid var(--dc-border) !important; }
.dc_versions_title .webix_el_box { font-weight: 600; }
.dc_versions_list { list-style: none; margin: 0; padding: 4px 0; }
.dc_versions_list li { padding: 8px 16px; border-bottom: 1px solid var(--dc-border); }
.dc_v_head { display: flex; justify-content: space-between; gap: 8px; }
.dc_v_head span, .dc_v_who { color: var(--dc-text-muted); font-size: 13px; }
.dc_v_what { margin: 2px 0; }
.dc_v_note { color: var(--dc-text-muted); font-size: 12px; padding: 8px 16px; }
.webix_view.dc_tb_div, .dc_tb_div .webix_template { background: transparent !important; }
/* A Command that changes the item's state and can be undone, such as Cancel Discipline: amber, in its dark shade, since
   amber alone is too light for text (AM-090 §3.7 A). Delete, which cannot be undone in place, is red */
.dc_tb_warn .webix_button, .dc_tb_warn .webix_button .ti { color: var(--data-amber-text); }

/* ---------------------------------------------------------------- the tree picker (DC-085 §3.1.6, step 11) */
.dc_treepick .webix_el_box { position: relative; }
.dc_treepick input { cursor: pointer; padding-right: 30px !important; text-overflow: ellipsis; }
.dc_treepick input:read-only { background: var(--dc-surface); }
.dc_tp_chev { position: absolute; right: 10px; bottom: 9px; font-size: 16px; color: var(--dc-icon); pointer-events: none; }
.dc_tp_pop .webix_win_body { display: flex; }
.dc_tp_search { padding: 8px 8px 4px !important; }
.dc_tp_note .webix_template { padding: 4px 12px; font-size: var(--dc-font-size-sm); color: var(--dc-info); background: var(--dc-info-tint); line-height: 20px; white-space: normal; }
/* The field whose picker is open, marked so it is clear which one the panel belongs to */
.dc_tp_open input { box-shadow: 0 0 0 2px var(--dc-focus) !important; border-color: var(--dc-brand) !important; }
.dc_tp_note .ti { margin-right: 6px; vertical-align: -2px; }
.dc_tp_tree .webix_tree_item { height: 30px; line-height: 30px; }
.dc_tp_code { display: inline-block; min-width: 64px; margin-right: 8px; font-family: var(--dc-font-condensed); font-weight: 600; color: var(--dc-text); }
.dc_tp_item { color: var(--dc-text); }
.dc_tp_group { color: var(--dc-text-muted); font-size: var(--dc-font-size-sm); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.dc_tp_tree .webix_selected .dc_tp_group { color: var(--dc-text-muted); }
.dc_tp_off { color: var(--dc-text-muted); }
.dc_tp_desc { border-top: 1px solid var(--dc-border) !important; }
.dc_tp_desc .webix_template { padding: 8px 12px; font-size: var(--dc-font-size-sm); line-height: 1.4; color: var(--dc-text-muted); overflow: auto; }
.dc_tp_desc_head { color: var(--dc-text); font-weight: 600; margin-bottom: 2px; }
.dc_tp_desc .dc_tp_is { color: var(--dc-text); }
.dc_tp_desc b { color: var(--dc-text); font-weight: 600; }

/* A number assigned on save: read-only, in italic, so it does not read as a value */
.dc_assigned input { font-style: italic; color: var(--dc-text-muted) !important; }

/* ---------------------------------------------------------------- a module panel's empty state (DC-095 3.6.6) */
.dc_panel_empty .webix_template { padding: 24px 16px; }
.dc_empty_card { display: flex; gap: 16px; max-width: 760px; padding: 16px 20px; background: var(--dc-bg-alt); border: 1px solid var(--dc-border); border-radius: var(--dc-radius-lg); }
.dc_empty_icon { flex: none; width: 40px; height: 40px; border-radius: 20px; display: flex; align-items: center; justify-content: center;
  background: var(--dc-info-tint); color: var(--dc-info); font-size: 22px; }
.dc_empty_card h3 { margin: 6px 0 6px; font-size: 16px; font-weight: 600; color: var(--dc-text); }
.dc_empty_card p { margin: 0 0 8px; line-height: 1.5; color: var(--dc-text); }
.dc_empty_card p.dc_muted { color: var(--dc-text-muted); }
.dc_empty_card .dc_link { line-height: inherit; }

/* ---------------------------------------------------------------- Module settings (LY-092 screen 41) */
.dc_md_head h2 { margin: 4px 0 2px; font-size: 22px; font-weight: 600; color: var(--dc-text); }
.dc_md_head .dc_set_src { margin-bottom: 8px; }
.dc_md_hint { margin: 0 0 10px; line-height: 1.5; color: var(--dc-text-muted); font-size: var(--dc-font-size-sm); max-width: 880px; }
.dc_md_hint .dc_link, .dc_md_banner .dc_link { line-height: inherit; }
.dc_md_banner { display: flex; align-items: center; gap: 10px; margin: 6px 0 12px; padding: 8px 12px; border-radius: var(--dc-radius); background: var(--dc-warning-tint); color: var(--dc-warning-text); }
.dc_md_banner .ti { font-size: 18px; } .dc_md_banner span:nth-child(2) { flex: 1; }
.dc_md_mod { display: flex; gap: 14px; padding: 14px 16px; border: 1px solid var(--dc-border); border-radius: var(--dc-radius-lg); background: var(--dc-surface); margin-bottom: 16px; max-width: 920px; }
.dc_md_mod_icon { flex: none; width: 40px; height: 40px; border-radius: var(--dc-radius); background: var(--data-blue-soft); color: var(--data-blue-strong);
  display: flex; align-items: center; justify-content: center; font-size: 22px; }
.dc_md_mod_name { font-size: 17px; font-weight: 600; color: var(--dc-text); display: flex; align-items: center; gap: 10px; }
.dc_md_meta { margin-top: 6px; font-size: var(--dc-font-size-sm); color: var(--dc-text); }
.dc_md_sec h3, .dc_md_h3 h3 { margin: 6px 0 4px; font-size: 15px; font-weight: 600; color: var(--dc-text); }
.dc_md_list { list-style: none; margin: 0 0 8px; padding: 0; max-width: 920px; border: 1px solid var(--dc-border); border-radius: var(--dc-radius-lg); background: var(--dc-surface); }
.dc_md_row { display: flex; gap: 14px; align-items: flex-start; padding: 10px 14px; border-bottom: 1px solid var(--dc-border); }
.dc_md_row:last-child { border-bottom: 0; }
.dc_md_unavailable .dc_md_name, .dc_md_unavailable .dc_md_line, .dc_md_unavailable .dc_md_req { color: var(--dc-text-disabled); }
.dc_md_name { display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--dc-text); line-height: 22px; }
.dc_md_num { display: inline-block; min-width: 22px; height: 20px; line-height: 20px; text-align: center; border-radius: 10px; background: var(--dc-bg-alt);
  font-size: var(--dc-font-size-xs); color: var(--dc-text-muted); font-weight: 600; }
.dc_md_line { color: var(--dc-text-muted); font-size: var(--dc-font-size-sm); line-height: 1.45; margin-top: 2px; }
.dc_md_req { color: var(--dc-text); }
.dc_md_chip { display: inline-block; font-size: var(--dc-font-size-xs); font-weight: 600; line-height: 18px; padding: 0 8px; border-radius: 9px;
  background: var(--dc-bg-alt); color: var(--dc-text-muted); vertical-align: middle; }
.dc_md_on { background: var(--dc-success-tint); color: var(--dc-success); }
.dc_md_off { background: var(--dc-bg-alt); color: var(--dc-text-muted); }
.dc_md_reason { background: var(--dc-n150); color: var(--dc-n700); }
.dc_md_always { background: var(--dc-info-tint); color: var(--dc-info); }
/* A plain checkbox drawn as a switch, so the keyboard and screen readers use it as one (role=switch) */
.dc_md_switch { position: relative; flex: none; width: 38px; height: 22px; margin-top: 1px; cursor: pointer; }
.dc_md_switch input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: inherit; }
.dc_md_track { position: absolute; inset: 0; border-radius: 11px; background: var(--dc-n300); transition: background .15s; }
.dc_md_track:after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 8px; background: var(--dc-white); transition: left .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.dc_md_switch input:checked + .dc_md_track { background: var(--dc-brand); }
.dc_md_switch input:checked + .dc_md_track:after { left: 19px; }
.dc_md_switch input:disabled + .dc_md_track { opacity: .45; }
.dc_md_switch input:disabled { cursor: not-allowed; }
.dc_md_switch input:focus-visible + .dc_md_track { box-shadow: 0 0 0 2px var(--dc-focus); }
.dc_md_people { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 8px; }
.dc_md_person { display: inline-flex; align-items: center; gap: 8px; padding: 4px 4px 4px 12px; border: 1px solid var(--dc-border-strong); border-radius: 16px; background: var(--dc-surface); }
.dc_md_person_name { font-weight: 600; color: var(--dc-text); }
.dc_md_person .dc_muted { font-size: var(--dc-font-size-xs); }
.dc_md_remove { border: 0; background: transparent; width: 24px; height: 24px; border-radius: 12px; cursor: pointer; color: var(--dc-icon); }
.dc_md_remove:hover { background: var(--dc-hover); }
.dc_md_starter ul { list-style: none; margin: 0 0 8px; padding: 0; }
.dc_md_starter li { display: flex; align-items: center; gap: 8px; line-height: 28px; color: var(--dc-text); }
.dc_md_starter li .ti { color: var(--dc-success); font-size: 16px; }
.dc_md_starter li.dc_md_unmet { color: var(--dc-text-disabled); }
.dc_md_starter li.dc_md_unmet .ti { color: var(--dc-text-disabled); }
.dc_md_why .webix_template { color: var(--dc-text-muted); font-size: var(--dc-font-size-sm); line-height: 30px; }
.dc_md_why .ti { margin-right: 4px; vertical-align: -2px; }
.dc_md_done h3 { display: flex; align-items: center; gap: 8px; } .dc_md_done h3 .ti { color: var(--dc-success); font-size: 20px; }
.dc_md_done dl { margin: 0 0 12px; max-width: 920px; }
.dc_md_done dt { margin-top: 10px; font-weight: 600; color: var(--dc-text); }
.dc_md_done dd { margin: 2px 0 0 18px; color: var(--dc-text); line-height: 1.45; }

/* A picker's hint beside each option: a Party's role on a contract, and where the contract is in its life (DC-075 3.7.5 A) */
.dc_sel_hint, .dc_tp_hint { margin-left: 10px; color: var(--dc-text-muted); font-size: var(--dc-font-size-xs); }
.dc_sel_hint { float: right; }
/* A list narrowed by the working context says so, in its page bar (DC-075 §2.3) */
.dc_ctx_cell .webix_template { display: flex; align-items: center; justify-content: flex-end; padding: 0 10px; }
.dc_ctx_note { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 12px; background: var(--dc-bg-alt);
  color: var(--dc-text-muted); font-size: var(--dc-font-size-sm); cursor: pointer; white-space: nowrap; }
.dc_ctx_note:hover { color: var(--dc-text); }
.dc_ctx_note .ti { font-size: 15px; }
/* Repository settings (P07) */
.dc_rs_radio .webix_inp_radio_border { margin-bottom: 4px; }
.dc_rs_state { margin: 4px 0 0; }
/* An empty cell a List Rule marked shows the rule's name beside its icon */
.dc_rule_name { font-size: var(--dc-font-size-sm); }

/* ---------------------------------------------------------------- line items on a form (LY-092 screen 61) */
/* The panel's tab heading, and its one button at the right on the same rule */
.dc_line_tb { border-left: none !important; border-right: none !important; border-top: 1px solid var(--dc-border) !important; border-bottom: 1px solid var(--dc-border) !important; background: var(--dc-bg-alt) !important; box-sizing: border-box; }
.dc_line_bar .dc_line_tb { border-top: none !important; }
.dc_line_note .webix_template { display: flex; align-items: center; padding: 0 12px; font-size: var(--dc-font-size-xs); }
/* In place: an editable cell reads as one; a closed one is shaded; a refused one is outlined and says why */
.dc_lines_edit .webix_cell { cursor: text; }
.webix_cell.dc_line_off { background: var(--dc-bg-alt) !important; cursor: not-allowed; }
.webix_cell.dc_cell_err { box-shadow: inset 0 0 0 1px var(--dc-error); }
.dc_err_icon { color: var(--dc-error); margin-right: 4px; vertical-align: -2px; }
.dc_line_del_cell { text-align: center; }
.dc_line_del { color: var(--dc-icon); font-size: 16px; cursor: pointer; vertical-align: -3px; }
.dc_line_del:hover { color: var(--dc-error); }
.dc_flag.dc_flag_new { color: var(--data-green-text, var(--dc-text)); background: var(--data-green-soft, var(--dc-bg-alt)); font-weight: 600; }
.dc_line_win { border-radius: var(--dc-radius-md, 8px); overflow: hidden; }

/* ---------------------------------------------------------------- pick or add (DC-075 3.1.6) */
.dc_sel_add { color: var(--dc-accent, var(--dc-link)); font-weight: 600; }
.dc_sel_add .ti { margin-right: 6px; vertical-align: -2px; }
.dc_sel_taken { color: var(--dc-text-muted); }
.dc_an_bar { border-bottom: 1px solid var(--dc-border) !important; }
.dc_an_bar .webix_el_label { font-weight: 600; }
.dc_an_help .webix_template { padding: 0 2px; font-size: var(--dc-font-size-xs); color: var(--dc-text-muted); line-height: 1.4; }
.dc_an_says .webix_template { padding-top: 6px; }
.dc_an_sim .webix_template { padding: 2px 0 0; }
.dc_an_head { font-size: var(--dc-font-size-xs); font-weight: 600; color: var(--data-amber-text, var(--dc-text)); margin: 2px 0 6px; }
.dc_an_row { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--dc-border); border-radius: var(--dc-radius-sm); margin-bottom: 6px; background: var(--dc-bg); }
.dc_an_row.dc_an_same { border-color: var(--data-amber-text, var(--dc-border-strong)); background: var(--data-amber-soft, var(--dc-bg-alt)); }
.dc_an_name { flex: 1; font-size: var(--dc-font-size-sm); }
.dc_an_tag { font-size: var(--dc-font-size-xs); color: var(--dc-text-muted); }
.dc_an_use.webix_button { width: auto; height: 28px; padding: 0 12px; font-size: var(--dc-font-size-sm); }
.dc_an_none { font-size: var(--dc-font-size-xs); color: var(--dc-text-muted); padding: 2px 2px 4px; }
.dc_an_none .ti { color: var(--data-green-text, var(--dc-icon)); margin-right: 4px; vertical-align: -2px; }

/* ---------------------------------------------------------------- the Tree pattern (ACT-0107): a tree View */
.dc_tree_group { font-weight: 600; }
.dc_tree_group .ti { margin-right: 6px; color: var(--dc-icon); vertical-align: -2px; }

/* ---- Commands (LY-092 §4: Command input dialog, Commands over a selection) */
.dc_sel_cell .webix_template { display: flex; align-items: center; justify-content: flex-end; padding: 0 6px; background: transparent; }
.dc_sel_count { font-size: var(--dc-font-size-sm); color: var(--dc-text-muted); white-space: nowrap; }
.webix_view.dc_tb_btn.webix_disabled_view .webix_button, .dc_tb_btn .webix_disabled .webix_button { color: var(--dc-text-disabled); }
.dc_cmd_win .webix_win_body { background: var(--dc-surface); }
.dc_cmd_about .webix_template, .dc_cmd_help .webix_template, .dc_cmd_plan .webix_template { padding: 0 2px; }
.dc_cmd_head { color: var(--dc-text-muted); font-size: var(--dc-font-size-sm); margin: 2px 0 4px; }
.dc_cmd_list { margin: 0 0 10px; padding: 0 0 0 18px; line-height: 1.45; font-size: var(--dc-font-size-ui); }
.dc_cmd_list li + li { margin-top: 6px; }
.dc_cmd_list .dc_muted { font-size: var(--dc-font-size-sm); }
.dc_cmd_help .webix_template { font-family: var(--dc-font-condensed); font-size: 12px; line-height: 16px; color: var(--dc-text-muted); margin-top: -2px; padding-bottom: 6px; }
.dc_cmd_plan .webix_template { margin: 10px 0 0; padding: 9px 12px; background: var(--dc-info-tint); border-left: 3px solid var(--dc-info); border-radius: var(--dc-radius-sm);
  font-size: var(--dc-font-size-ui); line-height: 1.5; }
.dc_cmd_plan .ti { color: var(--dc-info); margin-right: 4px; vertical-align: -2px; }
.dc_line_keep { color: var(--dc-text-disabled); font-size: 15px; vertical-align: -3px; cursor: help; }

/* ---- the list page (LY-063 §2): title band naming the List and the View, the View's name its switcher */
.dc_list_title .webix_template { padding: 12px 16px 6px; }
.webix_view.dc_title_tools, .dc_title_tools.webix_toolbar { background: transparent !important; }
.dc_vs_cell .webix_template { display: flex; align-items: center; justify-content: flex-end; padding: 0; background: transparent; }
.webix_view.dc_vs_cell { background: transparent !important; }
.dc_view_switch { cursor: pointer; display: inline-flex; align-items: center; gap: 6px; border-radius: var(--dc-radius-sm); padding: 4px 8px; font-size: 15px; font-weight: 600; color: var(--dc-text); white-space: nowrap; }
.dc_vs_label { font-size: var(--dc-font-size-sm); font-weight: 400; color: var(--dc-text-muted); margin-right: 2px; }
.dc_view_switch .ti { font-size: 17px; color: var(--dc-icon); }
.dc_view_switch:hover { background: var(--dc-hover); }
.dc_view_menu .webix_list_item { padding: 9px 12px; line-height: 1.35; border-bottom: 1px solid var(--dc-border); }
.webix_view.dc_sel_cell, .dc_sel_cell .webix_template { background: transparent !important; }
.dc_vm_name { font-weight: 600; color: var(--dc-text); display: flex; align-items: center; gap: 6px; }
.dc_vm_name .ti { font-size: 15px; color: var(--dc-text-disabled); }
.dc_vm_on .ti { color: var(--dc-brand); }
.dc_vm_desc { font-size: var(--dc-font-size-sm); color: var(--dc-text-muted); padding-left: 21px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dc_title_row .dc_ctx_note { margin-left: 6px; }
.webix_view.dc_list_title, .dc_list_title .webix_template { background: transparent !important; }

/* ---- a list's column header (Paul, 2 Nov 2026): titles on one top line; the filter row tighter, its box smaller */
.dc_list .webix_ss_header td { vertical-align: top; }
.dc_list .webix_ss_header .webix_hcell.dc_hrow_title { line-height: 34px; }
.dc_list .webix_ss_header .webix_hcell.dc_hrow_filter { padding: 0 6px 5px; line-height: 24px; }
.dc_list .webix_ss_header .dc_hrow_filter input, .dc_list .webix_ss_header .dc_hrow_filter select { height: 24px; font-size: 12.5px; padding: 0 6px; margin: 0; }
.dc_hf_icon { font-size: 14px; color: var(--dc-text-disabled); margin-left: 6px; vertical-align: -2px; cursor: pointer; font-weight: 400; }
.dc_hf_icon:hover { color: var(--dc-text); }
.dc_hf_icon.dc_hf_on { color: var(--dc-brand); }
.dc_hf_toggle .webix_button .ti { font-size: 15px; margin-right: 6px; vertical-align: -2px; }

/* ---- rows selected with tick boxes (Paul, 2 Nov 2026) */
.dc_list .webix_cell.dc_sel_col, .dc_list .webix_hcell.dc_sel_head { text-align: center; padding: 0; cursor: pointer; }
.dc_tick { display: inline-block; width: 16px; height: 16px; box-sizing: border-box; border: 1.5px solid var(--dc-border-strong); border-radius: 3px;
  background: var(--dc-surface); vertical-align: -3px; position: relative; cursor: pointer; }
.dc_tick:hover { border-color: var(--dc-text-muted); }
.webix_row_select .dc_tick, .dc_tick.dc_on, .dc_tick.dc_part { background: var(--dc-brand); border-color: var(--dc-brand); }
.webix_row_select .dc_tick::after, .dc_tick.dc_on::after { content: ""; position: absolute; left: 4px; top: 1px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.dc_tick.dc_part::after { content: ""; position: absolute; left: 3px; top: 6px; width: 7px; height: 2px; background: #fff; }
/* a list in a tab: its toolbar band, as a list page's (Paul, 3 Nov 2026) */
.dc_line_tb.dc_tab_bar { border-top: none !important; }
/* a related list's heading: its count, and a link mark where its rows are items of their own (Paul, 3 Nov 2026) */
.dc_tab_rel { font-size: 15px; color: var(--dc-icon); margin-right: 6px; vertical-align: -2px; }
.dc_tab_count { display: inline-block; min-width: 18px; padding: 0 6px; margin-left: 8px; border-radius: 9px; background: var(--dc-bg-alt);
  color: var(--dc-text-muted); font-size: 12px; line-height: 18px; font-weight: 500; text-align: center; vertical-align: 1px; }
.webix_item_tab.webix_selected .dc_tab_count { background: var(--dc-hover); }
/* not saved yet (Paul, 4 Nov 2026): a new row tinted green and flagged, a changed cell amber, a row to be removed struck through */
.dc_lines_edit .webix_cell.dc_line_new { background: var(--dc-success-tint) !important; }
.dc_lines_edit .webix_cell.dc_cell_changed { background: var(--dc-warning-tint) !important; }
.dc_lines_edit .webix_cell.dc_line_removed { color: var(--dc-text-disabled) !important; text-decoration: line-through; }
.dc_lines_edit .webix_cell.dc_line_removed.dc_line_del_cell { text-decoration: none; }
.dc_line_undo { color: var(--dc-icon); font-size: 16px; cursor: pointer; vertical-align: -3px; }
.dc_line_undo:hover { color: var(--dc-text); }
.dc_pending { color: var(--dc-warning-text); font-weight: 500; margin-right: 6px; }
.dc_pending .ti { font-size: 12px; margin-right: 3px; vertical-align: 0; }