﻿/* Two-panel judges layout */
.judges-layout {
    display: grid;
    grid-template-columns: 320px 1fr; /* LEFT: judges, RIGHT: content */
    gap: 1rem;
    align-items: start;
    margin-bottom: 4rem; 
}

@media (max-width: 992px) {
    .judges-layout {
        grid-template-columns: 1fr; /* stack on small screens */
    }

    .judges-list {
        position: static;
        max-height: none;
    }
}

/* Left viewer */
.judges-viewer {
    background: #ffffff;
    border: 2px solid #1f4e79;
    border-radius: 12px;
    padding: 1.5rem;
    min-height: 900px; /* makes it feel substantial */
}

.judges-viewer-title {
    margin-bottom: 0.75rem;
}

.judges-viewer-actions {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.75rem;
}

.judges-iframe {
    width: 100%;
    height: 850px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
}

/* Right list */
.judges-list {
    background: #ffffff;
    border: 2px solid #1f4e79;
    border-radius: 12px;
    padding: 1rem;
    position: sticky;
    top: 1rem;
}

.judges-list-inner {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Judge buttons */
.judge-pick {
    width: 100%;
    text-align: left;
    min-height: 44px; /* touch target */
    padding: 0.75rem 1rem;
}

    /* Active judge highlight */
    .judge-pick.active {
        outline: 3px solid #1d4ed8;
        outline-offset: 2px;
    }

    /* Disabled styling */
    .judge-pick[disabled],
    .judge-pick.is-disabled {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Optional: disabled links look disabled */
a.is-disabled {
    pointer-events: none;
    opacity: 0.6;
}

.judges-list-inner {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.judge-item {
    margin-bottom: 0.5rem;
}