/* Full-width card family; this layer changes presentation only. */
@media screen {
 #master:has(#masterForm.on){padding:8px 12px 18px;min-width:0}
 #master:has(#masterForm.on) .masterHead{min-height:41px;padding-bottom:8px}
 #master:has(#masterForm.on) .masterHead h1{font-size:28px;font-weight:400;text-align:center;margin:0 125px}
 #master:has(#masterForm.on) #masterClose{left:0;right:auto}
 #master #masterCardMode{display:none}
 #master:has(#masterForm.on) #masterCardMode{display:block;position:absolute;right:7px;top:9px;font-size:13px;color:#555}
 #master #masterForm{margin-top:9px;border:1px solid #c9c9ce;background:#fff;min-width:0;width:100%;box-shadow:none}
 #masterForm .tabs{background:#fff;border-bottom:1px solid #c9c9ce;min-height:35px;gap:0}
 #masterForm .tabBtn{height:35px;padding:8px 16px;border:0;border-right:1px solid #d5d5d9;border-bottom:2px solid transparent;background:#fff;font-size:13px;color:#666;white-space:nowrap}
 #masterForm .tabBtn.active{background:#f8f8fa;border-bottom-color:var(--t);color:var(--n);font-weight:400}
 #masterForm .tabBtn:disabled{color:#aaa;cursor:default}
 #masterForm .tabPanel{padding:16px 18px 20px;min-height:555px}
 #masterForm .masterGrid{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;align-items:start;font-size:12px;min-width:0}
 #masterForm .masterCardRow{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;align-items:center;min-width:0;min-height:27px}
 #masterForm .masterCardRow>label{grid-column:1;text-align:left;margin:0;color:#444;line-height:1.3}
 #masterForm .masterCardRow>input,#masterForm .masterCardRow>select,#masterForm .masterCardRow>textarea,#masterForm .masterCardRow>.checkLine{grid-column:2;width:100%;min-width:0}
 #masterForm .masterCardRow>input,#masterForm .masterCardRow>select{height:27px;min-height:27px;padding:4px 7px;border:1px solid #c4c4c8;border-radius:2px;background:#fff;color:#333}
 #masterForm .masterCardRow>textarea{min-height:78px;padding:6px 7px;border:1px solid #c4c4c8;border-radius:2px;resize:vertical;font:12px Arial}
 #masterForm .masterCardRow>small{grid-column:2;color:#777}
 #masterForm .masterCardRow>[readonly]{background:#f3f3f5;color:#62626a}
 #masterForm .masterCardRow.hidden,#masterForm .masterCardRow[hidden],#masterForm [hidden]{display:none!important}
 #masterForm .masterCardCheckRow>label{visibility:hidden}
 #masterForm .checkLine{display:flex;align-items:center;gap:7px;min-height:25px;font-size:12px;color:#333}
 #masterForm .checkLine input[type=checkbox]{width:14px;height:14px;min-height:14px;padding:0;margin:0;flex:none;accent-color:var(--t)}
 #masterForm #masterCardPaymentTerms{display:grid;gap:9px;min-width:0;margin:3px 0 1px 151px;padding:11px 12px;border:1px solid #d0d0d5;border-radius:2px}
 #masterForm #masterCardPaymentTerms .masterCardRow{grid-template-columns:150px minmax(0,1fr);gap:14px}
 #masterForm #masterCardPaymentTerms .masterCardCheckRow{grid-template-columns:minmax(0,1fr)}
 #masterForm #masterCardPaymentTerms .masterCardCheckRow>label{display:none}
 #masterForm #masterCardPaymentTerms .masterCardCheckRow>.checkLine{grid-column:1}
 #masterForm[data-master-card-kind=supplier] #masterCardPaymentTerms{margin:0;padding:0;border:0}
 #masterForm #masterCardAccounts{display:grid;gap:9px;min-width:0;border:1px solid #d0d0d5;border-radius:2px;padding:12px;margin:5px 0 0}
 #masterForm .masterCardItemChecks{display:grid;gap:7px;margin:2px 0}
 #masterForm .masterActions{border-top:1px solid #c9c9ce;background:#f9f9fb;min-height:49px;padding:9px 16px;text-align:right}
 #masterForm .masterActions button{font-size:12px;min-height:30px;margin-left:7px}
 #masterForm .masterActions button:disabled{cursor:default}
 #masterForm #masterCardCompatibility{float:left;margin-left:0;color:#666;background:transparent;border-color:#bbb}
 #masterForm #masterCardCompatibility[aria-pressed=true]{border-color:var(--t);color:var(--n)}
}
@media screen and (max-width:760px){
 #masterForm .tabPanel{padding:13px 12px;min-height:450px}
 #masterForm .masterCardRow,#masterForm #masterCardPaymentTerms .masterCardRow{grid-template-columns:135px minmax(0,1fr);gap:9px}
 #masterForm #masterCardPaymentTerms{margin-left:0}
 #master:has(#masterForm.on) .masterHead h1{font-size:23px;margin:0 86px}
 #masterForm .tabBtn{padding:8px 10px;font-size:12px}
}
/* Customer-card pixels, 1180 × 757 reference viewport: 25px controls / 28px row pitch.
   Keep the existing working actions and Llogarit colors; no unimplemented footer controls. */
@media screen and (min-width:761px) {
 #master:has(#masterForm.on){padding:8px 26px 18px 17px}
 #master:has(#masterForm.on) .masterHead{min-height:44px;padding:0 0 10px}
 #master:has(#masterForm.on) .masterHead h1{line-height:33px}
 #master:has(#masterForm.on) #masterCardMode{top:16px;right:0;color:var(--t);font-size:14px}
 #master #masterForm{margin-top:8px;border:0;background:transparent}
 #master #masterForm.on{display:flex;flex-direction:column;min-height:calc(100vh - 126px)}
 #masterForm .tabs{min-height:25px;height:25px;gap:7px;border-bottom:0;background:transparent}
 #masterForm .tabBtn{height:25px;padding:3px 14px;border:1px solid #d3d3d8;border-bottom:0;border-radius:4px 4px 0 0;background:#f5f5f7;color:#444;font-size:14px;font-weight:600}
 #masterForm .tabBtn.active{background:var(--t);border-color:var(--t);color:#fff;font-weight:600}
 #masterForm .tabPanel{min-height:0;padding:6px 13px 8px 12px;background:#fff;border-radius:0 0 6px 6px}
 #masterForm .masterGrid{gap:3px}
 #masterForm .masterCardRow{grid-template-columns:150px minmax(0,1fr);gap:6px;min-height:25px}
 #masterForm .masterCardRow>input,#masterForm .masterCardRow>select{height:25px;min-height:25px;padding:3px 5px;border-color:#d0d0d3;border-radius:4px}
 #masterForm .masterCardRow>select{background:#efefef;border-radius:0}
 #masterForm .masterCardRow>input[type=number]{text-align:right}
 #masterForm .masterCardRow>input:focus-visible,#masterForm .masterCardRow>select:focus-visible,#masterForm .masterCardRow>textarea:focus-visible{outline:2px solid var(--t);outline-offset:1px}
 #masterForm #masterCardPaymentTerms{gap:3px;margin:24px 0 3px;padding:18px 5px 13px;position:relative;border-color:#d3d3d3}
 #masterForm #masterCardPaymentTerms .masterCardRow{grid-template-columns:150px minmax(0,1fr);gap:4px}
 #masterForm[data-master-card-kind=client] #masterCardPaymentTerms::before{content:'Termat e pagesës';position:absolute;top:-8px;left:5px;padding:0 5px;background:#fff;color:#555;font-size:12px;font-weight:600;line-height:15px}
 #masterForm #masterCardPaymentTerms .masterCardCheckRow{grid-template-columns:minmax(0,1fr);min-height:28px;padding-left:12px}
 #masterForm[data-master-card-kind=client] [data-master-field=active],#masterForm[data-master-card-kind=supplier] [data-master-field=active]{grid-template-columns:minmax(0,1fr);padding-left:12px}
 #masterForm[data-master-card-kind=client] [data-master-field=active]>label,#masterForm[data-master-card-kind=supplier] [data-master-field=active]>label{display:none}
 #masterForm[data-master-card-kind=client] [data-master-field=active]>.checkLine,#masterForm[data-master-card-kind=supplier] [data-master-field=active]>.checkLine{grid-column:1;gap:9px}
 #masterForm[data-master-card-kind=supplier] #masterCardPaymentTerms{margin:0;padding:0;border:0}
 #masterForm #masterCardAccounts{gap:3px}
 #masterForm .masterActions{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:10px;min-height:67px;margin: auto 43px 0 33px;padding:12px 0 0;border-top:1px solid #d6d6d6;background:transparent}
 #masterForm .masterActions button{margin-left:0}
 #masterForm #masterCardCompatibility{position:absolute;left:0;bottom:0;float:none}
}