/* Fázisszimmetria: harmadik kártya a grid és a PV mellett, azonos formában. */
.dlb-meter.phase-symmetry{border-left:3px solid var(--ink-3)}
.dlb-meter.phase-symmetry.even{border-left-color:var(--ok)}
.dlb-meter.phase-symmetry.mild{border-left-color:var(--warn)}
.dlb-meter.phase-symmetry.bad{border-left-color:var(--bad)}
.dlb-meter.phase-symmetry strong{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}

.phase-badge{padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;background:var(--hairline-2);color:var(--ink-2)}
.phase-symmetry.even .phase-badge{background:var(--ok-tint);color:var(--ok-ink)}
.phase-symmetry.mild .phase-badge{background:var(--warn-tint);color:var(--warn-ink)}
.phase-symmetry.bad .phase-badge{background:var(--bad-tint);color:var(--bad-ink)}

.phase-bar{display:grid;grid-template-columns:22px 1fr 50px;align-items:center;gap:6px;margin:2px 0;font-size:11px}
.phase-bar i{font-style:normal;color:var(--ink-3);font-weight:700}
.phase-bar span{height:7px;border-radius:4px;background:var(--hairline);overflow:hidden}
.phase-bar span b{display:block;height:100%;background:#0ca7a2;border-radius:4px}
.phase-bar.is-peak span b{background:var(--warn)}
.phase-symmetry.bad .phase-bar.is-peak span b{background:var(--bad)}
.phase-bar em{font-style:normal;text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-2)}

/* Fázistérkép: a csatlakozótáblázat fázisbekötés cellájában, a rögzített érték alatt. */
.phase-measured-wrap{margin-top:5px}
.phase-measured{display:block;color:var(--live-ink);font-size:10px;line-height:1.5}
.phase-measured b{color:var(--live-ink)}
.phase-measured i{font-style:normal;color:var(--ink-3)}
.phase-measured.empty{color:var(--ink-3);cursor:help;border-bottom:1px dotted var(--hairline);display:inline-block}
.phase-mismatch{display:inline-block;margin-top:3px;padding:2px 6px;border-radius:5px;background:var(--bad-tint);color:var(--bad-ink);font-size:10px;font-weight:700}

/* Fázisonkénti bontás a grid/PV kártyán: címke, teljesítmény, áram. */
.dlb-phases{display:grid;gap:2px;margin-top:2px}
.dlb-phases span{display:grid;grid-template-columns:22px 1fr;align-items:baseline;gap:8px}
.dlb-phases i{font-style:normal;color:var(--ink-3);font-weight:700}
/* A teljesítmény és az áram egyetlen elemben van, ezért a betűtípusuk nem tud
   elcsúszni egymástól. Balra zárt, tabuláris számokkal - így a fázisok
   értékei egymás alatt sorban állnak. */
.dlb-phases b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;text-align:left}

/* A két magyarázósor helye akkor is megvan, ha épp nincs mit odaírni: enélkül a
   kártya magassága a szöveg megjelenésekor változna, és a lista megugrana. */
.phase-symmetry .phase-peak{display:block;min-height:15px;color:var(--ink-3)}
.phase-symmetry .phase-note{display:block;min-height:30px}
.phase-symmetry.mild .phase-note,.phase-symmetry.bad .phase-note{color:var(--warn-ink)}
.phase-symmetry.even .phase-note{color:var(--ok-ink)}

/* A betöltés alatti váz halványabb, de ugyanakkora - így nem ugrál a sor. */
.dlb-meter.phase-symmetry.is-loading{opacity:.55}
.dlb-meter.phase-symmetry.is-loading strong{color:var(--ink-3)}
.dlb-meter.phase-symmetry.is-loading .phase-bar em{color:var(--ink-3)}
