/* Container-Styling */
#top .moho-status {
    font-weight: 500;
    padding: 2px 5px;
    border-radius: 4px;
    display: inline-block;
}

/* Status: OFFEN (Grün) */
#top .moho-status .open {
    color: #28a745; /* Sattes Grün */
    font-weight: bold;
}

/* Status: GESCHLOSSEN / FEIERTAG / RUHETAG (Rot) */
#top .moho-status .closed,
#top .moho-status .holiday,
#top .moho-status .rest-day {
    color: #dc3545; /* Signalrot */
    font-weight: bold;
}

/* Status: ÖFFNET BALD / SPÄTER (Gelb/Orange) */
#top .moho-status .opening-soon {
    color: #62b876;
    font-weight: bold;
}

/* Zusatz-Infos wie "schließt um..." oder "öffnet am..." */
#top .moho-info-text {
    font-size: 0.9em;
    color: #6c757d;
    margin-left: 5px;
}

/* Placeholder deutlich dezenter machen */
.moho-set-card input::placeholder, 
.moho-row input::placeholder {
    color: #bbbbbb !important;
    opacity: 0.9;
    font-weight: normal;
}
/* Fokus-Zustand für Eingabe */
.moho-set-card input:focus::placeholder {
    color: transparent !important;
}
.moho-set-header {
    margin-bottom: 15px
}

.moho-set-card,
.closure-list,
.moho-openings,
.special-list-container {
    background: #d7e0e1;
    border: 1px solid #4880b8;
    box-shadow: 0 1px 1px rgba(0,0,0,.04);
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
    position: relative;
}

.moho-openings {
  display:grid; 
  grid-auto-flow: row;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap:12px; 
  background:#f0f0f1; 
  padding:15px; 
  border-radius:6px;
}

.moho-openings {
    border: 1px solid #4880b8;
}

.special-list-container {
  padding: 10px;
  background-color: #f0f0f1
}


.moho-row {
    display: flex;
    gap: 10px;
    align-items: end;
    margin-bottom: 4px;
    padding: 8px;
    border-radius: 4px;
}
/* Styling für die Shortcode-Infobox */
.moho-shortcode-list {
    list-style: none !important;
    margin: 15px 0 !important;
    padding: 0 !important;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.moho-shortcode-item {
    background: #fff;
    border: 1px solid #dcdcde;
    border-radius: 6px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.moho-shortcode-item strong {
    color: #1d2327;
    font-size: 0.9em;
    border-right: 1px solid #eee;
    padding-right: 10px;
}

.moho-shortcode-item code {
    background: #f0f0f1 !important;
    color: #2271b1 !important;
    padding: 3px 6px !important;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
}

.moho-shortcode-item code:hover {
    background: #dcdcde !important;
}

.special-list-container .moho-row {
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
    gap: 12px;
    background: #f0f0f1;
    padding: 15px;
    border-radius: 6px;
}
.remove-set {
  margin-top: -14px;
  margin-right: -5px;
}

.remove-row {width: 40px}

.global .moho-row label {
  align-self: center
}

.global .moho-row input {
  padding: 0 8px !important;
  line-height: 2;
  min-height: 30px;
  border-radius: 4px;
  border-width: 1px;
}

.moho-headline-icon {
    font-size: 2rem !important; /* Macht das Icon größer, passend zur H1 */
    width: auto !important;
    height: auto !important;
    margin-right: 10px;         /* Abstand zum Text */
    color: #2271b1;             /* Das typische WordPress-Blau, passend zu den Buttons */
    vertical-align: middle;     /* Zentriert es vertikal zum Text */
    line-height: 1 !important;
}

/* Optional: Damit die H1 insgesamt etwas moderner wirkt */
.wrap h1 {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}