/* =========================================================
   WIRTZ HUB · MERCADO LIBRE · DEVOLUCIONES

   UBICACIÓN:
   frontend/src/pages/mercado-libre/devoluciones/
   devoluciones.css

   DISEÑO:
   - Ejecutivo.
   - Premium.
   - Moderno.
   - Compacto.
   - Full width.
   - Responsive.
   - Sin glow.
   - Sin blur.
   - Negro real en dark.
   - Texto fuerte y legible.
   - Divisiones visibles.
   - Sin scroll horizontal.
   ========================================================= */


/* =========================================================
   01 · VARIABLES
   ========================================================= */

.ml-return-page {
  --mlr-page:
    #f3f4f5;

  --mlr-surface:
    #ffffff;

  --mlr-surface-2:
    #f8f9fa;

  --mlr-surface-3:
    #f0f2f3;

  --mlr-surface-4:
    #e8ebed;

  --mlr-hover:
    #eceff1;

  --mlr-active:
    #e4e7e9;

  --mlr-text:
    #111315;

  --mlr-text-strong:
    #050607;

  --mlr-text-secondary:
    #24272a;

  --mlr-text-muted:
    #484d52;

  --mlr-placeholder:
    #747a80;

  --mlr-border:
    #d3d7da;

  --mlr-border-soft:
    #e2e5e7;

  --mlr-border-strong:
    #bcc2c6;

  --mlr-border-dark:
    #969da2;

  --mlr-success:
    #0b7543;

  --mlr-success-bg:
    #eaf7f0;

  --mlr-success-border:
    #9bd2b6;

  --mlr-warning:
    #945900;

  --mlr-warning-bg:
    #fff5df;

  --mlr-warning-border:
    #dfbd73;

  --mlr-danger:
    #be2929;

  --mlr-danger-bg:
    #fff0f0;

  --mlr-danger-border:
    #e1a0a0;

  --mlr-info:
    #245fae;

  --mlr-info-bg:
    #edf4ff;

  --mlr-info-border:
    #aac5eb;

  --mlr-radius-xs:
    7px;

  --mlr-radius-sm:
    9px;

  --mlr-radius:
    11px;

  --mlr-radius-lg:
    13px;

  --mlr-transition-fast:
    120ms
    cubic-bezier(
      0.2,
      0,
      0,
      1
    );

  --mlr-transition:
    180ms
    cubic-bezier(
      0.2,
      0,
      0,
      1
    );

  display:
    grid;

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

  align-content:
    start;

  gap:
    12px;

  width:
    100%;

  max-width:
    none;

  min-width:
    0;

  margin:
    0;

  padding:
    0;

  color:
    var(
      --mlr-text
    );

  font-family:
    "DM Sans",
    "Inter",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  font-size:
    14px;

  font-weight:
    600;

  overflow:
    visible;
}


/* =========================================================
   02 · DARK
   ========================================================= */

html[data-theme="dark"]
.ml-return-page,
body.dark
.ml-return-page,
body[data-theme="dark"]
.ml-return-page {
  --mlr-page:
    #050505;

  --mlr-surface:
    #090909;

  --mlr-surface-2:
    #0e0e0e;

  --mlr-surface-3:
    #141414;

  --mlr-surface-4:
    #1a1a1a;

  --mlr-hover:
    #171717;

  --mlr-active:
    #1d1d1d;

  --mlr-text:
    #f3f3f3;

  --mlr-text-strong:
    #ffffff;

  --mlr-text-secondary:
    #ededed;

  --mlr-text-muted:
    #c0c0c0;

  --mlr-placeholder:
    #898989;

  --mlr-border:
    #292929;

  --mlr-border-soft:
    #222222;

  --mlr-border-strong:
    #373737;

  --mlr-border-dark:
    #4b4b4b;

  --mlr-success:
    #65d496;

  --mlr-success-bg:
    #0c2115;

  --mlr-success-border:
    #2c5a40;

  --mlr-warning:
    #f0b459;

  --mlr-warning-bg:
    #251a09;

  --mlr-warning-border:
    #60471e;

  --mlr-danger:
    #ff7979;

  --mlr-danger-bg:
    #280f0f;

  --mlr-danger-border:
    #673030;

  --mlr-info:
    #92baff;

  --mlr-info-bg:
    #0d182a;

  --mlr-info-border:
    #2d4b76;
}


/* =========================================================
   03 · RESET INTERNO
   ========================================================= */

.ml-return-page,
.ml-return-page *,
.ml-return-page *::before,
.ml-return-page *::after,
.ml-return-modal,
.ml-return-modal *,
.ml-return-modal *::before,
.ml-return-modal *::after,
.ml-return-photo-viewer,
.ml-return-photo-viewer *,
.ml-return-photo-viewer *::before,
.ml-return-photo-viewer *::after {
  box-sizing:
    border-box;
}

.ml-return-page button,
.ml-return-page input,
.ml-return-page textarea,
.ml-return-page select,
.ml-return-modal button,
.ml-return-modal input,
.ml-return-modal textarea,
.ml-return-modal select {
  font:
    inherit;
}

.ml-return-page button,
.ml-return-modal button {
  -webkit-tap-highlight-color:
    transparent;
}

.ml-return-page img,
.ml-return-modal img,
.ml-return-photo-viewer img {
  display:
    block;

  max-width:
    100%;
}


/* =========================================================
   04 · CONTENEDORES PRINCIPALES
   ========================================================= */

#mlReturnHeaderMount,
#mlReturnMetricsMount,
#mlReturnSearchMount,
#mlReturnWorkspaceMount,
#mlReturnRecentMount {
  width:
    100%;

  max-width:
    100%;

  min-width:
    0;
}


/* =========================================================
   05 · ICONOS
   ========================================================= */

.ml-return-page
.icon,
.ml-return-modal
.icon,
.ml-return-photo-viewer
.icon {
  display:
    block;

  flex:
    0
    0
    auto;

  width:
    17px;

  height:
    17px;

  stroke-width:
    2.1;
}


/* =========================================================
   06 · FOCUS
   ========================================================= */

.ml-return-page button:focus-visible,
.ml-return-page input:focus-visible,
.ml-return-page textarea:focus-visible,
.ml-return-page select:focus-visible,
.ml-return-modal button:focus-visible,
.ml-return-modal input:focus-visible,
.ml-return-modal textarea:focus-visible,
.ml-return-modal select:focus-visible {
  outline:
    2px
    solid
    var(
      --mlr-text-strong
    );

  outline-offset:
    2px;
}


/* =========================================================
   07 · ANIMACIONES
   ========================================================= */

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

@keyframes ml-return-enter {
  from {
    opacity:
      0;

    transform:
      translateY(
        5px
      );
  }

  to {
    opacity:
      1;

    transform:
      translateY(
        0
      );
  }
}

@keyframes ml-return-modal-enter {
  from {
    opacity:
      0;

    transform:
      translateY(
        8px
      )
      scale(
        0.992
      );
  }

  to {
    opacity:
      1;

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

.ml-return-page
.is-spinning,
.ml-return-modal
.is-spinning {
  animation:
    ml-return-spin
    700ms
    linear
    infinite;
}

.ml-return-header,
.ml-return-metrics,
.ml-return-search-panel,
.ml-return-workspace,
.ml-return-recent {
  animation:
    ml-return-enter
    180ms
    ease-out
    both;
}


/* =========================================================
   08 · HEADER
   ========================================================= */

.ml-return-header {
  position:
    relative;

  display:
    grid;

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

  align-items:
    center;

  gap:
    28px;

  width:
    100%;

  min-width:
    0;

  min-height:
    88px;

  padding:
    16px
    18px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

  background:
    var(
      --mlr-surface
    );

  overflow:
    hidden;
}

.ml-return-header::before {
  content:
    "";

  position:
    absolute;

  inset:
    0
    auto
    0
    0;

  width:
    3px;

  background:
    var(
      --mlr-text-strong
    );
}


/* =========================================================
   09 · HEADER · IDENTIDAD
   ========================================================= */

.ml-return-header__identity {
  display:
    grid;

  grid-template-columns:
    44px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    13px;

  min-width:
    0;
}

.ml-return-header__icon {
  display:
    grid;

  place-items:
    center;

  width:
    44px;

  height:
    44px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    10px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );

  transition:
    transform
    var(
      --mlr-transition
    ),
    background
    var(
      --mlr-transition
    );
}

.ml-return-header:hover
.ml-return-header__icon {
  transform:
    translateY(
      -1px
    );

  background:
    var(
      --mlr-hover
    );
}

.ml-return-header__icon
.icon {
  width:
    20px;

  height:
    20px;
}

.ml-return-eyebrow {
  display:
    block;

  margin:
    0
    0
    3px;

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

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-header__identity
h1 {
  margin:
    0;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    clamp(
      25px,
      1.8vw,
      31px
    );

  font-weight:
    850;

  line-height:
    1.05;

  letter-spacing:
    -0.035em;
}

.ml-return-header__identity
p {
  max-width:
    820px;

  margin:
    5px
    0
    0;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    12px;

  font-weight:
    650;

  line-height:
    1.45;
}


/* =========================================================
   10 · HEADER · ACCIONES
   ========================================================= */

.ml-return-header__actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  flex-wrap:
    wrap;

  gap:
    8px;

  min-width:
    0;
}


/* =========================================================
   11 · BOTÓN PRIMARY
   ========================================================= */

.ml-return-primary-button {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  min-width:
    0;

  min-height:
    39px;

  padding:
    0
    14px;

  border:
    1px
    solid
    var(
      --mlr-text-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-text-strong
    );

  color:
    var(
      --mlr-surface
    );

  font-size:
    12px;

  font-weight:
    800;

  line-height:
    1;

  white-space:
    nowrap;

  cursor:
    pointer;

  transition:
    transform
      var(
        --mlr-transition-fast
      ),
    opacity
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      );
}

.ml-return-primary-button:hover:not(:disabled) {
  transform:
    translateY(
      -1px
    );

  opacity:
    0.88;
}

.ml-return-primary-button:active:not(:disabled) {
  transform:
    translateY(
      0
    )
    scale(
      0.985
    );
}

.ml-return-primary-button:disabled {
  opacity:
    0.42;

  cursor:
    default;
}

.ml-return-primary-button
.icon {
  width:
    15px;

  height:
    15px;
}


/* =========================================================
   12 · BOTÓN SECONDARY
   ========================================================= */

.ml-return-secondary-button {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  min-width:
    0;

  min-height:
    39px;

  padding:
    0
    13px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    12px;

  font-weight:
    800;

  line-height:
    1;

  white-space:
    nowrap;

  cursor:
    pointer;

  transition:
    transform
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      ),
    border-color
      var(
        --mlr-transition-fast
      );
}

.ml-return-secondary-button:hover:not(:disabled) {
  border-color:
    var(
      --mlr-border-dark
    );

  background:
    var(
      --mlr-hover
    );

  transform:
    translateY(
      -1px
    );
}

.ml-return-secondary-button:active:not(:disabled) {
  transform:
    translateY(
      0
    )
    scale(
      0.985
    );
}

.ml-return-secondary-button:disabled {
  opacity:
    0.42;

  cursor:
    default;
}

.ml-return-secondary-button.is-danger {
  border-color:
    var(
      --mlr-danger-border
    );

  color:
    var(
      --mlr-danger
    );
}

.ml-return-secondary-button.is-danger:hover:not(:disabled) {
  border-color:
    var(
      --mlr-danger
    );

  background:
    var(
      --mlr-danger-bg
    );
}

.ml-return-secondary-button
.icon {
  width:
    15px;

  height:
    15px;
}


/* =========================================================
   13 · ICON BUTTON
   ========================================================= */

.ml-return-icon-button {
  display:
    grid;

  place-items:
    center;

  flex:
    0
    0
    auto;

  width:
    36px;

  height:
    36px;

  padding:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text-strong
    );

  cursor:
    pointer;

  transition:
    transform
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      ),
    border-color
      var(
        --mlr-transition-fast
      );
}

.ml-return-icon-button:hover:not(:disabled) {
  border-color:
    var(
      --mlr-border-dark
    );

  background:
    var(
      --mlr-hover
    );

  transform:
    translateY(
      -1px
    );
}

.ml-return-icon-button:active:not(:disabled) {
  transform:
    scale(
      0.97
    );
}

.ml-return-icon-button:disabled {
  opacity:
    0.4;

  cursor:
    default;
}

.ml-return-icon-button.is-danger {
  color:
    var(
      --mlr-danger
    );
}

.ml-return-icon-button.is-danger:hover:not(:disabled) {
  border-color:
    var(
      --mlr-danger-border
    );

  background:
    var(
      --mlr-danger-bg
    );
}

.ml-return-icon-button
.icon {
  width:
    15px;

  height:
    15px;
}


/* =========================================================
   14 · MÉTRICAS
   ========================================================= */

.ml-return-metrics {
  display:
    grid;

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

  width:
    100%;

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

  background:
    var(
      --mlr-border-strong
    );

  overflow:
    hidden;
}

.ml-return-metric {
  position:
    relative;

  display:
    grid;

  grid-template-columns:
    38px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    10px;

  min-width:
    0;

  min-height:
    78px;

  padding:
    11px
    12px;

  border-right:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  transition:
    background
    var(
      --mlr-transition-fast
    );
}

.ml-return-metric:last-child {
  border-right:
    0;
}

.ml-return-metric:hover {
  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-metric__icon {
  display:
    grid;

  place-items:
    center;

  width:
    38px;

  height:
    38px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    9px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-metric__icon
.icon {
  width:
    18px;

  height:
    18px;
}

.ml-return-metric__body {
  display:
    grid;

  gap:
    4px;

  min-width:
    0;
}

.ml-return-metric__body
span {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    800;

  line-height:
    1.2;

  text-overflow:
    ellipsis;

  text-transform:
    uppercase;

  white-space:
    nowrap;
}

.ml-return-metric__body
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    22px;

  font-weight:
    850;

  line-height:
    1;

  letter-spacing:
    -0.03em;

  font-variant-numeric:
    tabular-nums;
}

.ml-return-metric.is-ok
.ml-return-metric__icon {
  border-color:
    var(
      --mlr-success-border
    );

  background:
    var(
      --mlr-success-bg
    );

  color:
    var(
      --mlr-success
    );
}

.ml-return-metric.is-warning
.ml-return-metric__icon,
.ml-return-metric.is-pending
.ml-return-metric__icon,
.ml-return-metric.is-review
.ml-return-metric__icon {
  border-color:
    var(
      --mlr-warning-border
    );

  background:
    var(
      --mlr-warning-bg
    );

  color:
    var(
      --mlr-warning
    );
}

.ml-return-metric.is-received
.ml-return-metric__icon {
  border-color:
    var(
      --mlr-info-border
    );

  background:
    var(
      --mlr-info-bg
    );

  color:
    var(
      --mlr-info
    );
}


/* =========================================================
   15 · BUSCADOR
   ========================================================= */

.ml-return-search-panel {
  display:
    grid;

  grid-template-columns:
    minmax(
      220px,
      0.32fr
    )
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    20px;

  width:
    100%;

  min-width:
    0;

  padding:
    14px
    15px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

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

.ml-return-search-panel__head {
  display:
    block;

  min-width:
    0;
}

.ml-return-search-panel__head
span {
  display:
    block;

  margin:
    0
    0
    3px;

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

  font-size:
    9px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-search-panel__head
h2 {
  margin:
    0;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    16px;

  font-weight:
    850;

  line-height:
    1.2;
}

.ml-return-search-panel__head
p {
  margin:
    4px
    0
    0;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    11px;

  font-weight:
    650;

  line-height:
    1.4;
}

.ml-return-search {
  display:
    grid;

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

  align-items:
    stretch;

  gap:
    8px;

  width:
    100%;

  min-width:
    0;
}

.ml-return-search__field {
  display:
    grid;

  grid-template-columns:
    42px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  width:
    100%;

  min-width:
    0;

  min-height:
    42px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-2
    );

  overflow:
    hidden;

  transition:
    border-color
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      );
}

.ml-return-search__field:focus-within {
  border-color:
    var(
      --mlr-border-dark
    );

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

.ml-return-search__icon {
  display:
    grid;

  place-items:
    center;

  width:
    42px;

  height:
    100%;

  border-right:
    1px
    solid
    var(
      --mlr-border-soft
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-search__icon
.icon {
  width:
    17px;

  height:
    17px;
}

.ml-return-search__field
input {
  width:
    100%;

  min-width:
    0;

  height:
    100%;

  min-height:
    40px;

  padding:
    0
    13px;

  border:
    0;

  outline:
    0;

  background:
    transparent;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    13px;

  font-weight:
    750;
}

.ml-return-search__field
input::placeholder {
  color:
    var(
      --mlr-placeholder
    );

  opacity:
    1;
}

.ml-return-search-panel
.ml-return-message {
  grid-column:
    1 / -1;
}


/* =========================================================
   16 · MENSAJES
   ========================================================= */

.ml-return-message {
  display:
    flex;

  align-items:
    flex-start;

  gap:
    8px;

  width:
    100%;

  min-width:
    0;

  padding:
    10px
    11px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    11px;

  font-weight:
    700;

  line-height:
    1.45;
}

.ml-return-message
.icon {
  width:
    15px;

  height:
    15px;

  margin-top:
    1px;
}

.ml-return-message.is-error {
  border-color:
    var(
      --mlr-danger-border
    );

  background:
    var(
      --mlr-danger-bg
    );

  color:
    var(
      --mlr-danger
    );
}

.ml-return-message.is-neutral {
  color:
    var(
      --mlr-text-secondary
    );
}


/* =========================================================
   17 · EMPTY PRINCIPAL
   ========================================================= */

.ml-return-empty {
  display:
    grid;

  place-items:
    center;

  align-content:
    center;

  gap:
    8px;

  width:
    100%;

  min-width:
    0;

  min-height:
    210px;

  padding:
    28px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

  background:
    var(
      --mlr-surface
    );

  text-align:
    center;
}

.ml-return-empty__icon {
  display:
    grid;

  place-items:
    center;

  width:
    46px;

  height:
    46px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    11px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-empty__icon
.icon {
  width:
    21px;

  height:
    21px;
}

.ml-return-empty
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    15px;

  font-weight:
    850;
}

.ml-return-empty
p {
  max-width:
    430px;

  margin:
    0;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    12px;

  font-weight:
    650;

  line-height:
    1.5;
}


/* =========================================================
   18 · WORKSPACE
   ========================================================= */

.ml-return-workspace {
  display:
    grid;

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

  gap:
    10px;

  width:
    100%;

  max-width:
    100%;

  min-width:
    0;
}

.ml-return-workspace__grid {
  display:
    grid;

  grid-template-columns:
    minmax(
      0,
      1fr
    )
    minmax(
      265px,
      300px
    );

  align-items:
    start;

  gap:
    10px;

  width:
    100%;

  max-width:
    100%;

  min-width:
    0;
}

.ml-return-workspace__main,
.ml-return-workspace__side {
  display:
    grid;

  align-content:
    start;

  gap:
    10px;

  width:
    100%;

  min-width:
    0;
}


/* =========================================================
   19 · DEVOLUCIÓN SELECCIONADA
   ========================================================= */

.ml-return-selected-head {
  display:
    grid;

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

  align-items:
    center;

  gap:
    20px;

  width:
    100%;

  min-width:
    0;

  padding:
    13px
    15px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

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

.ml-return-selected-head__main {
  display:
    grid;

  grid-template-columns:
    40px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    11px;

  min-width:
    0;
}

.ml-return-selected-head__icon {
  display:
    grid;

  place-items:
    center;

  width:
    40px;

  height:
    40px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    9px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-selected-head__icon
.icon {
  width:
    18px;

  height:
    18px;
}

.ml-return-selected-head__main
> div
> span {
  display:
    block;

  margin:
    0
    0
    2px;

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

  font-size:
    9px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-selected-head__main
h2 {
  margin:
    0;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    20px;

  font-weight:
    850;

  line-height:
    1.1;

  letter-spacing:
    -0.025em;
}

.ml-return-selected-head__main
p {
  margin:
    4px
    0
    0;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    11px;

  font-weight:
    650;
}

.ml-return-selected-head__meta {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  flex-wrap:
    wrap;

  gap:
    7px;

  min-width:
    0;
}


/* =========================================================
   20 · ESTADOS
   ========================================================= */

.ml-return-status,
.ml-return-condition {
  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    5px;

  width:
    auto;

  min-width:
    0;

  min-height:
    28px;

  max-width:
    100%;

  padding:
    0
    9px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    999px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    800;

  line-height:
    1;

  white-space:
    nowrap;
}

.ml-return-status
.icon,
.ml-return-condition
.icon {
  width:
    12px;

  height:
    12px;
}

.ml-return-status.is-pending,
.ml-return-status.is-review {
  border-color:
    var(
      --mlr-warning-border
    );

  background:
    var(
      --mlr-warning-bg
    );

  color:
    var(
      --mlr-warning
    );
}

.ml-return-status.is-received {
  border-color:
    var(
      --mlr-info-border
    );

  background:
    var(
      --mlr-info-bg
    );

  color:
    var(
      --mlr-info
    );
}

.ml-return-status.is-approved {
  border-color:
    var(
      --mlr-success-border
    );

  background:
    var(
      --mlr-success-bg
    );

  color:
    var(
      --mlr-success
    );
}

.ml-return-status.is-rejected {
  border-color:
    var(
      --mlr-danger-border
    );

  background:
    var(
      --mlr-danger-bg
    );

  color:
    var(
      --mlr-danger
    );
}

.ml-return-status.is-closed {
  border-color:
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-muted
    );
}

.ml-return-condition.is-ok {
  border-color:
    var(
      --mlr-success-border
    );

  background:
    var(
      --mlr-success-bg
    );

  color:
    var(
      --mlr-success
    );
}

.ml-return-condition.is-damaged,
.ml-return-condition.is-incomplete,
.ml-return-condition.is-wrong,
.ml-return-condition.is-other {
  border-color:
    var(
      --mlr-warning-border
    );

  background:
    var(
      --mlr-warning-bg
    );

  color:
    var(
      --mlr-warning
    );
}


/* =========================================================
   21 · DATOS DE DEVOLUCIÓN
   ========================================================= */

.ml-return-info-grid {
  display:
    grid;

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

  width:
    100%;

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

  background:
    var(
      --mlr-border-strong
    );

  overflow:
    hidden;
}

.ml-return-info-grid
article {
  display:
    grid;

  align-content:
    center;

  gap:
    5px;

  min-width:
    0;

  min-height:
    68px;

  padding:
    10px
    12px;

  border-right:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  transition:
    background
    var(
      --mlr-transition-fast
    );
}

.ml-return-info-grid
article:last-child {
  border-right:
    0;
}

.ml-return-info-grid
article:hover {
  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-info-grid
span {
  overflow:
    hidden;

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

  font-size:
    8px;

  font-weight:
    800;

  line-height:
    1.2;

  text-overflow:
    ellipsis;

  text-transform:
    uppercase;

  white-space:
    nowrap;
}

.ml-return-info-grid
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    800;

  line-height:
    1.35;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   22 · PANELES
   ========================================================= */

.ml-return-panel {
  width:
    100%;

  max-width:
    100%;

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

  background:
    var(
      --mlr-surface
    );

  overflow:
    hidden;
}

.ml-return-panel__head {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    14px;

  min-height:
    61px;

  padding:
    11px
    13px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-panel__head
> div {
  min-width:
    0;
}

.ml-return-panel__head
> div
> span {
  display:
    block;

  margin:
    0
    0
    2px;

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

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-panel__head
h3 {
  margin:
    0;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    14px;

  font-weight:
    850;

  line-height:
    1.2;
}

.ml-return-panel__head
p {
  margin:
    3px
    0
    0;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    10px;

  font-weight:
    650;

  line-height:
    1.4;
}

.ml-return-panel__head
> .icon {
  width:
    18px;

  height:
    18px;

  color:
    var(
      --mlr-text-strong
    );
}


/* =========================================================
   23 · CONTROL FÍSICO
   ========================================================= */

.ml-return-condition-grid {
  display:
    grid;

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

  width:
    100%;

  min-width:
    0;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-border-strong
    );
}

.ml-return-condition-option {
  position:
    relative;

  display:
    grid;

  grid-template-columns:
    34px
    minmax(
      0,
      1fr
    )
    17px;

  align-items:
    center;

  gap:
    8px;

  min-width:
    0;

  min-height:
    78px;

  padding:
    9px
    10px;

  border:
    0;

  border-right:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text
    );

  text-align:
    left;

  cursor:
    pointer;

  transition:
    background
      var(
        --mlr-transition-fast
      ),
    transform
      var(
        --mlr-transition-fast
      );
}

.ml-return-condition-option:last-child {
  border-right:
    0;
}

.ml-return-condition-option:hover:not(:disabled) {
  z-index:
    1;

  background:
    var(
      --mlr-hover
    );
}

.ml-return-condition-option:active:not(:disabled) {
  transform:
    scale(
      0.99
    );
}

.ml-return-condition-option:disabled {
  opacity:
    0.62;

  cursor:
    default;
}

.ml-return-condition-option.is-active {
  background:
    var(
      --mlr-active
    );
}

.ml-return-condition-option__icon {
  display:
    grid;

  place-items:
    center;

  width:
    34px;

  height:
    34px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-condition-option__icon
.icon {
  width:
    15px;

  height:
    15px;
}

.ml-return-condition-option__body {
  display:
    grid;

  min-width:
    0;
}

.ml-return-condition-option__body
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    850;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-condition-option__body
small {
  display:
    -webkit-box;

  margin:
    3px
    0
    0;

  overflow:
    hidden;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.35;

  -webkit-box-orient:
    vertical;

  -webkit-line-clamp:
    2;
}

.ml-return-condition-option__check {
  display:
    grid;

  place-items:
    center;

  color:
    var(
      --mlr-placeholder
    );
}

.ml-return-condition-option__check
.icon {
  width:
    15px;

  height:
    15px;
}

.ml-return-condition-option.is-ok.is-active {
  background:
    var(
      --mlr-success-bg
    );
}

.ml-return-condition-option.is-ok.is-active
.ml-return-condition-option__icon {
  border-color:
    var(
      --mlr-success-border
    );

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-success
    );
}

.ml-return-condition-option.is-ok.is-active
.ml-return-condition-option__check {
  color:
    var(
      --mlr-success
    );
}

.ml-return-condition-option.is-danado.is-active,
.ml-return-condition-option.is-incompleto.is-active,
.ml-return-condition-option.is-producto_incorrecto.is-active,
.ml-return-condition-option.is-otro.is-active {
  background:
    var(
      --mlr-warning-bg
    );
}

.ml-return-condition-option.is-danado.is-active
.ml-return-condition-option__icon,
.ml-return-condition-option.is-incompleto.is-active
.ml-return-condition-option__icon,
.ml-return-condition-option.is-producto_incorrecto.is-active
.ml-return-condition-option__icon,
.ml-return-condition-option.is-otro.is-active
.ml-return-condition-option__icon {
  border-color:
    var(
      --mlr-warning-border
    );

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-warning
    );
}

.ml-return-condition-option.is-danado.is-active
.ml-return-condition-option__check,
.ml-return-condition-option.is-incompleto.is-active
.ml-return-condition-option__check,
.ml-return-condition-option.is-producto_incorrecto.is-active
.ml-return-condition-option__check,
.ml-return-condition-option.is-otro.is-active
.ml-return-condition-option__check {
  color:
    var(
      --mlr-warning
    );
}


/* =========================================================
   24 · TEXTAREA
   ========================================================= */

.ml-return-textarea-field {
  display:
    grid;

  gap:
    6px;

  min-width:
    0;

  padding:
    12px
    13px;
}

.ml-return-textarea-field
> span {
  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    850;

  letter-spacing:
    0.04em;

  text-transform:
    uppercase;
}

.ml-return-textarea-field
textarea {
  width:
    100%;

  min-width:
    0;

  max-width:
    100%;

  min-height:
    88px;

  resize:
    vertical;

  padding:
    10px
    11px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  outline:
    0;

  background:
    var(
      --mlr-surface-2
    );

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    650;

  line-height:
    1.5;

  transition:
    border-color
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      );
}

.ml-return-textarea-field
textarea::placeholder {
  color:
    var(
      --mlr-placeholder
    );

  opacity:
    1;
}

.ml-return-textarea-field
textarea:focus {
  border-color:
    var(
      --mlr-border-dark
    );

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

.ml-return-textarea-field
textarea:disabled {
  opacity:
    0.6;

  cursor:
    default;
}


/* =========================================================
   25 · ITEMS
   ========================================================= */

.ml-return-items {
  display:
    grid;

  width:
    100%;

  min-width:
    0;
}

.ml-return-item {
  display:
    grid;

  grid-template-columns:
    minmax(
      0,
      1.6fr
    )
    72px
    72px
    minmax(
      120px,
      auto
    )
    36px;

  align-items:
    center;

  gap:
    10px;

  width:
    100%;

  min-width:
    0;

  min-height:
    62px;

  padding:
    9px
    12px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  transition:
    background
    var(
      --mlr-transition-fast
    );
}

.ml-return-item:last-child {
  border-bottom:
    0;
}

.ml-return-item:hover {
  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-item__identity {
  display:
    grid;

  grid-template-columns:
    36px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    9px;

  min-width:
    0;
}

.ml-return-item__icon {
  display:
    grid;

  place-items:
    center;

  width:
    36px;

  height:
    36px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-item__icon
.icon {
  width:
    16px;

  height:
    16px;
}

.ml-return-item__identity
> div {
  display:
    grid;

  min-width:
    0;
}

.ml-return-item__identity
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    800;

  line-height:
    1.35;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-item__identity
small {
  overflow:
    hidden;

  margin:
    2px
    0
    0;

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

  font-size:
    9px;

  font-weight:
    650;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-item__quantity {
  display:
    grid;

  gap:
    2px;

  min-width:
    0;
}

.ml-return-item__quantity
span {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    8px;

  font-weight:
    800;

  line-height:
    1.2;

  text-transform:
    uppercase;
}

.ml-return-item__quantity
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    14px;

  font-weight:
    850;

  line-height:
    1.1;

  font-variant-numeric:
    tabular-nums;
}


/* =========================================================
   26 · PANEL VACÍO
   ========================================================= */

.ml-return-panel-empty {
  display:
    grid;

  place-items:
    center;

  align-content:
    center;

  gap:
    6px;

  width:
    100%;

  min-width:
    0;

  min-height:
    112px;

  padding:
    18px;

  background:
    var(
      --mlr-surface
    );

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

  text-align:
    center;
}

.ml-return-panel-empty
.icon {
  width:
    20px;

  height:
    20px;
}

.ml-return-panel-empty
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    800;
}

.ml-return-panel-empty
span {
  max-width:
    340px;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    650;

  line-height:
    1.45;
}


/* =========================================================
   27 · CARGA DE FOTOS
   ========================================================= */

.ml-return-upload {
  display:
    grid;

  grid-template-columns:
    minmax(
      230px,
      1fr
    )
    minmax(
      120px,
      150px
    )
    minmax(
      150px,
      0.8fr
    )
    auto;

  align-items:
    center;

  gap:
    8px;

  width:
    100%;

  min-width:
    0;

  padding:
    11px
    12px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

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

.ml-return-upload__drop {
  position:
    relative;

  display:
    grid;

  grid-template-columns:
    36px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    8px;

  width:
    100%;

  min-width:
    0;

  min-height:
    46px;

  padding:
    6px
    9px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-2
    );

  cursor:
    pointer;

  transition:
    background
      var(
        --mlr-transition-fast
      ),
    border-color
      var(
        --mlr-transition-fast
      );
}

.ml-return-upload__drop:hover {
  border-color:
    var(
      --mlr-border-dark
    );

  background:
    var(
      --mlr-hover
    );
}

.ml-return-upload__drop
input {
  position:
    absolute;

  width:
    1px;

  height:
    1px;

  opacity:
    0;

  pointer-events:
    none;
}

.ml-return-upload__icon {
  display:
    grid;

  place-items:
    center;

  width:
    36px;

  height:
    36px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    7px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-upload__icon
.icon {
  width:
    16px;

  height:
    16px;
}

.ml-return-upload__drop
> div {
  display:
    grid;

  min-width:
    0;
}

.ml-return-upload__drop
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-upload__drop
small {
  overflow:
    hidden;

  margin:
    2px
    0
    0;

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

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-upload
select,
.ml-return-upload
> input[type="text"] {
  width:
    100%;

  min-width:
    0;

  min-height:
    40px;

  padding:
    0
    10px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  outline:
    0;

  background:
    var(
      --mlr-surface-2
    );

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    700;

  transition:
    border-color
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      );
}

.ml-return-upload
select:focus,
.ml-return-upload
> input[type="text"]:focus {
  border-color:
    var(
      --mlr-border-dark
    );

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

.ml-return-upload
> input[type="text"]::placeholder {
  color:
    var(
      --mlr-placeholder
    );

  opacity:
    1;
}


/* =========================================================
   28 · FOTOS
   ========================================================= */

.ml-return-photo-grid {
  display:
    grid;

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

  width:
    100%;

  min-width:
    0;

  background:
    var(
      --mlr-border-strong
    );

  gap:
    1px;
}

.ml-return-photo {
  display:
    grid;

  grid-template-rows:
    auto
    auto;

  min-width:
    0;

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

.ml-return-photo__preview {
  position:
    relative;

  display:
    block;

  width:
    100%;

  aspect-ratio:
    4 / 3;

  padding:
    0;

  border:
    0;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-3
    );

  cursor:
    zoom-in;

  overflow:
    hidden;
}

.ml-return-photo__preview
img {
  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  transition:
    transform
    var(
      --mlr-transition
    );
}

.ml-return-photo__preview:hover
img {
  transform:
    scale(
      1.025
    );
}

.ml-return-photo__body {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    8px;

  min-width:
    0;

  min-height:
    50px;

  padding:
    8px
    9px;
}

.ml-return-photo__body
> div {
  display:
    grid;

  min-width:
    0;
}

.ml-return-photo__body
span {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.05em;

  text-transform:
    uppercase;
}

.ml-return-photo__body
strong {
  overflow:
    hidden;

  margin:
    2px
    0
    0;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    9px;

  font-weight:
    750;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   29 · PANEL DE ACCIONES
   ========================================================= */

.ml-return-actions {
  position:
    sticky;

  top:
    12px;

  display:
    grid;

  gap:
    13px;

  width:
    100%;

  min-width:
    0;

  padding:
    13px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

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

.ml-return-actions
> div:first-child {
  min-width:
    0;
}

.ml-return-actions
> div:first-child
> span {
  display:
    block;

  margin:
    0
    0
    3px;

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

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-actions
> div:first-child
> strong {
  display:
    block;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    16px;

  font-weight:
    850;

  line-height:
    1.2;
}

.ml-return-actions
p {
  margin:
    5px
    0
    0;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    10px;

  font-weight:
    650;

  line-height:
    1.5;
}

.ml-return-actions__buttons {
  display:
    grid;

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

  gap:
    7px;
}

.ml-return-actions__buttons
button {
  width:
    100%;
}


/* =========================================================
   30 · FORMULARIOS GENERALES
   ========================================================= */

.ml-return-form-grid {
  display:
    grid;

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

  gap:
    10px;
}

.ml-return-form-field {
  display:
    grid;

  gap:
    5px;

  min-width:
    0;
}

.ml-return-form-field
> span {
  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.03em;

  text-transform:
    uppercase;
}

.ml-return-form-field
input,
.ml-return-form-field
select {
  width:
    100%;

  min-width:
    0;

  min-height:
    42px;

  padding:
    0
    10px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  outline:
    0;

  background:
    var(
      --mlr-surface-2
    );

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    700;

  transition:
    border-color
      var(
        --mlr-transition-fast
      ),
    background
      var(
        --mlr-transition-fast
      );
}

.ml-return-form-field
input::placeholder {
  color:
    var(
      --mlr-placeholder
    );

  opacity:
    1;
}

.ml-return-form-field
input:focus,
.ml-return-form-field
select:focus {
  border-color:
    var(
      --mlr-border-dark
    );

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


/* =========================================================
   31 · CHECKBOX GRID
   ========================================================= */

.ml-return-check-grid {
  display:
    grid;

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

  gap:
    7px;
}

.ml-return-check-grid
label {
  display:
    flex;

  align-items:
    center;

  gap:
    7px;

  min-width:
    0;

  min-height:
    40px;

  padding:
    0
    10px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-2
    );

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    750;

  cursor:
    pointer;

  transition:
    background
      var(
        --mlr-transition-fast
      ),
    border-color
      var(
        --mlr-transition-fast
      );
}

.ml-return-check-grid
label:hover {
  border-color:
    var(
      --mlr-border-dark
    );

  background:
    var(
      --mlr-hover
    );
}

.ml-return-check-grid
input {
  width:
    15px;

  height:
    15px;

  flex:
    0
    0
    auto;

  accent-color:
    var(
      --mlr-text-strong
    );
}


/* =========================================================
   FIN PARTE 1 DE 2
   CONTINÚA DIRECTAMENTE CON PARTE 2
   ========================================================= *//* =========================================================
   32 · HISTORIAL
   ========================================================= */

.ml-return-recent {
  width:
    100%;

  max-width:
    100%;

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    var(
      --mlr-radius-lg
    );

  background:
    var(
      --mlr-surface
    );

  overflow:
    hidden;
}

.ml-return-recent__head {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  min-height:
    58px;

  padding:
    11px
    14px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-recent__head
> div {
  min-width:
    0;
}

.ml-return-recent__head
span:first-child {
  display:
    block;

  margin:
    0
    0
    2px;

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

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-recent__head
h2 {
  margin:
    0;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    14px;

  font-weight:
    850;

  line-height:
    1.2;
}

.ml-return-recent__count {
  display:
    grid;

  place-items:
    center;

  min-width:
    31px;

  height:
    27px;

  padding:
    0
    8px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    999px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    9px;

  font-weight:
    850;
}

.ml-return-recent-list {
  display:
    grid;

  width:
    100%;

  min-width:
    0;
}

.ml-return-recent-row {
  display:
    grid;

  grid-template-columns:
    minmax(
      190px,
      1.4fr
    )
    max-content
    max-content
    minmax(
      120px,
      0.8fr
    )
    18px;

  align-items:
    center;

  gap:
    11px;

  width:
    100%;

  min-width:
    0;

  min-height:
    58px;

  padding:
    9px
    12px;

  border:
    0;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text-strong
    );

  text-align:
    left;

  cursor:
    pointer;

  transition:
    background
      var(
        --mlr-transition-fast
      ),
    transform
      var(
        --mlr-transition-fast
      );
}

.ml-return-recent-row:last-child {
  border-bottom:
    0;
}

.ml-return-recent-row:hover {
  background:
    var(
      --mlr-hover
    );
}

.ml-return-recent-row:active {
  background:
    var(
      --mlr-active
    );
}

.ml-return-recent-row__number {
  display:
    grid;

  min-width:
    0;
}

.ml-return-recent-row__number
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    800;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-recent-row__number
small {
  overflow:
    hidden;

  margin:
    2px
    0
    0;

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

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-recent-row__operator {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    10px;

  font-weight:
    700;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-recent-row__arrow {
  width:
    13px !important;

  height:
    13px !important;

  justify-self:
    end;

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

  transition:
    transform
    var(
      --mlr-transition-fast
    );
}

.ml-return-recent-row:hover
.ml-return-recent-row__arrow {
  transform:
    translateX(
      2px
    );
}


/* =========================================================
   33 · MODAL BACKDROP
   ========================================================= */

.ml-return-modal-backdrop {
  --mlr-surface:
    #ffffff;

  --mlr-surface-2:
    #f8f9fa;

  --mlr-surface-3:
    #f0f2f3;

  --mlr-hover:
    #eceff1;

  --mlr-active:
    #e4e7e9;

  --mlr-text:
    #111315;

  --mlr-text-strong:
    #050607;

  --mlr-text-secondary:
    #24272a;

  --mlr-text-muted:
    #484d52;

  --mlr-placeholder:
    #747a80;

  --mlr-border:
    #d3d7da;

  --mlr-border-soft:
    #e2e5e7;

  --mlr-border-strong:
    #bcc2c6;

  --mlr-border-dark:
    #969da2;

  --mlr-success:
    #0b7543;

  --mlr-success-bg:
    #eaf7f0;

  --mlr-success-border:
    #9bd2b6;

  --mlr-warning:
    #945900;

  --mlr-warning-bg:
    #fff5df;

  --mlr-warning-border:
    #dfbd73;

  --mlr-danger:
    #be2929;

  --mlr-danger-bg:
    #fff0f0;

  --mlr-danger-border:
    #e1a0a0;

  --mlr-info:
    #245fae;

  --mlr-info-bg:
    #edf4ff;

  --mlr-info-border:
    #aac5eb;

  position:
    fixed;

  inset:
    0;

  z-index:
    99999;

  display:
    grid;

  place-items:
    center;

  width:
    100%;

  height:
    100%;

  padding:
    22px;

  background:
    rgba(
      0,
      0,
      0,
      0.64
    );

  overflow:
    hidden;
}

html[data-theme="dark"]
.ml-return-modal-backdrop,
body.dark
.ml-return-modal-backdrop,
body[data-theme="dark"]
.ml-return-modal-backdrop {
  --mlr-surface:
    #090909;

  --mlr-surface-2:
    #0e0e0e;

  --mlr-surface-3:
    #141414;

  --mlr-hover:
    #171717;

  --mlr-active:
    #1d1d1d;

  --mlr-text:
    #f3f3f3;

  --mlr-text-strong:
    #ffffff;

  --mlr-text-secondary:
    #ededed;

  --mlr-text-muted:
    #c0c0c0;

  --mlr-placeholder:
    #898989;

  --mlr-border:
    #292929;

  --mlr-border-soft:
    #222222;

  --mlr-border-strong:
    #373737;

  --mlr-border-dark:
    #4b4b4b;

  --mlr-success:
    #65d496;

  --mlr-success-bg:
    #0c2115;

  --mlr-success-border:
    #2c5a40;

  --mlr-warning:
    #f0b459;

  --mlr-warning-bg:
    #251a09;

  --mlr-warning-border:
    #60471e;

  --mlr-danger:
    #ff7979;

  --mlr-danger-bg:
    #280f0f;

  --mlr-danger-border:
    #673030;

  --mlr-info:
    #92baff;

  --mlr-info-bg:
    #0d182a;

  --mlr-info-border:
    #2d4b76;
}


/* =========================================================
   34 · MODAL
   ========================================================= */

.ml-return-modal {
  display:
    grid;

  grid-template-rows:
    auto
    minmax(
      0,
      1fr
    );

  width:
    min(
      760px,
      calc(
        100vw -
        44px
      )
    );

  max-width:
    100%;

  max-height:
    min(
      88vh,
      900px
    );

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    14px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text
    );

  font-family:
    "DM Sans",
    "Inter",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  overflow:
    hidden;

  animation:
    ml-return-modal-enter
    170ms
    ease-out
    both;
}

.ml-return-modal--summary {
  width:
    min(
      900px,
      calc(
        100vw -
        44px
      )
    );
}

.ml-return-modal--new-return {
  width:
    min(
      680px,
      calc(
        100vw -
        44px
      )
    );
}

.ml-return-modal--item {
  width:
    min(
      820px,
      calc(
        100vw -
        44px
      )
    );
}


/* =========================================================
   35 · MODAL HEADER
   ========================================================= */

.ml-return-modal__head {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  min-height:
    62px;

  padding:
    11px
    13px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-modal__head
> div {
  min-width:
    0;
}

.ml-return-modal__head
span {
  display:
    block;

  margin:
    0
    0
    2px;

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

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-modal__head
h2 {
  margin:
    0;

  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    16px;

  font-weight:
    850;

  line-height:
    1.2;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   36 · MODAL BODY
   ========================================================= */

.ml-return-modal__body {
  display:
    grid;

  align-content:
    start;

  gap:
    12px;

  width:
    100%;

  min-width:
    0;

  padding:
    13px;

  overflow-x:
    hidden;

  overflow-y:
    auto;

  overscroll-behavior:
    contain;

  scrollbar-width:
    thin;

  scrollbar-color:
    var(
      --mlr-border-strong
    )
    transparent;
}


/* =========================================================
   37 · MODAL FOOTER
   ========================================================= */

.ml-return-modal__footer {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    9px;

  width:
    calc(
      100% +
      26px
    );

  min-height:
    58px;

  margin:
    2px
    -13px
    -13px;

  padding:
    9px
    13px;

  border-top:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-modal__footer
> div {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  flex-wrap:
    wrap;

  gap:
    7px;
}


/* =========================================================
   38 · INVENTARIO PICKER
   ========================================================= */

.ml-return-inventory-picker {
  display:
    grid;

  gap:
    9px;

  width:
    100%;

  min-width:
    0;

  padding:
    11px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    10px;

  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-inventory-picker__head {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  min-width:
    0;
}

.ml-return-inventory-picker__head
> div {
  display:
    grid;

  min-width:
    0;
}

.ml-return-inventory-picker__head
span {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}

.ml-return-inventory-picker__head
strong {
  margin-top:
    2px;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    13px;

  font-weight:
    850;

  line-height:
    1.25;
}

.ml-return-inventory-picker__head
small {
  margin-top:
    2px;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    650;

  line-height:
    1.4;
}

.ml-return-inventory-picker__head
> .icon {
  width:
    18px;

  height:
    18px;

  color:
    var(
      --mlr-text-strong
    );
}


/* =========================================================
   39 · INVENTARIO SEARCH
   ========================================================= */

.ml-return-inventory-search {
  display:
    grid;

  grid-template-columns:
    38px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  width:
    100%;

  min-width:
    0;

  min-height:
    41px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  overflow:
    hidden;
}

.ml-return-inventory-search
> .icon {
  justify-self:
    center;

  width:
    15px;

  height:
    15px;

  color:
    var(
      --mlr-text-muted
    );
}

.ml-return-inventory-search
input {
  width:
    100%;

  min-width:
    0;

  min-height:
    39px;

  padding:
    0
    10px;

  border:
    0;

  border-left:
    1px
    solid
    var(
      --mlr-border-soft
    );

  outline:
    0;

  background:
    transparent;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    700;
}

.ml-return-inventory-search
input::placeholder {
  color:
    var(
      --mlr-placeholder
    );

  opacity:
    1;
}


/* =========================================================
   40 · INVENTARIO RESULTADOS
   ========================================================= */

.ml-return-inventory-results {
  display:
    grid;

  width:
    100%;

  min-width:
    0;

  max-height:
    270px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  overflow-x:
    hidden;

  overflow-y:
    auto;

  scrollbar-width:
    thin;
}

.ml-return-inventory-result {
  display:
    grid;

  grid-template-columns:
    34px
    minmax(
      0,
      1fr
    )
    auto
    16px;

  align-items:
    center;

  gap:
    9px;

  width:
    100%;

  min-width:
    0;

  min-height:
    54px;

  padding:
    7px
    9px;

  border:
    0;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text
    );

  text-align:
    left;

  cursor:
    pointer;

  transition:
    background
    var(
      --mlr-transition-fast
    );
}

.ml-return-inventory-result:last-child {
  border-bottom:
    0;
}

.ml-return-inventory-result:hover {
  background:
    var(
      --mlr-hover
    );
}

.ml-return-inventory-result.is-selected {
  background:
    var(
      --mlr-success-bg
    );
}

.ml-return-inventory-result__icon {
  display:
    grid;

  place-items:
    center;

  width:
    34px;

  height:
    34px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}

.ml-return-inventory-result__icon
.icon {
  width:
    15px;

  height:
    15px;
}

.ml-return-inventory-result__body {
  display:
    grid;

  min-width:
    0;
}

.ml-return-inventory-result__body
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-inventory-result__body
small {
  overflow:
    hidden;

  margin:
    2px
    0
    0;

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

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-inventory-result__stock {
  display:
    grid;

  justify-items:
    end;

  gap:
    1px;
}

.ml-return-inventory-result__stock
small {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    7px;

  font-weight:
    800;

  text-transform:
    uppercase;
}

.ml-return-inventory-result__stock
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    12px;

  font-weight:
    850;

  font-variant-numeric:
    tabular-nums;
}

.ml-return-inventory-result__arrow {
  width:
    13px !important;

  height:
    13px !important;

  color:
    var(
      --mlr-text-muted
    );
}


/* =========================================================
   41 · INVENTARIO STATE
   ========================================================= */

.ml-return-inventory-state {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  min-height:
    72px;

  padding:
    14px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    10px;

  font-weight:
    700;

  text-align:
    center;
}

.ml-return-inventory-state.is-error {
  border-color:
    var(
      --mlr-danger-border
    );

  background:
    var(
      --mlr-danger-bg
    );

  color:
    var(
      --mlr-danger
    );
}


/* =========================================================
   42 · RESUMEN
   ========================================================= */

.ml-return-summary {
  gap:
    11px;
}

.ml-return-summary__states {
  display:
    flex;

  align-items:
    center;

  flex-wrap:
    wrap;

  gap:
    7px;
}

.ml-return-summary__grid {
  display:
    grid;

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

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    9px;

  background:
    var(
      --mlr-border-strong
    );

  overflow:
    hidden;
}

.ml-return-summary__grid
article {
  display:
    grid;

  align-content:
    center;

  gap:
    4px;

  min-width:
    0;

  min-height:
    65px;

  padding:
    9px
    10px;

  border-right:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

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

.ml-return-summary__grid
article:nth-child(
  3n
) {
  border-right:
    0;
}

.ml-return-summary__grid
article:nth-last-child(
  -n + 3
) {
  border-bottom:
    0;
}

.ml-return-summary__grid
span {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    8px;

  font-weight:
    800;

  line-height:
    1.2;

  text-transform:
    uppercase;
}

.ml-return-summary__grid
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.35;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-summary__section {
  display:
    grid;

  gap:
    7px;

  min-width:
    0;
}

.ml-return-summary__section
> span {
  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    8px;

  font-weight:
    850;

  letter-spacing:
    0.07em;
}

.ml-return-summary__section
> p {
  margin:
    0;

  padding:
    10px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-2
    );

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    10px;

  font-weight:
    650;

  line-height:
    1.5;
}


/* =========================================================
   43 · RESUMEN ITEMS
   ========================================================= */

.ml-return-summary-items {
  display:
    grid;

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    9px;

  overflow:
    hidden;
}

.ml-return-summary-items
article {
  display:
    grid;

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

  align-items:
    center;

  gap:
    9px;

  min-width:
    0;

  min-height:
    53px;

  padding:
    8px
    10px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

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

.ml-return-summary-items
article:last-child {
  border-bottom:
    0;
}

.ml-return-summary-items
> article
> div {
  display:
    grid;

  min-width:
    0;
}

.ml-return-summary-items
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-summary-items
small {
  overflow:
    hidden;

  margin:
    2px
    0
    0;

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

  font-size:
    8px;

  font-weight:
    650;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}

.ml-return-summary-items
> article
> span {
  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    10px;

  font-weight:
    800;
}


/* =========================================================
   44 · RESUMEN FOTOS
   ========================================================= */

.ml-return-summary-photos {
  display:
    grid;

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

  gap:
    7px;

  min-width:
    0;
}

.ml-return-summary-photos
button {
  display:
    block;

  min-width:
    0;

  aspect-ratio:
    4 / 3;

  padding:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-3
    );

  cursor:
    zoom-in;

  overflow:
    hidden;
}

.ml-return-summary-photos
img {
  width:
    100%;

  height:
    100%;

  object-fit:
    cover;

  transition:
    transform
    var(
      --mlr-transition
    );
}

.ml-return-summary-photos
button:hover
img {
  transform:
    scale(
      1.025
    );
}


/* =========================================================
   45 · PHOTO VIEWER
   ========================================================= */

.ml-return-modal-backdrop--photo {
  padding:
    22px;
}

.ml-return-photo-viewer {
  display:
    grid;

  grid-template-rows:
    auto
    minmax(
      0,
      1fr
    );

  width:
    min(
      1100px,
      calc(
        100vw -
        44px
      )
    );

  max-width:
    100%;

  max-height:
    92vh;

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    14px;

  background:
    var(
      --mlr-surface
    );

  overflow:
    hidden;

  animation:
    ml-return-modal-enter
    170ms
    ease-out
    both;
}

.ml-return-photo-viewer
header {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  min-height:
    56px;

  padding:
    9px
    12px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface-2
    );
}

.ml-return-photo-viewer
header
> span {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;
}

.ml-return-photo-viewer
> div {
  display:
    grid;

  place-items:
    center;

  min-width:
    0;

  min-height:
    0;

  padding:
    12px;

  background:
    #050505;

  overflow:
    hidden;
}

.ml-return-photo-viewer
img {
  width:
    auto;

  height:
    auto;

  max-width:
    100%;

  max-height:
    calc(
      92vh -
      80px
    );

  object-fit:
    contain;
}


/* =========================================================
   46 · DARK SELECT
   ========================================================= */

html[data-theme="dark"]
.ml-return-page
select,
body.dark
.ml-return-page
select,
body[data-theme="dark"]
.ml-return-page
select,
html[data-theme="dark"]
.ml-return-modal
select,
body.dark
.ml-return-modal
select,
body[data-theme="dark"]
.ml-return-modal
select {
  color-scheme:
    dark;
}

html[data-theme="dark"]
.ml-return-page
option,
body.dark
.ml-return-page
option,
body[data-theme="dark"]
.ml-return-page
option,
html[data-theme="dark"]
.ml-return-modal
option,
body.dark
.ml-return-modal
option,
body[data-theme="dark"]
.ml-return-modal
option {
  background:
    #111111;

  color:
    #ffffff;
}


/* =========================================================
   47 · PREVENCIÓN DE DESBORDE
   ========================================================= */

.ml-return-page,
.ml-return-page
> *,
.ml-return-workspace,
.ml-return-workspace
> *,
.ml-return-workspace__grid,
.ml-return-workspace__main,
.ml-return-workspace__side,
.ml-return-panel,
.ml-return-items,
.ml-return-photo-grid,
.ml-return-recent,
.ml-return-recent-list,
.ml-return-search-panel,
.ml-return-info-grid,
.ml-return-metrics {
  max-width:
    100%;
}

.ml-return-page
input,
.ml-return-page
select,
.ml-return-page
textarea,
.ml-return-page
button,
.ml-return-modal
input,
.ml-return-modal
select,
.ml-return-modal
textarea,
.ml-return-modal
button {
  max-width:
    100%;
}


/* =========================================================
   48 · DESKTOP MEDIO
   ========================================================= */

@media (
  max-width:
  1500px
) {
  .ml-return-metrics {
    grid-template-columns:
      repeat(
        3,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-metric:nth-child(
    3n
  ) {
    border-right:
      0;
  }

  .ml-return-metric:nth-child(
    -n + 3
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-info-grid {
    grid-template-columns:
      repeat(
        3,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-info-grid
  article:nth-child(
    3n
  ) {
    border-right:
      0;
  }

  .ml-return-info-grid
  article:nth-child(
    -n + 3
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-condition-grid {
    grid-template-columns:
      repeat(
        3,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-condition-option:nth-child(
    3n
  ) {
    border-right:
      0;
  }

  .ml-return-condition-option:nth-child(
    -n + 3
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-photo-grid {
    grid-template-columns:
      repeat(
        3,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-upload {
    grid-template-columns:
      minmax(
        220px,
        1fr
      )
      minmax(
        125px,
        150px
      );
  }

  .ml-return-upload
  > input[type="text"] {
    grid-column:
      1;
  }

  .ml-return-upload
  > .ml-return-primary-button {
    grid-column:
      2;
  }
}


/* =========================================================
   49 · NOTEBOOK
   ========================================================= */

@media (
  max-width:
  1250px
) {
  .ml-return-search-panel {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-workspace__grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-actions {
    position:
      static;
  }

  .ml-return-actions__buttons {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-item {
    grid-template-columns:
      minmax(
        0,
        1fr
      )
      70px
      70px
      minmax(
        110px,
        auto
      )
      36px;
  }

  .ml-return-recent-row {
    grid-template-columns:
      minmax(
        180px,
        1fr
      )
      max-content
      max-content
      minmax(
        100px,
        160px
      )
      16px;
  }
}


/* =========================================================
   50 · TABLET
   ========================================================= */

@media (
  max-width:
  1024px
) {
  .ml-return-header {
    grid-template-columns:
      minmax(
        0,
        1fr
      );

    gap:
      13px;
  }

  .ml-return-header__actions {
    justify-content:
      flex-start;
  }

  .ml-return-metrics {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-metric,
  .ml-return-metric:nth-child(
    3n
  ) {
    border-right:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-metric:nth-child(
    2n
  ) {
    border-right:
      0;
  }

  .ml-return-metric:nth-child(
    -n + 4
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-info-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-info-grid
  article,
  .ml-return-info-grid
  article:nth-child(
    3n
  ) {
    border-right:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-info-grid
  article:nth-child(
    2n
  ) {
    border-right:
      0;
  }

  .ml-return-info-grid
  article:nth-child(
    -n + 4
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-condition-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-condition-option,
  .ml-return-condition-option:nth-child(
    3n
  ) {
    border-right:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-condition-option:nth-child(
    2n
  ) {
    border-right:
      0;
  }

  .ml-return-condition-option:nth-child(
    -n + 4
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-condition-option:last-child {
    border-right:
      0;
  }

  .ml-return-photo-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-recent-row {
    grid-template-columns:
      minmax(
        0,
        1fr
      )
      max-content
      max-content;

    gap:
      6px
      9px;
  }

  .ml-return-recent-row__number {
    grid-column:
      1;

    grid-row:
      1 / span 2;
  }

  .ml-return-recent-row
  .ml-return-status {
    grid-column:
      2;

    grid-row:
      1;
  }

  .ml-return-recent-row
  .ml-return-condition {
    grid-column:
      3;

    grid-row:
      1;
  }

  .ml-return-recent-row__operator {
    grid-column:
      2 / 4;

    grid-row:
      2;
  }

  .ml-return-recent-row__arrow {
    display:
      none;
  }

  .ml-return-summary__grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-summary__grid
  article:nth-child(
    3n
  ) {
    border-right:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-summary__grid
  article:nth-child(
    2n
  ) {
    border-right:
      0;
  }

  .ml-return-summary__grid
  article:nth-last-child(
    -n + 3
  ) {
    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-summary__grid
  article:nth-last-child(
    -n + 2
  ) {
    border-bottom:
      0;
  }
}


/* =========================================================
   51 · TABLET PORTRAIT
   ========================================================= */

@media (
  max-width:
  820px
) {
  .ml-return-page {
    gap:
      10px;
  }

  .ml-return-header {
    min-height:
      0;

    padding:
      14px;
  }

  .ml-return-header__identity {
    grid-template-columns:
      41px
      minmax(
        0,
        1fr
      );

    gap:
      10px;
  }

  .ml-return-header__icon {
    width:
      41px;

    height:
      41px;
  }

  .ml-return-header__identity
  h1 {
    font-size:
      24px;
  }

  .ml-return-header__identity
  p {
    font-size:
      11px;
  }

  .ml-return-search {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-search__field {
    grid-column:
      1 / -1;
  }

  .ml-return-search
  .ml-return-primary-button,
  .ml-return-search
  .ml-return-secondary-button {
    width:
      100%;
  }

  .ml-return-selected-head {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-selected-head__meta {
    justify-content:
      flex-start;
  }

  .ml-return-item {
    grid-template-columns:
      minmax(
        0,
        1fr
      )
      minmax(
        110px,
        auto
      )
      36px;
  }

  .ml-return-item__quantity {
    display:
      none;
  }

  .ml-return-upload {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-upload
  > input[type="text"],
  .ml-return-upload
  > .ml-return-primary-button {
    grid-column:
      1;
  }

  .ml-return-form-grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-check-grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-summary-photos {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }
}


/* =========================================================
   52 · MOBILE
   ========================================================= */

@media (
  max-width:
  640px
) {
  .ml-return-page {
    gap:
      8px;

    font-size:
      13px;
  }

  .ml-return-header {
    gap:
      11px;

    padding:
      12px;

    border-radius:
      11px;
  }

  .ml-return-header::before {
    width:
      3px;
  }

  .ml-return-header__identity {
    grid-template-columns:
      38px
      minmax(
        0,
        1fr
      );

    gap:
      9px;
  }

  .ml-return-header__icon {
    width:
      38px;

    height:
      38px;

    border-radius:
      8px;
  }

  .ml-return-header__icon
  .icon {
    width:
      18px;

    height:
      18px;
  }

  .ml-return-eyebrow {
    font-size:
      8px;
  }

  .ml-return-header__identity
  h1 {
    font-size:
      21px;
  }

  .ml-return-header__identity
  p {
    font-size:
      10px;
  }

  .ml-return-header__actions {
    display:
      grid;

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

    width:
      100%;
  }

  .ml-return-header__actions
  button {
    width:
      100%;
  }

  .ml-return-metrics {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-metric {
    grid-template-columns:
      35px
      minmax(
        0,
        1fr
      );

    gap:
      8px;

    min-height:
      70px;

    padding:
      9px;
  }

  .ml-return-metric__icon {
    width:
      35px;

    height:
      35px;
  }

  .ml-return-metric__body
  span {
    font-size:
      8px;

    white-space:
      normal;
  }

  .ml-return-metric__body
  strong {
    font-size:
      20px;
  }

  .ml-return-search-panel {
    gap:
      11px;

    padding:
      12px;
  }

  .ml-return-search-panel__head
  h2 {
    font-size:
      15px;
  }

  .ml-return-search {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-search__field,
  .ml-return-search
  .ml-return-primary-button,
  .ml-return-search
  .ml-return-secondary-button {
    grid-column:
      1;

    width:
      100%;
  }

  .ml-return-info-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-info-grid
  article {
    min-height:
      63px;
  }

  .ml-return-info-grid
  strong {
    white-space:
      normal;
  }

  .ml-return-panel__head {
    min-height:
      58px;

    padding:
      10px
      11px;
  }

  .ml-return-panel__head
  h3 {
    font-size:
      13px;
  }

  .ml-return-panel__head
  p {
    font-size:
      9px;
  }

  .ml-return-condition-grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-condition-option,
  .ml-return-condition-option:nth-child(
    2n
  ),
  .ml-return-condition-option:nth-child(
    3n
  ) {
    min-height:
      66px;

    border-right:
      0;

    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-condition-option:last-child {
    border-bottom:
      0;
  }

  .ml-return-item {
    grid-template-columns:
      minmax(
        0,
        1fr
      )
      36px;

    gap:
      7px;
  }

  .ml-return-item
  .ml-return-condition {
    grid-column:
      1;

    justify-self:
      start;
  }

  .ml-return-item
  .ml-return-icon-button {
    grid-column:
      2;

    grid-row:
      1 / span 2;
  }

  .ml-return-photo-grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-actions__buttons {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-recent-row {
    grid-template-columns:
      minmax(
        0,
        1fr
      )
      max-content;

    gap:
      6px;

    min-height:
      66px;

    padding:
      9px
      10px;
  }

  .ml-return-recent-row__number {
    grid-column:
      1;

    grid-row:
      1 / span 2;
  }

  .ml-return-recent-row
  .ml-return-status {
    grid-column:
      2;

    grid-row:
      1;

    justify-self:
      end;
  }

  .ml-return-recent-row
  .ml-return-condition {
    grid-column:
      2;

    grid-row:
      2;

    justify-self:
      end;
  }

  .ml-return-recent-row__operator,
  .ml-return-recent-row__arrow {
    display:
      none;
  }

  .ml-return-summary__grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-summary__grid
  article,
  .ml-return-summary__grid
  article:nth-child(
    2n
  ),
  .ml-return-summary__grid
  article:nth-child(
    3n
  ),
  .ml-return-summary__grid
  article:nth-last-child(
    -n + 2
  ),
  .ml-return-summary__grid
  article:nth-last-child(
    -n + 3
  ) {
    border-right:
      0;

    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-summary__grid
  article:last-child {
    border-bottom:
      0;
  }

  .ml-return-summary-items
  article {
    grid-template-columns:
      minmax(
        0,
        1fr
      )
      auto;
  }

  .ml-return-summary-items
  .ml-return-condition {
    grid-column:
      1 / -1;

    justify-self:
      start;
  }

  .ml-return-inventory-result {
    grid-template-columns:
      32px
      minmax(
        0,
        1fr
      )
      auto;
  }

  .ml-return-inventory-result__icon {
    width:
      32px;

    height:
      32px;
  }

  .ml-return-inventory-result__arrow {
    display:
      none;
  }

  .ml-return-modal-backdrop {
    place-items:
      end
      center;

    padding:
      0;
  }

  .ml-return-modal,
  .ml-return-modal--summary,
  .ml-return-modal--new-return,
  .ml-return-modal--item {
    width:
      100%;

    max-width:
      100%;

    max-height:
      94dvh;

    border-right:
      0;

    border-bottom:
      0;

    border-left:
      0;

    border-radius:
      14px
      14px
      0
      0;
  }

  .ml-return-modal__head {
    min-height:
      58px;

    padding:
      10px
      12px;
  }

  .ml-return-modal__body {
    padding:
      12px;
  }

  .ml-return-modal__footer {
    width:
      calc(
        100% +
        24px
      );

    margin:
      2px
      -12px
      -12px;

    padding:
      9px
      12px;
  }

  .ml-return-modal__footer {
    align-items:
      stretch;

    flex-direction:
      column;
  }

  .ml-return-modal__footer
  > div {
    display:
      grid;

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

    width:
      100%;
  }

  .ml-return-modal__footer
  button {
    width:
      100%;
  }

  .ml-return-modal-backdrop--photo {
    place-items:
      center;

    padding:
      8px;
  }

  .ml-return-photo-viewer {
    width:
      100%;

    max-height:
      96dvh;

    border-radius:
      10px;
  }
}


/* =========================================================
   53 · MOBILE PEQUEÑO
   ========================================================= */

@media (
  max-width:
  440px
) {
  .ml-return-header__identity {
    grid-template-columns:
      35px
      minmax(
        0,
        1fr
      );
  }

  .ml-return-header__icon {
    width:
      35px;

    height:
      35px;
  }

  .ml-return-header__identity
  h1 {
    font-size:
      19px;
  }

  .ml-return-header__identity
  p {
    font-size:
      9px;
  }

  .ml-return-header__actions {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-metrics {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-metric,
  .ml-return-metric:nth-child(
    2n
  ),
  .ml-return-metric:nth-child(
    3n
  ) {
    border-right:
      0;

    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-metric:last-child {
    border-bottom:
      0;
  }

  .ml-return-info-grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-info-grid
  article,
  .ml-return-info-grid
  article:nth-child(
    2n
  ),
  .ml-return-info-grid
  article:nth-child(
    3n
  ) {
    border-right:
      0;

    border-bottom:
      1px
      solid
      var(
        --mlr-border-strong
      );
  }

  .ml-return-info-grid
  article:last-child {
    border-bottom:
      0;
  }

  .ml-return-selected-head {
    padding:
      11px;
  }

  .ml-return-selected-head__main {
    grid-template-columns:
      36px
      minmax(
        0,
        1fr
      );

    gap:
      8px;
  }

  .ml-return-selected-head__icon {
    width:
      36px;

    height:
      36px;
  }

  .ml-return-selected-head__main
  h2 {
    font-size:
      17px;
  }

  .ml-return-selected-head__meta {
    display:
      grid;

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

    width:
      100%;
  }

  .ml-return-selected-head__meta
  .ml-return-status,
  .ml-return-selected-head__meta
  .ml-return-condition {
    width:
      100%;
  }

  .ml-return-selected-head__meta
  .ml-return-icon-button {
    width:
      100%;

    height:
      35px;
  }

  .ml-return-panel__head {
    align-items:
      flex-start;

    flex-wrap:
      wrap;
  }

  .ml-return-panel__head
  .ml-return-secondary-button {
    width:
      100%;
  }

  .ml-return-summary-photos {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-recent-row {
    grid-template-columns:
      minmax(
        0,
        1fr
      );

    gap:
      6px;

    padding:
      10px;
  }

  .ml-return-recent-row__number,
  .ml-return-recent-row
  .ml-return-status,
  .ml-return-recent-row
  .ml-return-condition {
    grid-column:
      1;

    grid-row:
      auto;

    justify-self:
      start;
  }

  .ml-return-recent-row
  .ml-return-status,
  .ml-return-recent-row
  .ml-return-condition {
    width:
      auto;
  }

  .ml-return-inventory-result {
    grid-template-columns:
      30px
      minmax(
        0,
        1fr
      );
  }

  .ml-return-inventory-result__stock {
    grid-column:
      2;

    justify-items:
      start;

    grid-template-columns:
      auto
      auto;

    align-items:
      center;

    gap:
      5px;
  }

  .ml-return-inventory-result__stock
  small {
    margin:
      0;
  }
}


/* =========================================================
   54 · REDUCED MOTION
   ========================================================= */

@media (
  prefers-reduced-motion:
  reduce
) {
  .ml-return-page *,
  .ml-return-page *::before,
  .ml-return-page *::after,
  .ml-return-modal *,
  .ml-return-modal *::before,
  .ml-return-modal *::after,
  .ml-return-photo-viewer *,
  .ml-return-photo-viewer *::before,
  .ml-return-photo-viewer *::after {
    animation-duration:
      0.01ms !important;

    animation-iteration-count:
      1 !important;

    transition-duration:
      0.01ms !important;

    scroll-behavior:
      auto !important;
  }
}


/* =========================================================
   55 · PRINT
   ========================================================= */

@media print {
  .ml-return-header__actions,
  .ml-return-search-panel,
  .ml-return-actions,
  .ml-return-icon-button,
  .ml-return-primary-button,
  .ml-return-secondary-button,
  .ml-return-upload {
    display:
      none !important;
  }

  .ml-return-page {
    color:
      #000000;

    background:
      #ffffff;
  }

  .ml-return-header,
  .ml-return-panel,
  .ml-return-selected-head,
  .ml-return-recent,
  .ml-return-info-grid,
  .ml-return-metrics {
    border-color:
      #bcbcbc;

    background:
      #ffffff;

    break-inside:
      avoid;
  }
}


/* =========================================================
   FIN
   DEVOLUCIONES.CSS
   ========================================================= *//* =========================================================
   AGREGAR AL FINAL DE:
   frontend/src/pages/mercado-libre/devoluciones/
   devoluciones.css

   DEVOLUCIONES · BÚSQUEDA DE VENTA ML
   ========================================================= */


/* =========================================================
   56 · BUSCADOR DE VENTA ML
   ========================================================= */

.ml-return-sale-search {
  display:
    grid;

  gap:
    10px;

  width:
    100%;

  min-width:
    0;

  padding:
    12px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    10px;

  background:
    var(
      --mlr-surface-2
    );
}


.ml-return-sale-search__head {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    14px;

  min-width:
    0;

  padding-bottom:
    9px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );
}


.ml-return-sale-search__head
> div {
  display:
    grid;

  min-width:
    0;
}


.ml-return-sale-search__head
> div
> span {
  display:
    block;

  margin:
    0
    0
    2px;

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

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.07em;

  text-transform:
    uppercase;
}


.ml-return-sale-search__head
> div
> strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    13px;

  font-weight:
    850;

  line-height:
    1.3;
}


.ml-return-sale-search__head
> div
> small {
  margin-top:
    3px;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    9px;

  font-weight:
    650;

  line-height:
    1.4;
}


.ml-return-sale-search__head
> .icon {
  flex:
    0
    0
    auto;

  width:
    19px;

  height:
    19px;

  color:
    var(
      --mlr-text-strong
    );
}


/* =========================================================
   57 · FILA DE BÚSQUEDA DE VENTA
   ========================================================= */

.ml-return-sale-search__row {
  display:
    grid;

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

  align-items:
    end;

  gap:
    8px;

  width:
    100%;

  min-width:
    0;
}


.ml-return-sale-search__row
.ml-return-secondary-button {
  min-height:
    42px;

  height:
    42px;
}


/* =========================================================
   58 · ACCIONES DE VENTA
   ========================================================= */

.ml-return-sale-search__actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-start;

  flex-wrap:
    wrap;

  gap:
    7px;

  min-width:
    0;
}


.ml-return-sale-search__actions
.ml-return-secondary-button {
  min-height:
    34px;

  padding:
    0
    11px;

  font-size:
    10px;
}


.ml-return-secondary-button.is-active {
  border-color:
    var(
      --mlr-text-strong
    );

  background:
    var(
      --mlr-text-strong
    );

  color:
    var(
      --mlr-surface
    );
}


.ml-return-secondary-button.is-active:hover:not(:disabled) {
  border-color:
    var(
      --mlr-text-strong
    );

  background:
    var(
      --mlr-text-strong
    );

  color:
    var(
      --mlr-surface
    );

  opacity:
    0.9;
}


/* =========================================================
   59 · VENTA ENCONTRADA
   ========================================================= */

.ml-return-sale-found {
  display:
    grid;

  gap:
    10px;

  width:
    100%;

  min-width:
    0;

  padding:
    10px;

  border:
    1px
    solid
    var(
      --mlr-success-border
    );

  border-radius:
    9px;

  background:
    var(
      --mlr-success-bg
    );
}


.ml-return-sale-found__head {
  display:
    grid;

  grid-template-columns:
    34px
    minmax(
      0,
      1fr
    );

  align-items:
    center;

  gap:
    9px;

  min-width:
    0;
}


.ml-return-sale-found__icon {
  display:
    grid;

  place-items:
    center;

  width:
    34px;

  height:
    34px;

  border:
    1px
    solid
    var(
      --mlr-success-border
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  color:
    var(
      --mlr-success
    );
}


.ml-return-sale-found__icon
.icon {
  width:
    16px;

  height:
    16px;
}


.ml-return-sale-found__head
> div {
  display:
    grid;

  min-width:
    0;
}


.ml-return-sale-found__head
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    11px;

  font-weight:
    850;

  line-height:
    1.3;
}


.ml-return-sale-found__head
small {
  margin-top:
    2px;

  color:
    var(
      --mlr-text-secondary
    );

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.35;
}


/* =========================================================
   60 · DATOS DE VENTA ENCONTRADA
   ========================================================= */

.ml-return-sale-found__grid {
  display:
    grid;

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

  min-width:
    0;

  border:
    1px
    solid
    var(
      --mlr-success-border
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-success-border
    );

  overflow:
    hidden;
}


.ml-return-sale-found__grid
article {
  display:
    grid;

  align-content:
    center;

  gap:
    3px;

  min-width:
    0;

  min-height:
    56px;

  padding:
    8px
    9px;

  border-right:
    1px
    solid
    var(
      --mlr-success-border
    );

  border-bottom:
    1px
    solid
    var(
      --mlr-success-border
    );

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


.ml-return-sale-found__grid
article:nth-child(
  3n
) {
  border-right:
    0;
}


.ml-return-sale-found__grid
article:nth-last-child(
  -n + 3
) {
  border-bottom:
    0;
}


.ml-return-sale-found__grid
span {
  overflow:
    hidden;

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

  font-size:
    7px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.04em;

  text-overflow:
    ellipsis;

  text-transform:
    uppercase;

  white-space:
    nowrap;
}


.ml-return-sale-found__grid
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.35;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   61 · PRODUCTOS DE LA VENTA
   ========================================================= */

.ml-return-sale-products {
  display:
    grid;

  gap:
    8px;

  min-width:
    0;

  padding-top:
    2px;
}


.ml-return-sale-products__head {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  min-width:
    0;
}


.ml-return-sale-products__head
> div {
  display:
    grid;

  min-width:
    0;
}


.ml-return-sale-products__head
span {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    7px;

  font-weight:
    850;

  line-height:
    1.2;

  letter-spacing:
    0.06em;

  text-transform:
    uppercase;
}


.ml-return-sale-products__head
strong {
  margin-top:
    2px;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;
}


.ml-return-sale-products__head
> .icon {
  width:
    16px;

  height:
    16px;

  color:
    var(
      --mlr-success
    );
}


/* =========================================================
   62 · LISTA DE PRODUCTOS DE LA VENTA
   ========================================================= */

.ml-return-sale-products__list {
  display:
    grid;

  min-width:
    0;

  max-height:
    220px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface
    );

  overflow-x:
    hidden;

  overflow-y:
    auto;

  scrollbar-width:
    thin;

  scrollbar-color:
    var(
      --mlr-border-strong
    )
    transparent;
}


.ml-return-sale-product {
  display:
    grid;

  grid-template-columns:
    34px
    minmax(
      0,
      1fr
    )
    auto;

  align-items:
    center;

  gap:
    9px;

  min-width:
    0;

  min-height:
    52px;

  padding:
    7px
    9px;

  border-bottom:
    1px
    solid
    var(
      --mlr-border-strong
    );

  background:
    var(
      --mlr-surface
    );

  transition:
    background
    var(
      --mlr-transition-fast
    );
}


.ml-return-sale-product:last-child {
  border-bottom:
    0;
}


.ml-return-sale-product:hover {
  background:
    var(
      --mlr-surface-2
    );
}


.ml-return-sale-product__icon {
  display:
    grid;

  place-items:
    center;

  width:
    34px;

  height:
    34px;

  border:
    1px
    solid
    var(
      --mlr-border-strong
    );

  border-radius:
    8px;

  background:
    var(
      --mlr-surface-3
    );

  color:
    var(
      --mlr-text-strong
    );
}


.ml-return-sale-product__icon
.icon {
  width:
    15px;

  height:
    15px;
}


.ml-return-sale-product__body {
  display:
    grid;

  min-width:
    0;
}


.ml-return-sale-product__body
strong {
  overflow:
    hidden;

  color:
    var(
      --mlr-text-strong
    );

  font-size:
    10px;

  font-weight:
    800;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.ml-return-sale-product__body
small {
  overflow:
    hidden;

  margin-top:
    2px;

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

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.ml-return-sale-product__quantity {
  display:
    grid;

  justify-items:
    end;

  gap:
    1px;

  min-width:
    42px;
}


.ml-return-sale-product__quantity
span {
  color:
    var(
      --mlr-text-muted
    );

  font-size:
    7px;

  font-weight:
    800;

  text-transform:
    uppercase;
}


.ml-return-sale-product__quantity
strong {
  color:
    var(
      --mlr-text-strong
    );

  font-size:
    13px;

  font-weight:
    850;

  font-variant-numeric:
    tabular-nums;
}


/* =========================================================
   63 · CAMPOS AUTOCOMPLETADOS
   ========================================================= */

.ml-return-modal
.ml-return-form-field
input[readonly] {
  border-color:
    var(
      --mlr-success-border
    );

  background:
    var(
      --mlr-success-bg
    );

  color:
    var(
      --mlr-text-strong
    );

  cursor:
    default;
}


.ml-return-modal
.ml-return-form-field
input[readonly]:focus {
  border-color:
    var(
      --mlr-success-border
    );

  background:
    var(
      --mlr-success-bg
    );
}


/* =========================================================
   64 · NUEVA DEVOLUCIÓN MÁS AMPLIA
   ========================================================= */

.ml-return-modal--new-return {
  width:
    min(
      780px,
      calc(
        100vw -
        44px
      )
    );
}


/* =========================================================
   65 · DARK · VENTA ENCONTRADA
   ========================================================= */

html[data-theme="dark"]
.ml-return-sale-found,
body.dark
.ml-return-sale-found,
body[data-theme="dark"]
.ml-return-sale-found {
  background:
    #0b1710;

  border-color:
    #28523a;
}


html[data-theme="dark"]
.ml-return-sale-found__grid,
body.dark
.ml-return-sale-found__grid,
body[data-theme="dark"]
.ml-return-sale-found__grid {
  background:
    #28523a;

  border-color:
    #28523a;
}


html[data-theme="dark"]
.ml-return-sale-found__grid
article,
body.dark
.ml-return-sale-found__grid
article,
body[data-theme="dark"]
.ml-return-sale-found__grid
article {
  border-color:
    #28523a;

  background:
    #0c0c0c;
}


html[data-theme="dark"]
.ml-return-modal
.ml-return-form-field
input[readonly],
body.dark
.ml-return-modal
.ml-return-form-field
input[readonly],
body[data-theme="dark"]
.ml-return-modal
.ml-return-form-field
input[readonly] {
  border-color:
    #28523a;

  background:
    #0b1710;

  color:
    #ffffff;
}


/* =========================================================
   66 · RESPONSIVE · TABLET
   ========================================================= */

@media (
  max-width:
  820px
) {
  .ml-return-sale-found__grid {
    grid-template-columns:
      repeat(
        2,
        minmax(
          0,
          1fr
        )
      );
  }

  .ml-return-sale-found__grid
  article,
  .ml-return-sale-found__grid
  article:nth-child(
    3n
  ) {
    border-right:
      1px
      solid
      var(
        --mlr-success-border
      );

    border-bottom:
      1px
      solid
      var(
        --mlr-success-border
      );
  }

  .ml-return-sale-found__grid
  article:nth-child(
    2n
  ) {
    border-right:
      0;
  }

  .ml-return-sale-found__grid
  article:nth-last-child(
    -n + 2
  ) {
    border-bottom:
      0;
  }

  .ml-return-sale-search__row {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-sale-search__row
  .ml-return-secondary-button {
    width:
      100%;
  }
}


/* =========================================================
   67 · RESPONSIVE · MOBILE
   ========================================================= */

@media (
  max-width:
  640px
) {
  .ml-return-sale-search {
    gap:
      9px;

    padding:
      10px;
  }

  .ml-return-sale-search__head {
    align-items:
      flex-start;
  }

  .ml-return-sale-search__head
  > div
  > strong {
    font-size:
      12px;
  }

  .ml-return-sale-search__actions {
    display:
      grid;

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

    width:
      100%;
  }

  .ml-return-sale-search__actions
  .ml-return-secondary-button {
    width:
      100%;
  }

  .ml-return-sale-found__grid {
    grid-template-columns:
      minmax(
        0,
        1fr
      );
  }

  .ml-return-sale-found__grid
  article,
  .ml-return-sale-found__grid
  article:nth-child(
    2n
  ),
  .ml-return-sale-found__grid
  article:nth-child(
    3n
  ),
  .ml-return-sale-found__grid
  article:nth-last-child(
    -n + 2
  ),
  .ml-return-sale-found__grid
  article:nth-last-child(
    -n + 3
  ) {
    border-right:
      0;

    border-bottom:
      1px
      solid
      var(
        --mlr-success-border
      );
  }

  .ml-return-sale-found__grid
  article:last-child {
    border-bottom:
      0;
  }

  .ml-return-sale-found__grid
  strong {
    white-space:
      normal;

    overflow-wrap:
      anywhere;
  }

  .ml-return-sale-product {
    grid-template-columns:
      32px
      minmax(
        0,
        1fr
      )
      auto;

    gap:
      7px;

    padding:
      7px;
  }

  .ml-return-sale-product__icon {
    width:
      32px;

    height:
      32px;
  }

  .ml-return-sale-product__body
  strong {
    white-space:
      normal;

    display:
      -webkit-box;

    -webkit-box-orient:
      vertical;

    -webkit-line-clamp:
      2;
  }

  .ml-return-modal--new-return {
    width:
      100%;

    max-width:
      100%;
  }
}


/* =========================================================
   68 · RESPONSIVE · MOBILE PEQUEÑO
   ========================================================= */

@media (
  max-width:
  440px
) {
  .ml-return-sale-found {
    padding:
      9px;
  }

  .ml-return-sale-found__head {
    grid-template-columns:
      32px
      minmax(
        0,
        1fr
      );
  }

  .ml-return-sale-found__icon {
    width:
      32px;

    height:
      32px;
  }

  .ml-return-sale-product {
    grid-template-columns:
      30px
      minmax(
        0,
        1fr
      );
  }

  .ml-return-sale-product__quantity {
    grid-column:
      2;

    grid-template-columns:
      auto
      auto;

    justify-content:
      start;

    justify-items:
      start;

    align-items:
      center;

    gap:
      5px;
  }

  .ml-return-sale-product__quantity
  span {
    margin:
      0;
  }
}


/* =========================================================
   69 · PREVENIR DESBORDES NUEVOS
   ========================================================= */

.ml-return-sale-search,
.ml-return-sale-search__head,
.ml-return-sale-search__row,
.ml-return-sale-search__actions,
.ml-return-sale-found,
.ml-return-sale-found__grid,
.ml-return-sale-products,
.ml-return-sale-products__list,
.ml-return-sale-product,
.ml-return-sale-product__body {
  max-width:
    100%;

  min-width:
    0;
}