/* Табло – по снимките от пленарната зала и hElectoralView (ElasticFocus.ES).
   Единицата --u мащабира всичко пропорционално при 16:9 (1u = 1% от височината). */

.board {
    --u: min(1vh, 0.5625vw);
    --blue-top-1: #5070c0;
    --blue-top-2: #2c4c9e;
    --blue-body-1: #2648a6;
    --blue-body-2: #1a3684;
    --blue-deep: #172d78;
    --line: rgba(200, 214, 255, .85);
    --red: #e3231b;
    --green-1: #63e36b;
    --green-2: #2fb53c;
    --dot-yes: #3fd24c;
    --dot-no: #ee2f27;
    --dot-abstain: #f4d31c;

    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    color: #fff;
    font-family: Arial, "Liberation Sans", Helvetica, sans-serif;
    background-color: #0e1e54;
    user-select: none;
    cursor: default;
}

/* ── горна лента ── */
.b-top {
    flex: 0 0 calc(var(--u) * 10);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 calc(var(--u) * 3.2);
    background-color: #18338c;
    border-bottom: calc(var(--u) * .35) solid var(--line);
    font-size: calc(var(--u) * 5);
    white-space: nowrap;
    text-shadow: 0 calc(var(--u) * .15) calc(var(--u) * .3) rgba(0, 0, 0, .35);
}

.b-top-title {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: calc(var(--u) * 3);
}

.b-gap { display: inline-block; width: calc(var(--u) * 3.5); }

/* ── големите числа (регистрация / подписка) ── */
.b-big {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: calc(var(--u) * 6);
    padding: 0 12% 0 11%;
}

.b-big-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: baseline;
    font-size: calc(var(--u) * 12);
    line-height: 1;
    text-shadow: 0 calc(var(--u) * .3) calc(var(--u) * .6) rgba(0, 0, 0, .35);
}

.b-big-row .val { min-width: 3.2ch; text-align: right; }

.b-big-petition { gap: calc(var(--u) * 4.5); }

.b-petition-title {
    font-size: calc(var(--u) * 4.6);
    color: #dfe7ff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── долна лента: статус (кворум) + таймер ── */
.b-bottom {
    flex: 0 0 calc(var(--u) * 13);
    display: grid;
    grid-template-columns: 62% calc(var(--u) * .6) 1fr;
    background: var(--blue-deep);
}

.b-status, .b-timer {
    display: flex;
    align-items: center;
    padding-right: 3%;
    justify-content: right;
    font-size: calc(var(--u) * 6.6);
    white-space: nowrap;
    overflow: hidden;
}

.b-status.bad { background-color: #f0342a; }
.b-status.ok  { background-color: #1d8d28; }
.b-status.info { background-color: #284a9c; font-size: calc(var(--u) * 5.2); }

.b-bottom-sep { background: var(--line); opacity: .5; }

.b-timer {
    background-color: #18338c;
    font-variant-numeric: tabular-nums;
    letter-spacing: .02em;
}

/* ── празно табло ── */
.b-idle {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(ellipse at 50% 40%, rgba(255, 255, 255, .06), transparent 60%);
}

.b-idle-title {
    max-width: 85%;
    text-align: center;
    font-size: calc(var(--u) * 7);
    color: rgba(255, 255, 255, .75);
}

/* ── гласуване: имена вляво, общо вдясно ── */
.b-vote {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: 1fr calc(var(--u) * .35) calc(var(--u) * 66);
    min-height: 0;
}

.b-vote::before {
    content: "";
    grid-column: 2;
    grid-row: 1;
    background: var(--line);
    opacity: .7;
}

.b-names {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: calc(var(--u) * 1.6) calc(var(--u) * 2.4) calc(var(--u) * 1.6) calc(var(--u) * 3.2);
}

.b-names-head {
    display: flex;
    justify-content: space-between;
    gap: calc(var(--u) * 2);
    font-size: calc(var(--u) * 3.3);
    color: #e9eeff;
    white-space: nowrap;
    margin-bottom: calc(var(--u) * 1);
}

.b-names-title { overflow: hidden; text-overflow: ellipsis; }
.b-names-page { color: #b9c8f4; font-variant-numeric: tabular-nums; }

.b-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-variant-numeric: tabular-nums;
}

.b-table th {
    font-weight: normal;
    font-size: calc(var(--u) * 2.9);
    color: #e9eeff;
    text-align: right;
    padding: 0 0 calc(var(--u) * .9);
    width: calc(var(--u) * 12);
}

.b-table th.c-name { width: auto; }

.b-table td {
    font-size: calc(var(--u) * 4.1);
    height: calc(var(--u) * 75 / var(--rows) - var(--u) * .1);
    max-height: calc(var(--u) * 6.4);
    text-align: right;
    white-space: nowrap;
    padding: 0;
}

.b-table td.c-name {
    text-align: left;
}

.b-table tr.absent td { color: rgba(255, 255, 255, .62); }

.dot {
    display: inline-block;
    width: calc(var(--u) * 2.4);
    height: calc(var(--u) * 2.4);
    border-radius: 50%;
    margin-right: calc(var(--u) * 1.6);
    vertical-align: calc(var(--u) * -.15);
    box-shadow: 0 0 0 calc(var(--u) * .25) rgba(255, 255, 255, .85);
}

.dot.yes     { background: radial-gradient(circle at 35% 35%, #b5f7b9, var(--dot-yes) 55%, #1f9b2a); }
.dot.no      { background: radial-gradient(circle at 35% 35%, #ffb3ae, var(--dot-no) 55%, #a8160f); }
.dot.abstain { background: radial-gradient(circle at 35% 35%, #fff4b0, var(--dot-abstain) 55%, #b39400); }
.dot.hidden  { background: radial-gradient(circle at 35% 35%, #ffffff, #c9d4f2 60%, #8a9cd0); }
.dot.none    { background: transparent; box-shadow: 0 0 0 calc(var(--u) * .25) rgba(255, 255, 255, .35); }

.b-totals {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    padding: calc(var(--u) * 1.6) calc(var(--u) * 3.2) calc(var(--u) * 2) calc(var(--u) * 3.6);
    font-variant-numeric: tabular-nums;
}

.b-totals-head {
    text-align: right;
    font-size: calc(var(--u) * 3.3);
    color: #e9eeff;
    margin-bottom: calc(var(--u) * 1.4);
}

.t-row {
    display: flex;
    justify-content: space-between;
    font-size: calc(var(--u) * 5.6);
    line-height: 1.32;
}

.t-gap { height: calc(var(--u) * 4.2); }

.b-result {
    margin-top: auto;
    padding: calc(var(--u) * .9) calc(var(--u) * 1.4);
    text-align: center;
    font-size: calc(var(--u) * 3.6);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.b-result.ok   { background-color: #1d8d28; }
.b-result.bad  { background-color: #f0342a; }
.b-result.info { background: linear-gradient(180deg, #4a6cc4 0%, #2d4ea3 100%); animation: pulse 1.6s ease-in-out infinite; }

.b-vote-timer {
    text-align: center;
    font-size: calc(var(--u) * 9.5);
    margin-top: calc(var(--u) * 1.6);
    letter-spacing: .02em;
}

@keyframes pulse {
    50% { filter: brightness(1.25); }
}

/* бутон за цял екран – вижда се само при посочване */
.b-fs {
    position: absolute;
    right: calc(var(--u) * 1);
    bottom: calc(var(--u) * 1);
    border: 0;
    background: rgba(0, 0, 0, .25);
    color: #fff;
    font-size: calc(var(--u) * 3);
    padding: 0 calc(var(--u) * 1);
    border-radius: calc(var(--u) * .6);
    opacity: 0;
    transition: opacity .2s;
    cursor: pointer;
}

.board:hover .b-fs { opacity: .8; }

@media (prefers-reduced-motion: reduce) {
    .b-result.info { animation: none; }
}

/* ── вградено табло (страницата на петицията): същият вид, мащабиран в 16:9 рамка ── */
.board.embedded {
    position: relative;
    inset: auto;
    width: 100%;
    aspect-ratio: 16 / 9;
    container-type: size;
    --u: 1cqh;
}

.board.embedded .b-fs { display: none; }

/* ── подписка: имена вляво (с изрично съгласие), общо вдясно ── */
.b-signers { list-style: none; margin: 0; padding: 0; }

.b-signers li {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: calc(var(--u) * 2.4);
    align-items: baseline;
    font-size: calc(var(--u) * 4.1);
    height: calc(var(--u) * 6.25);
    white-space: nowrap;
}

.b-signers .s-name { overflow: hidden; text-overflow: ellipsis; }
.b-signers .s-city { color: rgba(255, 255, 255, .72); font-size: calc(var(--u) * 3.4); }
.b-signers .s-time { color: rgba(255, 255, 255, .62); font-size: calc(var(--u) * 3.2); font-variant-numeric: tabular-nums; min-width: 5ch; text-align: right; }
.b-signers li:first-child .s-name::before {
    content: "";
    display: inline-block;
    width: calc(var(--u) * 2.4);
    height: calc(var(--u) * 2.4);
    border-radius: 50%;
    margin-right: calc(var(--u) * 1.6);
    background: var(--dot-yes);
    vertical-align: calc(var(--u) * -.15);
}

.b-signers-empty { font-size: calc(var(--u) * 3.6); color: rgba(255, 255, 255, .7); padding-top: calc(var(--u) * 4); }

.b-progress {
    height: calc(var(--u) * 2.2);
    background: rgba(255, 255, 255, .18);
    margin: calc(var(--u) * 1.4) 0 calc(var(--u) * 2.4);
}

.b-progress span { display: block; height: 100%; background: #1d8d28; }

.b-suspended {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(var(--u) * 5.5);
    text-align: center;
    padding: 0 10%;
}

/* ── QR код към терминала на таблото ── */
.b-big { position: relative; }

.b-qr {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--u) * 1.4);
    font-size: calc(var(--u) * 3);
    color: #dfe7ff;
}

.b-qr svg { display: block; width: calc(var(--u) * 38); height: calc(var(--u) * 38); }
.b-qr.big svg { width: calc(var(--u) * 52); height: calc(var(--u) * 52); }

.b-idle-qr { display: flex; align-items: center; gap: calc(var(--u) * 7); padding: 0 8%; width: 100%; }
.b-idle-side { display: flex; flex-direction: column; gap: calc(var(--u) * 3); min-width: 0; }
.b-idle-qr .b-idle-title { text-align: left; max-width: none; color: #fff; }
.b-idle-hint { font-size: calc(var(--u) * 4.2); color: #dfe7ff; max-width: 32ch; line-height: 1.3; }
.b-idle-url { font-size: calc(var(--u) * 3); color: #b9c8f4; word-break: break-all; }