/* Opções auxiliares (grupos de produtos e campos extras), no padrão das telas de lista do original. */
.aux-page { gap: 14px; }
.aux-tab-off { display: inline-flex; align-items: center; min-height: 42px; padding: 0 12px; color: #8a949c; cursor: not-allowed; white-space: nowrap; }
.aux-tabs a { white-space: nowrap; }

.aux-notice {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px; border: 1px solid #dce2e7; border-radius: 3px; background: #fff; color: #262b2f;
}
.aux-notice-icon { display: inline-grid; place-items: center; width: 28px; height: 28px; flex: 0 0 auto; color: #262b2f; }
.aux-notice-icon svg { width: 20px; height: 20px; }
.aux-notice-text { display: grid; gap: 2px; min-width: 0; flex: 1; }
.aux-notice-text strong { font-size: 13px; font-weight: 700; }
.aux-notice-text p { margin: 0; font-size: 13px; color: #262b2f; }
.aux-link-off { border: 0; background: transparent; padding: 0; font: inherit; color: #262b2f; font-weight: 700; text-decoration: underline; cursor: not-allowed; }
.aux-notice-close { border: 0; background: transparent; color: #6b757d; font-size: 18px; line-height: 1; cursor: pointer; padding: 2px 4px; }

.aux-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.aux-search { display: inline-flex; align-items: stretch; min-width: min(360px, 100%); }
.aux-search input {
  flex: 1; height: 36px; padding: 6px 10px; border: 1px solid #c9d0d6; border-right: 0; border-radius: 3px 0 0 3px;
  background: #fff; font-size: 13px; color: #262b2f;
}
.aux-search-button {
  display: inline-grid; place-items: center; width: 42px; height: 36px; border: 0; border-radius: 0 3px 3px 0;
  background: #111; color: #fff; cursor: pointer;
}
.aux-search-button svg { width: 16px; height: 16px; }

.aux-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.aux-count { display: inline-flex; margin: 0; border: 1px solid #dce2e7; border-radius: 3px; overflow: hidden; font-size: 13px; background: #fff; }
.aux-count-label { padding: 6px 10px; background: #f4f5f7; color: #34424b; border-right: 1px solid #dce2e7; }
.aux-count-total { padding: 6px 10px; color: #262b2f; }

.aux-form {
  padding: 16px; border: 1px solid #dce2e7; border-radius: 3px; background: #fff; max-width: 640px;
}
.aux-form h3 { margin: 0; font-size: 16px; }

.aux-empty {
  display: grid; justify-items: center; gap: 10px; padding: 36px 20px;
  border: 1px solid #dce2e7; border-radius: 3px; background: #fff; text-align: center;
}
.aux-empty h3 { margin: 6px 0 0; font-size: 20px; font-weight: 600; }
.aux-empty p { max-width: 560px; margin: 0; color: #5b656d; font-size: 13px; line-height: 1.5; }
.aux-empty-icon {
  display: inline-grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; background: #f4f5f7; color: #262b2f;
}
.aux-empty-icon svg { width: 36px; height: 36px; }
.aux-empty-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.aux-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; width: 100%; margin-top: 14px; text-align: left; }
.aux-card { padding: 14px; border: 1px solid #dce2e7; border-radius: 3px; background: #fff; }
.aux-card h4 { margin: 0 0 6px; font-size: 13px; font-weight: 700; }
.aux-card p { margin: 0; font-size: 12px; color: #5b656d; line-height: 1.45; }

@media (max-width: 640px) {
  .aux-search { min-width: 0; width: 100%; }
  .aux-notice { padding: 12px; }
}

/* Telas sem backend (tipos de contatos, tipos de endereços, balanças) e formulários de adicionar. */
.aux-add-green {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.5rem 0.9rem; border-radius: 4px; background: #2a9d5c; color: #fff;
  font-weight: 600; cursor: not-allowed; opacity: 0.85;
}
.aux-add-green .add-symbol { font-weight: 700; }
.aux-scales-icon { color: #444; }
.aux-scales .aux-empty-icon { width: 4.5rem; height: 4.5rem; border-radius: 50%; }
.aux-rule-empty { margin: 0.75rem 0; text-align: center; color: #444; }
.aux-new .reg-form { max-width: none; }

/* Balanças: cartões com ícone colorido ao lado do texto, como no original. */
.aux-scale-card { display: flex; gap: 12px; align-items: flex-start; }
.aux-card-title { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 700; }
.aux-card-icon { display: inline-grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 4px; }
.aux-card-icon svg { width: 16px; height: 16px; }
.aux-card-icon.is-code { background: #e8e3fb; color: #6f5bd8; }
.aux-card-icon.is-products { background: #dbe9fb; color: #2f6fdb; }
.aux-card-icon.is-load { background: #dcf5e6; color: #2b8a57; }

/* Leva 5 (T5): Campos extras de clientes, estado vazio nas medidas da captura atributos-clientes (1440 px):
   busca de 38 px (x 1055 a 1385), faixa informativa de 67 px, título a y=448, botões a y=578, cartões de 97 px. */
#view-root[data-view='customer-attributes'] .aux-page .aux-toolbar { margin-bottom: 9px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-search input { width: 330px; height: 38px; min-height: 38px; padding: 0 12px; font-size: 16px; border-color: #cfd4d8; }
#view-root[data-view='customer-attributes'] .aux-page .aux-search-button { width: 40px; height: 38px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-notice { min-height: 67px; box-sizing: border-box; gap: 16px; padding: 11px 31px; margin-bottom: 3px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-notice-text { gap: 0; }
#view-root[data-view='customer-attributes'] .aux-page .aux-notice-text strong,
#view-root[data-view='customer-attributes'] .aux-page .aux-notice-text p { line-height: 21px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-empty h3 { margin-top: 9px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-empty > p { max-width: 522px; margin-top: -2px; font-size: 15.3px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-empty-actions { margin-top: 10px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-cards-icons { margin-top: 18px; }
#view-root[data-view='customer-attributes'] .aux-page .aux-cards-icons .aux-card { padding: 14px 16px 13px; }