/* Only targets the existing configuration sidebar and branding preview. */
#gskc-logo-editor{margin:24px 0 26px;padding:17px 15px;border:1px solid rgba(159,189,186,.35);border-radius:12px;background:rgba(0,0,0,.12);color:inherit;font-family:'Open Sans',sans-serif}
#gskc-logo-editor h4{margin:0 0 12px !important;padding:0 !important}
#gskc-logo-editor .gskc-label{display:block;margin:12px 0 5px;font-size:13px;font-weight:600;line-height:1.4}
#gskc-logo-editor .gskc-note{font-size:12px;line-height:1.5;opacity:.85;margin:8px 0 10px}
#gskc-logo-editor select,#gskc-logo-editor input[type=color],#gskc-logo-editor input[type=file]{width:100%;max-width:100%;box-sizing:border-box}
#gskc-logo-editor input[type=file]{font-size:12px;line-height:1.5;margin-top:4px}
#gskc-logo-editor .gskc-color-row{display:flex;gap:8px;align-items:center}
#gskc-logo-editor .gskc-color-row select{flex:1;min-width:0}
#gskc-logo-editor .gskc-color-row input[type=color]{flex:0 0 48px;width:48px;height:38px;padding:3px;border-radius:5px}
#gskc-logo-editor .gskc-range-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;align-items:center;margin:11px 0}
#gskc-logo-editor .gskc-range-row label{font-size:12px;line-height:1.3;grid-column:1/-1}
#gskc-logo-editor .gskc-range-row input{width:100%;margin:0}
#gskc-logo-editor .gskc-range-row output{font-size:12px;min-width:44px;text-align:right}
#gskc-logo-editor [hidden]{display:none !important}
#gskc-logo-editor .gskc-message{display:none;background:#faf4da;color:#413c26;border-radius:4px;padding:8px;margin-top:10px;font-size:12px}
#gskc-logo-editor .gskc-message.is-on{display:block}
.gs-global-branding.gs-kc-logo-upload .site-logo > .logo-icon,
.gs-global-branding.gs-kc-logo-upload .site-logo > .logo-name,
.gs-global-branding.gs-kc-logo-upload .site-logo > .logo-subline{display:none !important}
.gs-global-branding .gskc-uploaded-logo{display:none;object-fit:contain;margin:0 auto;max-width:90vw;height:auto}
.gs-global-branding.gs-kc-logo-upload .gskc-uploaded-logo{display:block !important}
/* Master hides branding name on mobile; our configurator controls should remain previewable. */
@media(max-width:767px){
 .gs-global-branding.gs-kc-compose .logo-name,.gs-global-branding.gs-kc-compose .logo-subline{display:block !important}
 .gs-global-branding .gskc-uploaded-logo{max-width:90vw}
}

/* 2.1: Original-Master-Controls inside a single accessible logo editor. */
#gskc-logo-editor .gskc-control-group{margin:12px 0 18px;padding-bottom:10px;border-bottom:1px solid rgba(159,189,186,.23)}
#gskc-logo-editor .gskc-control-group h5{margin:14px 0 7px;padding:0;color:inherit;font-size:14px;line-height:1.45;font-weight:600}
#gskc-logo-editor #gskc-name-slot input,#gskc-logo-editor #gskc-subline-slot input{width:100%;max-width:100%;box-sizing:border-box}
#gskc-logo-editor .brand-icon-grid{margin:9px 0 14px !important}
#gskc-logo-editor .brand-color-grid{margin:9px 0 18px !important}


/* 2.2 – mehr Platz im Konfigurator, ohne das Master-Child-Theme anzufassen. */
@media (min-width: 768px) {
  #design-switcher { width: 560px !important; max-width: 100vw !important; }
}
/* Alle fünf Metall-/Designfarben bleiben in genau einer Zeile. */
#gskc-logo-editor #gskc-icon-color-slot .brand-color-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 10px 0 18px !important;
  align-items: stretch;
}
#gskc-logo-editor #gskc-icon-color-slot .brand-color-choice {
  min-width: 0 !important;
  width: 100% !important;
  flex: none !important;
  box-sizing: border-box !important;
  padding: 8px 3px !important;
  font-size: 11px !important;
}
#gskc-logo-editor #gskc-icon-color-slot .brand-color-choice .brand-metal {
  max-width: 100%;
}
/* Auf kleinen Displays eine einzige horizontal scrollbar Farbe-Reihe
   statt Kupfer allein in einer zweiten Zeile. */
@media (max-width: 767px) {
  #gskc-logo-editor #gskc-icon-color-slot .brand-color-grid {
    grid-template-columns: repeat(5, 78px) !important;
    overflow-x: auto !important;
    max-width: 100%;
    padding-bottom: 8px;
    overscroll-behavior-x: contain;
  }
}
