/* === Grundlayout === */
body {
  background-color: #fce57e;
  color: #222;
  font-family: 'Inter', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 0;
}

/* Haupt-Template-Wrapper */
.uxm-template {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1rem; /* Reduziert */
  background: white;
  border-radius: 12px;
}

/* Innen-Container */
.uxm-container {
  width: 98%; /* vorher 90% */
  margin: 0 auto;
  padding: 8px 12px; /* vorher 20px */
}

/* Flex-Reihenstruktur */
.uxm-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
}

/* Bereichsgruppen */
.uxm-main-area,
.uxm-bottom-area {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

/* Top/Bottom Body – über gesamte Breite */
.uxm-topbody,
.uxm-bottombody {
  width: 100%;
  background-color: #fff7c2;
  padding: 15px;
  border-radius: 6px;
}

/* Hauptinhalt */
.uxm-mainbody,
.uxm-bottombody {
  flex: 2;
  min-width: 300px;
}

/* Sidebodies – feste Breite */
.uxm-sidebody-a,
.uxm-sidebody-b {
  flex: 0 0 250px;
  max-width: 250px;
  background-color: #fff3d4;
  padding: 12px;
  border-radius: 6px;
}

/* Bottom-A und Footer-A nebeneinander */
.uxm-bottom-a,
.uxm-footer-a {
  flex: 1 1 50%;
}

/* Labels fett */
.uxm-label,
label.uxm-label {
  color: #912B3B
  font-size: 1.5rem !important;
  font-weight: bold;
  margin-bottom: 5px;
  display: block;
}
/* Rahmen für Debug oder Info-Boxen */
.uxm-box {
  border: 1px dashed #aaa;
  padding: 10px;
  background-color: #fcfcfc;
  margin-bottom: 10px;
}

/* Farbakzente & Buttons */
.umx-header {
  background-color: #781d27;
  color: white;
  padding: 10px;
  border-radius: 6px;
}

.umx-button {
  background-color: #781d27;
  color: white;
  padding: 8px 12px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* === Responsive für Smartphones/Tablets === */
@media (max-width: 768px) {
  .uxm-row,
  .uxm-main-area,
  .uxm-bottom-area {
    flex-direction: column;
  }

  .uxm-mainbody,
  .uxm-bottombody,
  .uxm-sidebody-a,
  .uxm-sidebody-b {
    width: 100%;
    max-width: 100%;
  }
}

/* Optischer Block je SEBLOD Gruppe */
.seblod-group-box {
  background-color: #fef6d8;
  border-radius: 6px;
  padding: 1rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 0 0 1px #f1e9b2 inset;
}

/* Gruppenüberschrift */
.seblod-group-box .cck_label {
  font-size: 1.2rem;
  font-weight: bold;
  color: #7a1c33;
  margin-bottom: 0.75rem;
}

/* Einzelne Felder */
.seblod-group-box .uxm-value {
  display: block;
  margin-left: 0.5rem;
  font-size: 0.95rem;
  color: #111;
  margin-bottom: 0.4rem;
}

.seblod-group-box {
  background-color: red !important;
}

