/*
 * R48 Concert Social UX 1.0.0
 * Visual language: warm paper + black + R48 yellow.
 */

/* --- GoOut facts / "Informace o koncertu" ------------------------------ */
.r48-concert-source-facts{
    position:relative;
    overflow:hidden;
    margin:1.35rem 0 1.25rem;
    padding:1.35rem 1.45rem 1.3rem;
    background:
        linear-gradient(135deg, rgba(255,207,20,.11) 0, rgba(255,207,20,.03) 42%, transparent 68%),
        #ebe6da;
    border:1px solid rgba(17,17,17,.18);
    border-top:6px solid #ffcf14;
    box-shadow:7px 7px 0 rgba(17,17,17,.07);
    color:#111;
}

.r48-concert-source-facts::after{
    content:"48";
    position:absolute;
    right:-.06em;
    bottom:-.3em;
    z-index:0;
    font:900 7rem/1 Arial,Helvetica,sans-serif;
    color:rgba(17,17,17,.035);
    pointer-events:none;
    user-select:none;
}

.r48-concert-source-facts > *{
    position:relative;
    z-index:1;
}

.r48-concert-source-facts h2{
    margin:0 0 .8rem;
    color:#111;
}

.r48-concert-source-facts ul{
    margin:.25rem 0 .95rem;
    padding-left:1.15rem;
}

.r48-concert-source-facts li{
    margin:.22rem 0;
}

.r48-concert-source-facts li::marker{
    color:#d6aa00;
}

.r48-concert-source-facts a{
    color:#111;
    font-weight:800;
    text-decoration-thickness:2px;
    text-underline-offset:3px;
}

.r48-concert-source-facts a:hover,
.r48-concert-source-facts a:focus-visible{
    color:#8a0000;
}

/* --- Sharing ----------------------------------------------------------- */
.r48-concert-share-actions{
    display:inline-flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.55rem;
    margin:.75rem 0 .75rem .6rem;
    vertical-align:middle;
}

.r48-concert-share-actions--standalone{
    display:flex;
    margin:.85rem 0 0;
}

.r48-concert-share-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.55rem;
    min-height:42px;
    padding:.68rem .92rem;
    border:1px solid transparent;
    border-radius:0;
    box-sizing:border-box;
    font:800 .72rem/1.05 Arial,Helvetica,sans-serif;
    letter-spacing:.035em;
    text-transform:uppercase;
    text-decoration:none !important;
    transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.r48-concert-share-btn:hover,
.r48-concert-share-btn:focus-visible{
    transform:translateY(-2px);
    box-shadow:0 4px 0 rgba(17,17,17,.18);
    filter:brightness(1.035);
}

.r48-concert-share-btn:focus-visible{
    outline:3px solid #ffcf14;
    outline-offset:3px;
}

/* Facebook app blue */
.r48-concert-share-btn--facebook{
    background:#1877f2;
    border-color:#1877f2;
    color:#fff !important;
}

/* X brand guidance: white logo on black background */
.r48-concert-share-btn--x{
    background:#000;
    border-color:#000;
    color:#fff !important;
}

.r48-concert-share-icon{
    width:1.05rem;
    height:1.05rem;
    flex:0 0 1.05rem;
    fill:currentColor;
}

.r48-concert-share-icon--x{
    width:.95rem;
    height:.95rem;
    flex-basis:.95rem;
}

@media (max-width:700px){
    .r48-concert-source-facts{
        padding:1.15rem 1.05rem 1.1rem;
        box-shadow:5px 5px 0 rgba(17,17,17,.07);
    }

    .r48-concert-share-actions{
        display:flex;
        width:100%;
        margin:.65rem 0 0;
    }

    .r48-concert-share-btn{
        flex:1 1 10rem;
        min-height:44px;
        padding:.75rem .75rem;
    }
}

/* R3.5.1 — fallback share action */
.r48-concert-share-btn--copy{
    appearance:none;
    cursor:pointer;
    background:#f4efe4;
    border-color:#111;
    color:#111 !important;
}

.r48-concert-share-btn--copy:hover,
.r48-concert-share-btn--copy:focus-visible{
    background:#ffcf14;
}

.r48-concert-share-status{
    display:inline-flex;
    align-items:center;
    min-height:42px;
    font-weight:800;
    font-size:.72rem;
    text-transform:uppercase;
}

@media (max-width:700px){
    .r48-concert-share-status{
        flex:1 0 100%;
        min-height:0;
    }
}

/* -----------------------------------------------------------------------
 * R48 Concert Social UX R3.5.2
 * Ticket + FB + X are one visual action row on desktop.
 * -------------------------------------------------------------------- */

.r48-concert-share-btn--copy,
.r48-concert-share-status{
    display:none !important;
}

.r48-concert-primary-actions{
    display:flex;
    align-items:stretch;
    flex-wrap:nowrap;
    gap:.42rem;
    margin:.85rem 0 0;
    width:100%;
}

.r48-concert-primary-actions > a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    margin:0 !important;
}

.r48-concert-primary-actions .r48-concert-share-actions{
    display:flex;
    flex:0 0 auto;
    align-items:stretch;
    flex-wrap:nowrap;
    gap:.42rem;
    width:auto;
    margin:0 !important;
}

.r48-concert-primary-actions .r48-concert-share-btn{
    min-height:42px;
    margin:0;
    padding:.66rem .72rem;
    font-size:.66rem;
    white-space:nowrap;
    box-shadow:none;
}

.r48-concert-primary-actions .r48-concert-share-btn:hover,
.r48-concert-primary-actions .r48-concert-share-btn:focus-visible{
    transform:translateY(-2px);
}

.r48-concert-primary-actions .r48-concert-share-icon{
    width:.92rem;
    height:.92rem;
    flex-basis:.92rem;
}

@media (max-width: 760px){
    .r48-concert-primary-actions{
        flex-wrap:wrap;
    }

    .r48-concert-primary-actions > a{
        flex:1 1 100%;
    }

    .r48-concert-primary-actions .r48-concert-share-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        flex:1 1 100%;
        width:100%;
    }

    .r48-concert-primary-actions .r48-concert-share-btn{
        width:100%;
        min-height:44px;
    }
}

/* -----------------------------------------------------------------------
 * R48 Concert Social UX R3.5.3 — concert state separation
 *
 * State is business information, social actions are secondary actions.
 * They must never visually merge when no ticket CTA is present.
 * -------------------------------------------------------------------- */

.r48-concert-state-row{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    width:100%;
    margin:.9rem 0 0;
}

.r48-concert-state-row + .r48-concert-share-actions,
.r48-concert-state-row + .r48-concert-share-actions--standalone{
    margin-top:.72rem !important;
}

.r48-concert-state-badge--detached{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    width:auto !important;
    margin:0 !important;
    flex:0 0 auto !important;
}

/* A no-ticket state uses two clearly independent rows. */
.r48-concert-no-ticket-actions{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    width:100%;
    margin:.9rem 0 0;
}

.r48-concert-no-ticket-actions .r48-concert-state-row{
    margin:0;
}

.r48-concert-no-ticket-actions .r48-concert-share-actions{
    display:flex;
    flex-wrap:nowrap;
    align-items:stretch;
    gap:.42rem;
    width:auto;
    margin:.72rem 0 0 !important;
}

.r48-concert-no-ticket-actions .r48-concert-share-btn{
    margin:0;
}

/* Override the older standalone rule that made the social block behave like
   the primary CTA on mobile. It remains secondary to the concert state. */
@media (max-width:760px){
    .r48-concert-no-ticket-actions{
        margin-top:.85rem;
    }

    .r48-concert-no-ticket-actions .r48-concert-share-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
        width:100%;
        gap:.5rem;
        margin-top:.75rem !important;
    }

    .r48-concert-no-ticket-actions .r48-concert-share-btn{
        width:100%;
        min-height:44px;
    }
}