/* Only Planner save confirmations receive this appearance. */
.uk-notification:has(.planner-save-notice) {
  width: min(580px, calc(100vw - 40px));
  max-width: calc(100vw - 40px);
}
.uk-notification-message:has(.planner-save-notice) {
  position: relative;
  margin: 0 0 15px !important;
  padding: 22px 54px 22px 20px !important;
  border: 1px solid #e5ebf2;
  border-left: 6px solid #00c783;
  border-radius: 14px !important;
  background: #fff !important;
  text-align: left;
  box-shadow: 0 12px 36px rgba(40, 60, 93, .09);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.planner-save-notice { display: flex; align-items: center; gap: 20px; }
.planner-save-notice-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 60px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #e2faf0;
  color: #00c783;
}
.planner-save-notice-icon svg { width: 32px; height: 32px; }
.planner-save-notice-text { flex: 1 1 auto; min-width: 0; }
.planner-save-notice-text strong { display: block; margin: 0 0 3px; color: #10203c; font-size: 24px; line-height: 1.35; font-weight: 750; }
.planner-save-notice-text p { margin: 0; color: #73829b; font-size: 20px; line-height: 1.4; }
.uk-notification-message:has(.planner-save-notice) .uk-notification-close {
  display: block !important;
  top: 23px;
  right: 22px;
  padding: 0;
  color: #7f8da4;
}
.uk-notification-message:has(.planner-save-notice) .uk-notification-close svg { width: 18px; height: 18px; }
.uk-notification-message:has(.planner-save-notice) .uk-notification-close:hover { color: #10203c; }
@media (max-width: 540px) {
  .uk-notification-message:has(.planner-save-notice) { padding: 18px 38px 18px 15px !important; }
  .planner-save-notice { gap: 13px; }
  .planner-save-notice-icon { flex-basis: 46px; width: 46px; height: 46px; }
  .planner-save-notice-text strong { font-size: 19px; }
  .planner-save-notice-text p { font-size: 15px; }
  .uk-notification-message:has(.planner-save-notice) .uk-notification-close { top: 18px; right: 14px; }
}
