/* ===== Defaults (fallbacks) ===== */
.cr-contact{
  --cr-btn-bg: #0d6efd;
  --cr-btn-bg-h: #0b5ed7;
  --cr-btn-color: #ffffff;
  --cr-btn-color-h: #ffffff;
  --cr-btn-fs: 16px;
  --cr-btn-py: 10px;
  --cr-btn-px: 16px;
  --cr-btn-radius: 6px;
  --cr-btn-bc: #0d6efd;
  --cr-btn-bw: 1px;

  --cr-content-color: #111111;
  --cr-content-fs: 16px;

  --cr-box-bg: #ffffff;
  --cr-box-bc: rgba(0,0,0,0.12);
  --cr-box-bw: 1px;
  --cr-box-radius: 10px;
  --cr-box-pad: 12px;
}

/* ===== Button ===== */
.cr-contact .cr-btn{
  background: var(--cr-btn-bg) !important;
  color: var(--cr-btn-color) !important;
  font-size: var(--cr-btn-fs) !important;

  padding: var(--cr-btn-py) var(--cr-btn-px) !important;
  border-radius: var(--cr-btn-radius) !important;

  /* Border also for Primary */
  border: var(--cr-btn-bw) solid var(--cr-btn-bc) !important;

  text-transform: none !important; /* Maxora/Helix kapitalisiert sonst */
}

/* Hover */
.cr-contact .cr-btn:hover,
.cr-contact .cr-btn:focus{
  background: var(--cr-btn-bg-h) !important;
  color: var(--cr-btn-color-h) !important;
  border-color: var(--cr-btn-bc) !important;
}

/* Outline-Variante: transparent, Rahmen sichtbar */
.cr-contact .cr-outline{
  background: transparent !important;
  color: var(--cr-btn-bc) !important;
  border: var(--cr-btn-bw) solid var(--cr-btn-bc) !important;
}
.cr-contact .cr-outline:hover,
.cr-contact .cr-outline:focus{
  background: var(--cr-btn-bg-h) !important;
  color: var(--cr-btn-color-h) !important;
  border-color: var(--cr-btn-bc) !important;
}

/* ===== Box ===== */
.cr-contact .cr-box{
  margin-top: 12px;
  padding: var(--cr-box-pad);

  background: var(--cr-box-bg);
  border: var(--cr-box-bw) solid var(--cr-box-bc);
  border-radius: var(--cr-box-radius);
}

/* ===== Content Typography ===== */
.cr-contact .cr-box,
.cr-contact .cr-box *{
  color: var(--cr-content-color);
  font-size: var(--cr-content-fs);
}

/* ===== Layout: Values aligned (Icon | Label | Value) ===== */
.cr-contact .cr-item{
  display: grid;
  grid-template-columns: 22px 120px 1fr;
  column-gap: 10px;
  align-items: start;
  padding: 6px 0;
}

.cr-contact .cr-icn{
  width: auto;
  text-align: center;
  opacity: .9;
}

/* Labels bold, values normal */
.cr-contact .cr-label{ font-weight: 700; }
.cr-contact .cr-value,
.cr-contact .cr-val,
.cr-contact .cr-role,
.cr-contact .cr-addr{ font-weight: 400; }

/* Value column always 3rd */
.cr-contact .cr-value,
.cr-contact .cr-val,
.cr-contact .cr-addr{ grid-column: 3; }

/* Separator / role */
.cr-contact .cr-sep{ opacity: .6; margin: 0 6px; }
.cr-contact .cr-role{ opacity: .85; }

/* Address multiline */
.cr-contact .cr-addr{
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
}
.cr-contact .cr-br{ display:block; height:2px; }
.cr-contact .cr-line{ display:block; }
