/* Dodatki panelu eFix Cloud (bazowy wygląd: app.css z panelu sterownika) */
.nav.no-main { display: none; }
main.full { margin-left: 0; }
.sites-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.site-card { cursor: pointer; }
.site-card:hover { border-color: var(--accent); }
.site-card .head { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.site-card .nm { font-weight: 650; font-size: 16px; }
.site-card .org { color: var(--muted); font-size: 12px; }
.site-card .nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 10px; }
.site-card .nums div { background: var(--panel2); border-radius: 8px; padding: 6px 8px; }
.site-card .nums .t { color: var(--muted); font-size: 11px; text-transform: uppercase; }
.site-card .nums .v { font-family: var(--mono); font-size: 15px; white-space: nowrap; }
.dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.dot.on { background: var(--ok); box-shadow: 0 0 6px var(--ok); } .dot.off { background: var(--err); } .dot.none { background: var(--muted); }
.keybox { font-family: var(--mono); background: var(--panel2); border: 1px dashed var(--accent); border-radius: 8px; padding: 10px;
  word-break: break-all; user-select: all; margin: 8px 0; }
.qr { background: #fff; padding: 10px; border-radius: 8px; display: inline-block; }
.qr img { display: block; width: 200px; height: 200px; image-rendering: pixelated; }
.steps { padding-left: 18px; } .steps li { margin: 4px 0; }
.filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.filters input, .filters select { width: auto; min-width: 180px; }
.vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0 24px; }
.vrow { display: flex; justify-content: space-between; gap: 10px; padding: 5px 2px; border-bottom: 1px solid var(--border); font-size: 14px; }
.vrow .v { font-family: var(--mono); white-space: nowrap; text-align: right; }
.role-admin { color: var(--accent); } .role-service { color: var(--info); } .role-client { color: var(--text); }
.login .sub { color: var(--muted); margin-top: -6px; }
.code-input { font-family: var(--mono); font-size: 22px; letter-spacing: 6px; text-align: center; max-width: 200px; }
.pill { white-space: nowrap; }
@media (max-width: 820px) {
  #user-pill { max-width: 110px; overflow: hidden; text-overflow: ellipsis; }
  .section-title { flex-wrap: wrap; }
}
.stale { color: var(--muted); font-style: italic; }

/* Logo: eFix + dopisek. Telefon/wąskie okno: „EMS”, szeroki ekran: „Energy Management System”.
   Dopisek podporządkowany logo: mniejszy, przygaszony, linia bazowa równo z dolną krawędzią logo. */
@font-face { font-family: "eFix Brand"; src: url("/brand-font.woff") format("woff"); font-weight: 700; font-display: swap; }
.brand { flex: none; align-items: baseline; gap: 7px; }
.brand img { display: block; }
.brand-sub { display: inline-block !important; font-family: "eFix Brand", "Segoe UI", Roboto, system-ui, sans-serif; font-weight: 700;
  color: #B8C4D3; line-height: 1; white-space: nowrap; }
.brand-sub .bs-short { font-size: 16px; letter-spacing: 1px; }
.brand-sub .bs-long { display: none; font-size: 15px; letter-spacing: .3px; }
@media (min-width: 1100px) {
  .brand-sub .bs-short { display: none; }
  .brand-sub .bs-long { display: inline; }
}