/**
 * Magic Transcript Layer
 *
 * --- NAV ARROW NUKE (single source of truth) ---
 * Removes theme/plugin focus rings and red boxes on nav arrows.
 * Targets element, :focus, :active, and ::after (Swiper draws icon via ::after).
 */
html body .msw-unique-gato .msw-nav-next,
html body .msw-unique-gato .msw-nav-prev,
html body .msw-unique-gato .swiper-button-next,
html body .msw-unique-gato .swiper-button-prev,
html body .msw-unique-gato .gato-next,
html body .msw-unique-gato .gato-prev,
html body .msw-unique-gato .msw-nav-next:focus,
html body .msw-unique-gato .msw-nav-prev:focus,
html body .msw-unique-gato .swiper-button-next:focus,
html body .msw-unique-gato .swiper-button-prev:focus,
html body .msw-unique-gato .msw-nav-next:active,
html body .msw-unique-gato .msw-nav-prev:active,
html body .msw-unique-gato .swiper-button-next:active,
html body .msw-unique-gato .swiper-button-prev:active,
.msw-nav-next, .msw-nav-prev,
.swiper-button-next, .swiper-button-prev,
.gato-next, .gato-prev {
    outline: 0 !important;
    outline: none !important;
    border: 0 !important;
    border-style: none !important;
    border-width: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}
html body .msw-unique-gato .swiper-button-next::after,
html body .msw-unique-gato .swiper-button-prev::after,
html body .msw-unique-gato .swiper-button-next::before,
html body .msw-unique-gato .swiper-button-prev::before,
.msw-nav-next::after, .msw-nav-prev::after,
.swiper-button-next::after, .swiper-button-prev::after,
.msw-nav-next::before, .msw-nav-prev::before,
.swiper-button-next::before, .swiper-button-prev::before {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}
[class*="msw-nav-"] *, [class*="swiper-button-"] * {
    outline: none !important;
    border: none !important;
}

/* --- Transcript rules (scoped to .msw-transcript-container) --- */
.msw-transcript-container {
    position: relative;
    margin-top: 0.25rem;
    overflow: visible;
    border: none !important;
    outline: none !important;
    z-index: 999999 !important;
}

.msw-transcript-container .msw-transcript-trigger {
    display: block;
    cursor: pointer !important;
    position: relative;
    z-index: 99999;
    font-size: 1.125rem;
    line-height: 1.4;
    color: var(--msw-text-s-c1, #333);
    padding: 0.4rem 0.6rem;
    opacity: 0.85;
    transition: opacity 0.2s ease;
    -webkit-tap-highlight-color: transparent;
    border: none !important;
    outline: none !important;
}

.msw-transcript-container .msw-transcript-trigger:hover,
.msw-transcript-container .msw-transcript-trigger:focus-visible {
    opacity: 1;
}

/* Author: own line above preview */
.msw-transcript-container .msw-transcript-auth {
    display: block !important;
    font-weight: 600;
    margin-right: 0;
    margin-bottom: 0.3rem;
    cursor: default !important;
}

/* Preview: fallback typography; visibility controlled by swiper-view.php inline */
.msw-transcript-container .msw-transcript-preview {
    font-style: italic;
    font-size: 1.125rem;
}

/* Trigger layout for desktop full text (768px+) */
@media (min-width: 768px) {
    .msw-transcript-container .msw-transcript-trigger {
        max-width: 80%;
        margin: 0 auto;
        /* CLS fix: reserve space when switching from mobile (8 words) to desktop (full text) at 768px */
        min-height: 2.8em;
    }
}

/* Overlay: fallback typography only; positioning via swiper-view.php inline (centering) */
.msw-transcript-container .msw-transcript-overlay {
    color: var(--msw-text-s-c1, #333);
    font-family: "Noto Sans", sans-serif;
    font-size: 2.5rem;
    line-height: 1.3;
}

/* Tablet (768px–1023px): caption text 25% smaller – desktop and mobile unchanged */
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .msw-transcript-container .msw-transcript-overlay,
    .msw-transcript-container .msw-transcript-overlay .msw-transcript-full,
    .msw-transcript-container .msw-transcript-overlay .msw-transcript-full p {
        font-size: 1.875rem !important;  /* 2.5rem * 0.75 = 25% smaller */
    }
}

/* Desktop (1024px+): caption text 25% smaller for better fit with wider overlay */
@media screen and (min-width: 1024px) {
    .msw-transcript-container .msw-transcript-overlay,
    .msw-transcript-container .msw-transcript-overlay .msw-transcript-full,
    .msw-transcript-container .msw-transcript-overlay .msw-transcript-full p {
        font-size: 1.875rem !important;  /* 2.5rem * 0.75 = 25% smaller */
    }
}

/* Close button: top-right corner, ~35px, #3D3D3D */
.msw-transcript-container .msw-transcript-close {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #3D3D3D !important;
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent;
    border: none !important;
    outline: none !important;
    background: transparent !important;
}
.msw-transcript-container .msw-transcript-close i {
    font-size: 1.75rem;
}
.msw-transcript-container .msw-transcript-close:hover,
.msw-transcript-container .msw-transcript-close:focus-visible {
    opacity: 0.8;
}

/* Hide trigger when overlay open (only overlay + close button visible) */
.msw-transcript-container.is-open .msw-transcript-trigger {
    opacity: 0 !important;
    pointer-events: none !important;
}

.msw-transcript-container .msw-transcript-full {
    white-space: pre-wrap;
    word-wrap: break-word;
}