/* Supervision de la synchronisation Google Agenda. */
.google-heading-actions .google-reconnect,
.pc-sync-alert .google-reconnect {
  text-decoration: none;
}

.google-error-detail {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  margin-top: 12px;
  padding: 10px 11px;
  color: #7f4b16;
  background: #fff7e8;
  border: 1px solid #efd6ad;
  border-radius: 8px;
}

.google-error-detail > span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: #fff;
  background: #d67b20;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 900;
}

.google-error-detail strong {
  display: block;
  color: #704116;
  font-size: 9px;
}

.google-error-detail p {
  margin: 4px 0 0;
  color: #8a5b2a;
  font-size: 8px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.calendar-card:has(.connection.warning) {
  border-color: #e8c48f;
  box-shadow: 0 7px 20px #a66a1817;
}

.pc-sync-alert-wrap {
  z-index: 170;
}

.pc-sync-alert {
  width: min(760px, 100%);
  border-top: 5px solid #d9771c;
}

.pc-sync-alert header p {
  margin: 6px 0 0;
  color: #7d8b99;
  font-size: 9px;
}

.pc-sync-alert-content {
  display: grid;
  gap: 14px;
  padding: 18px 22px 22px;
}

.pc-sync-alert-content > aside {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 13px 14px;
  color: #764516;
  background: #fff7e9;
  border: 1px solid #efd5aa;
  border-radius: 10px;
}

.pc-sync-alert-content > aside > span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  color: #fff;
  background: #d97920;
  border-radius: 9px;
  font-size: 17px;
  font-weight: 900;
}

.pc-sync-alert-content > aside strong {
  color: #704216;
  font-size: 11px;
}

.pc-sync-alert-content > aside p {
  margin: 5px 0 0;
  color: #855b31;
  font-size: 9px;
  line-height: 1.5;
}

.pc-sync-issue-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.pc-sync-issue-list article {
  display: grid;
  grid-template-columns: 5px minmax(0, 1fr);
  gap: 10px;
  min-height: 58px;
  padding: 10px 11px;
  background: #f8fafc;
  border: 1px solid #dfe6ed;
  border-radius: 9px;
}

.pc-sync-issue-list article > i {
  width: 4px;
  min-height: 34px;
  border-radius: 4px;
}

.pc-sync-issue-list article > div {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.pc-sync-issue-list article strong {
  color: #31516d;
  font-size: 10px;
}

.pc-sync-issue-list article small {
  margin-top: 3px;
  color: #82909e;
  font-size: 8px;
}

.pc-sync-issue-list article p {
  margin: 5px 0 0;
  color: #a05c1c;
  font-size: 7.5px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.pc-sync-more {
  margin: -4px 0 0;
  color: #768696;
  text-align: center;
  font-size: 8px;
  font-weight: 700;
}

/* Contexte enrichi du journal d'activité. */
.journal > article.with-context {
  align-items: start;
  min-height: 96px;
  padding: 12px 0;
}

.journal > article.with-context > .log-icon {
  margin-top: 2px;
}

.journal > article.with-context > time {
  padding-top: 6px;
}

.log-meta {
  display: flex !important;
  flex-wrap: wrap;
  gap: 5px !important;
  margin-top: 8px;
}

.journal .log-meta .log-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  min-height: 23px;
  padding: 3px 7px;
  color: #526a7f;
  background: #f2f6f9;
  border: 1px solid #dce5ec;
  border-radius: 6px;
  font-size: 8px;
  line-height: 1.3;
}

.journal .log-meta .log-chip b {
  color: #708396;
  text-transform: uppercase;
  letter-spacing: 0.35px;
  font-size: 6.5px;
}

.journal .log-meta .log-chip.planning {
  color: #285f8c;
  background: #eef6fc;
  border-color: #d3e6f4;
}

.journal .log-meta .log-chip.date,
.journal .log-meta .log-chip.time {
  color: #526273;
  background: #f5f7f9;
}

.journal .log-meta .log-chip.google {
  color: #6b4c98;
  background: #f4f0fa;
  border-color: #e2d9ef;
}

.journal .log-meta .log-chip.location {
  color: #39705e;
  background: #eff8f4;
  border-color: #d6ebe2;
}

.journal .log-meta .log-changes {
  flex-basis: 100%;
  margin-top: 1px;
  padding: 5px 7px;
  color: #875a27;
  background: #fff8ee;
  border-left: 3px solid #e69a43;
  border-radius: 4px;
  font-size: 8px;
}

.journal .log-meta .log-changes strong {
  color: #744716;
  font-size: 8px;
}

@media (max-width: 680px) {
  .google-heading-actions .google-reconnect {
    grid-column: 1 / -1;
  }

  .pc-sync-issue-list {
    grid-template-columns: 1fr;
  }

  .pc-sync-alert-content {
    padding: 15px 16px 18px;
  }

  .pc-sync-alert > footer {
    grid-template-columns: 1fr;
  }

  .pc-sync-alert > footer .btn {
    width: 100%;
  }

  .journal > article.with-context {
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .journal > article.with-context > time {
    grid-column: 2;
    padding-top: 0;
  }

  .journal .log-meta .log-chip {
    width: 100%;
  }
}

/* Sélection directe du mois. */
.month-picker {
  position: relative;
  margin-left: 5px;
}

.month-nav .month-picker-trigger {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  width: auto;
  min-width: 154px;
  padding: 0 9px;
  color: #193c64;
  background: transparent;
  border-color: transparent;
  font-size: 18px;
  font-weight: 760;
  line-height: 1;
}

.month-nav .month-picker-trigger:hover,
.month-nav .month-picker-trigger[aria-expanded="true"] {
  background: #f2f6f9;
  border-color: #d7e1e9;
}

.month-picker-trigger > span {
  color: #8292a1;
  font-size: 12px;
}

.month-picker-menu {
  z-index: 80;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  width: 270px;
  padding: 8px;
  background: #fff;
  border: 1px solid #d5e0e9;
  border-radius: 10px;
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  box-shadow: 0 18px 42px #1034532e;
}

.month-nav .month-picker-menu button {
  display: block;
  width: 100%;
  height: 31px;
  padding: 0 9px;
  color: #50677b;
  text-align: left;
  background: #fff;
  border: 1px solid transparent;
  border-radius: 6px;
  font-size: 9px;
  font-weight: 700;
}

.month-nav .month-picker-menu button:hover {
  color: #174e7c;
  background: #eef5fa;
}

.month-nav .month-picker-menu button.active {
  color: #fff;
  background: #1f659d;
  border-color: #1f659d;
}

/* Missions communes et droits partiels. */
.mission-shared-notice {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  margin: 0 22px 14px;
  padding: 12px 13px;
  color: #405f79;
  background: #eef6fb;
  border: 1px solid #cfe1ee;
  border-radius: 10px;
}

.mission-shared-notice > span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  color: #fff;
  background: #2d78aa;
  border-radius: 9px;
  font-size: 16px;
  font-weight: 900;
}

.mission-shared-notice strong {
  color: #28516f;
  font-size: 10px;
}

.mission-shared-notice p {
  margin: 4px 0 9px;
  color: #6d8293;
  font-size: 8px;
  line-height: 1.45;
}

.mission-target-statuses {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.mission-target-statuses > span {
  display: inline-flex;
  flex-direction: column;
  min-width: 112px;
  padding: 6px 8px;
  background: #fff;
  border: 1px solid #d8e3eb;
  border-radius: 7px;
}

.mission-target-statuses > span.editable {
  background: #edf8f3;
  border-color: #cde7da;
}

.mission-target-statuses > span.locked {
  background: #fff7ec;
  border-color: #ecd8bb;
}

.mission-target-statuses b {
  color: #36546c;
  font-size: 8px;
}

.mission-target-statuses small {
  margin-top: 2px;
  color: #83919d;
  font-size: 6.5px;
}

.mission-target-statuses .editable small {
  color: #2c7a60;
}

.mission-target-statuses .locked small {
  color: #a36a2d;
}

.partial-edit-info {
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  margin: 0 22px 12px;
  padding: 10px 11px;
  color: #72501f;
  background: #fff8ed;
  border: 1px solid #ecd7b8;
  border-radius: 8px;
}

.partial-edit-info > span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  color: #fff;
  background: #d78831;
  border-radius: 50%;
  font-size: 8px;
  font-weight: 900;
}

.partial-edit-info strong {
  color: #76501f;
  font-size: 8px;
}

.partial-edit-info p {
  margin: 4px 0 0;
  color: #8a6a42;
  font-size: 7.5px;
  line-height: 1.45;
}

/* Demande persistante de validation d'une mission. */
.mission-change-alert-wrap {
  z-index: 185;
}

.mission-change-alert {
  width: min(760px, 100%);
  border-top: 5px solid #2d78aa;
}

.mission-change-alert header p {
  margin: 5px 0 0;
  color: #84919d;
  font-size: 8px;
}

.mission-change-content {
  display: grid;
  gap: 13px;
  padding: 18px 22px 21px;
}

.mission-change-content > aside:first-child {
  display: grid;
  grid-template-columns: 35px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 12px 13px;
  color: #345d7c;
  background: #eef6fb;
  border: 1px solid #cfe1ee;
  border-radius: 10px;
}

.mission-change-content > aside:first-child > span {
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
  color: #fff;
  background: #2d78aa;
  border-radius: 9px;
  font-size: 17px;
  font-weight: 900;
}

.mission-change-content > aside:first-child strong {
  color: #28516f;
  font-size: 10px;
}

.mission-change-content > aside:first-child p {
  margin: 5px 0 0;
  color: #667e90;
  font-size: 8px;
  line-height: 1.5;
}

.mission-change-comparison {
  display: grid;
  gap: 7px;
}

.mission-change-comparison article {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 55px;
  padding: 8px 10px;
  background: #fafbfd;
  border: 1px solid #e0e7ed;
  border-radius: 8px;
}

.mission-change-comparison article > strong {
  color: #708294;
  text-transform: uppercase;
  letter-spacing: .4px;
  font-size: 7px;
}

.mission-change-comparison article > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
  gap: 7px;
  align-items: center;
}

.mission-change-comparison span {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 6px 8px;
  background: #fff;
  border-radius: 6px;
}

.mission-change-comparison span.proposed {
  background: #edf7f2;
}

.mission-change-comparison small {
  color: #93a0ab;
  font-size: 6px;
  font-weight: 800;
}

.mission-change-comparison b {
  margin-top: 2px;
  color: #405a70;
  overflow-wrap: anywhere;
  font-size: 8px;
}

.mission-change-comparison .proposed b {
  color: #247158;
}

.mission-change-comparison i {
  color: #91a0ad;
  text-align: center;
  font-size: 13px;
  font-style: normal;
}

.mission-change-disabled {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
  color: #8a5b2a;
  background: #fff7e8;
  border-radius: 7px;
  font-size: 8px;
}

.mission-change-disabled p {
  margin: 0;
}

.mission-change-alert > footer {
  grid-template-columns: auto 1fr auto auto;
}

@media (max-width: 680px) {
  .month-picker {
    flex: 1;
  }

  .month-nav .month-picker-trigger {
    width: 100%;
    min-width: 0;
    font-size: 16px;
  }

  .month-picker-menu {
    width: min(270px, calc(100vw - 28px));
    right: 0;
    left: auto;
  }

  .mission-shared-notice,
  .partial-edit-info {
    margin-right: 16px;
    margin-left: 16px;
  }

  .mission-target-statuses > span {
    width: 100%;
  }

  .mission-change-content {
    padding: 15px 16px 18px;
  }

  .mission-change-comparison article {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .mission-change-alert > footer {
    grid-template-columns: 1fr;
  }

  .mission-change-alert > footer .btn {
    width: 100%;
  }
}