/* Shared sales components. Isolated names replace competing legacy metrics,
   ui-tab and payment-row rules; server data and action hooks are unchanged. */
html[data-passite-app] #view-commerce{--cw-line:var(--border);--cw-ink:var(--text);--cw-muted:var(--text-muted);--cw-bg:var(--surface);--cw-soft:var(--surface-muted)}
html[data-passite-app] #view-commerce>:is(.owner-commerce-panel,.commerce-panel){overflow:visible;border:1px solid var(--cw-line);border-radius:14px;background:var(--cw-bg);box-shadow:none}
html[data-passite-app] #view-commerce .panel-head{gap:20px;padding:22px 24px;align-items:center;background:transparent;border-bottom:1px solid var(--cw-line)}
html[data-passite-app] #view-commerce .panel-head h3{font-size:19px;line-height:1.35;margin:4px 0 0;letter-spacing:-.025em}
html[data-passite-app] #view-commerce .panel-head .kicker{font-size:10px;letter-spacing:.08em;color:var(--cw-muted)}
html[data-passite-app] #view-commerce .panel-note{font-size:12px;line-height:1.5;margin:7px 0 0;color:var(--cw-muted)}
html[data-passite-app] #view-commerce .tool-row{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px;min-width:0}
html[data-passite-app] #view-commerce :is(.btn.compact,.commerce-client-toggle){min-height:40px;height:auto;border-radius:9px;padding:9px 12px;font-size:12px;line-height:1.4;box-shadow:none}
html[data-passite-app] #view-commerce .commerce-client-filter{width:min(350px,100%);min-width:0}
html[data-passite-app] #view-commerce .commerce-client-toggle{width:100%;max-width:100%;background:var(--cw-bg);border:1px solid var(--cw-line)}
html[data-passite-app] #view-commerce .commerce-project-context{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0;padding:16px 24px;border:0;border-bottom:1px solid var(--cw-line);border-radius:0;background:transparent}
html[data-passite-app] #view-commerce .commerce-project-context>div{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
html[data-passite-app] #view-commerce .commerce-project-context strong{display:block;font-size:13px;line-height:1.5;font-weight:650;color:var(--cw-ink);overflow-wrap:anywhere}
html[data-passite-app] #view-commerce .commerce-project-context small{display:block;font-size:11px;line-height:1.5;color:var(--cw-muted);overflow-wrap:anywhere}
html[data-passite-app] #view-commerce .commerce-summary-strip{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:16px 24px;border:0;border-bottom:1px solid var(--cw-line);background:transparent}
html[data-passite-app] #view-commerce .commerce-summary-item{display:flex;align-items:center;justify-content:space-between;gap:18px;flex:0 1 auto;min-width:130px;min-height:48px;height:auto;margin:0;padding:10px 14px;border:1px solid var(--cw-line);border-radius:9px;background:var(--cw-bg);box-shadow:none;transform:none}
html[data-passite-app] #view-commerce .commerce-summary-item::before,html[data-passite-app] #view-commerce .commerce-summary-item::after{content:none}
html[data-passite-app] #view-commerce .commerce-summary-item>span{display:block;position:static;margin:0;color:var(--cw-muted);font-size:12px;font-weight:500;line-height:1.4;letter-spacing:0;text-transform:none;white-space:normal}
html[data-passite-app] #view-commerce .commerce-summary-item>strong{display:block;margin:0;color:var(--cw-ink);font-size:20px;line-height:1.2;font-weight:650;letter-spacing:-.025em;font-variant-numeric:tabular-nums;white-space:nowrap}
html[data-passite-app] #view-commerce .commerce-section-nav{display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:6px;margin:18px 24px 0;border:1px solid var(--cw-line);border-radius:11px;background:var(--cw-soft);box-shadow:none;overflow:visible}
html[data-passite-app] #view-commerce .commerce-section-tab{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto;min-height:38px;min-width:0;width:auto;padding:8px 13px;margin:0;border:1px solid transparent;border-radius:7px;outline-offset:3px;background:transparent;color:var(--cw-muted);font:inherit;font-size:13px;font-weight:550;line-height:1.4;text-align:center;text-decoration:none;box-shadow:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
html[data-passite-app] #view-commerce .commerce-section-tab::before,html[data-passite-app] #view-commerce .commerce-section-tab::after{content:none!important}
html[data-passite-app] #view-commerce .commerce-section-tab:hover{color:var(--cw-ink);background:color-mix(in srgb,var(--cw-bg) 70%,transparent)}
html[data-passite-app] #view-commerce .commerce-section-tab.active{color:var(--cw-ink);background:var(--cw-bg);border-color:var(--cw-line);box-shadow:0 1px 2px rgb(0 0 0 / .04);text-decoration:none}
html[data-passite-app] #view-commerce .commerce-section-tab:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
html[data-passite-app] #view-commerce .ps-tab-count{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:19px;padding:0 5px;margin:0;border-radius:5px;background:color-mix(in srgb,var(--cw-muted) 9%,transparent);color:var(--cw-muted);font-size:10px;font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
html[data-passite-app] #view-commerce .ps-tab-count.has-new{background:var(--ps-selected,var(--primary-soft));color:var(--ps-selected-ink,var(--primary))}
html[data-passite-app] #view-commerce :is(.owner-commerce-content,.commerce-content){min-height:0;padding:22px 24px 24px;margin:0;background:transparent}
html[data-passite-app] #view-commerce .commerce-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px}
html[data-passite-app] #view-commerce .commerce-section-heading h4{font-size:16px;font-weight:650;line-height:1.4;margin:0 0 4px}
html[data-passite-app] #view-commerce .commerce-section-heading p{font-size:12px;line-height:1.5;color:var(--cw-muted);margin:0}
html[data-passite-app] #view-commerce :is(.booking-list,.p75-catalog-list,.c75-catalog-list){display:grid;gap:12px;padding:0;margin:0;background:transparent}
html[data-passite-app] #view-commerce :is(.booking-card,.p75-catalog-row,.c75-catalog-row){border:1px solid var(--cw-line);border-radius:11px;box-shadow:none;background:var(--cw-bg);overflow-wrap:anywhere}
html[data-passite-app] #view-commerce .booking-card-head{padding:15px 18px;gap:18px;background:transparent;border-bottom:1px solid var(--cw-line)}
html[data-passite-app] #view-commerce .booking-card-body{padding:16px 18px;gap:18px;background:transparent}
html[data-passite-app] #view-commerce .booking-reference b{font-size:12px;line-height:1.5;letter-spacing:0;overflow-wrap:anywhere}
html[data-passite-app] #view-commerce .booking-info strong{font-size:14px;line-height:1.5;letter-spacing:0}
html[data-passite-app] #view-commerce :is(.booking-info small,.booking-reference small){font-size:12px;line-height:1.6;color:var(--cw-muted)}
html[data-passite-app] #view-commerce :is(.p75-catalog-row,.c75-catalog-row){padding:14px 16px;gap:16px}
html[data-passite-app] #view-commerce :is(.p75-catalog-copy,.c75-catalog-copy) b{font-size:14px;line-height:1.5}
html[data-passite-app] #view-commerce :is(.p75-catalog-copy,.c75-catalog-copy) p{font-size:12px;line-height:1.6;margin-top:5px}
html[data-passite-app] #view-commerce :is(.p75-settings-block,.c75-settings-block){margin:0 0 16px;padding:20px;border:1px solid var(--cw-line);border-radius:11px;background:var(--cw-bg);box-shadow:none}
html[data-passite-app] #view-commerce :is(.p75-settings-head,.c75-settings-head){margin-bottom:18px;gap:14px}
html[data-passite-app] #view-commerce :is(.p75-settings-head,.c75-settings-head) h4{font-size:16px;margin:4px 0 0}
html[data-passite-app] #view-commerce :is(.p75-settings-head,.c75-settings-head) p{font-size:12px;line-height:1.5;color:var(--cw-muted)}
html[data-passite-app] #view-commerce :is(.empty,.commerce-pick-client){min-height:150px;padding:28px 20px;background:transparent}
html[data-passite-app] #view-commerce .client-commerce-filter{padding:16px 24px 0;gap:10px;background:transparent;border:0}
/* Identical payment rows in owner, customer and acquiring history. */
html[data-passite-app] :is(.payment-list,.client-payment-list){container-type:inline-size}
html[data-passite-app] .ps-payment-entry{display:grid;grid-template-columns:minmax(0,1fr) 120px 160px 118px;align-items:center;gap:14px 18px;min-width:0;padding:18px 0;margin:0;border:0;border-bottom:1px solid var(--border);border-radius:0;background:transparent;box-shadow:none;color:var(--text)}
html[data-passite-app] .ps-payment-entry:first-child{padding-top:4px}html[data-passite-app] .ps-payment-entry:last-child{border-bottom:0;padding-bottom:4px}
html[data-passite-app] .ps-payment-main{display:flex;flex-direction:column;gap:5px;min-width:0}
html[data-passite-app] .ps-payment-reference{display:block;min-width:0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;font-weight:600;line-height:1.6;letter-spacing:0;overflow-wrap:anywhere;word-break:normal;color:var(--text)}
html[data-passite-app] .ps-payment-description{display:block;font-size:12px;line-height:1.6;color:var(--text-muted);overflow-wrap:anywhere}
html[data-passite-app] .ps-payment-provider{display:block;font-size:11px;line-height:1.4;color:var(--text-muted)}
html[data-passite-app] .ps-payment-amount{justify-self:end;font-size:15px;font-weight:650;line-height:1.5;letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums}
html[data-passite-app] .ps-payment-status{display:inline-flex;justify-self:start;align-items:center;gap:7px;width:fit-content;max-width:100%;padding:5px 8px;border-radius:6px;background:var(--surface-muted);color:var(--text-muted);font-size:11px;font-weight:550;font-style:normal;line-height:1.45;white-space:normal}
html[data-passite-app] .ps-payment-status i{height:5px;width:5px;flex:0 0 5px;border-radius:50%;background:currentColor}
html[data-passite-app] .ps-payment-status[data-state=paid]{color:#246c50;background:#ecf6ef}
html[data-passite-app] .ps-payment-status:is([data-state=pending],[data-state=processing],[data-state=hold]){color:#8a611a;background:#fff8e9}
html[data-passite-app] .ps-payment-status:is([data-state=error],[data-state=declined]){color:#ad3936;background:#fff0ee}
html[data-passite-app] .ps-payment-date{justify-self:end;color:var(--text-muted);font-size:11px;line-height:1.5;text-align:right;font-variant-numeric:tabular-nums;white-space:normal}
html[data-passite-app] .ps-payment-actions{grid-column:1/-1;justify-self:end}
html[data-passite-app] .commerce-payment-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:160px;padding:24px;text-align:center;color:var(--text-muted)}
html[data-passite-app] .commerce-payment-empty svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;margin-bottom:5px}.commerce-payment-empty b{font-size:14px;color:var(--text)}.commerce-payment-empty span{font-size:12px;line-height:1.5}
html[data-passite-app][data-theme=dark] .ps-payment-status[data-state=paid]{background:#19372b;color:#9ed8ba}html[data-passite-app][data-theme=dark] .ps-payment-status:is([data-state=pending],[data-state=processing],[data-state=hold]){background:#362e1e;color:#ebcb90}html[data-passite-app][data-theme=dark] .ps-payment-status:is([data-state=error],[data-state=declined]){background:#3b2528;color:#f4aaa4}
@container(max-width:760px){html[data-passite-app] .ps-payment-entry{grid-template-columns:minmax(0,1fr) auto;gap:10px 16px}html[data-passite-app] .ps-payment-main{grid-column:1;grid-row:1/3}html[data-passite-app] .ps-payment-amount{grid-column:2;grid-row:1}html[data-passite-app] .ps-payment-status{grid-column:2;grid-row:2;justify-self:end}html[data-passite-app] .ps-payment-date{grid-column:1/-1;grid-row:3;justify-self:start;text-align:left}}
@media(max-width:900px){html[data-passite-app] #view-commerce .panel-head{align-items:flex-start;flex-wrap:wrap}html[data-passite-app] #view-commerce .tool-row{justify-content:flex-start;width:100%}html[data-passite-app] #view-commerce .commerce-client-filter{flex:1 1 240px;width:auto;max-width:420px}}
@media(max-width:640px){html[data-passite-app] #view-commerce .panel-head{padding:18px 16px;gap:16px}html[data-passite-app] #view-commerce :is(.commerce-project-context,.commerce-summary-strip){padding:14px 16px}html[data-passite-app] #view-commerce .commerce-summary-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}html[data-passite-app] #view-commerce .commerce-summary-item{min-width:0;min-height:46px;padding:10px;gap:8px}html[data-passite-app] #view-commerce .commerce-summary-item>span{font-size:11px}html[data-passite-app] #view-commerce .commerce-summary-item>strong{font-size:18px}html[data-passite-app] #view-commerce .commerce-section-nav{margin:16px 16px 0;gap:4px}html[data-passite-app] #view-commerce .commerce-section-tab{min-height:40px;flex:1 0 auto;padding:8px 10px;font-size:12px}html[data-passite-app] #view-commerce :is(.owner-commerce-content,.commerce-content){padding:18px 16px}html[data-passite-app] #view-commerce .commerce-section-heading{gap:12px}html[data-passite-app] #view-commerce .commerce-section-heading .btn{width:100%}html[data-passite-app] #view-commerce :is(.p75-settings-block,.c75-settings-block){padding:16px}html[data-passite-app] #view-commerce :is(.booking-card-head,.booking-card-body){padding:14px}html[data-passite-app] #view-commerce .client-commerce-filter{padding:14px 16px 0}}
@media(max-width:540px){html[data-passite-app] .ps-payment-entry{grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:16px 0}html[data-passite-app] .ps-payment-main{grid-column:1/-1;grid-row:auto}html[data-passite-app] .ps-payment-amount{grid-column:1;grid-row:auto;justify-self:start}html[data-passite-app] .ps-payment-status{grid-column:2;grid-row:auto;justify-self:end}html[data-passite-app] .ps-payment-date{grid-column:1/-1;grid-row:auto;justify-self:start;text-align:left}}
@media(prefers-reduced-motion:reduce){html[data-passite-app] #view-commerce .commerce-section-tab{transition:none}}
@media(forced-colors:active){html[data-passite-app] #view-commerce .commerce-section-tab.active{outline:2px solid Highlight;outline-offset:-2px}html[data-passite-app] .ps-payment-status{border:1px solid CanvasText}}
