/* V7.3.1 - design, responsive layout and action reliability */
:root{--v10-action-h:42px}
html,body{max-width:100%;overflow-x:hidden}
button,a,input,select,textarea{font:inherit}
button,.btn,[role="button"]{touch-action:manipulation}
.btn{min-height:var(--v10-action-h);display:inline-flex;align-items:center;justify-content:center;gap:7px;line-height:1.25;white-space:normal;text-align:center}
.btn.tiny{min-height:36px}
.btn:focus-visible,.icon-btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 35%,transparent);outline-offset:2px}
.btn[disabled],button[disabled]{cursor:not-allowed;opacity:.55;filter:saturate(.55)}
.btn.v10-busy{pointer-events:none;position:relative;padding-inline-start:34px}
.btn.v10-busy:before{content:"";position:absolute;inset-inline-start:12px;width:13px;height:13px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:v10spin .75s linear infinite}
@keyframes v10spin{to{transform:rotate(360deg)}}
.page-host,.panel,.toolbar,.page-head,.cards-list,.table-wrap{min-width:0;max-width:100%}
.page-head{gap:14px}.page-actions,.row-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.row-actions>*{max-width:100%}
.v10-page-note{display:flex;align-items:flex-start;gap:10px;padding:11px 14px;margin:0 0 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-3);color:var(--muted)}
.v10-page-note b{color:var(--text);white-space:nowrap}.v10-page-note span{line-height:1.75}
.v10-source-chip,.v10-role-chip,.v10-action-chip{display:inline-flex;align-items:center;min-height:26px;padding:3px 9px;border-radius:999px;font-size:.78rem;font-weight:800;background:var(--surface-2);border:1px solid var(--line);color:var(--muted)}
.v10-source-chip.legacy{background:color-mix(in srgb,var(--accent) 12%,var(--surface));color:var(--accent)}
.v10-action-chip.danger{background:color-mix(in srgb,var(--danger) 10%,var(--surface));color:var(--danger)}
.v10-action-chip.warn{background:color-mix(in srgb,var(--warning) 15%,var(--surface));color:var(--warning-text,var(--text))}
.v10-action-chip.success{background:color-mix(in srgb,var(--success) 12%,var(--surface));color:var(--success)}

/* Customers are person-centric */
.v10-customers-page .toolbar{position:relative}
.v10-customer-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.v10-customer-card{display:grid;gap:14px;border-top:4px solid color-mix(in srgb,var(--primary) 70%,transparent)}
.v10-customer-card .v10-person-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.v10-person-identity{display:flex;align-items:center;gap:11px;min-width:0}
.v10-person-identity>div:last-child{display:grid;gap:3px;min-width:0}
.v10-person-identity b{font-size:1.04rem;overflow-wrap:anywhere}.v10-person-identity small{color:var(--muted);overflow-wrap:anywhere}
.v10-customer-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}
.v10-customer-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.v10-metric{display:grid;gap:4px;padding:10px;border-radius:12px;background:var(--surface-2);min-width:0}
.v10-metric span{font-size:.76rem;color:var(--muted)}.v10-metric b{overflow-wrap:anywhere}.v10-metric .money{font-size:.91rem}
.v10-next-action{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:12px;border:1px dashed var(--line);background:var(--surface-3)}
.v10-next-action span{color:var(--muted);font-size:.8rem}.v10-next-action b{font-size:.88rem;text-align:end}
.v10-customer-card .row-actions{padding-top:2px;border-top:1px solid var(--line)}
.v10-customer-card .row-actions .btn.primary{flex:1 1 130px}
.v10-customer-card .row-actions .btn:not(.primary),.v10-customer-card .row-actions a{flex:0 1 auto}

/* Contracts are document/financial-centric and intentionally different */
.v10-contract-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:14px}
.v10-contract-card{display:grid;gap:13px;border-inline-start:5px solid var(--primary);position:relative;overflow:hidden}
.v10-contract-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.v10-contract-title{display:grid;gap:4px;min-width:0}.v10-contract-number{font-size:1.12rem;font-weight:900;color:var(--primary);overflow-wrap:anywhere;text-align:start;padding:0}
.v10-contract-title small{color:var(--muted);overflow-wrap:anywhere}.v10-contract-tags{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}
.v10-contract-progress{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}.v10-contract-progress>i{display:block;height:100%;background:var(--success);border-radius:inherit;min-width:2px}
.v10-contract-money{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.v10-contract-money>div{display:grid;gap:4px;padding:9px;border-radius:11px;background:var(--surface-2);min-width:0}
.v10-contract-money span{font-size:.72rem;color:var(--muted)}.v10-contract-money b{font-size:.86rem;overflow-wrap:anywhere}
.v10-contract-dates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;border-block:1px solid var(--line);padding-block:10px}
.v10-contract-dates>div{display:grid;gap:3px}.v10-contract-dates span{font-size:.74rem;color:var(--muted)}.v10-contract-dates b{font-size:.86rem}
.v10-contract-card .row-actions .btn.primary{flex:1 1 130px}
.v10-table-identity{display:grid;gap:2px;min-width:150px}.v10-table-identity small{color:var(--muted)}
.v10-table-actions{display:flex;flex-wrap:wrap;gap:5px;min-width:180px}
.v10-table-actions .btn{min-height:34px;padding:6px 9px}
.v10-compact-contract{grid-template-columns:minmax(120px,1fr) minmax(130px,1fr) minmax(90px,.7fr) minmax(110px,.8fr) auto!important}

/* Legacy entry: real responsive rows, while keyboard navigation remains intact */
.v10-entry-grid{display:grid;grid-template-columns:52px minmax(190px,1.45fr) minmax(150px,1fr) minmax(150px,1fr) minmax(190px,1.2fr) 46px;gap:8px;align-items:center;overflow:visible}
.v10-grid-cell{display:block;min-width:0}.v10-grid-cell>span{display:none}.v10-grid-cell input,.v10-grid-cell select{width:100%;min-width:0}
.v10-entry-grid .legacy-row-no{align-self:stretch;display:grid;place-items:center;border-radius:10px;background:var(--surface-2);font-weight:800}
.v10-entry-grid .legacy-remove{min-width:42px;min-height:42px}
.v10-entry-help{display:none;color:var(--muted);font-size:.74rem;margin-top:3px}

/* Legacy schedule: editable in both quick and detailed modes */
.v10-schedule{display:grid;grid-template-columns:58px minmax(122px,1fr) minmax(125px,1fr) minmax(125px,1fr) minmax(122px,1fr) minmax(130px,1fr);gap:8px;align-items:center;overflow:visible}
.v10-schedule .legacy-row-no{align-self:stretch;display:grid;place-items:center;border-radius:10px;background:var(--surface-2);font-weight:800}
.v10-schedule .v10-grid-cell{position:relative}.v10-schedule input,.v10-schedule select{width:100%;min-width:0}
.v10-schedule .v10-paid-cell.has-payment input{border-color:var(--success);background:color-mix(in srgb,var(--success) 7%,var(--surface))}
.v10-schedule .v10-status-cell select[data-state="overdue"]{border-color:var(--danger);color:var(--danger)}
.v10-schedule .v10-status-cell select[data-state="partial"]{border-color:var(--warning);color:var(--warning-text,var(--text))}
.v10-schedule .v10-status-cell select[data-state="paid"]{border-color:var(--success);color:var(--success)}
.v10-fast-tip{display:flex;align-items:center;gap:7px;margin:8px 0 0;color:var(--muted);font-size:.8rem}

/* Safer dialogs, forms and grids */
dialog{max-width:min(94vw,980px)}.modal-card{max-width:100%;max-height:min(92vh,900px);overflow:auto}.form-grid>*{min-width:0}
.table-wrap{overflow:auto;overscroll-behavior-inline:contain}.data-table{min-width:760px}.data-table td,.data-table th{vertical-align:middle}
.toolbar{gap:9px;flex-wrap:wrap}.toolbar .search-box{flex:1 1 260px}.toolbar select{flex:0 1 190px}.view-switch{flex:0 0 auto}
.cards-list>*{min-width:0}.meta-grid>*{min-width:0}.panel-head{gap:10px;flex-wrap:wrap}
.document-card{position:relative;min-width:0}.document-card img{max-width:100%;height:auto}.doc-preview-dialog img{max-width:100%;max-height:75vh;object-fit:contain}
.v10-action-error{padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--danger) 9%,var(--surface));color:var(--danger)}

@media(max-width:1100px){
 .v10-contract-money{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v10-entry-grid{grid-template-columns:44px minmax(170px,1.4fr) minmax(140px,1fr) minmax(140px,1fr) minmax(160px,1fr) 42px;overflow:auto;padding-bottom:5px}
}
@media(max-width:760px){
 :root{--v10-action-h:44px}
 .page-host{padding-inline:10px}.page-head{align-items:stretch}.page-head>div:first-child{min-width:0}.page-actions{width:100%}.page-actions .btn{flex:1 1 130px}
 .v10-page-note{display:grid}.v10-page-note b{white-space:normal}
 .v10-customer-list,.v10-contract-list{grid-template-columns:1fr}
 .v10-customer-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.v10-customer-metrics .v10-metric:first-child{grid-column:1/-1}
 .v10-contract-money{grid-template-columns:repeat(2,minmax(0,1fr))}.v10-contract-dates{grid-template-columns:repeat(2,minmax(0,1fr))}.v10-contract-dates>div:last-child{grid-column:1/-1}
 .v10-customer-card .row-actions .btn,.v10-customer-card .row-actions a,.v10-contract-card .row-actions .btn,.v10-contract-card .row-actions a{flex:1 1 calc(50% - 8px)}
 .v10-entry-grid,.v10-schedule{display:block;overflow:visible;min-width:0!important}
 .v10-entry-grid>.legacy-grid-head,.v10-schedule>.legacy-grid-head{display:none}
 .v10-entry-grid>.legacy-row-no,.v10-schedule>.legacy-row-no{margin-top:12px;border-radius:12px 12px 0 0;min-height:36px;background:var(--primary);color:#fff}
 .v10-grid-cell{display:grid;grid-template-columns:105px minmax(0,1fr);align-items:center;gap:8px;padding:6px 8px;border-inline:1px solid var(--line);background:var(--surface)}
 .v10-grid-cell>span{display:block;font-size:.76rem;font-weight:800;color:var(--muted)}
 .v10-entry-grid .legacy-remove{width:100%;border-radius:0 0 12px 12px;border:1px solid var(--line);background:color-mix(in srgb,var(--danger) 7%,var(--surface));color:var(--danger);margin-bottom:5px}
 .v10-schedule .v10-status-cell{border-bottom:1px solid var(--line);border-radius:0 0 12px 12px;padding-bottom:10px;margin-bottom:4px}
 .v10-entry-help{display:block;grid-column:2}
 .v9-primary-fields{grid-template-columns:1fr 1fr!important}.v9-person-summary{grid-template-columns:1fr!important}
 .v9-mode-switch{top:68px}.v9-mode-switch button{min-height:44px}
 .legacy-paste-box{display:grid!important;grid-template-columns:1fr!important}.legacy-paste-box .btn{width:100%}
 dialog{width:100%;max-width:100%;height:auto;max-height:96dvh;margin:auto 0 0;border-radius:20px 20px 0 0}.modal-card{max-height:94dvh}
 .toolbar .search-box,.toolbar select,.toolbar .view-switch{flex:1 1 100%;width:100%}.view-switch{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr))}
 .data-table{min-width:700px}
}
@media(max-width:430px){
 .v10-person-head,.v10-contract-head{display:grid}.v10-customer-badges,.v10-contract-tags{justify-content:flex-start}
 .v10-customer-metrics,.v10-contract-money,.v10-contract-dates{grid-template-columns:1fr}.v10-customer-metrics .v10-metric:first-child,.v10-contract-dates>div:last-child{grid-column:auto}
 .v10-grid-cell{grid-template-columns:90px minmax(0,1fr)}
 .v9-primary-fields{grid-template-columns:1fr!important}
 .v10-customer-card .row-actions .btn,.v10-customer-card .row-actions a,.v10-contract-card .row-actions .btn,.v10-contract-card .row-actions a{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){.btn.v10-busy:before{animation-duration:1.4s}*{scroll-behavior:auto!important}}
/* Tabs and workflow steps must never leave the viewport. */
.settings-tabs{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));overflow:visible!important;gap:8px}
.settings-tabs button{width:100%;min-height:42px;white-space:normal!important;line-height:1.4}
@media(max-width:760px){
 .settings-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v9-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible!important;gap:6px}
 .v9-flow i{display:none}.v9-flow span{min-width:0;white-space:normal!important;text-align:center;padding:8px 5px;font-size:.78rem!important}
}
@media(max-width:390px){.settings-tabs{grid-template-columns:1fr 1fr}.v9-flow{grid-template-columns:1fr}.v9-flow span:not(.active){display:none}}
