/*
 * Le cadre des écrans de l'extension dans la page du thème.
 *
 * Le titre de page libéré de son bandeau, la carte de page en plateau
 * translucide autour d'un cœur blanc, l'entrée en fondu. Ces règles visent
 * la carte du thème AUTOUR de la racine de l'extension.
 *
 * Écrans : toute page qui porte un écran de l'extension.
 *
 * Sa place dans la cascade est fixée par cnpr_insc_feuilles_front()
 * (includes/front-tunnel-core.php) : toutes les feuilles du front se
 * chargent partout où l'extension s'affiche, dans cet ordre, avant le thème.
 */

/* ==========================================================================
   Tunnel shell — double-bezel architecture (scoped to pages hosting the
   tunnel via :has(), zero theme edits).

   The theme stacks two equal-weight cards on these pages (the calendar-hero
   title banner + the article.card content frame), and the tunnel used to add
   its own borders inside — three frames deep. Instead of removing nesting,
   make it deliberate: the title floats free on the page, and the content card
   becomes ONE machined surface — a barely-there translucent tray (hairline,
   soft diffused ambient shadow) holding a concentric white core. Structural
   separations inside are whitespace + soft hairlines; borders are reserved
   for interactive elements.

   overflow:visible on the tray is load-bearing: the base .card clips with
   overflow:hidden, which creates a clipping context and KILLS position:sticky
   for the pinned activité name on the picks step. Nothing bleeds out of the
   inner core, so no clipping is needed anywhere.
   ========================================================================== */

/* Title banner → free-floating page title (no box, no glow blob). */
main.layout:has(.cnpr-insc) .calendar-hero {
    background: none;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 18px 6px 0;
}
main.layout:has(.cnpr-insc) .calendar-hero::after { content: none; }

/* Outer shell: translucent tray, hairline, one large diffused shadow. */
.card:has(.cnpr-insc) {
    background: rgba(255, 255, 255, 0.45);
    border: 1px solid rgba(16, 32, 53, 0.06);
    border-radius: 28px;
    padding: 8px;
    box-shadow:
        0 40px 80px -48px rgba(16, 32, 53, 0.28),
        0 2px 6px rgba(16, 32, 53, 0.04);
    overflow: visible;
}
/* Inner core: white, mathematically concentric radius (28px − 8px tray). */
.card:has(.cnpr-insc) > .page-content {
    background: var(--cnpr-fond, #ffffff);
    border: 1px solid rgba(16, 32, 53, 0.04);
    border-radius: 20px;
    padding: 26px 28px 28px;
}
@media (max-width: 560px) {
    .card:has(.cnpr-insc) { padding: 5px; border-radius: 22px; }
    .card:has(.cnpr-insc) > .page-content { border-radius: 17px; padding: 18px 16px 20px; }
}
/* Entrance: one gentle, heavy fade-up per page load — transform/opacity only. */
@media (prefers-reduced-motion: no-preference) {
    .card:has(.cnpr-insc) {
        animation: cnpr-insc-rise 0.7s cubic-bezier(0.32, 0.72, 0, 1) backwards;
    }
    @keyframes cnpr-insc-rise {
        from { opacity: 0; transform: translateY(16px); }
    }
}