/* Criar/editar produto — somente computador (>=900px): cores, fotos por cor e medidas. */
@media (min-width: 900px) {
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-options-editor {
    display: block !important; padding: 18px 20px !important; margin: 16px 0 !important;
    border: 1px solid #e7e5ee !important; border-radius: 10px !important; background: #fff !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-options-editor .form-section-heading {
    font-size: 15px !important; font-weight: 600 !important; margin: 0 0 14px !important; color: #1f1d2b !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-options-editor .field { display: flex !important; flex-direction: column !important; gap: 10px !important; margin: 0 0 18px !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-options-editor .field > label { font-size: 13px !important; font-weight: 600 !important; color: #4b4860 !important; margin: 0 !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay :is(#beautyColorsBuilder, #beautySizesBuilder) { display: flex !important; flex-direction: column !important; gap: 8px !important; }

  /* Linha de cor: nome | amostra | foto | status | remover */
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-color-row {
    display: grid !important; grid-template-columns: minmax(0,1fr) 44px max-content 36px !important;
    align-items: center !important; gap: 10px !important; padding: 10px 12px !important;
    border: 1px solid #ecebf1 !important; border-radius: 8px !important; background: #fafafc !important; position: relative !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-options-editor :is(.sd-beauty-color-name, .sd-beauty-size-row input) {
    width: 100% !important; min-width: 0 !important; height: 38px !important; margin: 0 !important; padding: 0 10px !important;
    font-size: 13px !important; border: 1px solid #dcdae4 !important; border-radius: 6px !important; background: #fff !important; box-sizing: border-box !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-color-hex {
    width: 44px !important; height: 38px !important; padding: 3px !important; margin: 0 !important;
    border: 1px solid #dcdae4 !important; border-radius: 6px !important; background: #fff !important; cursor: pointer !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-color-filelabel {
    display: inline-flex !important; align-items: center !important; gap: 6px !important; height: 38px !important; padding: 0 12px !important; margin: 0 !important;
    white-space: nowrap !important; font-size: 13px !important; font-weight: 500 !important; color: #1f1d2b !important;
    border: 1px dashed #c9c6d6 !important; border-radius: 6px !important; background: #fff !important; cursor: pointer !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-color-file { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-camera-icon { width: 18px !important; height: 18px !important; object-fit: contain !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-photo-status { grid-column: 1 / -1 !important; grid-row: 2 !important; font-size: 12px !important; color: #8a879a !important; margin: 0 !important; white-space: nowrap !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-photo-status.is-filled { color: #15803d !important; font-weight: 500 !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-color-preview {
    grid-column: 1 / -1 !important; grid-row: 3 !important; width: 64px !important; height: 64px !important; object-fit: cover !important; border-radius: 8px !important; box-shadow: none !important; border: 1px solid #ecebf1 !important;
  }

  /* Linha de tamanho: tabela de medidas em 4 colunas + remover */
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-size-row {
    display: grid !important; grid-template-columns: 1fr 36px !important; align-items: start !important; gap: 10px !important;
    padding: 10px 12px !important; border: 1px solid #ecebf1 !important; border-radius: 8px !important; background: #fafafc !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-size-grid {
    display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 8px !important; margin: 0 !important;
  }

  /* Botões remover e adicionar */
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-color-row > .sd-beauty-remove { grid-column: 4 !important; grid-row: 1 !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-remove {
    position: static !important; width: 36px !important; height: 36px !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important;
    display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 18px !important; line-height: 1 !important;
    color: #6b6880 !important; border: 1px solid #dcdae4 !important; border-radius: 6px !important; background: #fff !important;
  }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-remove:hover { color: #b91c1c !important; border-color: #f3c2c2 !important; }
  html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay :is(#addBeautyColor, #addBeautySize) {
    align-self: flex-start !important; width: auto !important; height: 36px !important; padding: 0 14px !important; margin: 2px 0 0 !important;
    font-size: 13px !important; font-weight: 600 !important; border: 1px solid #dcdae4 !important; border-radius: 6px !important; background: #fff !important; color: #1f1d2b !important;
  }
  @media (min-width: 1280px) { html body[data-app-variant="seller"] #overlay#overlay#overlay#overlay#overlay#overlay .sd-beauty-options-editor .sd-beauty-size-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
}
