/*
 * Rollespilslauget – ekstra styling
 * Styler kontaktformularen (Contact Form 7), eventkalenderen
 * (The Events Calendar) og små hjælpere, som theme.json ikke dækker.
 */

/* ---------- Fuldbredde-garanti ---------- */
/* Header-, footer-dele og selve hovedindholdet (<main>) skal altid
   spænde hele skærmens bredde, uanset WordPress-version. Teksten
   inde i sektionerne holder stadig en læsbar bredde via theme.json. */
body > .wp-site-blocks > .wp-block-template-part,
body > .wp-site-blocks > .wp-block-group.alignfull {
        max-width: none;
        width: 100%;
}

/* ---------- Små hjælpere ---------- */

.rx-eyebrow::before {
        content: "";
        display: inline-block;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: var(--wp--preset--color--rav, #E9A23B);
        margin-right: 8px;
        vertical-align: 1px;
}

.rx-trust span {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-weight: 700;
        font-size: 0.85rem;
        color: var(--wp--preset--color--moerk-groen, #1E3A2C);
        background: var(--wp--preset--color--salvie, #E7F0E7);
        padding: 6px 14px;
        border-radius: 999px;
        margin: 0 8px 8px 0;
}
.rx-trust span::before {
        content: "";
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: var(--wp--preset--color--groen, #2E6B4E);
}

/* Ikon-"chips" på aktivitetskortene */
.rx-ikon {
        display: flex !important;
        justify-content: center;
        align-items: center;
        width: 52px !important;
        height: 52px;
        border-radius: 16px;
        margin: 0 0 0.9rem !important;
}
.rx-ikon img { width: 26px; height: 26px; padding: 0; }
.rx-ikon-groen { background: var(--wp--preset--color--salvie, #E7F0E7); }
.rx-ikon-rav { background: var(--wp--preset--color--rav-tint, #FBEFDA); }
.rx-ikon-himmel { background: var(--wp--preset--color--himmel, #E4EEF6); }
.rx-ikon-baer { background: var(--wp--preset--color--baer, #F6E7E4); }

/* Hero */
.rx-hero-foto { position: relative; }
.rx-hero-foto .wp-block-image.rx-hero-img { margin-bottom: -2.2rem !important; }
.rx-hero-img img {
        box-shadow: var(--wp--preset--shadow--kort, 0 10px 30px rgba(34, 51, 43, .08));
        border-radius: 22px !important;
}
.rx-hero-cap {
        position: relative;
        z-index: 2;
        width: fit-content;
        margin: 0 auto;
        box-shadow: var(--wp--preset--shadow--loeftet, 0 16px 40px rgba(34, 51, 43, .14));
}
.rx-floatkort { position: relative; z-index: 3; width: min(92%, 480px); }

/* Logo-mærke i headeren */
.rx-logo-mark { flex-shrink: 0; }
.rx-logo-mark img { width: 22px; height: 22px; margin: 0; }
.rx-logo-tekst .wp-block-site-title { margin: 0; }
.rx-logo-tekst .wp-block-site-title a {
        color: var(--wp--preset--color--blaek, #22332B);
        text-decoration: none;
}
.rx-logo-tekst .wp-block-site-tagline { margin-top: 0; line-height: 1.1; }

/* Rav-knapvariant (Bliv medlem / kontakt) */
.rx-btn-variant .wp-block-button__link {
        background: var(--wp--preset--color--rav, #E9A23B) !important;
        color: #3A2A0C !important;
}
.rx-btn-variant .wp-block-button__link:hover {
        background: #DE9427 !important;
        color: #3A2A0C !important;
}

/* Kerneværdi-piller */
.rx-pills { row-gap: 0.6rem; }
.rx-pill .wp-block-button__link {
        padding: 0.45rem 1.1rem !important;
        font-size: 0.9rem !important;
        min-height: 0;
}
.rx-pill.is-style-outline .wp-block-button__link {
        background: transparent !important;
        color: #EFEDE2 !important;
        border: 1.5px solid rgba(239, 237, 226, 0.35);
}
.rx-pill.is-style-outline .wp-block-button__link:hover {
        background: rgba(239, 237, 226, 0.12) !important;
        text-decoration: none !important;
}
.rx-pill-hot .wp-block-button__link {
        background: var(--wp--preset--color--rav, #E9A23B) !important;
        color: #3A2A0C !important;
}
.rx-pill-hot .wp-block-button__link:hover { background: #DE9427 !important; color: #3A2A0C !important; }

/* Kontakt-rækker i det mørke kort */
.rx-kontakt-raekke {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 9px 0;
        border-bottom: 1px solid rgba(251, 248, 241, 0.12);
        margin: 0 !important;
}
.rx-kontakt-raekke:last-child { border-bottom: none; }
.rx-kontakt-raekke img { margin: 0; flex-shrink: 0; }

/* Kort løfter sig let ved hover */
.is-style-kort { transition: transform .18s ease, box-shadow .18s ease; }
.is-style-kort:hover { transform: translateY(-3px); box-shadow: var(--wp--preset--shadow--loeftet, 0 16px 40px rgba(34, 51, 43, .14)); }

/* Blødt sidehoved på undersider */
.wp-block-post-title { overflow-wrap: break-word; }

/* ---------- Contact Form 7 ---------- */

.wpcf7 form { max-width: 640px; }
.wpcf7 label { display: block; margin-bottom: 1rem; }
.wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="url"],
.wpcf7 input[type="date"],
.wpcf7 textarea,
.wpcf7 select {
        width: 100%;
        border: 1px solid var(--wp--preset--color--linje, #E4DFD2);
        border-radius: 12px;
        padding: 13px 16px;
        font-family: var(--wp--preset--font-family--krop, "Nunito Sans", sans-serif);
        font-size: 0.95rem;
        background: var(--wp--preset--color--overflade, #FFFFFF);
        color: var(--wp--preset--color--blaek, #22332B);
        transition: box-shadow .15s ease;
}
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
        outline: 3px solid rgba(233, 162, 59, 0.55);
        border-color: var(--wp--preset--color--groen, #2E6B4E);
}
.wpcf7 .wpcf7-submit {
        background: var(--wp--preset--color--groen, #2E6B4E);
        color: #FFFFFF;
        border: none;
        border-radius: 999px;
        padding: 0.8rem 1.6rem;
        font-weight: 700;
        font-family: var(--wp--preset--font-family--krop, "Nunito Sans", sans-serif);
        cursor: pointer;
}
.wpcf7 .wpcf7-submit:hover { background: var(--wp--preset--color--moerk-groen, #1E3A2C); }
.wpcf7 .wpcf7-not-valid-tip { color: #9A4A3C; font-size: 0.85rem; }
.wpcf7 .wpcf7-response-output {
        border-radius: 12px;
        border: 1px solid var(--wp--preset--color--linje, #E4DFD2);
        background: var(--wp--preset--color--overflade, #FFFFFF);
}

/* ---------- The Events Calendar ---------- */

.tribe-events,
.tribe-events .tribe-events-header,
.tribe-events .tribe-common-h2,
.tribe-events .tribe-common-h3,
.tribe-events .tribe-events-calendar-list__event-title {
        font-family: var(--wp--preset--font-family--krop, "Nunito Sans", sans-serif);
}
.tribe-events .tribe-events-calendar-list__event-title a,
.tribe-events .tribe-events-calendar-list__event-title-title-link {
        font-family: var(--wp--preset--font-family--overskrift, "Fraunces", Georgia, serif) !important;
        color: var(--wp--preset--color--blaek, #22332B) !important;
}
.tribe-events .tribe-events-calendar-list__event-row {
        background: var(--wp--preset--color--overflade, #FFFFFF);
        border: 1px solid var(--wp--preset--color--linje, #E4DFD2);
        border-radius: 18px;
        margin-bottom: 1rem;
        overflow: hidden;
        box-shadow: var(--wp--preset--shadow--kort, 0 10px 30px rgba(34, 51, 43, .08));
}
.tribe-events .tribe-events-calendar-list__event-date-tag {
        background: var(--wp--preset--color--salvie, #E7F0E7);
        color: var(--wp--preset--color--moerk-groen, #1E3A2C);
        border-radius: 14px;
        margin: 0.8rem;
}
.tribe-events .tribe-events-calendar-list__event-date-tag__month,
.tribe-events .tribe-events-calendar-list__event-date-tag__year {
        color: var(--wp--preset--color--moerk-groen, #1E3A2C) !important;
}
.tribe-events .tribe-events-calendar-list__event-date-tag__weeknum {
        color: var(--wp--preset--color--moerk-groen, #1E3A2C) !important;
}
.tribe-events .tribe-events-c-top-bar,
.tribe-events .tribe-events-c-view-selector { border-color: var(--wp--preset--color--linje, #E4DFD2); }
.tribe-events .tribe-events-c-events-bar__search-button,
.tribe-events a.tribe-events-button {
        border-radius: 999px !important;
        background: var(--wp--preset--color--groen, #2E6B4E) !important;
        border: none !important;
}
.tribe-events a.tribe-events-button:hover { background: var(--wp--preset--color--moerk-groen, #1E3A2C) !important; }
.tribe-events .tribe-events-c-small-cta__price {
        color: var(--wp--preset--color--moerk-rav, #8A5A16);
        font-weight: 700;
}

/* ---------- Responsivt ---------- */

@media (max-width: 781px) {
        .rx-hero-foto .wp-block-image.rx-hero-img { margin-bottom: -1.6rem !important; }
        .rx-floatkort { width: 100%; }
        .is-style-mork-sektion { padding-left: 1.6rem !important; padding-right: 1.6rem !important; }
        .rx-moerk-watermark::after { width: 220px !important; height: 220px !important; }
}

/* ---------- Rollespils-detaljer ---------- */

/* Svag terning-mønsterbaggrund i hero-feltet */
.rx-hero-eventyr {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cg fill='none' stroke='%232E6B4E' stroke-width='1.6' stroke-linejoin='round' opacity='0.09'%3E%3Cpath d='M34 22l19 11v22L34 66 15 55V33z'/%3E%3Cpath d='M34 22v13M15 33l19 8 19-8M34 66v-9M34 57l-19 8M34 57l19 8'/%3E%3C/g%3E%3Cg fill='none' stroke='%232E6B4E' stroke-width='1.4' stroke-linejoin='round' opacity='0.07'%3E%3Cpath d='M100 78l14 8v17l-14 8-14-8V86z'/%3E%3Cpath d='M100 78v10M86 86l14 5 14-5M100 111v-9'/%3E%3C/g%3E%3Ccircle cx='70' cy='112' r='3' fill='%232E6B4E' opacity='0.08'/%3E%3Ccircle cx='114' cy='34' r='3' fill='%238A5A16' opacity='0.09'/%3E%3C/svg%3E");
}

/* D20-vandmærke i de mørke sektioner */
.rx-moerk-watermark { position: relative; overflow: hidden; }
.rx-moerk-watermark::after {
        content: "";
        position: absolute;
        right: -60px;
        bottom: -60px;
        width: 320px;
        height: 320px;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FBF8F1' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round' opacity='0.07'%3E%3Cpath d='M12 2 21 7.2v9.6L12 22 3 16.8V7.2Z'/%3E%3Cpath d='M12 2v7.5M3 7.2l9 2.3 9-2.3M12 22v-8.4M12 13.6 3 16.8M12 13.6l9 3.2'/%3E%3C/svg%3E") center / contain no-repeat;
        pointer-events: none;
}
.rx-moerk-watermark > * { position: relative; z-index: 1; }

/* Quest-mærke på aktivitetskortene ("Eventyr 01" osv.) */
.rx-quest-tag {
        display: flex !important;
        align-items: center;
        gap: 7px !important;
        font-size: 0.68rem !important;
        font-weight: 800;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--wp--preset--color--moerk-rav, #8A5A16) !important;
        margin: 0 0 0.9rem !important;
        padding-bottom: 0.55rem;
        border-bottom: 1.5px dashed #EBCB90;
}
.rx-quest-tag img { margin: 0 !important; flex-shrink: 0; }

/* D20-formede dagbrikker i kalenderen */
.rx-dato {
        clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%) !important;
        border-radius: 0 !important;
        min-width: 92px;
        padding-top: 1.05rem !important;
        padding-bottom: 1.05rem !important;
}

/* D20-formede trinnumre i "Sådan kommer du i gang" */
.rx-trin {
        width: 58px !important;
        height: 64px;
        min-height: 64px;
        background: var(--wp--preset--color--moerk-groen, #1E3A2C);
        clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
        display: flex !important;
        align-items: center;
        justify-content: center;
        margin-bottom: 1rem !important;
}
.rx-trin p {
        margin: 0 !important;
        color: #F0C989 !important;
        font-family: var(--wp--preset--font-family--overskrift, Georgia, serif) !important;
        font-size: 1.55rem !important;
        font-weight: 700 !important;
}

/* Eventyrkort løfter sig også ved hover */
.is-style-questkort { transition: transform .18s ease, box-shadow .18s ease; }
.is-style-questkort:hover { transform: translateY(-3px); box-shadow: var(--wp--preset--shadow--loeftet, 0 16px 40px rgba(34, 51, 43, .14)); }

/* «Laugshumor»-linje i den mørke værdi-sektion */
.rx-laugs-humor {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        margin: 1.4rem 0 0 !important;
        color: #9DB4A4 !important;
        font-size: 0.9rem !important;
        font-style: italic;
}
.rx-laugs-humor img { margin: 0 !important; opacity: 0.85; }

/* Mobilmenu (overlay) */
.wp-block-navigation__responsive-container.is-menu-open {
        background: var(--wp--preset--color--moerk-groen, #1E3A2C) !important;
        padding: 1.5rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        color: var(--wp--preset--color--hvid-creme, #F2EFE4) !important;
        font-size: 1.1rem;
        padding: 0.6rem 0;
}
.wp-block-navigation__responsive-container-open { padding: 6px; }
.wp-block-navigation__responsive-container-close svg,
.wp-block-navigation__responsive-container-open svg { width: 26px; height: 26px; }

/* ---------- Levende detaljer: bevægelse, energi & små glimt ---------- */

/* Nøgleframe-animationer */
@keyframes rx-svaev {
        0%, 100% { transform: translateY(0) rotate(0deg); }
        50% { transform: translateY(-12px) rotate(8deg); }
}
@keyframes rx-glimt {
        0%, 100% { opacity: 0.25; transform: scale(0.8) rotate(0deg); }
        50% { opacity: 1; transform: scale(1.12) rotate(20deg); }
}
@keyframes rx-vip {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-6px); }
}
@keyframes rx-puls {
        0%, 100% { transform: scale(1); opacity: 1; }
        50% { transform: scale(1.45); opacity: 0.55; }
}

/* Svævende dekorationer (terninger & glimt) – placeres pr. sektion */
.rx-flyv {
        position: absolute !important;
        z-index: 1;
        pointer-events: none;
        margin: 0 !important;
        line-height: 0;
}
.rx-flyv img { margin: 0 !important; width: 100% !important; height: auto !important; }
.rx-svaev { animation: rx-svaev 7s ease-in-out infinite; }
.rx-glimt { animation: rx-glimt 4.5s ease-in-out infinite; }

/* Hero: terning top-right, glimt over fotoet, terning nederst til venstre */
.rx-hero-eventyr { position: relative; }
.rx-hero-eventyr .rx-p1 { top: 8%; right: 5%; width: 42px !important; animation-delay: 0.3s; }
.rx-hero-eventyr .rx-p2 { top: 5%; left: 56%; width: 24px !important; animation-delay: 1.4s; }
.rx-hero-eventyr .rx-p3 { bottom: 6%; left: 4%; width: 30px !important; animation-delay: 0.8s; }
.rx-hero-eventyr .rx-p4 { top: 38%; right: 2%; width: 18px !important; animation-delay: 2.1s; }

/* Mørk værdi-sektion: gyldne stjerner der glimter */
.rx-moerk-watermark .rx-p1 { top: 16%; right: 6%; width: 22px !important; }
.rx-moerk-watermark .rx-p2 { top: 40%; left: 3.5%; width: 17px !important; animation-delay: 2s; }
.rx-moerk-watermark .rx-p3 { bottom: 26%; right: 13%; width: 15px !important; animation-delay: 1s; }

/* Event-log-sektion: lille terning ved overskriften */
.rx-quest-baggrund { position: relative; }
.rx-quest-baggrund .rx-p1 { top: 2.6rem; right: 4%; width: 34px !important; animation-delay: 0.5s; }
.rx-quest-baggrund .rx-p2 { top: 5.6rem; right: 8.5%; width: 18px !important; animation-delay: 1.8s; }

/* Bølge-divider i bunden af hero-feltet */
.rx-bolge {
        position: absolute !important;
        left: 0;
        right: 0;
        bottom: -1px;
        margin: 0 !important;
        line-height: 0;
        z-index: 2;
        pointer-events: none;
}
.rx-bolge img { width: 100% !important; height: 54px !important; display: block; }

/* Gylden håndtegnet bølge-streg under herotitelens kursiv */
.rx-hero-eventyr h1 em {
        font-style: italic;
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8 Q 20 2 40 7 T 80 7 T 118 6' fill='none' stroke='%23E9A23B' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat left 96% / 100% 0.22em;
        padding-bottom: 0.14em;
}

/* Aktivitetskort: farvet topstribe + ikoner der vipper når kortet løftes */
#aktiviteter .is-style-kort { position: relative; overflow: hidden; }
#aktiviteter .is-style-kort::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 5px;
        background: linear-gradient(90deg, var(--wp--preset--color--groen, #2E6B4E), var(--wp--preset--color--rav, #E9A23B));
}
.rx-ikon img { transition: transform 0.25s ease; }
.is-style-kort:hover .rx-ikon img { transform: rotate(-8deg) scale(1.14); }

/* Trust-badges skifter farve: salvie → rav → himmel */
.rx-trust span:nth-child(3n+2) { background: var(--wp--preset--color--rav-tint, #FBEFDA); }
.rx-trust span:nth-child(3n+2)::before { background: var(--wp--preset--color--rav, #E9A23B); }
.rx-trust span:nth-child(3n) { background: var(--wp--preset--color--himmel, #E4EEF6); }
.rx-trust span:nth-child(3n)::before { background: #33608A; }

/* Dato-brikker i kalenderen: grøn / rav / himmel */
.rx-dato-rav { background: var(--wp--preset--color--rav-tint, #FBEFDA) !important; }
.rx-dato-rav p { color: var(--wp--preset--color--moerk-rav, #8A5A16) !important; }
.rx-dato-himmel { background: var(--wp--preset--color--himmel, #E4EEF6) !important; }
.rx-dato-himmel p { color: #33608A !important; }

/* Knapper løfter sig en anelse ved hover */
.wp-block-button__link { transition: transform 0.16s ease, box-shadow 0.16s ease, background 0.16s ease; }
.wp-block-button__link:hover { transform: translateY(-2px); }

/* Logo-terningen ruller ved hover */
.rx-logo-mark img { transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); }
.rx-logo-mark:hover img { transform: rotate(180deg); }

/* Eyebrow-prikker pulserer blidt */
.rx-eyebrow::before { animation: rx-puls 3.2s ease-in-out infinite; }

/* Eventyr-terningerne (trin 1-2-3) vipper forskudt */
.rx-trin { animation: rx-vip 5.5s ease-in-out infinite; }
.wp-block-column:nth-child(2) .rx-trin { animation-delay: 0.7s; }
.wp-block-column:nth-child(3) .rx-trin { animation-delay: 1.4s; }

/* Dagbrikker i kalenderen vipper ved hover */
.is-style-kort .rx-dato { transition: transform 0.2s ease; }
.is-style-kort:hover .rx-dato { transform: rotate(-4deg) scale(1.04); }

/* Skærmtaktsvenlighed: alle bevægelser kan slås fra */
@media (prefers-reduced-motion: reduce) {
        .rx-svaev, .rx-glimt, .rx-trin,
        .rx-eyebrow::before { animation: none !important; }
        .wp-block-button__link,
        .rx-ikon img, .rx-logo-mark img,
        .is-style-kort, .is-style-questkort,
        .is-style-kort .rx-dato { transition: none !important; }
        .wp-block-button__link:hover { transform: none; }
}

/* Dekorationer skjules på små skærme, hvor pladsen er trang */
@media (max-width: 781px) {
        .rx-flyv { display: none !important; }
        .rx-bolge img { height: 30px !important; }
}
