/* ═══════════════════════════════════════════════════════════════════
   COMPONENTS: buttons, fields, badges/tags, lists, cards, KPI, notebook, statusbar,
   estimate builder, settings, empty states
   Source: odoo-reference ODOO_DESIGN_SYSTEM.md + catalog/COMPONENTS.md (F2, F6, F12, F18, B4, B5, B9, V1, V7).
   ═══════════════════════════════════════════════════════════════════ */

/* ═════════════ BUTTONS: 32.3px high, padding 5px 10px, radius 6, weight 500 ═════════════ */
.bA, .sm, .bG, .bT, .bB, .bR, .btn-danger, .xs, .fin button:not([class]):not([style]) {
  display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 32.3px; padding: 5px 10px;
  font-family: var(--ft); font-size: 14px; font-weight: 500; line-height: 21px; white-space: nowrap; text-decoration: none; user-select: none; vertical-align: middle;
  border: 1px solid var(--o-border-btn); border-radius: var(--r); background: var(--o-surface); color: var(--odoo-body-color); cursor: pointer;
  transition: background-color var(--dur), border-color var(--dur), color var(--dur); }
.bA:hover, .sm:hover, .bG:hover, .bT:hover, .bB:hover, .xs:hover, .fin button:not([class]):not([style]):hover { background: var(--odoo-gray-200); border-color: var(--odoo-gray-400); color: var(--odoo-body-color); }
/* primary: one purple button per area */
.bA, .bA.sm, .xs.bA { background: var(--o-btn); border-color: var(--o-btn); color: #fff; }
.bA:hover, .bA.sm:hover, .xs.bA:hover { background: var(--o-btn-hover); border-color: var(--o-btn-hover); color: #fff; }
.bA:active { background: var(--Adk); border-color: var(--Adk); }
/* danger: secondary look with red text */
.bR, .btn-danger { color: var(--err-dk); }
.bR:hover, .btn-danger:hover { background: var(--odoo-danger-bg-subtle); border-color: var(--odoo-danger); color: var(--err-dk); }
[data-theme="dark"] .bR, [data-theme="dark"] .btn-danger { color: var(--err-text); }
/* the coloured secondary variants (green/teal/blue) are plain secondary in Odoo */
.bT { color: var(--o-link); }
.bT:hover { color: var(--odoo-link-hover); }
/* toggled / current: teal tint */
.sm.on, .sm.active, .sm[aria-pressed="true"] { background: var(--o-action-lt); border-color: var(--o-action); color: var(--o-on-tint); }
.sm.on:hover, .sm.active:hover { background: var(--o-action-lt); border-color: var(--o-action); color: var(--o-on-tint); }
/* small / icon buttons (btn-sm) */
.xs { height: 26px; min-width: 26px; padding: 0 8px; font-size: 13px; line-height: 19.5px; border-radius: var(--r); }
.xs.bR { color: var(--err-dk); } .xs.bT { color: var(--o-link); } .xs.bG, .xs.bB { color: var(--odoo-body-color); }
.xs.bR:hover { background: var(--odoo-danger-bg-subtle); border-color: var(--odoo-danger); }
[data-theme="dark"] .xs.bR { color: var(--err-text); }
td .xs, th .xs { border-color: transparent; background: transparent; color: var(--odoo-gray-700); }
td .xs:hover { background: var(--odoo-gray-200); border-color: transparent; }
td .xs.bR { color: var(--err-dk); } td .xs.bT { color: var(--o-link); }
.bA svg, .sm svg, .xs svg, .bR svg, .bG svg, .bT svg { flex-shrink: 0; }
button:disabled, button[disabled], .bA:disabled, .sm:disabled, .xs:disabled { opacity: .65; cursor: not-allowed; pointer-events: none; }
.bA:focus-visible, .sm:focus-visible, .xs:focus-visible, .bR:focus-visible { outline: 0; box-shadow: var(--odoo-focus-ring); }
.icon-btn { width: 32px; height: 32px; padding: 0; border-radius: var(--r); display: inline-flex; align-items: center; justify-content: center; background: none; color: var(--o-text); cursor: pointer; transition: background var(--dur); }
.icon-btn:hover { background: var(--o-hover); }
.icon-btn.sm { width: 28px; height: 28px; background: none; border: 0; }
.icon-btn svg { width: 14px; height: 14px; }
.icon-btn.danger:hover { background: var(--err-lt); color: var(--err-dk); }
.btn-icon { width: 14px; height: 14px; flex-shrink: 0; }
.add-row-btn, .iet-add { display: block; width: 100%; padding: 8px 16px; font-size: 14px; font-weight: 400; text-align: left; color: var(--o-link); background: transparent; border: 0; border-top: 1px solid var(--o-border); cursor: pointer; }
.add-row-btn:hover, .iet-add:hover { color: var(--odoo-link-hover); background: var(--odoo-gray-100); }
/* bare back buttons in page templates */
.fin button:not([class]):not([style]) { font-weight: 500; }

/* icon-only action buttons whose label was stripped: CSS mask icons */
.xs[title]:empty::before { content: ''; width: 13px; height: 13px; background: currentColor; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
.xs[title="Print"]   { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M5 7V2h10v5M5 15H3V8h14v7h-2M6 12h8v6H6z'/%3E%3C/svg%3E"); }
.xs[title="Share"]   { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='15' cy='4' r='2.5'/%3E%3Ccircle cx='5' cy='10' r='2.5'/%3E%3Ccircle cx='15' cy='16' r='2.5'/%3E%3Cpath d='M7.2 8.8l5.6-3.6M7.2 11.2l5.6 3.6'/%3E%3C/svg%3E"); }
.xs[title="Clone"]   { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Crect x='7' y='7' width='11' height='11' rx='1.5'/%3E%3Cpath d='M13 7V3.5A1.5 1.5 0 0 0 11.5 2h-8A1.5 1.5 0 0 0 2 3.5v8A1.5 1.5 0 0 0 3.5 13H7'/%3E%3C/svg%3E"); }
.xs[title="Notes"]   { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M3 3h14v10l-4 4H3z'/%3E%3Cpath d='M13 17v-4h4M6 7h8M6 10h5' stroke-linecap='round'/%3E%3C/svg%3E"); }
.xs[title="Purchase"]{ --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 2h2.5l2.2 10h9.8l2-7H5'/%3E%3Ccircle cx='7.5' cy='16.5' r='1.5'/%3E%3Ccircle cx='14.5' cy='16.5' r='1.5'/%3E%3C/svg%3E"); }
.xs[title="Invoice"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 2h12v16l-2-1.5L12 18l-2-1.5L8 18l-2-1.5L4 18z'/%3E%3Cpath d='M7 7h6M7 10h6' stroke-linecap='round'/%3E%3C/svg%3E"); }
.xs[title="Edit"]:empty, .xs[title="Delete"]:empty { --ico: none; }

/* ═════════════ FIELDS (o_input): flat, thin bottom line, teal on focus ═════════════ */
.finp, input[type=text], input[type=number], input[type=email], input[type=date], input[type=password],
input[type=tel], input[type=search], input[type=url], input[type=datetime-local], input[type=time], input[type=month], input:not([type]), select, textarea {
  display: block; width: 100%; min-height: 27px; padding: 3px 0; font-family: var(--ft); font-size: 14px; line-height: 21px; color: var(--o-text);
  background: transparent; border: 0; border-bottom: 1px solid var(--o-border-input); border-radius: 0; box-shadow: none; outline: none;
  transition: border-color var(--dur), box-shadow var(--dur); }
.finp:hover, input:hover:not([type=checkbox]):not([type=radio]):not([type=range]), select:hover, textarea:hover { border-bottom-color: var(--odoo-gray-400); }
.finp:focus, input:focus:not([type=checkbox]):not([type=radio]):not([type=range]), select:focus, textarea:focus { border-bottom-color: var(--o-action); box-shadow: 0 1px 0 0 var(--o-action); outline: none; }
.finp:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: none; }
textarea { resize: vertical; min-height: 72px; padding: 3px 0; }
select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 8l5 5 5-5' fill='none' stroke='%236C757D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 0 center; background-size: 14px; }
select option, select optgroup { background: var(--o-surface); color: var(--o-text); }
input:disabled, select:disabled, textarea:disabled, input[readonly] { color: var(--odoo-secondary-color); border-bottom-color: transparent; cursor: default; }
input::placeholder, textarea::placeholder { color: var(--o-text3); font-family: var(--ft); font-size: inherit; opacity: 1; }
:where(input[type=checkbox]) { appearance: none; -webkit-appearance: none; width: 14px; height: 14px; margin: 0; flex-shrink: 0; vertical-align: -2px; cursor: pointer;
  border: 1px solid var(--o-check); border-radius: 3.5px; background: var(--o-surface) center / 10px no-repeat; }
:where(input[type=checkbox]:checked) { background-color: var(--odoo-action); border-color: var(--odoo-action);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.5 3.5 7.5-8' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
:where(input[type=checkbox]:indeterminate) { background-color: var(--odoo-action); border-color: var(--odoo-action);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10h10' stroke='white' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E"); }
:where(input[type=radio]) { appearance: none; -webkit-appearance: none; width: 14px; height: 14px; margin: 0; flex-shrink: 0; vertical-align: -2px; cursor: pointer;
  border: 1px solid var(--o-check); border-radius: 50%; background: var(--o-surface); }
:where(input[type=radio]:checked) { border-color: var(--odoo-action); background: radial-gradient(circle, var(--odoo-action) 0 4px, var(--o-surface) 4.5px); }
input[type=checkbox]:focus-visible, input[type=radio]:focus-visible { outline: 2px solid var(--o-action); outline-offset: 2px; box-shadow: none; }
input[type=range] { accent-color: var(--odoo-action); border: 0; box-shadow: none; padding: 0; min-height: 0; }
input[type=color] { padding: 0; border: 1px solid var(--o-border-btn); border-radius: var(--r); height: 30px; cursor: pointer; background: none; }
input[type=file] { border: 0; padding: 4px 0; font-size: var(--odoo-fs-small); }
label, .lbl { display: block; font-size: 14px; font-weight: 500; line-height: 21px; color: var(--o-heading); margin-bottom: 4px; }
label:has(> input[type=checkbox]), label:has(> input[type=radio]) { font-weight: 400; color: var(--o-text); display: inline-flex; align-items: center; gap: 8px; margin-bottom: 0; }
.lbl.req::after, .mo-field-lbl.req::after { content: ' *'; color: var(--odoo-danger); }
.field { margin-bottom: 12px; } .field-row { display: flex; gap: 16px; } .field-row .field { flex: 1; }
.fg { display: flex; flex-direction: column; gap: 4px; }
.fg label, .fm-label, .field-label { font-size: 14px; font-weight: 500; color: var(--o-heading); margin-bottom: 0; display: block; }
.fg-row { display: grid; gap: 8px 16px; } .fg-row-2 { grid-template-columns: 1fr 1fr; }
.fg-row-3 { grid-template-columns: 1fr 1fr 1fr; } .fg-row-4 { grid-template-columns: repeat(4, 1fr); }
.fg-sep, .fm-sep { height: 0; border-top: 1px solid var(--o-border); margin: 16px 0; }
.fm-row { display: flex; gap: 16px; } .fm-row > * { flex: 1; min-width: 0; }
.fm-hint, .field-hint { font-size: var(--odoo-fs-small); color: var(--o-text3); margin-top: 4px; }
.fm-section-title { font-size: 13px; font-weight: 700; text-transform: uppercase; color: var(--odoo-gray-700); margin: 24px 0 16px; box-shadow: 0 1px 0 var(--o-border); padding-bottom: 4px; }
.fm-req { color: var(--odoo-danger); margin-left: 2px; }

/* form group: label | value rows (o_inner_group) */
.mo-field-group { margin-bottom: 8px; }
.mo-field-row { display: flex; align-items: flex-start; gap: 16px; padding: 4px 0; }
.mo-field-lbl { width: 150px; flex-shrink: 0; font-size: 14px; font-weight: 500; line-height: 21px; color: var(--o-heading); padding-top: 3px; }
.mo-field-val { flex: 1; min-width: 0; }
.mo-field-val .finp, .mo-field-val input, .mo-field-val select, .mo-field-val textarea { margin: 0; }
.mo-field { display: flex; flex-direction: column; gap: 4px; }
.mo-field label { font-size: 14px; font-weight: 500; color: var(--o-heading); }
.mo-section-hdr, .sec-hdr { display: flex; align-items: center; gap: 8px; margin: 24px 0 16px; padding: 0 0 4px; box-shadow: 0 1px 0 var(--o-border);
  font-size: 13px; font-weight: 700; text-transform: uppercase; color: var(--odoo-gray-700); }
.mo-section-hdr:first-child, .sec-hdr:first-child { margin-top: 0; }
.mo-section-ico { display: none; }
.mo-section-title { font-size: 13px; font-weight: 700; text-transform: uppercase; color: var(--odoo-gray-700); }
.mo-section { margin-bottom: 8px; }

/* toggle switch (o_boolean_toggle): 32 x 16 */
.tgl { position: relative; display: inline-flex; align-items: center; width: 32px; height: 16px; margin: 0; cursor: pointer; flex-shrink: 0; }
.tgl input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
.tgl-s { position: absolute; inset: 0; border-radius: 16px; background: var(--odoo-gray-400); transition: background var(--dur); }
.tgl-s::after { content: ''; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: transform var(--dur) var(--ease-out); }
.tgl input:checked + .tgl-s { background: var(--odoo-success); }
.tgl input:checked + .tgl-s::after { transform: translateX(16px); }
.tgl input:focus-visible + .tgl-s { outline: 2px solid var(--o-action); outline-offset: 2px; }
.toggle-track { width: 32px; height: 16px; background: var(--odoo-gray-400); border-radius: 16px; position: relative; transition: background var(--dur); flex-shrink: 0; cursor: pointer; }
.toggle-track.on { background: var(--odoo-success); }
.toggle-thumb { position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: transform var(--dur); }
.toggle-track.on .toggle-thumb { transform: translateX(16px); }

/* segmented control / radio buttons: selected = teal tint */
.appl-seg { display: inline-flex; border: 1px solid var(--o-border-btn); border-radius: var(--r); overflow: hidden; background: var(--o-surface); }
.appl-seg-btn { padding: 4px 12px; font-size: 14px; font-weight: 500; color: var(--o-text); border-left: 1px solid var(--o-border-btn); transition: background var(--dur); }
.appl-seg-btn:first-child { border-left: 0; }
.appl-seg-btn:hover { background: var(--odoo-gray-200); }
.appl-seg-btn.on { background: var(--o-action-lt); color: var(--o-on-tint); box-shadow: inset 0 0 0 1px var(--o-action); }

/* ═════════════ CARDS / SHEET: white, 1px #DEE2E6, radius 8, no shadow ═════════════ */
.card, .mod-section, .profile-section, .purchase-card, .dash-chart-wrap, .compa-card, .company-card {
  background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); box-shadow: none; }
.card { overflow: hidden; }
.card.p3 { padding: 12px; } .card.p4 { padding: 16px; }
.card.clickable, .card-link { cursor: pointer; transition: border-color var(--dur); }
.card.clickable:hover, .card-link:hover { border-color: var(--odoo-gray-400); }
.card-hdr, .mod-section-hdr, .profile-section-hdr { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 16px; min-height: 40px; border-bottom: 1px solid var(--o-border); flex-shrink: 0; }
.card-hdr-title, .mod-section-title { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); }
.profile-section-hdr { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); justify-content: flex-start; }
.card-hdr-sub, .mod-section-sub { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.card-body, .mod-section-body { padding: 16px; } .mod-section-body.no-pad { padding: 0; }
.mod-wrap { display: flex; flex-direction: column; gap: 16px; }
.profile-section, .purchase-card { margin-bottom: 16px; overflow: hidden; }
.sh:not(.card) { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sh h3, .sh h2, .sh h4 { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); margin: 0; }
.page-hdr { margin-bottom: 16px; }
.page-hdr-title, .pgt, .page-title { font-size: var(--odoo-fs-h2); font-weight: 500; line-height: 1.2; color: var(--o-heading); margin-bottom: 4px; }
.page-hdr-sub, .pgt-sub, .page-subtitle { font-size: 14px; color: var(--o-text3); margin-bottom: 16px; }
.section-title { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); }
.section-sub { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.dv { border-bottom: 1px solid var(--o-border); margin: 16px 0; }

/* ═════════════ DASHBOARD / KPI ═════════════ */
.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.kpi-grid.kpi-grid-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 768px) { .kpi-grid.kpi-grid-3 { grid-template-columns: 1fr 1fr; } .kpi-grid.kpi-grid-3 > :last-child { grid-column: span 2; } }
.kpi, .kpi-card, .kpi-box { position: relative; display: flex; flex-direction: column; padding: 16px; cursor: pointer; background: var(--o-surface);
  border: 1px solid var(--o-border); border-radius: var(--r3); transition: border-color var(--dur); }
.kpi:hover, .kpi-card:hover, .kpi-box:hover { border-color: var(--odoo-gray-400); }
.kpi.hl, .kpi-box.hl { background: var(--o-surface); border-color: var(--odoo-primary); }
.kpi.hl::before, .kpi-box.hl::before { display: none; }
.kpi-l, .kpi-label, .kpi-card-label, .kpi-box-label { display: flex; align-items: center; gap: 4px; margin-bottom: 4px; font-size: 14px; font-weight: 500; color: var(--o-heading); }
.kpi-v, .kpi-card-value, .kpi-box-value { font-size: 21px; font-weight: 500; line-height: 1.2; color: var(--o-text); font-variant-numeric: tabular-nums; }
.kpi-v.lg { font-size: 21px; }
.kpi-s { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; font-size: 12px; }
.kpi-card-sub, .kpi-box-sub { font-size: var(--odoo-fs-small); color: var(--o-text3); margin-top: 4px; }
.kpi-card-trend { font-size: var(--odoo-fs-small); font-weight: 500; } .kpi-card-trend.up { color: var(--ok-text); } .kpi-card-trend.down { color: var(--err-text); }
.kpi-v.tA { color: var(--A); } .kpi-v.tT { color: var(--ok-text); } .kpi-v.tR { color: var(--err-text); } .kpi-v.tB { color: var(--info-text); } .kpi-v.tP { color: var(--A); }
.kpi-row, .kpi-row-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.kpi-row-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 16px; }
.kpi-row-2 { grid-template-columns: repeat(2, 1fr); }
.kpi-box.hl .kpi-box-value { color: var(--A); }
/* pipeline strip = dashboard stat cells */
.pipeline { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; }
.pipe { display: flex; flex-direction: column; gap: 2px; padding: 16px 12px; cursor: pointer; text-align: left; border-left: 1px solid var(--o-border); transition: background var(--dur); min-width: 0; }
.pipe:first-child { border-left: 0; }
.pipe:hover { background: var(--o-row-hover); }
.pipe-n { font-size: 21px; font-weight: 500; line-height: 1.2; font-variant-numeric: tabular-nums; }
.pipe-l { font-size: 14px; color: var(--o-text3); display: block; }
.pipe-v { font-size: 14px; font-weight: 500; color: var(--o-text); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* progress bars (kanban column bar look: track #DEE2E6, radius 4) */
.prog, .pur-prog-bar, .br-bar { height: 8px; background: var(--odoo-gray-300); border-radius: 4px; overflow: hidden; }
.prog { margin-top: 4px; }
.prog-fill, .pur-prog-fill, .br-fill { height: 100%; border-radius: 4px; background: var(--odoo-success); transition: width .4s var(--ease); }
.pur-progress { margin-top: 8px; display: flex; align-items: center; gap: 8px; } .pur-prog-bar { flex: 1; max-width: 180px; }
.br-bar { flex: 1; height: 6px; }
.act-item { display: flex; align-items: flex-start; gap: 8px; padding: 8px 4px; border-bottom: 1px solid var(--o-border); }
.act-item:last-child { border-bottom: 0; }
.dash-chart-wrap { padding: 16px; }
.dash-chart-title { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); margin-bottom: 8px; }
.dash-chart-wrap canvas { max-width: 100%; height: auto !important; }
.gr2 > .card:has(> .pipeline) { display: flex; flex-direction: column; }
.card > .pipeline { flex: 1; align-items: stretch; }
.card > .pipeline .pipe { justify-content: center; }

/* ═════════════ LIST VIEW (o_list_view): header 39.7 / row 40 / cell 8px 4.8px ═════════════ */
table { width: 100%; border-collapse: collapse; font-size: 14px; }
thead th, .mod-table th, .std-table th, .card table th, .iet th, .bom-tbl th, .bom-t th, .pm-table th {
  height: 39.7px; padding: 8px 4.8px; font-size: 14px; font-weight: 500; line-height: 21px; color: var(--odoo-gray-700); text-transform: none; letter-spacing: 0;
  background: var(--o-surface); border-bottom: 1px solid var(--o-border); text-align: left; white-space: nowrap; vertical-align: middle; }
tbody td, .mod-table td, .std-table td, .card table td, .bom-tbl td, .bom-t td { padding: 8px 4.8px; font-size: 14px; line-height: 21px; border-bottom: 1px solid var(--o-border); color: var(--o-text); vertical-align: middle; }
tr > :first-child:is(th, td) { padding-left: 16px; }
tr > :last-child:is(th, td) { padding-right: 16px; }
tbody tr:last-child td { border-bottom: 1px solid var(--o-border); }
.card tbody tr:last-child td, .mod-section tbody tr:last-child td, .rt-wrap tbody tr:last-child td { border-bottom: 0; }
tbody tr.hov:hover td, .hov tr:hover td, .mod-table tbody tr:hover td, .std-table tbody tr:hover td, .card table tr[onclick]:hover td, tbody tr[onclick]:hover td, tbody tr[data-qid]:hover td,
.bom-tbl tr:hover td, .bom-t tbody tr:hover td, .pm-table tr:hover td, .iet tr:hover td { background: var(--o-row-hover); }
tbody tr[onclick], tbody tr.hov, tbody tr[data-qid] { cursor: pointer; }
.rt-wrap, .tbl-scroll, .pm-wrap, .pm { overflow-x: auto; -webkit-overflow-scrolling: touch; width: 100%; }
.rt-wrap { background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); }
.card .rt-wrap, .mod-section .rt-wrap, .card .tbl-scroll { border: 0; border-radius: 0; }
th[onclick], th.sort-th, .sort-hdr { cursor: pointer; user-select: none; }
th[onclick]:hover, th.sort-th:hover, .sort-hdr:hover { color: var(--o-heading); }
th.sort-th .sort-arrow { margin-left: 4px; opacity: .4; font-size: 10px; }
th.sort-th.asc .sort-arrow::after { content: '▲'; opacity: 1; } th.sort-th.desc .sort-arrow::after { content: '▼'; opacity: 1; }
.td-num, .td-r { text-align: right; font-variant-numeric: tabular-nums; }
.td-c { text-align: center; } .td-muted { color: var(--o-text3); font-size: var(--odoo-fs-small); } .td-bold { font-weight: 500; }
.std-table td.num, .std-table td.price { text-align: right; font-variant-numeric: tabular-nums; }
.std-table td.center { text-align: center; } .std-table td.muted { color: var(--o-text3); font-size: var(--odoo-fs-small); }
.std-table td.bold, .std-table td.price { font-weight: 500; }
.std-table .xs-cell { padding: 4px 8px; }
.td-actions { white-space: nowrap; text-align: right; }
.grp-hdr { display: flex; align-items: center; gap: 4px; height: 40px; padding: 5px 4.8px 5px 16px; background: var(--o-surface); border-bottom: 1px solid var(--o-border); font-size: 14px; font-weight: 500; color: var(--o-heading); }
/* inline-edit (editable list / one2many) */
.iet, .bom-t { width: 100%; border-collapse: collapse; font-size: 14px; }
.iet td, .bom-t td { padding: 4px 4.8px; border-bottom: 1px solid var(--o-border); vertical-align: middle; }
.iet td input, .iet td select, .bom-t td input, .bom-t td select, .pm-table input[type=number] {
  width: 100%; min-height: 0; padding: 2px 4px; font-size: 14px; border: 0 !important; border-bottom: 1px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--o-text); box-shadow: none; }
.iet td input:hover, .iet td select:hover, .bom-t td input:hover, .bom-t td select:hover, .pm-table input[type=number]:hover { border-bottom-color: var(--o-border-input) !important; }
.iet td input:focus, .iet td select:focus, .bom-t td input:focus, .bom-t td select:focus, .pm-table input[type=number]:focus { border-bottom-color: var(--o-action) !important; box-shadow: 0 1px 0 0 var(--o-action) !important; }
.iet td.td-r { text-align: right; }
.bom-row-no { width: 30px; text-align: center; color: var(--o-text3); font-size: 12px; }
.bom-expand-btn { background: none; border: 0; cursor: pointer; color: var(--o-text3); padding: 2px 6px; border-radius: 4px; font-size: 12px; }
.bom-expand-btn:hover { background: var(--o-hover); color: var(--o-text); }
.rate-reset { cursor: pointer; color: var(--o-link); margin-left: 4px; font-size: var(--odoo-fs-small); }
.bom-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--o-border); flex-wrap: wrap; }
.bom-toolbar-left, .bom-toolbar-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* price matrix */
.pm-table { border-collapse: collapse; font-size: 14px; min-width: 600px; }
.pm-table th { text-align: right; } .pm-table th:first-child { text-align: left; }
.pm-table td { padding: 4px 8px; border-bottom: 1px solid var(--o-border); }
.pm-table .pm-prod, .pm-table td.pm-prod { font-weight: 500; color: var(--o-text); max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pm-table .pm-spec { font-size: 12px; color: var(--o-text3); }
.pm-table td.pm-rate { text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; }
.pm-table td.pm-empty, .pm-cell.miss { color: var(--o-text3); text-align: center; }
.pm-table input[type=number] { width: 86px; text-align: right; font-variant-numeric: tabular-nums; }
.pm-hd { text-align: right; }
.pm-cat-row td, .pm-table .pm-cat-hdr td, .pm-row-header { font-size: 14px; font-weight: 500; color: var(--o-heading); padding: 5px 16px; background: var(--odoo-gray-100) !important; text-transform: none; letter-spacing: 0; }
.pm-c { display: flex; align-items: center; justify-content: flex-end; }
.pm-i { border: 0 !important; background: transparent; text-align: right; width: 86px; font-size: 14px; color: var(--o-text); padding: 2px 4px; border-radius: 0 !important; }
.pm-i:focus { box-shadow: 0 1px 0 0 var(--o-action); outline: none; }

/* ═════════════ BADGES / TAGS: soft pill (tint 15% + dark text), padding 3px 9.84px, 12/500 ═════════════ */
.badge, .stat-chip, .status-badge, .st-pill, .m-badge, .tag {
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 9.84px; border-radius: 800px; font-size: 12px; font-weight: 500; line-height: 14px;
  white-space: nowrap; border: 0; font-family: var(--ft); background: var(--sec-lt); color: var(--sec-dk); }
.tag { text-transform: capitalize; }
.stat-chip.up, .badge-ok, .st-won, .status-paid, .status-won, .tag.tT, .m-badge.good { background: var(--ok-lt); color: var(--ok-dk); }
.stat-chip.down, .badge-err, .st-lost, .status-overdue, .status-lost, .tag.tR, .m-badge.low { background: var(--err-lt); color: var(--err-dk); }
.badge-warn, .status-pending, .m-badge.ok { background: var(--warn-lt); color: var(--warn-dk); }
.badge-info, .st-sent, .status-sent, .tag.tB { background: var(--info-lt); color: var(--info-dk); }
.badge-neu, .st-draft, .status-draft, .tx { background: var(--sec-lt); color: var(--sec-dk); }
.badge-A, .st-invoiced, .status-invoiced, .tag.tA, .tag.tP { background: var(--pri-lt); color: var(--pri-dk); }
.tG { background: var(--o-action-lt); color: var(--o-on-tint); }
.tag.mono { font-family: var(--ft); }
/* status select rendered as a pill */
select.tag { width: auto; min-height: 20px; padding: 3px 22px 3px 9.84px !important; border-radius: 800px !important; border: 0 !important; background-position: right 6px center; background-size: 10px; cursor: pointer; text-transform: capitalize; font-size: 12px !important; font-weight: 500 !important; color: inherit; }
select.tag.st-won { background-color: var(--ok-lt) !important; color: var(--ok-dk) !important; }
select.tag.st-lost { background-color: var(--err-lt) !important; color: var(--err-dk) !important; }
select.tag.st-sent { background-color: var(--info-lt) !important; color: var(--info-dk) !important; }
select.tag.st-draft { background-color: var(--sec-lt) !important; color: var(--sec-dk) !important; }
select.tag.st-invoiced { background-color: var(--pri-lt) !important; color: var(--pri-dk) !important; }
.dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.dot.ok { background: var(--ok); } .dot.warn { background: var(--warn); } .dot.err { background: var(--err); } .dot.info { background: var(--info); }
.q-status { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.q-st-draft { background: var(--odoo-gray-400); } .q-st-sent { background: var(--info); } .q-st-won { background: var(--ok); } .q-st-lost { background: var(--err); } .q-st-invoiced { background: var(--odoo-primary); }
.ni-badge.teal { background: var(--o-action-lt); color: var(--o-on-tint); }
.ni-badge.blue { background: var(--info-lt); color: var(--info-dk); }
.gs-tag { flex-shrink: 0; padding: 3px 9.84px; border-radius: 800px; font-size: 12px; font-weight: 500; line-height: 14px; background: var(--sec-lt); color: var(--sec-dk); }
.ni-badge { margin-left: auto; min-width: 20px; padding: 3px 8px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 500; line-height: 14px; border-radius: 800px; background: var(--sec-lt); color: var(--sec-dk); }

/* ═════════════ FILTER CHIPS / SEARCH BAR (o_searchview) ═════════════ */
.filter-bar { display: flex; align-items: center; gap: 8px; padding: 8px 0; flex-wrap: wrap; }
.filter-chip, .inv-tab, .osearch-f, .osearch-filter, .gs-chip { display: inline-flex; align-items: center; height: 32.3px; padding: 5px 10px; border-radius: var(--r); font-size: 14px; font-weight: 500; line-height: 21px;
  border: 1px solid var(--o-border-btn); background: var(--o-surface); color: var(--o-text); cursor: pointer; transition: background var(--dur), border-color var(--dur); white-space: nowrap; }
.osearch-f, .osearch-filter, .gs-chip { height: 26px; padding: 0 8px; font-size: var(--odoo-fs-small); }
.filter-chip:hover, .inv-tab:hover, .osearch-f:hover, .osearch-filter:hover, .gs-chip:hover { background: var(--odoo-gray-200); }
.filter-chip.on, .inv-tab.on, .osearch-f.on, .osearch-filter.active, .gs-chip.gs-chip-on { background: var(--o-action-lt); border-color: var(--o-action); color: var(--o-on-tint); }
.filter-chip.won { background: var(--ok-lt); border-color: transparent; color: var(--ok-dk); }
.filter-chip.sent { background: var(--info-lt); border-color: transparent; color: var(--info-dk); }
.filter-chip.lost { background: var(--err-lt); border-color: transparent; color: var(--err-dk); }
.inv-tabs { display: flex; gap: 8px; flex-wrap: wrap; }
/* search box: 396 x 36.5, pill on the left, facets inside */
.osb-wrap { display: flex; align-items: center; flex: 1; min-width: 200px; max-width: 396px; min-height: 36.5px; padding: 0 0 0 16px; background: var(--o-surface);
  border: 1px solid var(--o-border-btn); border-radius: 800px; flex-wrap: wrap; position: relative; transition: border-color var(--dur), box-shadow var(--dur); }
.osb-wrap:focus-within { border-color: #68A9AF; box-shadow: 0 0 0 2px color-mix(in srgb, var(--o-action) 35%, transparent); }
.osb-wrap > svg { margin: 0 8px 0 0 !important; color: var(--o-text3); }
.osb-wrap input { flex: 1; min-width: 80px; min-height: 23px; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; font-size: 14px; outline: none; color: var(--o-text); }
.osb-divider { width: 1px; align-self: stretch; background: var(--o-border); flex-shrink: 0; }
.osb-btn { display: inline-flex; align-items: center; gap: 4px; padding: 0 12px; align-self: stretch; font-size: 14px; font-weight: 500; cursor: pointer; color: var(--o-text); white-space: nowrap; border-radius: 0 800px 800px 0; }
.osb-btn:hover { background: var(--odoo-gray-200); }
.osb-btn svg { width: 12px; height: 12px; }
.osb-pill { display: inline-flex; align-items: stretch; height: 22.3px; margin: 2px 4px 2px 0; border-radius: var(--r); font-size: var(--odoo-fs-small); font-weight: 400; overflow: hidden; background: var(--odoo-gray-100); color: var(--o-text);
  border: 1px solid transparent; cursor: pointer; white-space: nowrap; line-height: 20px; }
.osb-pill::before { content: ''; width: 22px; background: var(--odoo-primary-bg-subtle) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M3 5h14l-5.5 6.5V16l-3 1.5v-6z' fill='%23714B67'/%3E%3C/svg%3E") center / 12px no-repeat; }
[data-theme="dark"] .osb-pill::before { background-color: rgba(167, 118, 155, .3); }
.osb-pill > :first-child { padding-left: 8px; }
.osb-pill-close { padding: 0 6px 0 8px; font-size: 14px; line-height: 20px; opacity: .6; }
.osb-pill-close:hover { opacity: 1; }
.osb-dropdown { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 200; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--odoo-radius-xl);
  box-shadow: var(--odoo-popover-shadow); padding: 4px; animation: ddIn .1s var(--ease-out) both; }
.osb-dd-section { padding: 4px 0; }
.osb-dd-title { padding: 4px 20px; font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); display: flex; align-items: center; gap: 8px; }
.osb-row { display: flex; align-items: center; gap: 8px; min-height: 27px; padding: 3px 20px; border-radius: var(--r3); cursor: pointer; font-size: 14px; color: var(--o-text); }
.osb-row:hover { background: var(--o-hover); }
.osb-row svg { width: 12px; height: 12px; color: var(--o-text3); }
.osb-row span { flex: 1; }
.osb-sep { height: 0; border-top: 1px solid var(--o-border); margin: 8px 0; }
.act-filters { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; min-height: 24px; }
.act-filter-wrap { position: relative; }
.search-filter-bar, .list-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.search-filter-bar input { flex: 1; min-width: 160px; } .search-filter-bar select { width: auto; flex-shrink: 0; }
.list-toolbar .search-col { flex: 1; min-width: 180px; position: relative; max-width: 396px; }
.list-toolbar .filter-col { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.list-count { font-size: var(--odoo-fs-small); color: var(--o-text3); white-space: nowrap; }
.mod-search { position: relative; } .mod-search input { padding-left: 24px; }
.mod-search-ico { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--o-text3); pointer-events: none; }
.bulk-bar { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: var(--odoo-info-bg-subtle); color: var(--odoo-info-text); border-radius: var(--r); margin-bottom: 8px; flex-wrap: wrap; }
.bulk-cnt { font-size: 14px; font-weight: 500; }

/* ═════════════ NOTEBOOK TABS (o_notebook) ═════════════ */
.mtabs, .mo-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--o-border); margin: 0 0 16px; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.mo-tabs { margin: 0 calc(-1 * var(--mo-px, 16px)) 16px; padding: 0 var(--mo-px, 16px); }
.mtab, .mo-tab { padding: 8px 16px; height: 38.3px; font-size: 14px; line-height: 21px; font-weight: 400; color: var(--odoo-body-color); background: var(--odoo-gray-100); border: 1px solid var(--o-border); border-bottom: 0;
  margin-bottom: -1px; border-radius: 0; white-space: nowrap; cursor: pointer; flex-shrink: 0; transition: color var(--dur); }
.mtab + .mtab, .mo-tab + .mo-tab { border-left: 0; }
.mtab:first-child, .mo-tab:first-child { border-top-left-radius: var(--r); }
.mtab:hover, .mo-tab:hover { color: var(--o-heading); }
.mtab.on, .mo-tab.on { color: var(--odoo-primary); background: var(--o-surface); border: 1px solid var(--odoo-primary); border-bottom: 1px solid var(--o-surface); border-radius: var(--r) var(--r) 0 0; font-weight: 400; }
[data-theme="dark"] .mtab.on, [data-theme="dark"] .mo-tab.on { color: var(--A); border-color: var(--A); }
.fin > .mtabs .mtab.on { background: var(--o-bg); border-bottom-color: var(--o-bg); }

/* ═════════════ WIZARD = FORM STATUSBAR (o_statusbar_status): white box, arrow steps, current = #E6F2F3 ═════════════ */
.wiz { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 0 0 8px; margin: 0; background: none; border: 0; border-radius: 0; }
.wiz-hdr { display: flex; align-items: center; margin: 0; padding: 0; border: 0; flex: 1 1 auto; min-width: 0; }
.wiz-ttl, .wiz-title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: var(--odoo-fs-h4); font-weight: 500; line-height: 1.5; color: var(--o-heading); }
.wiz-title svg { width: 16px; height: 16px; color: var(--o-text3); }
.wiz-steps { display: flex; align-items: center; justify-content: flex-start; gap: 0; padding: 2px; height: 32.3px; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.wiz-steps::-webkit-scrollbar { display: none; }
.ws { position: relative; display: inline-flex; align-items: center; gap: 4px; height: 27px; padding: 3px 18px; margin-left: -12px; flex-shrink: 0; cursor: pointer; background: transparent; border: 0;
  font-size: 14px; font-weight: 500; line-height: 21px; color: var(--o-text3);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%, 12px 50%); transition: background var(--dur); }
.ws:first-child { margin-left: 0; padding-left: 12px; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%); border-radius: 6px 0 0 6px; }
.ws:last-child { padding-right: 12px; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 12px 50%); border-radius: 0 6px 6px 0; }
.ws:first-child:last-child { clip-path: none; }
.ws:hover { background: var(--odoo-gray-100); }
.ws-num { display: none; }
.ws-txt { font-size: 14px; font-weight: 500; color: inherit; white-space: nowrap; }
.ws.done { color: var(--o-text); }
.ws.active { background: var(--odoo-teal-tint); color: var(--o-heading); }
.step-bar { display: flex; align-items: center; margin-bottom: 16px; }
.step-dot { width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 500; flex-shrink: 0; }
.step-dot.done { background: var(--odoo-success); color: #fff; } .step-dot.active { background: var(--o-action); color: #fff; } .step-dot.pending { background: var(--sec-lt); color: var(--o-text3); }
.step-line { flex: 1; height: 2px; background: var(--o-border); } .step-line.done { background: var(--odoo-success); }
.wiz-wrap { max-width: 1140px; margin: 0 auto; }

/* ═════════════ ESTIMATE BUILDER ═════════════ */
.tc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
.tc { display: flex; flex-direction: column; gap: 4px; padding: 10px 14px; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); transition: border-color var(--dur); min-width: 0; }
.tc:hover { border-color: var(--odoo-gray-400); }
.tc.tc-added { border-color: var(--odoo-success); box-shadow: inset 3px 0 0 var(--odoo-success); }
.tc-cat { font-size: var(--odoo-fs-small); color: var(--o-text3); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tc-name { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); line-height: 1.5; }
.tc-spec { font-size: var(--odoo-fs-small); color: var(--o-text3); line-height: 1.5; flex: 1; }
.tc-cost { font-size: 14px; font-weight: 500; color: var(--o-text); margin-top: 4px; font-variant-numeric: tabular-nums; }
.tc-actions { display: flex; gap: 8px; margin-top: 8px; flex-wrap: nowrap; }
.tc-actions .sm { height: 28px; padding: 0 8px; font-size: var(--odoo-fs-small); }
.tc-actions .tc-btn-add { flex: 1; }
/* one purple primary per area: "Configure BOMs" in the side panel is the primary; the cards' add buttons are secondary (Q4-9) */
.tc-btn-add { color: var(--o-link); }
.tc-btn-add.tc-btn-added { background: var(--ok-lt) !important; border-color: transparent !important; color: var(--ok-dk) !important; }
.sum { position: sticky; top: 0; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); padding: 16px; }
.sum-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 0; border-bottom: 1px solid var(--o-border); font-size: 14px; }
.sum-v { font-weight: 500; color: var(--o-text); font-variant-numeric: tabular-nums; white-space: nowrap; }
.sum-total { display: flex; align-items: center; justify-content: space-between; padding: 8px 0 4px; margin-top: 4px; border-top: 1px solid var(--o-heading); font-size: var(--odoo-fs-h3); font-weight: 700; }
.sum-total .sum-v { font-size: var(--odoo-fs-h3); font-weight: 700; color: var(--o-heading); }
.mg-row { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.mg-row input[type=range] { flex: 1; }
.mg-val { min-width: 44px; text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; }
.tx-T { color: var(--ok-text); }
.s4-header { border-bottom: 1px solid var(--o-border); }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin-bottom: 12px; }
.cat-card { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r); }
.cat-card input { flex: 1; }
.br-r { display: grid; grid-template-columns: 8px minmax(0, 1fr) 70px auto; align-items: center; gap: 8px; padding: 4px 0; font-size: var(--odoo-fs-small); color: var(--o-text); }
.br-r .br-bar { width: 100%; }
.br-r .mono { font-family: var(--ft); font-variant-numeric: tabular-nums; color: var(--o-text); }

/* ═════════════ KANBAN (o_kanban_view): column 332, card padding 10x14, radius 8 ═════════════ */
.kanban-wrap { display: flex; gap: 16px; overflow-x: auto; padding-bottom: 8px; align-items: flex-start; }
.kanban-col { width: 332px; padding: 0 16px 16px; flex-shrink: 0; }
.kanban-hdr { padding: 8px 0; font-size: var(--odoo-fs-h4); font-weight: 500; color: var(--o-text); }
.kanban-body { display: flex; flex-direction: column; gap: 8px; min-height: 80px; }
.kanban-card, .kn-card { background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); padding: 10px 14px; cursor: pointer; font-size: var(--odoo-fs-small); transition: border-color var(--dur); }
.kanban-card:hover, .kn-card:hover { border-color: var(--odoo-gray-400); }
.kn-card.dragging, .dragging { opacity: .5; }

/* ═════════════ LIST ROWS & MODULE WIDGETS ═════════════ */
.qlist-row, .user-row, .action-row { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--o-border); cursor: pointer; }
.qlist-row:hover, .action-row:hover { background: var(--o-row-hover); }
.action-row:last-child { border-bottom: 0; }
.action-row-icon { width: 32px; height: 32px; border-radius: var(--r); background: var(--odoo-primary-bg-subtle); display: flex; align-items: center; justify-content: center; color: var(--A); flex-shrink: 0; }
.action-row-info { flex: 1; min-width: 0; } .action-row-title { font-size: 14px; font-weight: 500; color: var(--o-heading); }
.action-row-sub, .action-row-end { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.compa-card, .company-card { padding: 16px; display: flex; align-items: center; gap: 16px; margin-bottom: 8px; transition: border-color var(--dur); }
.compa-card:hover, .company-card:hover { border-color: var(--odoo-gray-400); }
.compa-card.active-co, .company-card.active { border-color: var(--odoo-primary); background: var(--odoo-primary-active-bg); }
.company-avatar, .user-avatar { width: 40px; height: 40px; border-radius: var(--r); flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 500; color: #fff; background: var(--o-btn); }
.user-avatar { width: 24px; height: 24px; font-size: 11px; }
.cust-name { font-size: 14px; font-weight: 500; color: var(--o-text); } .cust-firm, .cust-meta { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.cust-phone { font-variant-numeric: tabular-nums; font-size: 14px; }
.pur-card-hdr { display: flex; align-items: flex-start; justify-content: space-between; padding: 16px; border-bottom: 1px solid var(--o-border); gap: 12px; }
.pur-card-meta { font-size: var(--odoo-fs-small); color: var(--o-text3); margin-top: 4px; }
.doc-item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: var(--r); background: var(--odoo-gray-100); margin-bottom: 8px; border: 1px solid var(--o-border); }
.doc-item-ico { font-size: 20px; flex-shrink: 0; } .doc-item-info { flex: 1; min-width: 0; }
.doc-item-name { font-size: 14px; font-weight: 500; color: var(--o-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-item-meta { font-size: 12px; color: var(--o-text3); }
.mc { display: flex; flex-direction: column; gap: 2px; } .mc-lbl { font-size: 12px; color: var(--o-text3); } .mc-val { font-size: 14px; font-weight: 500; color: var(--o-text); }
/* alerts (B2): subtle bg + emphasis text, radius 6, padding 8px 16px */
.notice { display: flex; align-items: flex-start; gap: 8px; padding: 8px 16px; border: 0; border-radius: var(--r); font-size: 14px; background: var(--odoo-info-bg-subtle); color: var(--odoo-info-text); }
.notice.warn { background: var(--odoo-warning-bg-subtle); color: rgb(98, 63, 4); }
.notice.ok { background: var(--odoo-success-bg-subtle); color: rgb(10, 80, 38); }
.notice.err { background: var(--odoo-danger-bg-subtle); color: rgb(96, 27, 27); }
[data-theme="dark"] .notice.warn { color: #F5D9A0; } [data-theme="dark"] .notice.ok { color: #A8E6C0; } [data-theme="dark"] .notice.err { color: #FFC7C7; }
.expiry-alert { border-radius: var(--r) !important; }

/* empty state (o_view_nocontent): illustration + title 20.1/700 + help 16.1 */
.empty, .empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; text-align: center; gap: 8px; color: var(--o-text); }
.empty-ico:empty, .empty-state-icon:empty { width: 120px; height: 80px; margin-bottom: 8px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 80'%3E%3Crect x='20' y='14' width='80' height='56' rx='8' fill='%23E7EBED'/%3E%3Crect x='30' y='26' width='40' height='6' rx='3' fill='%23CED4DA'/%3E%3Crect x='30' y='38' width='60' height='6' rx='3' fill='%23DEE2E6'/%3E%3Crect x='30' y='50' width='30' height='6' rx='3' fill='%23DEE2E6'/%3E%3Ccircle cx='92' cy='20' r='12' fill='%23714B67'/%3E%3Cpath d='M92 14v12M86 20h12' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; }
[data-theme="dark"] .empty-ico:empty { filter: brightness(.7) contrast(1.1); }
.empty-ico { font-size: 32px; } .empty-state-icon:not(:empty) { width: 56px; height: 56px; border-radius: 50%; background: var(--odoo-gray-100); display: flex; align-items: center; justify-content: center; }
.empty-title, .empty-state-title { font-size: 20.125px; font-weight: 700; line-height: 1.5; color: var(--o-heading); }
.empty-sub, .empty-state-sub { font-size: 16.1px; line-height: 1.5; color: var(--o-text); max-width: 420px; }
.empty .fw6 { color: var(--o-heading); font-size: 20.125px; font-weight: 700; }

/* ═════════════ SETTINGS (res.config.settings): block h2 on #E7EBED, rows 14/500 + muted description ═════════════ */
.appl-group { display: block; margin: 24px 0 0; padding: 11.2px 16px; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--o-heading); background: var(--odoo-gray-200);
  border: 1px solid var(--o-border); border-bottom: 0; border-radius: var(--r3) var(--r3) 0 0; }
.appl-group:first-child { margin-top: 0; }
.appl-group + .appl-section { border-radius: 0 0 var(--r3) var(--r3); }
.appl-section { background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); overflow: hidden; }
.appl-section-hdr { padding: 16px 16px 8px; font-size: 13px; font-weight: 700; text-transform: uppercase; color: var(--odoo-gray-700); }
.appl-section-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 16px; margin: 0; min-height: 56px; border-top: 1px solid var(--o-border); }
.appl-section-hdr + .appl-section-row { border-top: 0; }
.appl-row-l { flex: 1; min-width: 0; }
.appl-row-t { font-size: 14px; font-weight: 500; color: var(--o-text); }
.appl-row-d { font-size: 14px; color: var(--o-text3); margin-top: 0; line-height: 21px; }
.appl-row-r { flex-shrink: 0; display: flex; align-items: center; gap: 8px; }
.appl-row-r select, .appl-row-r .finp { width: auto; min-width: 140px; }
.co-btn { transition: transform var(--dur); } .co-btn:hover { transform: scale(1.12); }

@media (max-width: 991.98px) {
  .kpi-grid, .kpi-row, .kpi-row-4 { grid-template-columns: repeat(2, 1fr); }
  .kpi-row-3 { grid-template-columns: 1fr 1fr; }
  .bld-grid-2col, .s3-grid, .profile-grid { grid-template-columns: 1fr !important; }
  .sum { position: static; }
}
@media (max-width: 767.98px) {
  .fg-row-2, .fg-row-3, .fg-row-4, .mo-field-row { grid-template-columns: 1fr; }
  .fm-row { flex-direction: column; }
  .mo-field-row { flex-direction: column; gap: 0; }
  .mo-field-lbl { width: auto; padding-top: 0; }
  .pipeline { grid-template-columns: repeat(3, 1fr); }
  .pipe:nth-child(4) { border-left: 0; }
  .pipe:nth-child(n+4) { border-top: 1px solid var(--o-border); }
  .appl-section-row { flex-direction: column; align-items: flex-start; }
  .wiz { flex-direction: column; align-items: stretch; }
  .wiz-steps { width: 100%; }
  .ws { padding-left: 14px; padding-right: 8px; }
  .ws:first-child { padding-left: 10px; }
  .rt-wrap > table, .tbl-scroll > table { min-width: 640px; }
  .fg-row > *, .fm-row > *, .gr2 > *, .gr3 > *, .gr4 > * { min-width: 0; }
  /* iOS zooms into focused fields below 16px */
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), select, textarea, .finp { font-size: 16px; }
}
@media (max-width: 575.98px) {
  .gr3.bld-hdr-grid { grid-template-columns: 1fr; }
  .kpi-grid, .kpi-row, .kpi-row-4, .kpi-row-3 { grid-template-columns: 1fr 1fr; }
  .kpi-v, .kpi-v.lg { font-size: 18.2px; }
  .ws-txt { font-size: 12px; }
}

/* ═══════════════════════════════════════════════════════════════════
   WAVE 3 TEMPLATE SWEEP: classes that replaced inline style="" in js/app.js
   (tokens only; no hex colours in the app UI; Odoo numbers from ODOO_DESIGN_SYSTEM.md)
   ═══════════════════════════════════════════════════════════════════ */

/* ── small utilities ── */
.btn-block { width: 100%; justify-content: center; }
.fit { width: fit-content; }
.tx-c { text-align: center; }
.tx-strike { text-decoration: line-through; }
.tx-body { color: var(--o-text); }
.lbl-inline { display: inline-block; margin: 0; white-space: nowrap; }
.w22 { width: 22px; } .w28 { width: 28px; } .w40 { width: 40px; } .w52 { width: 52px; } .w55 { width: 55px; } .w60 { width: 60px; }
.w72 { width: 72px; } .w80 { width: 80px; } .w85 { width: 85px; } .w90 { width: 90px; } .w96 { width: 96px; } .w100 { width: 100px; }
.w105 { width: 105px; } .w110 { width: 110px; } .w160 { width: 160px; } .w190 { width: 190px; }
.mw80 { min-width: 80px; } .mw100 { min-width: 100px; } .mw155 { min-width: 155px; }
.tbl-x { overflow-x: auto; }
.box-p3 { padding: 12px; }
.card-tint { background: var(--odoo-gray-100); }
.auto-grid { display: grid; gap: 12px 16px; } .auto-grid-120 { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; } .auto-grid-160 { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.kv-l { font-size: var(--odoo-fs-small); font-weight: 500; color: var(--o-text3); }
.kv-v { font-weight: 500; color: var(--o-heading); }
.is-invalid, .is-invalid:focus { border-bottom-color: var(--odoo-danger) !important; box-shadow: 0 1px 0 0 var(--odoo-danger) !important; }
.opt-dim { color: var(--o-text3); }
.row-void { opacity: .6; } .row-done { opacity: .6; } .row-rev { background: var(--odoo-gray-100); }
.chbg-0 { background: var(--ch2); } .chbg-1 { background: var(--ch6); } .chbg-2 { background: var(--ch10); }
.chbg-3 { background: var(--ch14); } .chbg-4 { background: var(--ch3); } .chbg-5 { background: var(--ch12); }
.br-dot { width: 8px; height: 8px; border-radius: 50%; }
.br-amt { min-width: 58px; }
.empty-ico:not(:empty) { display: flex; justify-content: center; opacity: .45; }

/* progress bar colour variants */
.prog-fill.pf-ok, .pur-prog-fill.pf-ok { background: var(--odoo-success); }
.prog-fill.pf-a, .pur-prog-fill.pf-a { background: var(--odoo-primary); }
.prog-fill.pf-low { background: var(--odoo-danger); }
.prog-90 { width: 90px; margin-top: 0; }

/* ── clickable rows / tiles (keyboard: shell.js maps Enter/Space to click) ── */
.kpi[onclick], .pipe[onclick], .card-link[onclick], th[onclick], .mini-row, .bom-pick { cursor: pointer; }
tr[role="link"]:focus-visible, .kpi:focus-visible, .pipe:focus-visible, .card-link:focus-visible, th[tabindex]:focus-visible { outline: 2px solid var(--o-action); outline-offset: -2px; }

/* ── dashboard ── */
.chart-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; }
.chart-grid .dash-chart-wrap { border: 0; padding: 0; }
.act-scroll { max-height: 260px; overflow-y: auto; }
.act-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--odoo-primary); flex-shrink: 0; margin-top: 6px; }
.act-dot.dot-b { background: var(--ch2); } .act-dot.dot-t { background: var(--ch14); } .act-dot.dot-p { background: var(--ch6); } .act-dot.dot-n { background: var(--o-text3); }
.act-msg { font-size: 14px; color: var(--o-text); }
@media (max-width: 767.98px) { .chart-grid { grid-template-columns: 1fr; } }

/* ── lists ── */
.kpi-v.or { color: var(--warn-text); }
.pager { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border-top: 1px solid var(--o-border); }
.pager-info { font-size: var(--odoo-fs-small); color: var(--o-text3); }
input.rcvd-in { width: 56px; min-width: 0; text-align: center; padding: 3px 4px; }
.tot-row td { background: var(--odoo-gray-100); font-weight: 500; color: var(--o-text3); }
.pay-form { margin-top: 16px; padding: 12px; border: 1px solid var(--o-border); border-radius: var(--r3); background: var(--odoo-gray-100); }
.inv-no { font-size: var(--odoo-fs-h3); font-weight: 500; color: var(--A); }
.amt-lg { font-size: 16.8px; font-weight: 500; }
.gs-cnt { opacity: .7; font-size: 11px; }
.gs-chip svg { margin-right: 4px; }

/* ── recent panel ── */
button.recent-item { width: 100%; text-align: left; background: none; border: 0; }
.recent-ico { color: var(--o-text3); display: inline-flex; }
.recent-txt { display: flex; flex-direction: column; min-width: 0; }
.recent-nm { font-weight: 500; }
.recent-sub { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.recent-empty { padding: 16px; text-align: center; color: var(--o-text3); }

/* ── template picker dialog ── */
.tp-scroll { max-height: 440px; overflow-y: auto; }
.tp-cat { font-size: var(--odoo-fs-small); font-weight: 500; color: var(--o-text3); margin-bottom: 8px; }
.tp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
.tp-card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 10px 14px; text-align: left; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); transition: border-color var(--dur), background var(--dur); }
.tp-card:hover, .tp-card:focus-visible { border-color: var(--odoo-primary); background: var(--odoo-primary-active-bg); }
.tp-card-cat { font-size: 11px; font-weight: 500; text-transform: uppercase; color: var(--o-text3); }
.tp-card-name { font-weight: 500; color: var(--o-heading); }
.tp-card-spec { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.tp-card-cost { font-weight: 500; color: var(--A); font-variant-numeric: tabular-nums; }

/* ── wizard frame ── */
.ws:focus-visible { outline-offset: -3px; }
.step-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--o-border); }
.step-foot > :first-child { margin-right: auto; }
.step-foot-grp { display: inline-flex; flex-wrap: nowrap; align-items: center; gap: 8px; margin-left: auto; }   /* the right-hand buttons wrap together, Review never drops to a line of its own */
.step-foot-grp > button { white-space: nowrap; }
.step-foot-card { margin: 0 16px 16px; }
.bld-grid-2col { display: grid; grid-template-columns: 1fr 295px; gap: 16px; align-items: start; }
.s3-grid { grid-template-columns: 1fr 280px; }
@media (max-width: 991.98px) { .bld-grid-2col, .s3-grid, .profile-grid { grid-template-columns: 1fr; } }
.bom-sel-prod { min-width: 155px; }
.bom-spec { font-size: 11px; color: var(--o-text3); padding: 1px 4px; }
input.bom-qty-in { width: 64px; text-align: center; }
input.bom-rate-in { width: 80px; }
input.bom-note-in { min-width: 70px; }
.bom-sell { min-width: 60px; }
input.bom-name-in { min-width: 80px; max-width: 160px; font-weight: 500; }
input.bom-mk-in { width: 56px; text-align: center; }
.bom-batch-sel { max-width: 130px; }
.stepper { display: inline-flex; align-items: center; border: 1px solid var(--o-border-btn); border-radius: var(--r); overflow: hidden; }
.stepper button { padding: 2px 8px; line-height: 21px; font-weight: 500; background: var(--odoo-gray-100); color: var(--o-text); }
.stepper button:hover { background: var(--odoo-gray-200); }
.stepper input[type=number] { width: 44px; text-align: center; border: 0; border-left: 1px solid var(--o-border-btn); border-right: 1px solid var(--o-border-btn); border-radius: 0; padding: 2px 0; }
.bom-tabs { display: flex; align-items: flex-end; gap: 0; overflow-x: auto; overflow-y: hidden; padding: 8px 8px 0; background: var(--odoo-gray-100); border-bottom: 1px solid var(--o-border); }
.bom-tab { display: inline-flex; align-items: center; flex-shrink: 0; margin-bottom: -1px; border: 1px solid transparent; border-bottom: 0; border-radius: var(--r) var(--r) 0 0; }
.bom-tab.on { background: var(--o-surface); border-color: var(--o-border); border-top: 2px solid var(--odoo-primary); }
.bom-tab-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 8px 7px 14px; white-space: nowrap; color: var(--o-text); }
.bom-tab.on .bom-tab-btn { color: var(--odoo-primary); }
.bom-tab-cost { font-size: var(--odoo-fs-small); color: var(--o-text3); }
.bom-tab-x { padding: 2px 8px 2px 2px; color: var(--o-text3); font-size: 16px; line-height: 1; }
.bom-tab-x:hover { color: var(--odoo-danger); }
.bom-tab-add { padding: 7px 12px; color: var(--o-link); white-space: nowrap; flex-shrink: 0; }
.bom-tab-add:hover { color: var(--odoo-link-hover); }
.mini-tbl { width: 100%; }
.mini-tbl th, .mini-tbl td { padding: 4px 8px; }
.mini-row.on td { background: var(--odoo-primary-active-bg); }
.mini-tot td { font-weight: 500; border-top: 1px solid var(--o-border); }
.link-btn { color: var(--o-link); padding: 0 4px; vertical-align: middle; }
.link-btn:hover { color: var(--odoo-link-hover); }
/* step 3 */
.s3-tbl { width: 100%; }
.bom-pick.on td { background: var(--odoo-primary-active-bg); }
input.mk-in { width: 64px; text-align: center; }
.chg-row td { background: var(--odoo-gray-100); font-weight: 500; color: var(--o-text3); }
.chg-row.chg-neg td { background: var(--odoo-danger-bg-subtle); color: var(--err-dk); }
.s3-foot td { font-weight: 500; border-top: 1px solid var(--o-heading); background: var(--odoo-gray-100); }
.s3-foot td:last-child { font-size: 16.8px; }
.gst-box { padding: 12px; border-radius: var(--r); background: var(--odoo-primary-active-bg); }
input.disc-in { width: 96px; }
.disc-type { width: auto; min-width: 150px; }
input.disc-in.disc-on { border-bottom-color: var(--odoo-danger); color: var(--err-dk); font-weight: 500; }
.s3-side { position: sticky; top: 0; }
.s3-panel { display: flex; flex-direction: column; gap: 8px; padding: 12px; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); }
.sum-line { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: var(--odoo-fs-small); }
.sum-line[hidden] { display: none; }
.sum-line.tR, .sum-line.tR span { color: var(--err-text); }
.sum-line-top { padding-top: 8px; border-top: 1px solid var(--o-border); font-size: 14px; }
.sum-sep { border-top: 1px solid var(--o-border); }
.net-pay { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; padding: 12px 14px; background: var(--odoo-primary); border-radius: var(--r3); color: #fff; font-weight: 500; }
.net-pay-v { font-size: var(--odoo-fs-h2); font-weight: 700; }
@media (max-width: 991.98px) { .s3-side { position: static; } }
/* step 4 */
.s4-card { margin-bottom: 16px; }
.s4-header { padding: 16px 24px; }
.s4-co { font-size: var(--odoo-fs-h2); font-weight: 500; color: var(--o-heading); }
.s4-doc { font-size: 15.4px; font-weight: 500; letter-spacing: 0; color: var(--o-heading); }
.s4-bom-hdr { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.s4-tbl { width: 100%; }
.s4-totals { width: 100%; max-width: 420px; margin-left: auto; }
.s4-totals td { padding: 4px 0; color: var(--o-text3); }
.s4-totals .s4-top td { border-top: 1px solid var(--o-border); }
.s4-totals .s4-disc td { color: var(--err-text); }
.s4-totals .s4-net td { padding: 8px 12px; background: var(--odoo-primary-active-bg); font-weight: 500; color: var(--o-heading); }
.s4-totals .s4-net td:last-child { font-size: var(--odoo-fs-h3); font-weight: 700; color: var(--A); }
.s4-foot-body { padding-top: 0; }
.dlg-tbl { width: 100%; }
.dlg-tot td { font-weight: 500; border-top: 1px solid var(--o-heading); background: var(--odoo-gray-100); }

/* ── dialogs ── */
.dlg-text { line-height: 1.5; }
.dlg-scroll { max-height: 62vh; overflow-y: auto; padding-right: 4px; }
.dlg-step { font-size: var(--odoo-fs-small); font-weight: 500; color: var(--o-text3); margin-bottom: 8px; }
.opt-card { display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px; margin: 0; background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--r3); cursor: pointer; font-weight: 400; transition: border-color var(--dur), background var(--dur); }
.opt-card:hover { border-color: var(--odoo-gray-400); }
.opt-card:has(input:checked) { border-color: var(--odoo-primary); background: var(--odoo-primary-active-bg); }
.opt-card input { margin-top: 3px; flex-shrink: 0; }
.opt-card .fw6 { color: var(--o-heading); }
.ht-sec .card-hdr { justify-content: flex-start; }
.ht-num { width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--odoo-primary); color: #fff; font-size: var(--odoo-fs-small); font-weight: 500; flex-shrink: 0; }
.ht-desc { margin-bottom: 12px; line-height: 1.5; }
.ht-row { display: flex; gap: 8px; align-items: flex-start; font-size: var(--odoo-fs-small); }
.ht-k { min-width: 72px; font-weight: 500; color: var(--A); flex-shrink: 0; }
.ref-list { list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: var(--odoo-fs-small); color: var(--o-text3); }
.ref-list li::before { content: "\2022"; margin-right: 6px; color: var(--A); }
.kbd-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; background: var(--odoo-gray-100); border-radius: var(--r); }
.note-txt { padding-right: 24px; }
.note-del { position: absolute; top: 0; right: 0; padding: 2px 6px; color: var(--o-text3); font-size: 16px; line-height: 1; }
.note-del:hover { color: var(--odoo-danger); }
.share-msg { min-height: 220px; resize: vertical; }

/* ── company profile ── */
.profile-wrap, .settings-wrap { max-width: 900px; }
.settings-wrap .card { overflow: hidden; }
.appl-rows > .appl-section-row:first-child { border-top: 0; }
.profile-grid { align-items: start; }
.prefix-grid { grid-template-columns: 140px 1fr; align-items: end; }
.logo-img { object-fit: contain; }
.logo-img-profile { max-height: 80px; max-width: 200px; padding: 8px; border: 1px solid var(--o-border); border-radius: var(--r); background: #fff; }
.logo-img-preview { max-height: 50px; max-width: 120px; }
.logo-img-print { max-height: 65px; max-width: 150px; }
.logo-box { display: flex; align-items: center; justify-content: center; min-height: 110px; padding: 16px; background: var(--odoo-gray-100); border-radius: var(--r3); text-align: center; }
.logo-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 200px; padding: 16px 0; border: 1px dashed var(--odoo-gray-400); border-radius: var(--r3); color: var(--o-text3); font-size: var(--odoo-fs-small); }
.drop-zone { display: flex; align-items: center; gap: 8px; margin: 4px 0 0; padding: 8px 12px; border: 1px dashed var(--odoo-gray-400); border-radius: var(--r); background: var(--odoo-gray-100); color: var(--o-text3); cursor: pointer; font-weight: 400; }
.drop-zone:hover, .drop-zone:focus-within { border-color: var(--odoo-primary); background: var(--odoo-primary-active-bg); }
.opt-chip { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 0; padding: 5px 10px; border: 1px solid var(--o-border-btn); border-radius: var(--r); cursor: pointer; font-weight: 400; }
.opt-chip.on { border-color: var(--odoo-primary); background: var(--odoo-primary-active-bg); color: var(--odoo-primary); }
.hdr-preview { padding: 14px 16px; background: #fff; border: 1px solid var(--o-border); border-radius: var(--r); color: #212529; }
.hp-row { display: flex; align-items: center; gap: 16px; padding-bottom: 10px; border-bottom: 2px solid var(--odoo-primary); }
.hp-row.hp-between { justify-content: space-between; }
.hp-row.hp-center { flex-direction: column; text-align: center; }
.hp-name { font-size: 16.8px; font-weight: 500; color: var(--odoo-primary); }
.hp-sub { font-size: 12px; color: #495057; }
.tips-list { padding-left: 16px; line-height: 1.7; font-size: var(--odoo-fs-small); }

/* ── search bar (osb) ── */
.act-filter-wrap.grow { flex: 1; min-width: 200px; }
.osb-lens { margin-left: 9px; flex-shrink: 0; color: var(--o-text3); }
.osb-btn-x { padding: 0 8px; }
.osb-dir { color: var(--A); font-size: 11px; }
.cmd-ico2 { font-size: 11px; font-weight: 500; }

/* ═══════════════════════════════════════════════════════════════════
   WAVE 4 UI ROUND 2a (QA 4): visible controls, phone card rows, tabs, keyboard, contrast, touch targets
   ═══════════════════════════════════════════════════════════════════ */

/* ── text-safe tokens (Q4-10): plain text/numbers on page or white use these, fills keep the Odoo colours ── */
:root { --star-on: #8A5A00; --star-off: var(--odoo-gray-400); }
[data-theme="dark"] { --star-on: #F5C451; }
.stars, .star-on { color: var(--star-on); }
/* expiry badge: text-safe red on the soft red fill */
.tag.exp { background: var(--err-lt); color: var(--err-text); }
/* the company-header preview is a white sheet in both themes: it forces a light scheme */
.hdr-preview { color-scheme: light; --o-text: #212529; --o-text2: #495057; --o-text3: #495057; --o-heading: #000; --A: #714B67; --o-border: #DEE2E6; }
.hdr-preview, .hdr-preview * { color: #212529; }
.hdr-preview .hp-name { color: #714B67; } .hdr-preview .hp-sub { color: #495057; }

/* ── text that must not break the layout (Q4-5) ── */
.ell { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
td.ell { max-width: 0; }
.card, .tc, .kpi, .pipe, .pur-card-meta, .act-msg, .doc-item-name, .recent-nm, .tc-name, .tc-spec, .empty-sub { overflow-wrap: anywhere; }
table.fixed { table-layout: fixed; }
.rt-wrap > table.fixed { min-width: 900px; }
.rt-wrap > table.recent-tbl { min-width: 0; }
.w120 { width: 120px; } .w270 { width: 270px; } .w190 { width: 190px; }
.only-phone { display: none !important; }

/* ── sortable header = button inside th, aria-sort on th (Q4-6) ── */
.th-sort { display: inline-flex; align-items: center; gap: 4px; padding: 0; margin: 0; font: inherit; color: inherit; background: none; border: 0; cursor: pointer; text-align: inherit; white-space: nowrap; }
.th-sort:hover { color: var(--o-heading); }
.th-sort:focus-visible { outline: 2px solid var(--o-action); outline-offset: 2px; border-radius: 2px; box-shadow: none; }
.th-arrow { width: 10px; height: 10px; flex-shrink: 0; opacity: 0; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 8V2M2 5l3-3 3 3' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 8V2M2 5l3-3 3 3' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.th-sort:hover .th-arrow { opacity: .35; }
th[aria-sort="ascending"] .th-arrow, th[aria-sort="descending"] .th-arrow { opacity: 1; color: var(--o-action); }
th[aria-sort="descending"] .th-arrow { transform: rotate(180deg); }
th[aria-sort="ascending"], th[aria-sort="descending"] { color: var(--o-heading); }

/* ── clickable rows (Quotes row opens the quote) ── */
tr[data-qid]:focus-visible, tr[role="link"]:focus-visible { outline: 2px solid var(--o-action); outline-offset: -2px; }

/* ── row actions: icons on wide screens, a text menu on phones (Q4-4) ── */
.row-acts { display: flex; align-items: center; gap: 2px; flex-wrap: nowrap; }
.row-acts .xs { height: 30px; min-width: 30px; padding: 0 6px; }
.row-menu { display: none; position: relative; }
.row-more { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--r); border: 1px solid var(--o-border-btn); background: var(--o-surface); color: var(--o-text); cursor: pointer; list-style: none; }
.row-more::-webkit-details-marker { display: none; }
.row-more:hover { background: var(--odoo-gray-200); }
.row-more:focus-visible { outline: 0; box-shadow: var(--odoo-focus-ring); }
.row-menu[open] > .row-more { background: var(--o-action-lt); border-color: var(--o-action); color: var(--o-on-tint); }
.row-menu-pop { position: absolute; right: 0; bottom: calc(100% + 4px); z-index: 60; min-width: 220px; max-width: min(280px, 80vw); padding: 4px; display: flex; flex-direction: column;
  background: var(--o-surface); border: 1px solid var(--o-border); border-radius: var(--odoo-radius-xl); box-shadow: var(--odoo-popover-shadow); }
.menu-item { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; padding: 4px 12px; text-align: left; border-radius: var(--r); background: none; color: var(--o-text); font-size: 14px; }
.menu-item:hover { background: var(--o-hover); }
.menu-item.danger { color: var(--err-text); }
.menu-item svg { color: var(--o-text3); }

/* ── scroll hints: a soft shadow on the side that has more content (Q4-4) ── */
.rt-wrap, .tbl-scroll, .pm-wrap {
  background:
    linear-gradient(to right, var(--o-surface) 30%, transparent) left center / 36px 100% no-repeat local,
    linear-gradient(to left, var(--o-surface) 30%, transparent) right center / 36px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .22), transparent) left center / 14px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .22), transparent) right center / 14px 100% no-repeat scroll,
    var(--o-surface); }
[data-theme="dark"] .rt-wrap, [data-theme="dark"] .tbl-scroll, [data-theme="dark"] .pm-wrap {
  background:
    linear-gradient(to right, var(--o-surface) 30%, transparent) left center / 36px 100% no-repeat local,
    linear-gradient(to left, var(--o-surface) 30%, transparent) right center / 36px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(0, 0, 0, .6), transparent) left center / 14px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(0, 0, 0, .6), transparent) right center / 14px 100% no-repeat scroll,
    var(--o-surface); }

/* ── tab strips: role=tablist/tab, scroll sideways with an edge fade (Q4-4, Q4-6) ── */
@property --fade-l { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --fade-r { syntax: '<length>'; inherits: false; initial-value: 0px; }
@keyframes tab-edge { 0% { --fade-l: 0px; --fade-r: 28px; } 5% { --fade-l: 28px; } 95% { --fade-r: 28px; } 100% { --fade-l: 28px; --fade-r: 0px; } }
.mtabs, .mo-tabs, .bom-tabs, .inv-tabs, .tab-strip { scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 var(--fade-l), #000 calc(100% - var(--fade-r)), transparent 100%); }
.mtabs::-webkit-scrollbar, .mo-tabs::-webkit-scrollbar, .bom-tabs::-webkit-scrollbar, .inv-tabs::-webkit-scrollbar { display: none; }
@supports (animation-timeline: scroll()) {
  .mtabs, .mo-tabs, .bom-tabs, .inv-tabs, .tab-strip { animation: tab-edge linear both; animation-timeline: scroll(self inline); }
}
.inv-tabs { overflow-x: auto; flex-wrap: nowrap; }
.inv-tab { flex-shrink: 0; }
[role="tab"]:focus-visible { outline: 2px solid var(--o-action); outline-offset: -2px; }

/* ── Masters tables (Q4-2): the Active checkbox is visible again, the delete button is a real 32px icon button ── */
#cnt tbody input[type=checkbox], .iet td input[type=checkbox], .bom-t td input[type=checkbox], .pm-table input[type=checkbox], .mod-table td input[type=checkbox] {
  appearance: none; -webkit-appearance: none; display: inline-block; width: 14px !important; min-width: 14px; height: 14px !important; min-height: 14px; padding: 0 !important; margin: 0; vertical-align: -2px; cursor: pointer;
  border: 1px solid var(--o-check) !important; border-radius: 3.5px !important; background: var(--o-surface) center / 10px no-repeat !important; box-shadow: none !important; }
#cnt tbody input[type=checkbox]:checked, .iet td input[type=checkbox]:checked, .bom-t td input[type=checkbox]:checked, .pm-table input[type=checkbox]:checked, .mod-table td input[type=checkbox]:checked {
  background-color: var(--odoo-action) !important; border-color: var(--odoo-action) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.5 3.5 7.5-8' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; }
#cnt tbody input[type=checkbox]:focus-visible { outline: 2px solid var(--o-action); outline-offset: 2px; }
button.xs.bR { height: 32px; min-width: 32px; padding: 0 8px; }
button.xs.bR[title="Delete"] { width: 32px; padding: 0; }
button.xs.bR[title="Delete"] > svg { display: none; }
button.xs.bR[title="Delete"]::before { content: ''; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5.5h14M7.5 5.5V3.5h5v2M5 5.5l.8 11h8.4l.8-11M8.3 9v4.5M11.7 9v4.5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5.5h14M7.5 5.5V3.5h5v2M5 5.5l.8 11h8.4l.8-11M8.3 9v4.5M11.7 9v4.5'/%3E%3C/svg%3E") center / contain no-repeat; }

/* ── status pills: same padding with or without the select arrow (Q4-22) ── */
select.tag { padding: 3px 20px 3px 9.84px !important; background-position: right 7px center; background-size: 8px; }
.tag.tT.mono, .act-btns .tag { font-variant-numeric: tabular-nums; }

/* ── headings: one h1 per page = the page title in the control panel, looks unchanged (Q4-23) ── */
h1.tbar-title { margin: 0; font-size: 14px; font-weight: 500; line-height: 21px; }
.sh-title, .card-hdr-title { line-height: 1.5; }
.sh .sh-title { font-size: var(--odoo-fs-h5); font-weight: 500; color: var(--o-heading); margin: 0; }
.cmd-ico2 svg { width: 16px; height: 16px; }

/* ── dashboard (Q4-24, Q4-18) ── */
.pipeline { border-top: 0; }
.pipe { padding: 12px 16px; }
.dash-row { align-items: stretch; }
.chart-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.dash-chart-wrap { min-width: 0; }
.chart-link { display: block; border-radius: var(--r); }
.chart-link.card-link:hover { border-color: transparent; }
.dash-chart-wrap canvas { display: block; margin: 0 auto; }
.chart-toggle { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; font-size: var(--odoo-fs-small); }
.chart-data { margin-top: 8px; padding: 8px; background: var(--odoo-gray-100); border-radius: var(--r); }
.chart-data .mini-tbl th, .chart-data .mini-tbl td { padding: 4px 8px; font-size: var(--odoo-fs-small); height: auto; }
.kpi.hl { border-color: var(--o-border); }
.recent-tbl td, .recent-tbl th { padding-left: 8px; padding-right: 8px; }

/* ── Step 1 of the wizard: one column on phones, side panel from 992 (Q4-3) ── */
.s1-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.s1-side { position: sticky; top: 0; min-width: 0; }
.tc-grid { grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); }
.tc-actions { flex-wrap: wrap; }
.tc-actions .sm { min-width: 0; }
.tc-actions .tc-btn-add { flex: 1 1 100%; }
.tc-actions .tc-btn-prev, .tc-actions .tc-btn-cost { flex: 1 1 0; }
.tc-btn-cost { white-space: nowrap; }
@media (max-width: 991.98px) { .s1-grid { grid-template-columns: minmax(0, 1fr); } .s1-side { position: static; } }
@media (max-width: 767.98px) { .tc-grid { grid-template-columns: minmax(0, 1fr); } }

/* ═════════════ PHONES (below 768): card rows instead of wide tables (Q4-4) ═════════════ */
@media (max-width: 767.98px) {
  .only-phone { display: block !important; }
  select.only-phone { width: 100%; }
  .rt-wrap > table.cards, .tbl-scroll > table.cards, .rt-wrap > table.fixed { min-width: 0; }
  table.cards, table.cards tbody { display: block; width: 100%; }
  table.cards thead { display: none; }
  table.cards tr { display: grid; gap: 4px 8px; padding: 12px 16px; border-bottom: 1px solid var(--o-border); }
  table.cards tbody tr:last-child { border-bottom: 0; }
  table.cards tr > td { display: block; min-width: 0; padding: 0 !important; border: 0 !important; background: none !important; }
  table.cards td.ell { max-width: none; }
  table.cards .row-acts { display: none; }
  table.cards .row-menu { display: block; }
  /* quotes */
  table.q-table tr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "no st" "cu cu" "ti dt" "am ac"; align-items: center; }
  table.q-table .cr-no { grid-area: no; } table.q-table .cr-st { grid-area: st; justify-self: end; }
  table.q-table .cr-cu { grid-area: cu; } table.q-table .cr-ti { grid-area: ti; color: var(--o-text3); font-size: var(--odoo-fs-small); }
  table.q-table .cr-dt { grid-area: dt; color: var(--o-text3); } table.q-table .cr-am { grid-area: am; text-align: left; font-size: 16.8px; }
  table.q-table .cr-ac { grid-area: ac; justify-self: end; }
  table.q-table .cr-mk, table.q-table .cr-di { display: none; }
  /* invoices */
  table.inv-table tr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "no st" "cu cu" "am bl" "du ac"; align-items: center; }
  table.inv-table .cr-no { grid-area: no; } table.inv-table .cr-st { grid-area: st; justify-self: end; } table.inv-table .cr-cu { grid-area: cu; }
  table.inv-table .cr-am { grid-area: am; text-align: left; font-size: 16.8px; } table.inv-table .cr-bl { grid-area: bl; text-align: right; }
  table.inv-table .cr-du { grid-area: du; color: var(--o-text3); font-size: var(--odoo-fs-small); } table.inv-table .cr-ac { grid-area: ac; justify-self: end; }
  table.inv-table .cr-pd { display: none; }
  table.inv-table td[data-l]::before { content: attr(data-l) ' '; font-size: var(--odoo-fs-small); font-weight: 400; color: var(--o-text3); }
  table.inv-table tr.empty-row { display: block; }
  /* purchase items */
  table.pur-items tr { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "it rc" "br br" "sp sp" "qt tt" "up up"; align-items: center; }
  table.pur-items .cr-n, table.pur-items .cr-rt { display: none; }
  table.pur-items .cr-it { grid-area: it; } table.pur-items .cr-rc { grid-area: rc; justify-self: end; }
  table.pur-items .cr-br { grid-area: br; } table.pur-items .cr-sp { grid-area: sp; }
  table.pur-items .cr-qt { grid-area: qt; text-align: left; } table.pur-items .cr-qt::before { content: 'Qty '; font-weight: 400; color: var(--o-text3); }
  table.pur-items .cr-tt { grid-area: tt; text-align: right; } table.pur-items .cr-up { grid-area: up; text-align: left; }
  table.pur-items .cr-up::before { content: 'Received '; font-size: var(--odoo-fs-small); color: var(--o-text3); margin-right: 8px; }
  table.pur-items tr.tot-row { display: flex; justify-content: space-between; }
  table.pur-items tr.tot-row td:first-child { flex: 1; text-align: right; }
  table.pur-items tr.tot-row td:empty { display: none; }
  .pur-card-hdr { flex-direction: column; }
  .pur-card-hdr .act-btns { align-self: flex-start; }
  .chart-grid { grid-template-columns: minmax(0, 1fr); }
  .pipeline { grid-template-columns: repeat(2, 1fr); }
  .pipe { border-left: 0 !important; border-top: 1px solid var(--o-border); }
  .pipe:nth-child(-n+2) { border-top: 0; }
  .pipe:nth-child(even) { border-left: 1px solid var(--o-border) !important; }
  .pipe:nth-child(5) { grid-column: 1 / -1; border-left: 0 !important; }
  .recent-tbl th:nth-child(3), .recent-tbl td:nth-child(3) { display: none; }
}

/* ═════════════ TOUCH TARGETS (Q4-19): 40px minimum on phones and touch screens ═════════════ */
@media (pointer: coarse), (max-width: 768px) {
  button, .bA, .sm, .bG, .bT, .bB, .bR, .xs, .btn-danger, .icon-btn, .filter-chip, .inv-tab, .osb-btn, .appl-seg-btn, .menu-item, .th-sort, .link-btn, .o-menu-btn, .o-dd-item, .dd-item, .tp-card, .lu-card, .ni, .mo-close, .mtab, .mo-tab, .bom-tab-btn, .bom-tab-add, .o-notif-x, .recent-item {
    min-height: 40px; }
  .xs, .icon-btn, .icon-btn.sm, .mo-close, .hd-btn, .o-nav-btn, .o-notif-x, .row-acts .xs, button.xs.bR { min-width: 40px; }
  .xs, .row-acts .xs, button.xs.bR { height: 40px; }
  .icon-btn, .icon-btn.sm { height: 40px; }
  .hd-btn, .o-nav-btn, .o-brand, .o-menu-btn, .hd-company-chip, .hd-user-chip { min-height: 40px; }
  .o-nav { height: auto; min-height: calc(var(--nav-h) + var(--safe-t)); padding-top: calc(3px + var(--safe-t)); padding-bottom: 3px; }
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=hidden]), select, textarea, .finp { min-height: 40px; }
  select.tag { min-height: 32px; }
  .ws { height: 40px; min-height: 40px; }
  .wiz-steps { height: auto; }
  .stepper button { min-width: 40px; }
  .stepper input[type=number] { width: 56px; }
  /* checkboxes and radios: drawn 14px, hit area 40px (negative margin keeps the layout footprint) */
  input[type=checkbox], input[type=radio], #cnt tbody input[type=checkbox] { width: 40px !important; height: 40px !important; min-width: 40px; min-height: 40px; margin: -13px !important; padding: 0 !important; vertical-align: middle; border: 0 !important; border-radius: 0 !important;
    background-color: transparent !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 14px 14px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Crect x='.5' y='.5' width='13' height='13' rx='3.5' fill='none' stroke='%23ADB5BD'/%3E%3C/svg%3E") !important; }
  input[type=radio] { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Ccircle cx='7' cy='7' r='6.5' fill='none' stroke='%23ADB5BD'/%3E%3C/svg%3E") !important; }
  input[type=checkbox]:checked, #cnt tbody input[type=checkbox]:checked { background-color: transparent !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Crect x='0' y='0' width='14' height='14' rx='3.5' fill='%23017E84'/%3E%3Cpath d='M3.2 7.2l2.6 2.6 5-5.6' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; }
  input[type=radio]:checked { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Ccircle cx='7' cy='7' r='6.5' fill='none' stroke='%23017E84'/%3E%3Ccircle cx='7' cy='7' r='3.5' fill='%23017E84'/%3E%3C/svg%3E") !important; }
  label:has(> input[type=checkbox]), label:has(> input[type=radio]) { min-height: 40px; padding-left: 16px; }
  .tgl { min-height: 40px; }
  .tgl input[type=checkbox] { width: 100% !important; height: 100% !important; min-width: 0; min-height: 0; margin: 0 !important; background: none !important; }
  .pager .sm { min-width: 80px; }
}
/* aligned headers inside cards (the generic card th rule is more specific than the helper classes) */
table th.tx-r, table th.td-num, table th.td-r { text-align: right; }
table th.td-c, table th.tx-c { text-align: center; }
/* sort direction in the search-bar sort menu: an arrow drawn by CSS instead of a glyph */
.osb-dir { display: inline-block; width: 12px; height: 12px; background: currentColor; font-size: 0;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 8V2M2 5l3-3 3 3' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 8V2M2 5l3-3 3 3' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.osb-dir.desc { transform: rotate(180deg); }
@media (pointer: coarse), (max-width: 768px) {
  .tbar-acts > *, .hd-user-chip { min-width: 40px; }
  select.tag { min-height: 40px; }
  .skip-link { min-height: 0; }
}
@media (max-width: 991.98px) { .s1-side { order: -1; } }
@media (pointer: coarse), (max-width: 768px) {
  .iet td input, .iet td select, .bom-t td input, .bom-t td select, .pm-table input[type=number] { min-height: 40px; }
  .bom-t td input[type=number], .bom-t td input.bom-qty-in { min-width: 56px; }
  .bom-t td select { min-width: 120px; }
  .osb-btn { min-width: 40px; justify-content: center; }
  .tgl { width: 40px; height: 40px; }
  .tgl-s { inset: 12px 4px; }
}
/* contrast: number pills and the expiry text on a red alert use the text-safe tokens (Q4-10) */
.tag.tT.mono { color: var(--ok-text); }
.notice.err .tR { color: #9F2420; }
[data-theme="dark"] .notice.err .tR { color: var(--err-text); }
/* priority columns: on phones the less important columns are left out of the table (the row opens the full record) */
.ph-only { display: none; }
@media (max-width: 767.98px) {
  .ph-hide { display: none !important; }
  .ph-only { display: inline-block; }
  .rt-wrap > table.compact, .tbl-scroll > table.compact { min-width: 0; }
}
/* the search-bar filter menu and its pills are real buttons now (keyboard) */
button.osb-row { width: 100%; text-align: left; background: none; border: 0; font: inherit; }
button.osb-row:hover { background: var(--o-hover); }
.osb-row[aria-pressed="true"] { font-weight: 500; }
button.osb-pill { font: inherit; }
button.osb-pill:focus-visible { box-shadow: var(--odoo-focus-ring); outline: 0; }
.rate-reset { padding: 0 4px; vertical-align: middle; }
@media (pointer: coarse), (max-width: 768px) {
  .osb-row, .osb-pill, .rate-reset { min-height: 40px; }
  .rate-reset { min-width: 40px; }
}
/* tablets (768-991): the Quotes table keeps its priority columns (number, customer, date, amount, status) and shows the actions as a menu */
@media (max-width: 991.98px) {
  .rt-wrap > table.q-table { min-width: 0; }
  table.q-table .cr-ti, table.q-table .cr-mk, table.q-table .cr-di { display: none; }
  table.q-table .row-acts { display: none; }
  table.q-table .row-menu { display: block; }
  table.q-table th.w270 { width: 72px; }
  table.q-table th.w190 { width: 160px; }
  table.q-table .row-menu-pop { bottom: auto; top: calc(100% + 4px); }
}
@media (max-width: 767.98px) {
  table.q-table .cr-ti { display: block; }
  table.q-table .row-menu-pop { top: auto; bottom: calc(100% + 4px); }
}
@media (pointer: coarse), (max-width: 768px) {
  .bA, .sm, .bG, .bT, .bB, .bR, .btn-danger { min-width: 40px; }
}
/* a field the server or the form refused (customers editor, aria-invalid set by js/customers.js) */
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--err) !important; box-shadow: 0 1px 0 0 var(--err); }