/* Fælles Data og backup-udseende i alle programmer og webappmenuer. */
details.mp-data-backup,
details.mp-menu-fold {
  border:1px solid #d7e0e6;
  border-radius:12px;
  background:#fff;
  overflow:hidden;
}
details.mp-menu-fold{padding:0}
details.mp-data-backup > summary,
details.mp-menu-fold > summary {
  display:flex; align-items:center; gap:8px; min-height:44px;
  padding:10px 12px; background:#fff; color:#285875;
  font-size:15px; font-weight:600; line-height:1.35;
  cursor:pointer; list-style:none;
}
details.mp-data-backup > summary::-webkit-details-marker,
details.mp-menu-fold > summary::-webkit-details-marker{display:none}
details.mp-data-backup > summary::before,
details.mp-menu-fold > summary::before {
  content:"";flex:none;width:7px;height:7px;
  border:solid #356f98;border-width:0 2px 2px 0;
  transform:rotate(-45deg);margin-right:3px;
}
details.mp-data-backup[open] > summary::before,
details.mp-menu-fold[open] > summary::before{transform:rotate(45deg)}
details.mp-data-backup > summary::after,
details.mp-menu-fold > summary::after{content:none!important;display:none!important}
details.mp-data-backup > summary:hover,
details.mp-menu-fold > summary:hover{background:#f5f9fc}
details.mp-data-backup > summary:focus-visible,
details.mp-menu-fold > summary:focus-visible{outline:2px solid #356f98;outline-offset:-3px}
.mp-data-info-trigger {
  flex:none;display:inline-grid;place-items:center;
  width:20px;height:20px;min-width:20px;min-height:20px;
  padding:0;margin:0;border:1px solid #94b2c5;border-radius:50%;
  background:#fff;color:#285875;font:700 12px/1 Arial,sans-serif;
  cursor:pointer;vertical-align:middle;box-shadow:none;
}
.mp-data-info-trigger:hover,.mp-data-info-trigger:focus-visible{
  background:#eaf2f7; border-color:#356f98;outline-offset:2px;
}
.mp-data-info-popover {
  position:fixed; z-index:2147483647; box-sizing:border-box;
  max-width:min(350px,calc(100vw - 24px));width:max-content;
  padding:11px 13px;border:1px solid #b6cbd9;border-radius:10px;
  background:#fff;color:#173247;box-shadow:0 8px 26px #142c3f30;
  font:400 13px/1.5 Arial,sans-serif;white-space:normal;text-align:left;
}
.mp-data-info-popover[hidden]{display:none!important}
/* Existing program containers retain their structure and status messages. */
details.mp-data-backup .mp-data-content {
  border-top:1px solid #d7e0e6; background:#fff;
}
details.mp-data-backup .mp-data-actions {
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  padding:12px;margin:0;border:0;border-radius:0;background:#fff;
}
details.mp-data-backup .mp-data-actions > button {
  display:inline-flex; flex:0 1 auto;align-items:center;justify-content:center;
  box-sizing:border-box;min-height:38px;width:auto;
  margin:0;padding:8px 12px;border:1px solid #a9c4d5;
  border-radius:8px;background:#fff;color:#285875;
  font:600 13px/1.3 Arial,sans-serif;letter-spacing:normal;
  box-shadow:none;text-align:center;cursor:pointer;
}
details.mp-data-backup .mp-data-actions > button:hover:not(:disabled) {
  background:#edf4f9;border-color:#7199b3;
}
details.mp-data-backup .mp-data-actions > button:focus-visible {
  outline:2px solid #356f98;outline-offset:2px;
}
details.mp-data-backup .mp-data-actions > button:disabled {opacity:.6;cursor:not-allowed}
details.mp-data-backup .mp-data-actions > button.mp-data-danger {
  border-color:#b55258;background:#b55258;color:#fff;
}
details.mp-data-backup .mp-data-actions > button.mp-data-danger:hover:not(:disabled) {
  background:#923c42;border-color:#923c42;color:#fff;
}
/* De ældre lokale indholdsbokse må ikke lægge ekstra luft oven i den fælles knaprække. */
details.mp-data-backup .data-backup-content.mp-data-content,
details.mp-data-backup .saved-backup-tools.mp-data-content,
details.mp-data-backup .data-tools.mp-data-content:not(.mp-data-actions) {
  padding:0;
}
details.mp-data-backup .saved-backup-status:not([hidden]) {margin:0 12px 12px}
details.mp-data-backup #dataStatus:not(:empty) {margin:0 12px 12px}
/* Webappmenuerne deler også layout, med knapper i én kolonne. */
details.mp-data-backup.mp-data-webapp .mp-data-actions {
  display:grid;grid-template-columns:minmax(0,1fr);padding:0;gap:8px;
}
details.mp-data-backup.mp-data-webapp .mp-data-actions > button {
  width:100%;min-height:46px;border-radius:11px;font-size:14px;
}
details.mp-data-backup.mp-data-webapp .mp-data-content {
  padding:12px;
}

/* INFO i en modal dialog vises flydende ved ikonet uden at flytte dialogens indhold. */
.mp-data-info-popover.mp-data-info-in-dialog {
  position:fixed;
  max-width:min(350px,calc(100vw - 24px));
  margin:0;
}

/* Almindelige INFO: samme synlighed ved mus, klik og touch.
   Overstyr gamle :hover- og :focus-within-regler, men kun når JS er aktivt. */
html.mp-info-ready .danish-pref-help .danish-pref-help-text,
html.mp-info-ready .dmk-help .dmk-help-text,
html.mp-info-ready .variant-help-wrap .variant-help { display:none; }
html.mp-info-ready .danish-pref-help.mp-info-visible > .danish-pref-help-text,
html.mp-info-ready .dmk-help.mp-info-visible > .dmk-help-text,
html.mp-info-ready .variant-help-wrap.mp-info-visible > .variant-help { display:block; }
html.mp-info-ready .mp-info-visible > .danish-pref-help-text,
html.mp-info-ready .mp-info-visible > .dmk-help-text,
html.mp-info-ready .mp-info-visible > .variant-help {
  box-sizing:border-box;
  max-height:calc(100vh - 24px);
  overflow-y:auto;
}
.mp-data-info-popover { max-height:calc(100vh - 24px); overflow-y:auto; }

/* Foldemenuernes Hjælp-indhold får samme indvendige afstand som deres naboer. */
body.mp-consistent-ui .sheet details.mp-menu-fold.help-details > .menu-links{
  padding:12px;
  border-top:1px solid #d7e0e6;
}