/* =========================================================================
   Training calendar download dialog (template-parts/calendar-download.php)
   Used wherever a "Download Training Calendar (PDF)" button appears.
   ========================================================================= */
.jd-dl { width: min(520px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 0; border: 0; border-radius: var(--radius-lg); background: var(--forest); color: var(--on-forest); box-shadow: 0 40px 80px -24px rgba(0, 0, 0, .5); }
.jd-dl::backdrop { background: rgba(10, 20, 16, .6); backdrop-filter: blur(4px); }
.jd-dl[open] { animation: jd-dl-in var(--dur-slow) var(--ease-out); }
@keyframes jd-dl-in { from { opacity: 0; transform: translateY(24px) scale(.98); } }
.jd-dl__form { position: relative; display: grid; gap: var(--space-4); padding: clamp(28px, 5vw, 40px); }
.jd-dl__close { position: absolute; right: 16px; top: 16px; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 50%; background: none; color: inherit; cursor: pointer; transition: background-color var(--dur-base), border-color var(--dur-base); }
.jd-dl__close:hover { border-color: var(--lime); }
.jd-dl__close:focus-visible, .jd-dl__field input:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.jd-dl__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--lime); color: var(--forest); }
.jd-dl__icon svg { width: 22px; height: 22px; }
.jd-dl__title { margin: 0 0 var(--space-2); padding-right: 48px; font-size: var(--fs-h3); font-weight: 500; line-height: 1.2; }
.jd-dl__field { min-width: 0; display: grid; gap: 6px; font-size: var(--fs-small); color: var(--on-forest-muted); }
.jd-dl__field input { width: 100%; min-width: 0; height: 52px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 12px; background: rgba(255, 255, 255, .06); color: #fff; font: inherit; font-size: var(--fs-body); }
.jd-dl__field input[aria-invalid="true"] { border-color: #ffb4a8; }
.jd-dl__field i { font-style: normal; color: var(--lime); }
.jd-dl__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.jd-dl__check { position: relative; display: flex; gap: 12px; align-items: flex-start; font-size: var(--fs-small); line-height: 1.5; color: var(--on-forest); cursor: pointer; }
.jd-dl__check input { position: absolute; opacity: 0; width: 22px; height: 22px; margin: 0; }
.jd-dl__check small { font-size: inherit; color: var(--on-forest-muted); }
.jd-dl__box { flex: none; display: grid; place-items: center; width: 22px; height: 22px; border: 1.5px solid rgba(255, 255, 255, .5); border-radius: 6px; color: transparent; transition: background-color var(--dur-base), border-color var(--dur-base), color var(--dur-base); }
.jd-dl__box svg { width: 14px; height: 14px; }
.jd-dl__check input:checked + .jd-dl__box { border-color: var(--lime); background: var(--lime); color: var(--forest); }
.jd-dl__check input:focus-visible + .jd-dl__box { outline: 2px solid var(--lime); outline-offset: 2px; }
.jd-dl__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.jd-dl__status { min-height: 1.5em; margin: 0; font-size: var(--fs-small); color: var(--lime); }
.jd-dl__status.is-error { color: #ffb4a8; }
.jd-dl__submit { justify-self: start; }
.jd-dl__submit[disabled] { opacity: .7; cursor: progress; }
@media (max-width: 480px) { .jd-dl__pair { grid-template-columns: minmax(0, 1fr); } }
