/* =====================================================================
   Jurat cu fotografie — folosit pe ecranul de sala si in panoul admin.
   Pana la vot: poza alb-negru, inel auriu discret.
   Dupa vot: poza color, inel verde desenat circular, halou verde, bifa.
   ===================================================================== */
:root {
    --vote-ok: #7FCB9C;
    --vote-ok-glow: rgba(127, 203, 156, .5);
    --late-warn: #F2C94C;
    --late: #E0594C;
    --outlier: #F29B4C;
}

.judge-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--tile-min, 104px), 1fr));
    gap: var(--tile-gap, 1.1rem);
}

.judge-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .45rem;
    text-align: center;
    min-width: 0;
    transition: opacity .4s ease;
}

.judge-tile__photo {
    position: relative;
    display: block;
    width: var(--tile-photo, 84px);
    height: var(--tile-photo, 84px);
    flex: none;
    border-radius: 50%;
    background: #1b1813;
    box-shadow: 0 0 0 2px rgba(201, 160, 82, .26), 0 6px 18px rgba(0, 0, 0, .35);
    transition: box-shadow .5s ease, transform .5s ease;
}

.judge-tile__photo img,
.judge-tile__initials {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    display: grid;
    place-items: center;
}

/* Alb-negru pana la vot, color dupa vot. */
.judge-tile__photo img {
    filter: grayscale(1) brightness(.78) contrast(1.05);
    transition: filter .9s ease;
}

.judge-tile__initials {
    font-family: "Bodoni Moda", Georgia, serif;
    font-size: calc(var(--tile-photo, 84px) * .34);
    color: var(--gold-300, #E6C88A);
    background: radial-gradient(circle at 30% 25%, #2a2317, #15120d);
}

/* Inelul verde: un cerc SVG care se deseneaza pe circumferinta. */
.judge-tile__ring {
    position: absolute;
    inset: -7%;
    width: 114%;
    height: 114%;
    transform: rotate(-90deg);
    pointer-events: none;
    overflow: visible;
}

.judge-tile__ring circle {
    fill: none;
    stroke: var(--vote-ok);
    stroke-width: 3.2;
    stroke-linecap: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
    filter: drop-shadow(0 0 4px var(--vote-ok-glow));
    transition: stroke-dashoffset 1.1s cubic-bezier(.65, 0, .35, 1), stroke .4s ease;
}

.judge-tile__check {
    position: absolute;
    right: -2px;
    bottom: -2px;
    width: 1.6em;
    height: 1.6em;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: calc(var(--tile-photo, 84px) * .18);
    font-weight: 700;
    color: #0b1a11;
    background: var(--vote-ok);
    box-shadow: 0 0 0 3px #0c0b09;
    opacity: 0;
    transform: scale(.4);
    transition: opacity .35s ease .8s, transform .35s cubic-bezier(.2, 1.4, .4, 1) .8s;
    z-index: 2;
}

/* Plăcuța cu numărul scaunului, ca la masa juriului. */
.judge-tile__seat {
    display: inline-block;
    margin-top: .2rem;
    padding: .1rem .55rem;
    border-radius: 4px;
    border: 1px solid rgba(201, 160, 82, .35);
    background: linear-gradient(180deg, rgba(201, 160, 82, .16), rgba(201, 160, 82, .05));
    font-size: var(--tile-seat, .62rem);
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--gold-300, #E6C88A);
    font-variant-numeric: tabular-nums;
}

.judge-tile__name {
    font-size: var(--tile-name, .95rem);
    font-weight: 600;
    line-height: 1.2;
    color: var(--text-100, #F4EFE6);
    overflow-wrap: anywhere;
    transition: color .5s ease;
}

.judge-tile__meta {
    font-size: .8rem;
    color: var(--text-500, #A79F90);
    font-variant-numeric: tabular-nums;
}

/* ---- Votat ---- */
.judge-tile.has-voted .judge-tile__photo {
    box-shadow: 0 0 0 2px rgba(127, 203, 156, .2), 0 0 34px 6px var(--vote-ok-glow);
}
.judge-tile.has-voted .judge-tile__photo img { filter: none; }
.judge-tile.has-voted .judge-tile__ring circle { stroke-dashoffset: 0; }
.judge-tile.has-voted .judge-tile__check { opacity: 1; transform: scale(1); }
.judge-tile.has-voted .judge-tile__name { color: #C9F0D8; }

.judge-tile.just-voted .judge-tile__photo { animation: vote-pop 1.4s ease-out; }

@keyframes vote-pop {
    0%   { transform: scale(1); }
    25%  { transform: scale(1.12); }
    100% { transform: scale(1); }
}

/* ---- Explozie de particule la vot ---- */
.vote-burst {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 3;
}

.vote-burst i {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 7%;
    height: 7%;
    min-width: 4px;
    min-height: 4px;
    border-radius: 50%;
    background: var(--vote-ok);
    box-shadow: 0 0 8px var(--vote-ok);
    opacity: 0;
    animation: burst 1.1s cubic-bezier(.2, .8, .3, 1) var(--delay, 0ms) forwards;
}

.vote-burst i.is-gold { background: #E6C88A; box-shadow: 0 0 8px #E6C88A; }

@keyframes burst {
    0%   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
    100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(.3); }
}

/* ---- Presedintele juriului: rama aurie, putin mai mare ---- */
.judge-tile.is-president .judge-tile__photo {
    transform: scale(1.1);
    box-shadow: 0 0 0 3px #C9A052, 0 0 0 6px rgba(201, 160, 82, .22), 0 8px 26px rgba(0, 0, 0, .45);
}
.judge-tile.is-president.has-voted .judge-tile__photo {
    box-shadow: 0 0 0 3px #C9A052, 0 0 34px 6px var(--vote-ok-glow);
}
.judge-tile.is-president .judge-tile__name::after {
    content: "Președinte";
    display: block;
    margin-top: .15rem;
    font-size: .72em;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--gold-400, #C9A052);
}

/* ---- Abtinut: estompat, cu o linie fina peste poza ---- */
.judge-tile.is-recused { opacity: .42; }
.judge-tile.is-recused .judge-tile__photo { box-shadow: 0 0 0 1px rgba(255, 255, 255, .14); }
.judge-tile.is-recused .judge-tile__photo::after {
    content: "";
    position: absolute;
    left: 8%;
    right: 8%;
    top: 50%;
    height: 2px;
    background: rgba(255, 255, 255, .55);
    transform: rotate(-35deg);
    border-radius: 2px;
    z-index: 2;
}

/* ---- Panou admin: semafor si nota atipica ---- */
.judge-tile.is-late-warn .judge-tile__photo { box-shadow: 0 0 0 3px var(--late-warn), 0 0 22px rgba(242, 201, 76, .4); }
.judge-tile.is-late .judge-tile__photo,
.judge-tile.is-lagging .judge-tile__photo { box-shadow: 0 0 0 3px var(--late), 0 0 24px rgba(224, 89, 76, .5); animation: late-pulse 1.8s ease-in-out infinite; }
.judge-tile.is-outlier .judge-tile__photo { box-shadow: 0 0 0 3px var(--outlier), 0 0 26px rgba(242, 155, 76, .55); }
.judge-tile.is-outlier .judge-tile__meta { color: var(--outlier); font-weight: 700; }

@keyframes late-pulse { 50% { box-shadow: 0 0 0 3px var(--late), 0 0 38px rgba(224, 89, 76, .75); } }

@media (prefers-reduced-motion: reduce) {
    .judge-tile.just-voted .judge-tile__photo,
    .judge-tile.is-late .judge-tile__photo { animation: none; }
    .judge-tile__ring circle { transition: none; }
}

/* Lista juratilor din admin: pozele raman color (nu e o stare de vot). */
.table-x .judge-tile__photo img { filter: none; }

/* ---- Jurat in pauza (#20) ---- */
.judge-tile.is-away { opacity: .6; }
.judge-tile.is-away .judge-tile__photo { box-shadow: 0 0 0 2px rgba(143, 184, 232, .6); }
.judge-tile.is-away .judge-tile__name::before { content: "☕ "; }