.danger {
    --kt-bg-rgb-color: var(--kt-danger-rgb);
    color: var(--kt-danger) !important;
}

.warning {
    --kt-bg-rgb-color: var(--kt-warning-rgb);
    color: var(--kt-warning) !important;
}

.info {
    --kt-bg-rgb-color: var(--kt-info-rgb);
    color: var(--kt-info) !important;
}

.success {
    --kt-bg-rgb-color: var(--kt-success-rgb);
    color: var(--kt-success) !important;
}

.secondary {
    --kt-bg-rgb-color: var(--kt-secondary-rgb);
    color: var(--kt-secondary) !important;
}

.light {
    --kt-bg-rgb-color: var(--kt-light-rgb);
    color: var(--kt-light) !important;
}

.primary {
    --kt-bg-rgb-color: var(--kt-primary-rgb);
    color: var(--kt-primary) !important;
}

.white {
    --bs-bg-opacity: 1;
    color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;
}


.vanish > td > div  {
    opacity: 0.30;
}

.text-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}





    
  /* keep Metronic hover "pop" working even with custom stacking */
.symbol-group .symbol { position: relative; z-index: var(--nb-z, 1); }
.symbol-group .symbol:hover { z-index: 999; }


/* Root sem caixa gigante */
.nb-dz-root { position: relative; }

/* --- Base do bloco (compatível light/dark) --- */
#nb_product_images_dropzone{
  border: 1px solid var(--bs-border-color, rgba(0,0,0,.12));
  border-radius: 12px;
  padding: 18px;
  background: var(--bs-body-bg, #fff);
  transition: background .15s ease, box-shadow .15s ease, border-color .15s ease;
}

/* Card como o teu screenshot (compatível light/dark) */
.nb-dz-card{
  position: relative;
  border: 1px solid var(--bs-border-color, rgba(0,0,0,.12));
  border-radius: 12px;
  background: var(--bs-gray-100, rgba(0,0,0,.03));  /* light: cinza claro / dark: ok via vars */
  padding: 18px;
  height: 100%;
}

/* X vermelho no canto */
.nb-dz-remove{
  position: absolute;
  top: -8px;
  right: -10px;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: var(--bs-danger, #f1416c);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.nb-dz-remove i { color: #fff; }

/* Thumbnail centrada */
.nb-dz-thumb{
  height: 210px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nb-dz-thumb img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 10px;
}

/* Barra de “Click to browse” (se usares nb-dz-select ou dropzone-select) */
#nb_product_images_dropzone .nb-dz-select,
#nb_product_images_dropzone .dropzone-select{
  border: 1px dashed var(--bs-border-color, rgba(0,0,0,.15));
  border-radius: 10px;
  background: var(--bs-gray-100, rgba(0,0,0,.03));
}

/* ✅ HOVER: pinta o BLOCO TODO (light/dark) */
#nb_product_images_dropzone.dz-drag-hover{
  background: color-mix(in srgb, var(--bs-primary, #009EF7) 8%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-primary, #009EF7) 55%, var(--bs-border-color, rgba(0,0,0,.15))) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-primary, #009EF7) 30%, transparent) !important;
}

/* Se as previews estiverem a tapar o fundo, pinta-as também */
#nb_product_images_dropzone.dz-drag-hover #nb_product_images_previews,
#nb_product_images_dropzone.dz-drag-hover .dropzone-items{
  background: color-mix(in srgb, var(--bs-primary, #009EF7) 4%, transparent) !important;
  border-radius: 12px;
}

/* Barra também muda */
#nb_product_images_dropzone.dz-drag-hover .nb-dz-select,
#nb_product_images_dropzone.dz-drag-hover .dropzone-select{
  background: color-mix(in srgb, var(--bs-primary, #009EF7) 10%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-primary, #009EF7) 45%, var(--bs-border-color, rgba(0,0,0,.15))) !important;
}

/* Texto/ícone em primary (funciona em light/dark) */
#nb_product_images_dropzone.dz-drag-hover .nb-dz-select,
#nb_product_images_dropzone.dz-drag-hover .nb-dz-select i,
#nb_product_images_dropzone.dz-drag-hover .dropzone-select,
#nb_product_images_dropzone.dz-drag-hover .dropzone-select i{
  color: var(--bs-primary, #009EF7) !important;
}

/* opcional: cards ligeiramente realçados em hover */
#nb_product_images_dropzone.dz-drag-hover .nb-dz-card{
  border-color: color-mix(in srgb, var(--bs-primary, #009EF7) 28%, var(--bs-border-color, rgba(0,0,0,.15))) !important;
}
.prices .input-group-text {
    width: 42px !important;
}


.nb-avatar-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    letter-spacing: .5px;
    user-select: none;
}

#kt_datatable th.dt-col-avatar,
#kt_datatable td.dt-col-avatar {
  width: 100px !important;
  max-width: 100px !important;
  min-width: 70px !important;
  white-space: nowrap;
  text-align: center;
}

/* Estado ativo/inativo - texto branco */
.select2-container--default .select2-selection--single.bg-success .select2-selection__rendered,
.select2-container--default .select2-selection--single.bg-danger .select2-selection__rendered,
.select2-container--default .select2-selection--single.nb-active-select .select2-selection__rendered,
.select2-container--default .select2-selection--single.bg-success .select2-selection__placeholder,
.select2-container--default .select2-selection--single.bg-danger .select2-selection__placeholder,
.select2-container--default .select2-selection--single.nb-active-select .select2-selection__placeholder {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

select.nb-active-select,
select.nb-active-select:disabled,
#active.nb-active-select,
#active.nb-active-select:disabled {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    opacity: 1 !important;
}

select.nb-active-select option,
#active.nb-active-select option {
    color: var(--bs-gray-800) !important;
    -webkit-text-fill-color: var(--bs-gray-800) !important;
}