/* "Change" referee control (static/js/referee_select.js). */
.rs-btn { display: inline-flex; align-items: center; gap: .3rem; margin-left: .5rem; padding: .15rem .55rem;
    font-size: .75rem; font-weight: 600; line-height: 1.4; color: #034152; background: #fff;
    border: 1px solid #034152; border-radius: .375rem; cursor: pointer; vertical-align: middle; }
.rs-btn:hover, .rs-btn[aria-expanded="true"] { background: #e6f0f2; }
.rs-btn:focus-visible { outline: 2px solid #034152; outline-offset: 1px; }
.rs-btn .fa-pen { font-size: .65rem; }
.rs-saved { margin-left: .5rem; font-size: .75rem; font-weight: 600; color: #15803d; white-space: nowrap; }

.rs-panel { margin: .25rem 0 .5rem; border: 1px solid #d1d5db; border-radius: .5rem; background: #fff;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .08); overflow: hidden; text-align: left; }
.rs-search { display: block; width: 100%; padding: .55rem .75rem; border: 0; border-bottom: 1px solid #e5e7eb;
    font-size: 16px; color: #111827; background: #fff; outline: none; box-shadow: none; }
.rs-list { list-style: none; margin: 0; padding: .25rem 0; max-height: 13rem; overflow-y: auto; }
.rs-list li[hidden] { display: none; }
.rs-opt { display: flex; align-items: center; gap: .4rem; width: 100%; padding: .45rem .75rem; border: 0;
    background: none; font-size: .875rem; color: #111827; text-align: left; cursor: pointer; }
.rs-opt:hover, .rs-opt:focus { background: #f3f4f6; outline: none; }
.rs-opt.is-current { font-weight: 600; color: #034152; }
.rs-opt-none { color: #6b7280; }
.rs-check { margin-left: auto; font-size: .75rem; }
.rs-head { padding: 0 .3rem; border-radius: .25rem; background: #ede9fe; color: #6d28d9;
    font-size: .6rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.rs-msg { margin: 0; padding: .4rem .75rem; border-top: 1px solid #f3f4f6; font-size: .8rem; color: #6b7280; }
.rs-msg.is-error { color: #b91c1c; }
.rs-panel[aria-busy="true"] .rs-list { opacity: .5; pointer-events: none; }
.rs-pop .rs-panel { margin-bottom: 0; }

/* RefereeSelect.popup(): small card next to a timetable chip */
.rs-pop { position: fixed; z-index: 1300; padding: .75rem .85rem; overflow-y: auto; background: #fff;
    border: 1px solid #e5e7eb; border-radius: .75rem; box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
    font-size: .875rem; line-height: 1.4; color: #111827; }
.rs-pop-x { position: absolute; top: .4rem; right: .4rem; display: flex; align-items: center; justify-content: center;
    width: 1.75rem; height: 1.75rem; border: 0; border-radius: 50%; background: #f3f4f6; color: #4b5563; cursor: pointer; }
.rs-pop-x:hover { background: #e5e7eb; }
.rs-pop-info { padding-right: 2rem; }
.rs-pop-title { font-weight: 600; }
.rs-pop-sub { color: #4b5563; font-size: .8rem; }
.rs-pop-ref { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin-top: .6rem; padding-top: .6rem;
    border-top: 1px solid #e5e7eb; }
.rs-pop-label { margin-right: .35rem; color: #6b7280; font-weight: 500; }
.rs-pop-ref [data-rs-slot] { display: inline-flex; align-items: center; margin-left: auto; }