/*
 * Golfinity — redaktionella hjälpklasser för brödtext (RTE).
 * Laddas FÖRE klubbens tema-CSS så teman kan skriva över färgerna.
 *
 * Faktarutorna appliceras av redaktören via formatmenyn i texteditorn
 * (formaten definieras i richtext_editor.css via umb_name-regler, som
 * även ger förhandsvisning i editorn). Texten i omgivande brödtext
 * flyter runt höger-/vänsterrutorna, som i en tidning. På mobil
 * släpper rutan flytet och tar full bredd.
 */

.fact-box,
.fact-box-left,
.fact-box-full {
    padding: 1.25rem 1.5rem;
    background: #f3efe9;
    border-radius: 6px;
    font-size: .92rem;
    line-height: 1.55;
}

.fact-box {
    float: right;
    width: 38%;
    min-width: 240px;
    margin: .25rem 0 1rem 1.5rem;
}

.fact-box-left {
    float: left;
    width: 38%;
    min-width: 240px;
    margin: .25rem 1.5rem 1rem 0;
}

.fact-box-full {
    margin: 1.25rem 0;
}

.fact-box > :first-child,
.fact-box-left > :first-child,
.fact-box-full > :first-child { margin-top: 0; }

.fact-box > :last-child,
.fact-box-left > :last-child,
.fact-box-full > :last-child { margin-bottom: 0; }

/* Rubrik inne i rutan — vilken heading-nivå redaktören än väljer. */
.fact-box h2, .fact-box h3, .fact-box h4, .fact-box h5,
.fact-box-left h2, .fact-box-left h3, .fact-box-left h4, .fact-box-left h5,
.fact-box-full h2, .fact-box-full h3, .fact-box-full h4, .fact-box-full h5 {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin: 0 0 .6rem;
}

.fact-box ul, .fact-box ol,
.fact-box-left ul, .fact-box-left ol,
.fact-box-full ul, .fact-box-full ol { padding-left: 1.2rem; }

@media (max-width: 767px) {
    .fact-box,
    .fact-box-left {
        float: none;
        width: 100%;
        min-width: 0;
        margin: 1rem 0;
    }
}

/* ============================================================
   Stående film (9:16) i videoblock — "portraitVideo"
   Visar porträttfilm centrerad och höjdanpassad i stället för
   i den fasta 16:9-rutan (embed-responsive-16by9).
   ============================================================ */
.video-portrait {
    width: min(520px, 50vh); /* höjd ≈ 89vh vid 9:16 */
    max-width: calc(100% - 2rem); /* behåll luft på sidorna i mobil */
    margin: 0 auto;
}
.video-portrait video,
.video-portrait .video-portrait__media {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
    background: #000;
}
/* Inbäddad (YouTube Shorts/Vimeo i porträtt) – håll 9:16 med aspect-ratio */
.video-portrait--embed {
    position: relative;
    aspect-ratio: 9 / 16;
}
.video-portrait--embed .video-portrait__frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 12px;
}