/* =========================================================
   THE LAST EXIT - SETLIST POPUPS
   ========================================================= */

/* Main popup container */
.setlist-popup-content {
    position: relative;
    overflow: hidden;
    width: 90%;
    max-width: 800px;
    margin: 40px auto;
    padding: 50px 48px 42px;

    color: #ffffff;
    background-color: #11161b;

    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;

    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.08),
        0 35px 90px rgba(0, 0, 0, 0.80);
}

/* Album cover background */
.setlist-popup-content::before {
    content: "";
    position: absolute;
    inset: -12px;

    background-image: var(--setlist-background);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    filter: blur(4px);
    transform: scale(1.05);

    z-index: 0;
}

/* Dark overlay above the album cover */
.setlist-popup-content::after {
    content: "";
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(7,10,13,.45) 0%,
            rgba(7,10,13,.60) 35%,
            rgba(7,10,13,.75) 70%,
            rgba(7,10,13,.88) 100%
        );

    z-index: 1;
}

/* Keep all popup content above the background */
.setlist-popup-content > * {
    position: relative;
    z-index: 2;
}

/* Album title */
.setlist-popup-content h2 {
    margin: 0 0 10px;

    color: #ffffff;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 3px;

    font-size: 4rem;
    font-weight: 300;
    line-height: 1.05;

    text-shadow: 0 3px 12px rgba(0, 0, 0, 0.95);
}

/* Small record-style detail */
.setlist-popup-content h2::before {
    content: "THE LAST EXIT · STEREO · 33⅓ RPM";
    display: block;
    margin-bottom: 12px;

    color: rgba(255, 255, 255, 0.65);
    font-size: 0.65rem;
    font-weight: normal;
    letter-spacing: 3px;
}

/* Setlist category */
.setlist-category {
    margin-bottom: 20px;

    color: #e65a64;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 600;

    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.9);
}

/* Introductory liner-note blurb */
.setlist-description {
    max-width: 620px;
    margin: 0 auto 32px;

    color: #e0e0e0;
    text-align: center;
    font-style: italic;
    line-height: 1.7;

    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.9);
}

/* Song list */
.setlist-popup-content ul {
    margin: 0;
    padding: 0;

    list-style: none;
    column-count: 2;
    column-gap: 42px;
}

/* Individual song */
.setlist-popup-content li {
    padding: 9px 0;

    color: #f4f4f4;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);

    break-inside: avoid;
    line-height: 1.45;

    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
}

/* Artist name */
.setlist-popup-content .artist {
    color: #e65a64;
    font-weight: 600;
}

/* Divider above footer */
.setlist-popup-content hr {
    margin: 38px 0 24px;

    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}

/* Popup footer */
.setlist-footer {
    color: #c4c8cc;
    text-align: center;
    font-size: 0.9rem;
    line-height: 1.75;

    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
}

.setlist-footer strong {
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.setlist-footer em {
    color: #dedede;
}

/* Magnific Popup page overlay */
.mfp-bg {
    background: #050709;
    opacity: 0.94;
}

/* Close button */
.mfp-close-btn-in .mfp-close {
    color: #ffffff;
    font-size: 38px;
    opacity: 0.85;
    z-index: 5;
}

.mfp-close-btn-in .mfp-close:hover {
    opacity: 1;
}

/* Popup entrance animation */
.mfp-fade.mfp-bg {
    opacity: 0;
    transition: opacity 0.25s ease-out;
}

.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.94;
}

.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    transform: translateY(22px) scale(0.98);
    transition:
        opacity 0.25s ease-out,
        transform 0.25s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
    transform: translateY(22px) scale(0.98);
}

/* =========================================================
   MATCH EACH POPUP TO ITS ALBUM COVER
   Paths are relative to css/custom.css
   ========================================================= */

.popup-arena {
    --setlist-background: url("../img/album/1.jpg");
}

.popup-southern {
    --setlist-background: url("../img/album/2.jpg");
}

.popup-female {
    --setlist-background: url("../img/album/3.jpg");
}

.popup-country {
    --setlist-background: url("../img/album/4.jpg");
}

/* Mobile layout */
@media (max-width: 767px) {
    .setlist-popup-content {
        width: 94%;
        margin: 20px auto;
        padding: 42px 22px 32px;
    }

    .setlist-popup-content ul {
        column-count: 1;
    }

    .setlist-popup-content h2 {
        font-size: 1.65rem;
    }

    .setlist-popup-content h2::before {
        font-size: 0.55rem;
        letter-spacing: 2px;
    }

    .setlist-category {
        font-size: 0.8rem;
        letter-spacing: 2px;
    }
}

/* =========================================================
   BAND MEMBER FLIP CARDS
   ========================================================= */

.member-flip-card {
    position: relative;
    width: 100%;
    cursor: pointer;
    perspective: 1200px;
    outline: none;
}

/*
   The aspect ratio controls the card height.
   Adjust 4 / 5 if your member photos use a different ratio.
*/
.member-flip-inner {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;

    transform-style: preserve-3d;
    transition: transform 0.7s ease;
}

.member-flip-card.is-flipped .member-flip-inner {
    transform: rotateY(180deg);
}

.member-flip-front,
.member-flip-back {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;

    overflow: hidden;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.member-flip-front {
    background: #11161b;
}

.member-flip-front img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*
   Override the template's absolute member-info positioning
   only inside flip cards.
*/
.member-flip-card .member-info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    width: 100%;
    padding: 1.45em 12px;

    text-align: center;
    background: #ff5252;
}

.member-flip-back {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 34px;

    color: #ffffff;
    text-align: center;
    background:
        linear-gradient(
            rgba(8, 11, 14, 0.94),
            rgba(8, 11, 14, 0.98)
        );

    border: 1px solid rgba(255, 255, 255, 0.12);

    transform: rotateY(180deg);
}

.member-bio h4 {
    margin: 0 0 8px;

    text-transform: uppercase;
    letter-spacing: 3px;
}

.member-role {
    margin-bottom: 22px;

    color: #ff5252;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.8rem;
}

.member-bio p {
    color: #d7d7d7;
    line-height: 1.7;
}

.flip-hint {
    display: inline-block;
    margin-top: 18px;

    color: #ff5252;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.member-flip-card:focus-visible {
    box-shadow: 0 0 0 3px rgba(255, 82, 82, 0.65);
}

@media (max-width: 767px) {
    .member-flip-back {
        padding: 26px 20px;
    }
}
/* =========================================================
   BAND MEMBER CARDS
   ========================================================= */

.block-member {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    cursor: pointer;
    background: #11161b;
}

/* Force every photo to fill the same-sized card */
.block-member > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Keep the existing red name bar */
.block-member .member-info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;

    width: 100%;
    padding-top: .7em;
    padding-right: 12px;
    padding-bottom: .9em;
    padding-left: 12px;
    text-align: center;
    background: #ff5252;

    transition:
        opacity 0.35s ease,
        transform 0.35s ease;
}

/* =========================================================
   BAND MEMBER CARD FIXES
   ========================================================= */

.block-member {
    position: relative;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    cursor: pointer;
}

.block-member img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.member-bio-panel {
    position: absolute;
    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 30px;

    background:
        linear-gradient(
            rgba(8,11,14,.82),
            rgba(8,11,14,.92)
        );

    backdrop-filter: blur(3px);

    color: white;
    text-align: center;

    transform: translateY(100%);
    transition: transform .35s ease;

    z-index:3;
}

.bio-card.show-bio .member-bio-panel {
    transform: translateY(0);
}

.member-bio-content h4{
    color:white;
}

.member-bio-role{
    color:#ff5252;
    margin-bottom:20px;
}

.member-bio-close{
    display:block;
    margin-top:20px;
    color:#ff5252;
    font-size:.75rem;
}
.bio-card.show-bio .member-info {
    transform: translateY(20px);
    opacity: .25;
    transition: all .35s ease;
}

/* =========================================================
   SETLIST ALBUM CARD ALIGNMENT
   ========================================================= */

#discography .block-album {
    display: grid;
    grid-template-rows: 72px 42px auto;
    height: 100%;
}

/* Category title */
#discography .block-album > h5 {
    display: flex;
    align-items: flex-start;

    height: 72px;
    min-height: 72px;
    margin: 0 !important;

    line-height: 1.45;
}

/* View Setlist link */
#discography .block-album > a.link {
    display: block;

    height: 42px;
    min-height: 42px;
    margin: 0 !important;
    padding: 0 !important;
}

/* Album-cover link */
#discography .block-album > a.setlist-popup:not(.link) {
    display: block;
    width: 100%;
    margin: 0 !important;
}

/* Album covers */
#discography .block-album > a.setlist-popup:not(.link) img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    margin: 0 !important;
}

/* Mobile/tablet spacing */
@media (max-width: 991px) {
    #discography .block-album {
        margin-bottom: 40px;
    }
}

/* =========================================================
   CONTACT FORM
   ========================================================= */

.booking-form label {
    display: block;
    margin-bottom: 8px;

    color: #d7d7d7;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

.booking-form .form-group {
    margin-bottom: 24px;
}

.booking-form .form-control {
    width: 100%;

    color: #ffffff;
    background: #11161b;

    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.booking-form .form-control:focus {
    color: #ffffff;
    background: #11161b;

    border-color: #ff5252;
    box-shadow: 0 0 0 3px rgba(255, 82, 82, 0.15);
}

.booking-form textarea.form-control {
    resize: vertical;
    min-height: 180px;
}

.booking-form input[type="date"] {
    color-scheme: dark;
}

.contact-message {
    margin-bottom: 30px;
    padding: 18px 22px;

    text-align: center;

    border: 1px solid;
}

.contact-success {
    color: #d7f4dc;
    background: rgba(63, 145, 79, 0.15);
    border-color: rgba(94, 190, 112, 0.55);
}

.contact-error {
    color: #ffd9dc;
    background: rgba(180, 55, 65, 0.15);
    border-color: rgba(255, 82, 82, 0.55);
}

/* Hide the anti-spam honeypot field */
.contact-honeypot {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

.contact-direct a {
    font-size: 1.1rem;
}

/* Briefly highlight a page section found by search */
.site-search-highlight {
    animation: site-search-flash 1.8s ease;
}

@keyframes site-search-flash {
    0% {
        box-shadow: inset 0 0 0 3px rgba(255, 82, 82, 0);
    }

    30% {
        box-shadow: inset 0 0 0 3px rgba(255, 82, 82, 0.8);
    }

    100% {
        box-shadow: inset 0 0 0 3px rgba(255, 82, 82, 0);
    }
}

.hero::after {
    content: "";
    position: absolute;

    left: 50%;
    top: 56%;
    transform: translate(-50%, -50%);

    width: 300px;
    height: 300px;

    background: url("../img/lastexitlogo-transbkg.png") center center no-repeat;
    background-size: contain;

    opacity: .60;
    filter: drop-shadow(0 8px 25px rgba(0,0,0,.45));
    z-index: 5;
    pointer-events: none;
}

.hero-tagline,
.hero-video-btn {
    position: relative;
    top: 250px;
}

/* Mobile header */
@media (max-width: 768px) {

    .header .logo h2 {
        font-size: 1.35rem;
        letter-spacing: .11em;
    }

}


/* =========================================================
   BIO CARD PILL
   ========================================================= */


.bio-pill {
    display: inline-block;
    margin-top: 8px;
    padding: 3px 12px;

    background: #fff;
    color: #ff5252;

    border-radius: 999px;
    border: none;

    font-size: .65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;

    transition: .2s ease;
}

.block-member:hover .bio-pill {
    background: #f5f5f5;
    transform: translateY(-1px);
}

/* =========================================================
    Contact us below link
   ========================================================= */

   .booking-link {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}

.booking-link:hover {
    color: #fff;
    text-decoration: underline;
}