/* Pass D — events */

/* ===== homeMatchShowcaseStyle ===== */

/* Données Match : même famille, quelle que soit la vue qui les affiche. */
.answer.match-answer .home-match-date,
.answer.match-answer .home-match-club,
.answer.match-answer .home-match-kickoff,
.answer.match-answer .home-match-meeting .event-line-text,
.match-card.player-match-panel .home-match-date,
.match-card.player-match-panel .home-match-club,
.match-card.player-match-panel .home-match-kickoff,
.match-card.player-match-panel .home-match-meeting .event-line-text,
.coach-match-panel .coach-panel-date,
.coach-match-panel .coach-panel-teams > strong,
.coach-match-panel .coach-panel-teams > div > b,
.coach-match-panel .coach-panel-teams > div > span,
.coach-match-panel .home-match-meeting .event-line-text {
  font-family: var(--font-ui);
}

.home-match-layout {
  margin: .4rem 0 .8rem;
}

.home-match-date {
  text-align: center;
  color: #d7f3e0;
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.home-match-teams {
  display: grid;
  grid-template-columns: minmax(0,1fr) max-content minmax(0,1fr);
  align-items: start;
  gap: .45rem;
  margin-top: .55rem;
}

.home-match-club {
  display: flex;
  align-self: start;
  align-items: center;
  justify-content: center;
  min-height: 2.15rem;
  height: 2.15rem;
  text-align: center;
  font-size: 1.06rem;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

.home-match-club-left,.home-match-club-right {
  text-align: center;
}

.home-match-kickoff {
  text-align: center;
}

.home-match-kickoff b {
  display: block;
  padding: .42rem .2rem;
  border-radius: 8px;
  background: #eef3ef;
  color: var(--deep);
  font-size: 1.14rem;
  line-height: 1;
}

.home-match-kickoff span {
  display: block;
  margin-top: .35rem;
  color: #d7f3e0;
  font-size: .7rem;
  font-weight: 800;
  white-space: nowrap;
}

/* ===== matchSportStyle ===== */

.answer.match-answer {
  font-family: var(--font-ui);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-bottom: 1rem;
  border: 1px solid rgba(214, 243, 224, .35);
  border-radius: 18px;
  background: radial-gradient(circle at 12% 18%, rgba(255,255,255,.12) 0 2px, transparent 3px 100%),
            radial-gradient(circle at 92% 88%, rgba(255,255,255,.1) 0 1px, transparent 2px 100%),
            linear-gradient(145deg, #075b4a 0%, #064638 58%, #04372e 100%);
  box-shadow: 0 14px 28px rgba(3, 48, 38, .18);
}

.answer.match-answer::before,
        .answer.match-answer::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  border: 1px solid rgba(221, 250, 231, .14);
  border-radius: 999px;
}

.answer.match-answer::before {
  width: 18rem;
  height: 18rem;
  right: -9rem;
  top: -11rem;
}

.answer.match-answer::after {
  width: 12rem;
  height: 12rem;
  left: -8rem;
  bottom: -9rem;
}

.answer.match-answer > .eyebrow {
  margin-bottom: .45rem;
  color: var(--event-content-secondary);
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.answer.match-answer .home-match-layout {
  margin: .25rem 0 .5rem;
}

.answer.match-answer .home-match-date {
  color: #e8fff0;
  font-size: .84rem;
  font-weight: 600;
  letter-spacing: .1em;
}

.answer.match-answer .home-match-teams {
  grid-template-columns: minmax(0, 1fr) max-content minmax(0, 1fr);
  gap: .3rem;
  margin-top: .65rem;
}

.answer.match-answer .home-match-club {
  align-self: center;
  min-height: 0;
  height: auto;
  min-width: 0;
  color: var(--event-content-primary);
  overflow: visible;
  white-space: normal;
  font-size: clamp(.68rem, 3.55vw, 1.45rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.025em;
  text-transform: uppercase;
}

.answer.match-answer .home-match-kickoff {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.answer.match-answer .home-match-kickoff b {
  padding: .32rem .16rem;
  border: 1px solid rgba(7, 91, 74, .18);
  border-radius: 10px;
  background: #f2fff6;
  color: #064638;
  font-size: clamp(1.1rem, 4.1vw, 1.45rem);
  font-weight: 700;
  box-shadow: 0 5px 12px rgba(0,0,0,.12);
}

.answer.match-answer .home-match-kickoff span {
  margin-top: .32rem;
  color: rgba(235, 255, 242, .78);
  font-size: .66rem;
  font-weight: 500;
  letter-spacing: .04em;
}

.answer.match-answer .answer-actions {
  position: relative;
  z-index: 1;
  gap: .45rem;
  margin-top: .55rem;
}

.answer.match-answer .answer-actions button {
  min-height: 44px;
  padding: .38rem .68rem;
  border-radius: 10px;
  font-size: .82rem;
  font-weight: 600;
}

.answer.match-answer .answer-actions .present {
  border-color: #b7dfc5;
  background: var(--soft);
  color: var(--deep);
}

.answer.match-answer .answer-actions[data-answer="present"] .present {
  background: var(--green);
  border-color: #a9d6b6;
  color: var(--event-match-ink);
}

.answer.match-answer .answer-actions .absent {
  border-color: #e3b9b6;
  background: var(--redsoft);
  color: var(--red);
}

.answer.match-answer .answer-actions[data-answer="absent"] .absent {
  background: var(--red);
  color: var(--event-match-ink);
}

.answer.match-answer .convocation-status {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(90%, 25rem);
  min-height: 44px;
  margin: .45rem auto;
  padding: .45rem .7rem;
  border-radius: 10px;
  text-align: center;
  font-weight: 600;
  line-height: 1.15;
}

.answer.match-answer .convocation-status.is-convoked {
  background: rgba(8, 113, 61, .25);
  border: 1px solid rgba(169, 214, 182, .48);
  color: var(--event-match-ink);
}

.answer.match-answer .convocation-status.is-not-convoked {
  background: rgba(101, 113, 117, .28);
  border: 1px solid rgba(190, 217, 216, .42);
  color: var(--event-match-ink);
}

.answer.match-answer .event-description {
  width: 100%;
  margin: .35rem 0 .5rem;
  padding: .42rem .65rem;
  border: 1px solid rgba(184, 201, 193, .24);
  border-radius: 8px;
  background: rgba(16, 42, 37, .4);
  color: var(--event-match-muted);
  font-size: .7rem;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  white-space: pre-line;
}

.answer.match-answer .match-missions-summary {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.match-missions-summary {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .25rem .65rem;
  margin: .15rem 0 .45rem;
  color: var(--event-match-muted);
  font-size: .68rem;
  font-weight: 600;
}

.match-missions-summary span {
  white-space: nowrap;
}

.answer.match-answer .home-match-logistics {
  width: 100%;
  margin: .18rem auto .15rem;
  text-align: center;
  color: var(--event-match-muted);
  font-size: .78rem;
  line-height: 1.3;
}

.answer.match-answer .home-match-logistics > div {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

.answer.match-answer .home-match-logistics .home-match-meeting {
  margin-top: .12rem;
  opacity: .86;
  font-size: .74rem;
}

.answer.match-answer > .actions {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: .55rem;
}

.coach-match-kickoff.home-match-kickoff.match-result-inline-score { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: .25rem; white-space: nowrap; }
.coach-match-kickoff.home-match-kickoff.match-result-inline-score .score-box { display: inline-flex; flex: 0 0 2.25rem; align-items: center; justify-content: center; box-sizing: border-box; width: 2.25rem; height: 2.25rem; aspect-ratio: 1; margin: 0; padding: 0; border-radius: 6px; background: #075197; color: #fff; font-family: Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; font-size: 1.35rem; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1; }
.answer.match-answer .coach-match-kickoff.home-match-kickoff.match-result-inline-score .score-box,
.match-card.player-match-panel .coach-match-kickoff.home-match-kickoff.match-result-inline-score .score-box { font-family: var(--font-ui); }
.coach-match-kickoff.home-match-kickoff.match-result-inline-score .score-separator { display: none; margin: 0; color: currentColor; font-size: 1rem; font-weight: 900; line-height: 1; }
.answer.match-answer .coach-match-kickoff.home-match-kickoff.match-result-inline-score,
.match-card.player-match-panel .coach-match-kickoff.home-match-kickoff.match-result-inline-score {
  gap: clamp(.35rem, 1.2vw, .6rem);
}
.answer.match-answer .coach-match-kickoff.home-match-kickoff.match-result-inline-score {
  gap: clamp(.75rem, 3vw, 1.2rem);
}
.match-score-details { position: fixed; inset: 0; z-index: 1210; display: grid; place-items: center; padding: 1rem; isolation: isolate; }
.match-score-details[hidden] { display: none; }
.match-score-details-panel { position: relative; z-index: 1; width: min(100%, 24rem); max-height: min(80dvh, 32rem); overflow: auto; padding: 1.1rem; border-radius: 18px; background: var(--paper); box-shadow: 0 18px 50px rgba(4,35,27,.24); }
.match-score-details:not([hidden]) .match-score-details-panel { animation: match-score-pop-in .24s cubic-bezier(.22,.72,.22,1) both; }

@keyframes match-score-pop-in {
  from { opacity: 0; transform: translateY(-.8rem) scale(.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .match-score-details:not([hidden]) .match-score-details-panel { animation: none; }
}

.match-score-details-panel h2 { margin: .2rem 2.4rem 1rem 0; font-size: 1rem; line-height: 1.3; text-transform: uppercase; }
.match-score-details-panel ul { display: grid; gap: .55rem; margin: 0; padding: 0; list-style: none; }
.match-score-details-panel li { display: flex; align-items: flex-start; gap: .6rem; padding: .55rem .65rem; border-radius: 10px; background: var(--paper-strong); }
.match-score-details-panel li > span { font-size: 1rem; }
.match-score-details-panel li div { display: grid; gap: .15rem; }
.match-score-details-panel li small { color: var(--muted); }
.match-result-modal { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left)); }
.match-result-backdrop { position: absolute; inset: 0; border: 0; background: rgba(4, 35, 27, .46); }
.match-score-details .match-result-backdrop,
.match-score-details .match-result-backdrop:hover,
.match-score-details .match-result-backdrop:focus,
.match-score-details .match-result-backdrop:active {
  background: transparent;
  z-index: 0;
  pointer-events: auto;
  outline: none;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
}
.match-result-panel { position: relative; display: flex; flex-direction: column; width: min(100%, 32rem); max-height: min(92dvh, 48rem); overflow: hidden; padding: 1.1rem; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 18px 50px rgba(4, 35, 27, .24); }
.match-result-panel form { min-height: 0; overflow: auto; padding: .1rem .1rem 0; }
.match-result-close { position: absolute; top: .65rem; right: .65rem; width: 2rem; height: 2rem; border: 0; border-radius: 50%; background: var(--paper-strong); color: var(--deep); font-size: 1.25rem; line-height: 1; cursor: pointer; }
.match-result-panel h2 { margin: .1rem 2.4rem .9rem 0; text-transform: uppercase; }
.match-result-panel > h2 { display: none; }
.match-result-field { display: grid; gap: .22rem; margin-top: .42rem; }
.match-result-field span { color: var(--muted); font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.match-result-panel select, .match-result-panel input { width: 100%; min-height: 2.45rem; appearance: none; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--deep); font: inherit; padding: .45rem .6rem; }
.match-result-panel select { background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%); background-position: calc(100% - .9rem) 1.05rem, calc(100% - .65rem) 1.05rem; background-size: .25rem .25rem, .25rem .25rem; background-repeat: no-repeat; padding-right: 1.8rem; }
.match-result-score { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: .65rem; margin: .25rem 0 .15rem; }
.match-result-score label { display: grid; justify-items: center; gap: .35rem; min-width: 0; color: var(--deep); font-size: .78rem; font-weight: 800; text-align: center; text-transform: uppercase; }
.match-result-score input { width: 3rem; min-height: 3rem; padding: .2rem; text-align: center; font-size: 1.35rem; font-weight: 900; }
.match-result-score > b { padding-bottom: .75rem; color: var(--muted); font-size: 1.2rem; }
.match-goal { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 .6rem; margin-top: .55rem; padding: .55rem .65rem .65rem; border: 1px solid rgba(31, 93, 61, .1); border-radius: 12px; background: var(--paper-strong); }
.match-goal > b { grid-column: 1 / -1; color: var(--deep); font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; }
.match-result-panel .actions { position: sticky; bottom: 0; margin: 1rem -.1rem 0; padding: .65rem .1rem .1rem; background: linear-gradient(180deg, transparent, var(--paper) 28%); }
.match-result-panel .actions .primary { width: 100%; min-height: 2.8rem; border-radius: 12px; }

@media (max-width: 440px) {
  .match-result-modal { padding-inline: .65rem; }
  .match-result-panel { padding: .95rem; border-radius: 18px; }
  .match-result-score { gap: .45rem; }
  .match-result-score label { font-size: .65rem; }
  .match-score-details-panel { border: 1px solid rgba(7, 93, 52, .24); box-shadow: 0 10px 26px rgba(4, 35, 27, .14); }
}

html.match-score-open,
body.match-score-open {
  overscroll-behavior: none;
}

@media (max-width: 440px) {
  body.match-score-open { overflow: hidden; }
}

@media (max-width: 359px) {
  .match-goal { grid-template-columns: 1fr; }
  .match-goal > b { grid-column: auto; }
}

.answer.match-answer > .actions:empty {
  display: none;
}

.answer.match-answer > .actions button {
  width: auto;
  min-height: 36px;
  padding: .35rem .2rem .35rem .55rem;
  border: 0;
  background: transparent;
  color: var(--event-content-primary);
  font-size: .82rem;
  font-weight: 600;
  text-align: center;
}

.answer.match-answer > .actions button:hover,
.answer.match-answer > .actions button:focus-visible {
  color: var(--event-match-ink);
  text-decoration: underline;
}

/* Shared reveal for the home and agenda attendance / convocation panels. */
.player-match-panel .event-card-reveal {
  display: grid;
  grid-template-rows: 0fr;
  max-height: none;
  overflow: hidden;
  overflow-anchor: none;
  opacity: 0;
  pointer-events: none;
  transition: grid-template-rows .42s cubic-bezier(.22,.72,.22,1), opacity .2s ease;
}

/* Avoid the native mobile tap highlight/focus frame on event cards. */
@media (hover: none) and (pointer: coarse) {
  .player-match-panel,
  .player-match-panel button {
    -webkit-tap-highlight-color: transparent;
  }

  .player-match-panel:focus,
  .player-match-panel button:focus {
    outline: none;
    box-shadow: none;
  }
}

.player-match-panel .event-card-reveal.is-open {
  grid-template-rows: 1fr;
  opacity: 1;
  pointer-events: auto;
}

.player-match-panel .event-card-reveal-inner {
  min-height: 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(-.35rem);
  transition: opacity .24s ease .08s, transform .36s cubic-bezier(.22,.72,.22,1);
}

.player-match-panel .event-card-reveal.is-open > .event-card-reveal-inner {
  opacity: 1;
  transform: translateY(0);
}

@starting-style {
  .player-match-panel .event-card-reveal.is-open {
    grid-template-rows: 0fr;
    opacity: 0;
  }

  .player-match-panel .event-card-reveal.is-open > .event-card-reveal-inner {
    opacity: 0;
    transform: translateY(-.35rem);
  }
}

@media (max-width: 440px) {
  .answer.match-answer .home-match-logistics {
    font-size: .76rem;
  }
  .answer.match-answer .home-match-logistics .home-match-meeting {
    font-size: .71rem;
    white-space: normal;
  }
}

@media (max-width: 360px) {
  .answer.match-answer .home-match-teams {
    grid-template-columns: minmax(0, 1fr) max-content minmax(0, 1fr);
  }
  .answer.match-answer .home-match-club {
    font-size: clamp(.62rem, 3.35vw, .95rem);
  }
  .answer.match-answer .home-match-date {
    font-size: .76rem;
    letter-spacing: .075em;
  }
  .answer.match-answer .answer-actions button {
    padding-inline: .62rem;
    font-size: .82rem;
  }
}

@media (min-width: 700px) {
  .answer.match-answer {
    padding: 1.2rem 1.35rem;
  }
  .answer.match-answer .home-match-teams {
    gap: 1rem;
  }
}

/* ===== trainingAnswerStyle ===== */

.answer.training-answer {
  font-family: var(--font-ui);
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(220, 242, 250, .45);
  border-radius: 18px;
  background: radial-gradient(circle at 88% 18%, rgba(255,255,255,.12) 0 2px, transparent 3px 100%),
            linear-gradient(145deg, #2d7e92 0%, #256c80 58%, #1f5b6c 100%);
  color: #fff;
  box-shadow: 0 14px 28px rgba(3, 48, 38, .18);
}

.answer.training-answer > .eyebrow {
  margin-bottom: .45rem;
  color: #d9f1f7;
  font-size: .6rem;
  font-weight: 600;
  letter-spacing: .13em;
}

.answer.training-answer .training-schedule {
  position: relative;
  display: block;
  text-align: center;
  margin: .2rem 0 .45rem;
}

.answer.training-answer .training-date {
  color: var(--event-content-primary);
  font-size: .84rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-align: center;
}

.answer.training-answer .training-time {
  display: block;
  margin-top: .25rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--event-content-secondary);
  font-size: .76rem;
  font-weight: 500;
  line-height: 1;
}

.answer.match-answer .home-match-logistics .event-line-icon,
.answer.training-answer .training-time .event-line-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  min-width: 1rem;
  font-size: .72rem;
  line-height: 1;
}

.answer.training-answer .training-time .event-line-text {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
}

.answer.training-answer .training-time strong {
  font-weight: 500;
}

.answer.training-answer > h2 {
  margin: .25rem 0 .35rem;
  color: #fff;
  font-size: clamp(.95rem, 3.5cqw, 1.15rem);
  font-weight: 600;
}

.answer.training-answer .answer-actions {
  margin-top: .55rem;
}

.answer.training-answer .answer-actions button {
  min-height: 44px;
  padding: .38rem .68rem;
  font-size: .82rem;
}

.answer.training-answer .event-description {
  color: var(--event-content-secondary);
  font-size: .7rem;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  white-space: pre-line;
}

/* Match et entraînement : même hiérarchie pour les informations équivalentes. */
.answer.match-answer .home-match-date,
.answer.training-answer .training-date {
  color: var(--event-content-primary);
}

.answer.match-answer .home-match-logistics,
.answer.match-answer .home-match-logistics .home-match-meeting {
  font-family: var(--font-ui);
  color: var(--event-content-secondary);
  font-size: .76rem;
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
}

.answer.match-answer .home-match-logistics .home-match-meeting {
  opacity: 1;
}

.answer.match-answer .event-description,
.answer.training-answer .event-description {
  width: 100%;
  margin: .35rem 0 .5rem;
  padding: .42rem .65rem;
  border: 1px solid rgba(184, 201, 193, .24);
  border-radius: 8px;
  background: rgba(16, 42, 37, .4);
  font-family: var(--font-ui);
  color: var(--event-content-secondary);
  font-size: .7rem;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  white-space: pre-line;
}

.answer.match-answer .answer-actions button,
.answer.training-answer .answer-actions button {
  font-family: var(--font-ui);
  font-size: .82rem;
  font-weight: 600;
}

.answer.training-answer .answer-actions .present {
  border-color: #b7f0c8;
  background: var(--soft);
  color: var(--deep);
}

.answer.training-answer .answer-actions .absent {
  border-color: #efc7c4;
  background: var(--redsoft);
  color: var(--red);
}

.answer.training-answer .answer-actions[data-answer="present"] .present {
  background: var(--green);
  border-color: #a9d6b6;
  color: #e7f6ec;
}

.answer.training-answer .answer-actions[data-answer="absent"] .absent {
  background: var(--red);
  border-color: #d9a4a0;
  color: #f1f5f2;
}

.answer.training-answer .answer-actions[data-answer] button:disabled {
  border-color: #596569;
  background: var(--event-disabled);
  color: #eef2f3;
  cursor: not-allowed;
  opacity: 1;
}

.answer.training-answer > .actions {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: .55rem;
}

.answer.training-answer .actions button {
  width: auto;
  min-height: 36px;
  padding: .35rem .2rem .35rem .55rem;
  border: 0;
  background: transparent;
  color: var(--event-training-ink);
  font-size: .82rem;
  font-weight: 600;
  text-align: center;
}

.answer.training-answer .actions:empty {
  display: none;
}

@media (max-width: 360px) {
  .answer.training-answer .training-schedule {
    align-items: flex-start;
  }
  .answer.training-answer .training-date {
    font-size: .76rem;
    letter-spacing: .075em;
  }
  .answer.training-answer .training-time {
    font-size: .76rem;
  }
}

@media (max-width: 720px) {
  .answer.training-answer .event-description {
    display: block;
    max-height: none;
    margin: .35rem 0 0;
    overflow: visible;
    white-space: normal;
    line-height: 1.35;
  }
}

/* ===== importantInfoStyle ===== */

.important-info {
  position: relative;
  z-index: 3;
  margin-top: -2.6rem;
  border-color: #e2c777;
  background: linear-gradient(135deg, #fffdf6 0%, #fff1c9 100%);
  box-shadow: 0 14px 30px rgba(23, 59, 37, .18), 0 2px 8px rgba(183, 136, 34, .12), inset 0 1px 0 rgba(255, 255, 255, .8);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.important-info > i {
  background: rgba(255, 226, 145, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45);
}

.important-info[hidden],
.important-info .info-preview[hidden] {
  display: none !important;
}

.important-info .coach-card-menu {
  position: absolute;
  top: .7rem;
  right: .7rem;
  left: auto;
}

.important-info-modal-backdrop {
  position: fixed;
  z-index: 30;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: #062d1d88;
}

.important-info-modal {
  width: min(100%,520px);
  max-height: 90vh;
  overflow: auto;
  box-shadow: 0 20px 60px #001f1299;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.important-info-modal button,
.important-info-modal textarea {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.important-info-modal textarea {
  font-weight: 400;
}

.important-info-modal .title {
  align-items: center;
}

.important-info-modal .title .text {
  min-height: 34px;
  padding: .2rem .45rem;
}

@media (min-width:700px) {
  .important-info {
    margin-top: -3.2rem;
  }
}