/* ==========================================================================
   kopibogen.dk — opret firma (signup)
   Arver variabler + delt top-frame/footer fra landing.css (loades først).
   2-delt indhold: venstre = firmaoplysninger, højre = ordre + MobilePay.
   MobilePay-blå: #5a78ff.
   ========================================================================== */

.opret-indhold {
  flex: 1;
  width: 100%;
  max-width: 1040px;
  margin: 0 auto;
  padding: 34px 40px 56px;
}

.opret-titel {
  color: #fff;
  font-size: 32px;
  font-weight: 800;
  margin: 0 0 6px;
  text-shadow: 0 2px 18px rgba(0,0,0,.45);
}
.opret-intro {
  color: #e3e9f5;
  font-size: 16px;
  line-height: 1.5;
  margin: 0 0 26px;
  max-width: 640px;
  text-shadow: 0 1px 10px rgba(0,0,0,.4);
}
.opret-intro b { color: #ffd66b; }

/* ----- 2-delt grid: firma | betaling ----------------------------------- */
.opret-grid {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 26px;
  align-items: start;
}

.kort {
  background: var(--kort-bg);
  border-radius: 12px;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
  padding: 28px 28px 26px;
}
.kort h2 {
  margin: 0 0 16px;
  font-size: 19px;
  color: var(--blaa);
  font-weight: 800;
}
.kort h2.afsnit {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid var(--kant);
}
.afsnit-note {
  margin: -10px 0 14px;
  font-size: 13px;
  color: var(--tekst-dim);
}

/* To felter side om side */
.felt-raekke {
  display: flex;
  gap: 14px;
}
.felt-raekke .felt-grp { flex: 1; }
.felt-raekke .felt-bred { flex: 2.2; }

/* Lille hjælpetekst under et felt */
.felt-hjaelp {
  display: block;
  margin-top: 5px;
  font-size: 12px;
  color: var(--tekst-dim);
  line-height: 1.4;
}

/* CVR-opslag status */
.cvr-status:empty { display: none; }
.cvr-status.soeger   { color: var(--tekst-dim); }
.cvr-status.ok       { color: #2a662a; font-weight: 700; }
.cvr-status.fejl     { color: #a72020; font-weight: 700; }
.cvr-status.advarsel { color: #8a5a00; }

/* Vilkår-checkbox */
.vilkaar {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 6px;
  font-size: 13.5px;
  color: var(--tekst-dim);
  line-height: 1.45;
}
.vilkaar input { margin-top: 2px; width: 17px; height: 17px; flex: 0 0 auto; }
.vilkaar a { color: var(--blaa); }

/* ----- Betalings-kort (højre) ------------------------------------------ */
.betaling-kort { position: sticky; top: 20px; }

/* ── Resumé: ensartet typografi, klare grupper ──────────────────────── */
.resume-gruppe { margin-bottom: 16px; }
.resume-hd {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--tekst-dim);
  margin-bottom: 8px;
}
.resume-linje {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 5px 0;
  font-size: 14px;                 /* ENS skriftstørrelse på alle linjer */
}
.resume-linje > span:first-child { color: var(--tekst-dim); }
.resume-linje .v {
  font-weight: 700;
  color: var(--tekst);
  white-space: nowrap;             /* "kr." brækker aldrig */
}
.resume-delsum {
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--kant);
}
.resume-delsum > span:first-child { color: var(--tekst); font-weight: 700; }
.resume-delsum .v { color: var(--blaa); }

/* Fremhævet slut-total — samme skriftstørrelse, men tydelig baggrund */
.resume-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin: 6px 0 2px;
  padding: 12px 14px;
  background: #eef3fb;
  border: 1px solid #cfdcf0;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 800;
  color: var(--blaa);
}
.resume-total .v { white-space: nowrap; }
.resume-inkl-note {
  text-align: right;
  font-size: 11.5px;
  color: var(--tekst-dim);
  margin-bottom: 16px;
}

.moms-note {
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--tekst-dim);
  line-height: 1.4;
}

/* ----- MobilePay-boks --------------------------------------------------- */
.mobilepay-boks {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--kant);
  text-align: center;
}
.mp-titel {
  display: block;
  font-size: 12.5px;
  color: var(--tekst-dim);
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: .4px;
}
.btn-mobilepay {
  width: 100%;
  height: 52px;
  background: #5a78ff;
  color: #fff;
  border: none;
  border-radius: 9px;
  font-family: inherit;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .3px;
  cursor: pointer;
  transition: background .15s, box-shadow .15s;
  box-shadow: 0 6px 18px rgba(90,120,255,.35);
}
.btn-mobilepay:hover { background: #4763e8; }
.btn-mobilepay:disabled { opacity: .6; cursor: default; }
.mp-logo { display: inline-flex; align-items: center; gap: 8px; }
.mp-note {
  margin: 12px 0 0;
  font-size: 12px;
  color: var(--tekst-dim);
  line-height: 1.4;
}

/* Status / besked (genbruger .status-farver fra landing.css) */
.betaling-kort .status { margin-top: 16px; }

/* ==========================================================================
   Mobil — under 860px: stak betaling under firma-oplysninger
   ========================================================================== */
@media (max-width: 860px) {
  .opret-indhold { padding: 22px 18px 40px; }
  .opret-titel { font-size: 26px; }
  .opret-intro { font-size: 15px; }

  .opret-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .betaling-kort { position: static; }
  .felt-raekke { flex-direction: column; gap: 0; }
}
