/* Shared preview components, after the native and page-specific styles. */
/* X-editable uses icon-only buttons: text-button margins and baseline offsets
   otherwise move their check/cross glyphs away from the button centre. */
body.ph-ssr-active .editable-buttons>.btn>.glyphicon{margin:0;top:0}
body.ph-ssr-active .main-footer{border-top-color:var(--ph-lab-border)!important}
body.ph-ssr-active .invoice>.section,
body.ph-ssr-active .invoice>.notes{border-color:var(--ph-lab-border)}
body.ph-ssr-active #ph-invoice-layout .ph-invoice-sidebar .list-group>.ph-invoice-download{
 display:flex!important;align-items:center;justify-content:center;gap:8px;
 background:var(--ph-lab-tint)!important;color:var(--ph-lab-accent)!important;
 border:1px solid var(--ph-lab-border)!important;border-radius:7px!important;
 min-height:42px;line-height:1.5
}
body.ph-ssr-active #ph-invoice-layout .ph-invoice-sidebar .list-group>.ph-invoice-download:hover{
 border-color:var(--ph-lab-accent)!important
}
body.ph-ssr-active #ph-invoice-layout .ph-invoice-sidebar .list-group>.ph-invoice-download:focus-visible{
 outline:2px solid var(--ph-lab-accent);outline-offset:3px
}
body.ph-ssr-active .ph-funding-methods{border-bottom-color:var(--ph-lab-border)}
body.ph-ssr-active .ph-account[data-kind="funds"] .ph-funding-limits{border-top-color:var(--ph-lab-border)}
/* The retained polish sheet applies a fixed light-palette colour here. */
body.ph-ssr-active .ph-product-heading-meta .label.ph-service-active,
body.ph-ssr-active .ph-domain .label.ph-service-active{color:var(--ph-lab-text)!important}

/* Quota is service context, not a page-wide technical warning. The business
   module remains authoritative for whether an incident is still open. */
body.ph-ssr-active .ph-product-workspace>.ph-quota-card{
 display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:16px;
 align-items:center;margin:0;padding:20px 24px;
 border:0;border-bottom:1px solid var(--ph-lab-border);
 background:var(--ph-lab-soft);color:var(--ph-lab-text)
}
body.ph-ssr-active .ph-quota-card-icon{
 display:grid;place-items:center;width:40px;height:40px;border-radius:10px;
 background:var(--ph-lab-tint);color:var(--ph-lab-accent);font-size:17px
}
body.ph-ssr-active .ph-quota-card-content{min-width:0}
body.ph-ssr-active .ph-quota-card-heading{display:flex;gap:8px 20px;align-items:baseline;flex-wrap:wrap}
body.ph-ssr-active .ph-quota-card h2{margin:0;font-size:15px;font-weight:600;line-height:1.5;color:var(--ph-lab-text)}
body.ph-ssr-active .ph-quota-card-usage{display:inline-flex;gap:6px;flex-wrap:wrap;font-size:12px;line-height:1.6;color:var(--ph-lab-muted)}
body.ph-ssr-active .ph-quota-card-usage strong{font-weight:500;color:var(--ph-lab-text)}
body.ph-ssr-active .ph-quota-card p{margin:5px 0 0;font-size:13px;line-height:1.65;color:var(--ph-lab-muted);overflow-wrap:anywhere}
body.ph-ssr-active .ph-quota-card-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;max-width:290px}
body.ph-ssr-active .ph-quota-card-actions .btn{margin:0;min-height:36px;border-radius:6px;white-space:normal;font-size:12px;line-height:1.5}
@media(max-width:1100px){
 body.ph-ssr-active .ph-product-workspace>.ph-quota-card{grid-template-columns:40px minmax(0,1fr)}
 body.ph-ssr-active .ph-quota-card-actions{grid-column:2;justify-content:flex-start;max-width:none}
}
@media(max-width:575px){
 body.ph-ssr-active .ph-product-workspace>.ph-quota-card{padding:18px 16px;gap:12px;grid-template-columns:32px minmax(0,1fr);align-items:start}
 body.ph-ssr-active .ph-quota-card-icon{width:32px;height:32px;border-radius:8px;font-size:14px}
 body.ph-ssr-active .ph-quota-card-actions{grid-column:1/-1;gap:8px}
}