.products-admin-page {
  --products-bg:
    #f5f7f4;

  --products-surface:
    #ffffff;

  --products-surface-soft:
    #f8faf8;

  --products-text:
    #111813;

  --products-text-soft:
    #667269;

  --products-text-muted:
    #879189;

  --products-border:
    #dce4dd;

  --products-border-strong:
    #cbd6cd;

  --products-primary:
    #173d26;

  --products-primary-hover:
    #102f1d;

  --products-danger:
    #b42318;

  --products-radius:
    12px;

  width: 100%;
}


.products-admin-header {
  width: 100%;

  margin-bottom: 24px;

  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  gap: 24px;
}


.products-admin-eyebrow {
  display: block;

  margin-bottom: 5px;

  color:
    var(--products-primary);

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.12em;

  text-transform: uppercase;
}


.products-admin-header h1 {
  margin: 0;

  color:
    var(--products-text);

  font-size: 32px;
  font-weight: 800;

  line-height: 1.12;

  letter-spacing: -0.04em;
}


.products-admin-header p {
  max-width: 780px;

  margin: 8px 0 0;

  color:
    var(--products-text-soft);

  font-size: 14px;
  font-weight: 550;

  line-height: 1.6;
}


.products-admin-header__actions {
  display: flex;

  gap: 9px;

  flex-shrink: 0;
}


.products-admin-button {
  min-height: 42px;

  padding: 0 15px;

  border-radius: 9px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 8px;

  font-size: 13px;
  font-weight: 800;

  cursor: pointer;

  transition:
    background 150ms ease,
    border-color 150ms ease,
    transform 150ms ease;
}


.products-admin-button svg {
  width: 17px;
  height: 17px;
}


.products-admin-button.is-primary {
  border:
    1px solid
    var(--products-primary);

  background:
    var(--products-primary);

  color: #ffffff;
}


.products-admin-button.is-primary:hover {
  background:
    var(--products-primary-hover);
}


.products-admin-button.is-secondary {
  border:
    1px solid
    var(--products-border);

  background:
    var(--products-surface);

  color:
    var(--products-text);
}


.products-admin-button.is-secondary:hover {
  background:
    var(--products-surface-soft);
}


.products-admin-button:disabled {
  opacity: 0.65;

  cursor: wait;
}


.products-admin-toolbar {
  width: 100%;

  margin-bottom: 16px;

  padding: 12px;

  border:
    1px solid
    var(--products-border);

  border-radius:
    var(--products-radius);

  display: grid;

  grid-template-columns:
    minmax(260px, 1fr)
    220px
    190px
    auto;

  align-items: center;

  gap: 10px;

  background:
    var(--products-surface);
}


.products-admin-search {
  position: relative;

  min-width: 0;
}


.products-admin-search svg {
  position: absolute;

  top: 50%;
  left: 13px;

  width: 17px;
  height: 17px;

  color:
    var(--products-text-muted);

  transform:
    translateY(-50%);

  pointer-events: none;
}


.products-admin-search input,
.products-admin-filter {
  width: 100%;
  height: 42px;

  border:
    1px solid
    var(--products-border);

  border-radius: 8px;

  outline: none;

  background: #ffffff;

  color:
    var(--products-text);

  font-size: 13px;
  font-weight: 650;
}


.products-admin-search input {
  padding:
    0 14px 0 39px;
}


.products-admin-filter {
  padding:
    0 12px;
}


.products-admin-search input:focus,
.products-admin-filter:focus {
  border-color:
    rgba(23, 61, 38, 0.55);

  box-shadow:
    0 0 0 3px
    rgba(23, 61, 38, 0.07);
}


.products-admin-total {
  min-width: 100px;

  display: flex;
  align-items: center;
  justify-content: flex-end;

  gap: 7px;
}


.products-admin-total span {
  color:
    var(--products-text-soft);

  font-size: 11px;
  font-weight: 700;
}


.products-admin-total strong {
  min-width: 28px;
  height: 28px;

  padding: 0 7px;

  border-radius: 8px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  background:
    #edf2ed;

  color:
    var(--products-primary);

  font-size: 12px;
  font-weight: 800;
}


.products-admin-loading {
  margin-bottom: 14px;

  min-height: 42px;

  padding: 0 14px;

  border:
    1px solid
    var(--products-border);

  border-radius: 9px;

  display: flex;
  align-items: center;

  gap: 9px;

  background:
    var(--products-surface);

  color:
    var(--products-text-soft);

  font-size: 12px;
  font-weight: 700;
}


.products-admin-loading svg {
  width: 17px;
  height: 17px;

  animation:
    products-spin 0.9s linear infinite;
}


@keyframes products-spin {
  to {
    transform:
      rotate(360deg);
  }
}


.products-admin-table-card {
  width: 100%;

  border:
    1px solid
    var(--products-border);

  border-radius:
    var(--products-radius);

  overflow: hidden;

  background:
    var(--products-surface);
}


.products-admin-table-scroll {
  width: 100%;

  overflow-x: auto;
}


.products-admin-table {
  width: 100%;

  border-collapse:
    collapse;

  table-layout:
    auto;
}


.products-admin-table th {
  padding:
    12px 15px;

  border-bottom:
    1px solid
    var(--products-border);

  background:
    #f8faf8;

  color:
    #58645b;

  text-align: left;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.06em;

  text-transform: uppercase;

  white-space: nowrap;
}


.products-admin-table td {
  padding:
    13px 15px;

  border-bottom:
    1px solid
    #edf1ed;

  color:
    var(--products-text);

  font-size: 13px;
  font-weight: 620;

  vertical-align: middle;
}


.products-admin-table tbody tr:last-child td {
  border-bottom: 0;
}


.products-admin-table tbody tr:hover {
  background:
    #fbfcfb;
}


.products-admin-product {
  min-width: 260px;

  display: flex;
  align-items: center;

  gap: 11px;
}


.products-admin-product__image {
  width: 48px;
  min-width: 48px;
  height: 48px;

  border:
    1px solid
    var(--products-border);

  border-radius: 9px;

  display: flex;
  align-items: center;
  justify-content: center;

  overflow: hidden;

  background:
    #f5f7f4;

  color:
    #8b968e;
}


.products-admin-product__image img {
  width: 100%;
  height: 100%;

  object-fit: contain;
}


.products-admin-product__image svg {
  width: 19px;
  height: 19px;
}


.products-admin-product__copy {
  min-width: 0;

  display: grid;

  gap: 3px;
}


.products-admin-product__copy strong {
  max-width: 420px;

  overflow: hidden;

  color:
    var(--products-text);

  font-size: 13px;
  font-weight: 800;

  text-overflow: ellipsis;

  white-space: nowrap;
}


.products-admin-product__copy span {
  color:
    var(--products-text-soft);

  font-size: 11px;
  font-weight: 650;
}


.products-admin-money {
  font-weight: 800 !important;

  white-space: nowrap;
}


.products-admin-unit {
  margin-left: 4px;

  color:
    var(--products-text-muted);

  font-size: 10px;
  font-weight: 700;
}


.products-admin-status {
  min-height: 25px;

  padding: 0 8px;

  border-radius: 999px;

  display: inline-flex;
  align-items: center;

  font-size: 10px;
  font-weight: 800;

  white-space: nowrap;
}


.products-admin-status.is-published {
  background:
    #e8f5eb;

  color:
    #166534;
}


.products-admin-status.is-draft {
  background:
    #fff5df;

  color:
    #92400e;
}


.products-admin-status.is-inactive {
  background:
    #f1f3f2;

  color:
    #677269;
}


.products-admin-featured {
  display: inline-flex;
  align-items: center;

  gap: 5px;

  color:
    #725c08;

  font-size: 11px;
  font-weight: 800;
}


.products-admin-featured svg {
  width: 14px;
  height: 14px;
}


.products-admin-muted {
  color:
    var(--products-text-muted);

  font-size: 12px;
  font-weight: 600;
}


.products-admin-actions {
  display: flex;

  justify-content: flex-end;

  gap: 6px;
}


.products-admin-table__actions-column {
  text-align: right !important;
}


.products-admin-icon-button {
  width: 34px;
  height: 34px;

  padding: 0;

  border:
    1px solid
    var(--products-border);

  border-radius: 8px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: #ffffff;

  color:
    var(--products-text);

  cursor: pointer;
}


.products-admin-icon-button:hover {
  background:
    #f2f5f2;
}


.products-admin-icon-button.is-danger {
  color:
    var(--products-danger);
}


.products-admin-icon-button svg {
  width: 15px;
  height: 15px;
}


.products-admin-empty {
  padding: 70px 20px;

  border:
    1px dashed
    var(--products-border-strong);

  border-radius:
    var(--products-radius);

  text-align: center;

  background:
    rgba(255, 255, 255, 0.55);
}


.products-admin-empty__icon {
  width: 52px;
  height: 52px;

  margin:
    0 auto 14px;

  border-radius: 14px;

  display: flex;
  align-items: center;
  justify-content: center;

  background:
    #eaf0ea;

  color:
    var(--products-primary);
}


.products-admin-empty__icon svg {
  width: 23px;
  height: 23px;
}


.products-admin-empty h2 {
  margin:
    0 0 6px;

  font-size: 18px;
  font-weight: 800;
}


.products-admin-empty p {
  margin: 0;

  color:
    var(--products-text-soft);

  font-size: 13px;
  font-weight: 550;
}


.products-admin-modal {
  position: fixed;

  inset: 0;

  z-index: 1000;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 24px;
}


.products-admin-modal[hidden] {
  display: none;
}


.products-admin-modal__backdrop {
  position: absolute;

  inset: 0;

  border: 0;

  background:
    rgba(10, 18, 12, 0.46);

  backdrop-filter:
    blur(3px);
}


.products-admin-modal__panel {
  position: relative;

  z-index: 1;

  width:
    min(
      980px,
      100%
    );

  max-height:
    calc(100vh - 48px);

  border:
    1px solid
    var(--products-border);

  border-radius: 15px;

  display: flex;
  flex-direction: column;

  overflow: hidden;

  background: #ffffff;

  box-shadow:
    0 30px 90px
    rgba(16, 35, 20, 0.2);

  opacity: 0;

  transform:
    translateY(8px)
    scale(0.99);

  transition:
    opacity 150ms ease,
    transform 150ms ease;
}


.products-admin-modal.is-visible
.products-admin-modal__panel {
  opacity: 1;

  transform:
    translateY(0)
    scale(1);
}


.products-admin-modal__header {
  min-height: 72px;

  padding:
    0 20px;

  border-bottom:
    1px solid
    var(--products-border);

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;
}


.products-admin-modal__header span {
  display: block;

  margin-bottom: 2px;

  color:
    var(--products-primary);

  font-size: 9px;
  font-weight: 800;

  letter-spacing: 0.1em;

  text-transform: uppercase;
}


.products-admin-modal__header h2 {
  margin: 0;

  color:
    var(--products-text);

  font-size: 20px;
  font-weight: 800;
}


.products-admin-modal__close {
  width: 36px;
  height: 36px;

  padding: 0;

  border:
    1px solid
    var(--products-border);

  border-radius: 9px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #ffffff;

  color:
    var(--products-text);

  cursor: pointer;
}


.products-admin-modal__close svg {
  width: 17px;
  height: 17px;
}


.products-admin-modal__body {
  min-height: 0;

  padding: 20px;

  overflow-y: auto;
}


.products-admin-form-grid {
  display: grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0, 1fr)
    );

  gap: 15px;
}


.products-admin-field {
  min-width: 0;

  display: grid;

  gap: 6px;
}


.products-admin-field--full {
  grid-column:
    1 / -1;
}


.products-admin-field > span {
  color:
    var(--products-text);

  font-size: 12px;
  font-weight: 800;
}


.products-admin-field input,
.products-admin-field select,
.products-admin-field textarea {
  width: 100%;

  border:
    1px solid
    var(--products-border);

  border-radius: 8px;

  outline: none;

  background:
    #ffffff;

  color:
    var(--products-text);

  font-size: 13px;
  font-weight: 600;
}


.products-admin-field input,
.products-admin-field select {
  height: 42px;

  padding:
    0 11px;
}


.products-admin-field textarea {
  min-height: 88px;

  padding: 11px;

  resize: vertical;

  line-height: 1.55;
}


.products-admin-field input:focus,
.products-admin-field select:focus,
.products-admin-field textarea:focus {
  border-color:
    rgba(23, 61, 38, 0.58);

  box-shadow:
    0 0 0 3px
    rgba(23, 61, 38, 0.07);
}


.products-admin-switch-grid {
  margin-top: 20px;

  padding: 16px;

  border:
    1px solid
    var(--products-border);

  border-radius: 10px;

  display: grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0, 1fr)
    );

  gap: 14px;

  background:
    #f8faf8;
}


.products-admin-switch {
  position: relative;

  display: flex;
  align-items: center;

  gap: 9px;

  cursor: pointer;
}


.products-admin-switch input {
  position: absolute;

  top: 0;
  left: 0;

  width: 1px;
  height: 1px;

  margin: 0;

  opacity: 0;

  pointer-events: none;
}


.products-admin-switch__control {
  position: relative;

  width: 34px;
  min-width: 34px;
  height: 20px;

  border-radius: 999px;

  background:
    #cbd4cd;

  transition:
    background 150ms ease;
}


.products-admin-switch__control::after {
  content: "";

  position: absolute;

  top: 3px;
  left: 3px;

  width: 14px;
  height: 14px;

  border-radius: 50%;

  background: #ffffff;

  box-shadow:
    0 1px 3px
    rgba(0, 0, 0, 0.16);

  transition:
    transform 150ms ease;
}


.products-admin-switch input:checked
+
.products-admin-switch__control {
  background:
    var(--products-primary);
}


.products-admin-switch input:checked
+
.products-admin-switch__control::after {
  transform:
    translateX(14px);
}


.products-admin-switch strong {
  color:
    var(--products-text);

  font-size: 11px;
  font-weight: 750;
}


.products-admin-modal__footer {
  margin:
    22px -20px -20px;

  padding:
    14px 20px;

  border-top:
    1px solid
    var(--products-border);

  display: flex;
  align-items: center;
  justify-content: flex-end;

  gap: 9px;

  background:
    #fafcfa;
}


.products-admin-toast {
  position: fixed;

  right: 20px;
  bottom: 20px;

  z-index: 2000;

  max-width: 380px;

  padding:
    12px 15px;

  border:
    1px solid
    var(--products-border);

  border-radius: 10px;

  background:
    #ffffff;

  color:
    #182019;

  box-shadow:
    0 14px 40px
    rgba(17, 32, 21, 0.16);

  font-size: 12px;
  font-weight: 750;

  opacity: 0;

  pointer-events: none;

  transform:
    translateY(8px);

  transition:
    opacity 160ms ease,
    transform 160ms ease;
}


.products-admin-toast.is-visible {
  opacity: 1;

  transform:
    translateY(0);
}


.products-admin-toast.is-error {
  border-color:
    rgba(180, 35, 24, 0.28);

  color:
    #b42318;
}


@media (max-width: 1100px) {

  .products-admin-toolbar {
    grid-template-columns:
      1fr 180px 170px;
  }


  .products-admin-total {
    display: none;
  }

}


@media (max-width: 780px) {

  .products-admin-header {
    flex-direction: column;
  }


  .products-admin-header__actions {
    width: 100%;
  }


  .products-admin-header__actions
  .products-admin-button {
    flex: 1;
  }


  .products-admin-toolbar {
    grid-template-columns:
      1fr;
  }


  .products-admin-form-grid {
    grid-template-columns:
      1fr;
  }


  .products-admin-field--full {
    grid-column: auto;
  }


  .products-admin-switch-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  .products-admin-modal {
    padding: 10px;
  }


  .products-admin-modal__panel {
    max-height:
      calc(100vh - 20px);
  }

}


@media (max-width: 520px) {

  .products-admin-switch-grid {
    grid-template-columns:
      1fr;
  }

}


/* =========================================================
   FIX · ESTADOS HIDDEN
   ========================================================= */

.products-admin-loading[hidden] {
  display: none !important;
}


.products-admin-empty[hidden] {
  display: none !important;
}


.products-admin-table-card[hidden] {
  display: none !important;
}


.products-admin-modal[hidden] {
  display: none !important;
}


/* =========================================================
   PRODUCTOS ADMIN · GALERÍA / MANUAL
   ========================================================= */

.products-admin-media {
  margin-top: 4px;
  padding: 18px;
  border: 1px solid rgba(20, 40, 25, .1);
  border-radius: 14px;
  background: rgba(247, 249, 247, .8);
}

.products-admin-media__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.products-admin-media__header > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.products-admin-media__header span {
  color: #748078;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.products-admin-media__header strong {
  color: #172018;
  font-size: 15px;
}

.products-admin-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.products-admin-gallery__item {
  position: relative;
  min-height: 126px;
  border: 1px solid rgba(20, 40, 25, .1);
  border-radius: 11px;
  overflow: hidden;
  background: #fff;
}

.products-admin-gallery__item img {
  width: 100%;
  height: 126px;
  object-fit: cover;
}

.products-admin-gallery__principal {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 5px 7px;
  border-radius: 999px;
  background: #245f2d;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.products-admin-gallery__actions {
  position: absolute;
  right: 7px;
  bottom: 7px;
  display: flex;
  gap: 5px;
}

.products-admin-gallery__actions button {
  width: 31px;
  height: 31px;
  border: 0;
  border-radius: 8px;
  background: rgba(15, 24, 17, .86);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.products-admin-gallery__actions svg {
  width: 14px;
  height: 14px;
}

.products-admin-gallery__empty {
  padding: 18px;
  border: 1px dashed rgba(20, 40, 25, .18);
  border-radius: 10px;
  color: #78847b;
  text-align: center;
  font-size: 12px;
}

.products-admin-upload {
  min-height: 74px;
  padding: 14px;
  border: 1px dashed rgba(34, 104, 44, .32);
  border-radius: 11px;
  background: rgba(39, 118, 51, .045);
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
}

.products-admin-upload > svg {
  width: 24px;
  height: 24px;
  color: #31763b;
}

.products-admin-upload > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.products-admin-upload strong {
  color: #213b26;
  font-size: 13px;
}

.products-admin-upload span {
  color: #78847b;
  font-size: 10px;
}

.products-admin-upload input {
  margin-left: auto;
  max-width: 240px;
}

.products-admin-manual-current {
  min-height: 62px;
  margin-bottom: 12px;
  padding: 11px 12px;
  border: 1px solid rgba(20, 40, 25, .1);
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  gap: 11px;
}

.products-admin-manual-current > svg {
  width: 23px;
  height: 23px;
  color: #2c7237;
}

.products-admin-manual-current > div {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.products-admin-manual-current strong {
  color: #203226;
  font-size: 12px;
}

.products-admin-manual-current a {
  color: #377842;
  font-size: 10px;
  font-weight: 800;
}

.products-admin-manual-current button {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: rgba(183, 34, 34, .07);
  color: #b42323;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.products-admin-manual-current button svg {
  width: 16px;
  height: 16px;
}

@media (max-width: 650px) {
  .products-admin-upload {
    align-items: flex-start;
    flex-direction: column;
  }

  .products-admin-upload input {
    width: 100%;
    max-width: none;
    margin-left: 0;
  }
}