/* =========================================================
   DOCUMENTO PDF - Per il Frantoio

   The site's own language: #1C1C1C card, #EEEEEE text, #D19100
   accent, Arial, 16px corners — the same values the category
   archive and the events carousel are drawn from.

   Which half of the box is shown is decided in CSS alone, so
   there is no flash and nothing for a cache to get wrong:
   a wide screen driven by a real pointer gets the browser's
   own PDF viewer, everything else gets the first page and a
   download. Mobile is the default, the viewer is the
   exception — an iPad reports a coarse pointer and lands on
   the poster, which is right, because iOS renders only the
   first page of a PDF in an iframe.
   ========================================================= */

.frantoio-pdf {
    --frantoio-pdf-bg: #1C1C1C;
    --frantoio-pdf-text: #EEEEEE;
    --frantoio-pdf-muted: rgba(238, 238, 238, 0.62);
    --frantoio-pdf-border: rgba(238, 238, 238, 0.16);
    --frantoio-pdf-accent: #D19100;
    --frantoio-pdf-accent-text: #FFFFFF;
    --frantoio-pdf-radius: 16px;

    font-family: Arial, Helvetica, sans-serif;
    background: var(--frantoio-pdf-bg);
    color: var(--frantoio-pdf-text);
    border: 1px solid var(--frantoio-pdf-border);
    border-radius: var(--frantoio-pdf-radius);
    overflow: hidden;
    width: 100%;
}

/* ------------------------------------------------------------ the head row */

.frantoio-pdf-head {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--frantoio-pdf-border);
}

.frantoio-pdf-glyph {
    flex: 0 0 auto;
    width: 30px;
    height: 37px;
    color: var(--frantoio-pdf-accent);
}

.frantoio-pdf-glyph svg {
    display: block;
    width: 100%;
    height: 100%;
}

.frantoio-pdf-id {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.frantoio-pdf-name {
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.frantoio-pdf-meta {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--frantoio-pdf-muted);
}

.frantoio-pdf-action {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 20px;
    border-radius: 5px;
    background: var(--frantoio-pdf-accent);
    color: var(--frantoio-pdf-accent-text) !important;
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: none !important;
    transition: filter 0.25s ease, transform 0.2s ease;
}

.frantoio-pdf-action:hover,
.frantoio-pdf-action:focus {
    filter: brightness(1.12);
    transform: translateY(-1px);
    color: var(--frantoio-pdf-accent-text) !important;
}

/* --------------------------------------------------------------- the stage */

.frantoio-pdf-stage {
    background: rgba(0, 0, 0, 0.35);
}

/* Desktop viewer — hidden until the media query below turns it on. */
.frantoio-pdf-frame {
    display: none;
    width: 100%;
    height: 760px;
    border: 0;
    background: #2C2C2C;
}

/* Phone/tablet: the first page, big enough to recognise, and a way in. */
.frantoio-pdf-tap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    padding: 24px 18px 28px;
    color: var(--frantoio-pdf-text) !important;
    text-decoration: none !important;
}

.frantoio-pdf-poster {
    width: 100%;
    max-width: 300px;
    aspect-ratio: 1 / 1.294;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
}

.frantoio-pdf-poster img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* The top of a first page is its title; never centre-crop it away. */
    object-position: top center;
}

.frantoio-pdf-poster.is-blank {
    background: rgba(238, 238, 238, 0.06);
    border: 1px solid var(--frantoio-pdf-border);
    color: var(--frantoio-pdf-accent);
}

.frantoio-pdf-poster.is-blank svg {
    width: 64px;
    height: 79px;
}

.frantoio-pdf-tap-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 20px;
    border: 1px solid var(--frantoio-pdf-accent);
    border-radius: 5px;
    color: var(--frantoio-pdf-accent);
    font-size: 0.92rem;
    font-weight: 700;
}

/* ---------------------------------------------------------------- the foot */

.frantoio-pdf-foot {
    display: none;
    margin: 0;
    padding: 12px 18px;
    border-top: 1px solid var(--frantoio-pdf-border);
    font-size: 0.85rem;
    text-align: right;
}

.frantoio-pdf-foot a {
    color: var(--frantoio-pdf-accent) !important;
    text-decoration: none !important;
}

.frantoio-pdf-foot a:hover {
    text-decoration: underline !important;
}

/* ------------------------------------------------------------ narrow phone */

@media (max-width: 520px) {
    .frantoio-pdf-head {
        flex-wrap: wrap;
        gap: 12px;
    }

    .frantoio-pdf-id {
        flex-basis: calc(100% - 46px);
    }

    .frantoio-pdf-action {
        width: 100%;
    }
}

/* ------------------------------------------------- desktop with a pointer */

@media (min-width: 1025px) and (hover: hover) and (pointer: fine) {
    .frantoio-pdf-frame {
        display: block;
    }

    .frantoio-pdf-tap {
        display: none;
    }

    .frantoio-pdf-foot {
        display: block;
    }
}