/* =============================================================================
   Stavanger Open – Publikumsstemming
   ============================================================================= */

/* ── Hjerteknapp i programlisten ─────────────────────────────────────────── */

.so-heart-btn {
    background:    none !important;
    border:        none !important;
    box-shadow:    none !important;
    padding:       0 0 0 8px !important;
    margin:        0 !important;
    cursor:        pointer;
    color:         #a0aec0;
    line-height:   1;
    display:       inline-flex;
    align-items:   center;
    transition:    color .15s, transform .15s;
    flex-shrink:   0;
}

.so-heart-btn:hover:not(:disabled) {
    color:     #e53e3e !important;
    transform: scale(1.2);
}

.so-heart-btn--voted {
    color: #e53e3e !important;
}

.so-heart-btn--own {
    opacity: 0.25;
    cursor:  default !important;
}

.so-heart-btn:focus-visible {
    outline: 2px solid #2271b1;
    outline-offset: 2px;
    border-radius: 2px;
}

/* ── Registreringsmodal ───────────────────────────────────────────────────── */

.so-audience-modal {
    position:        fixed;
    inset:           0;
    z-index:         100001;
    display:         flex;
    align-items:     center;
    justify-content: center;
}

.so-audience-modal[hidden] { display: none; }

.so-audience-modal__backdrop {
    position:   absolute;
    inset:      0;
    background: rgba(0,0,0,.5);
}

.so-audience-modal__box {
    position:      relative;
    background:    #fff;
    border-radius: 8px;
    padding:       2rem;
    width:         min(460px, 92vw);
    max-height:    90vh;
    overflow-y:    auto;
    box-shadow:    0 8px 32px rgba(0,0,0,.2);
}

.so-audience-modal__close {
    position:      absolute;
    top:           .75rem;
    right:         .75rem;
    background:    transparent !important;
    border:        none !important;
    box-shadow:    none !important;
    font-size:     1.5rem;
    line-height:   1;
    color:         #718096 !important;
    cursor:        pointer;
    padding:       .2rem .5rem;
}

.so-audience-modal__close:hover { color: #1a202c !important; }

.so-audience-modal__title {
    font-size:     1.25rem;
    font-weight:   700;
    margin:        0 0 .5rem;
    color:         #1a202c;
    padding-right: 2rem;
}

.so-audience-modal__desc {
    font-size:     .9rem;
    color:         #4a5568;
    margin-bottom: 1.25rem;
    line-height:   1.5;
}

.so-audience-modal__field {
    margin-bottom: 1rem;
}

.so-audience-modal__field label {
    display:       block;
    font-size:     .875rem;
    font-weight:   600;
    margin-bottom: .3rem;
    color:         #2d3748;
}

.so-audience-modal__optional {
    font-weight: 400;
    color:       #718096;
    font-size:   .8rem;
}

.so-audience-modal__field input,
.so-audience-modal__field select {
    width:         100%;
    padding:       .5rem .75rem;
    border:        1px solid #cbd5e0;
    border-radius: 4px;
    font-size:     .95rem;
    color:         #1a202c;
}

.so-audience-modal__field input:focus,
.so-audience-modal__field select:focus {
    outline:      none;
    border-color: #2271b1;
    box-shadow:   0 0 0 2px rgba(34,113,177,.2);
}

.so-audience-modal__error {
    color:         #c53030;
    font-size:     .875rem;
    margin-bottom: .75rem;
}

.so-audience-modal__submit {
    width:         100%;
    padding:       .65rem 1rem;
    background:    #e53e3e !important;
    color:         #fff !important;
    border:        none !important;
    border-radius: 5px !important;
    font-size:     1rem !important;
    font-weight:   600 !important;
    cursor:        pointer;
    transition:    background .15s;
}

.so-audience-modal__submit:hover {
    background: #c53030 !important;
}

.so-audience-modal__submit:disabled {
    opacity: .6;
    cursor:  not-allowed;
}