/* =========================================================
   NAI HUB · LIBROS
   NEURO APRENDIZAJE INFANTIL

   UBICACIÓN:
   frontend/src/pages/libros/libros.css

   PARTE 1 DE 4

   ESTILO:
   - MISMA LÍNEA QUE USUARIOS / CONFIGURACIÓN / STOCK
   - PREMIUM
   - COMPACTO
   - ELEGANTE
   - TEXTO NEGRO / BLANCO
   - LETRAS MARCADAS
   - SIN GLOW
   - ANIMACIONES RÁPIDAS
   - RESPONSIVE
   - SIN SCROLL HORIZONTAL
   - STOCK INTEGRADO
   - DESCARGA MASIVA
   ========================================================= */


/* =========================================================
   TOKENS
   ========================================================= */

#librosPage,
.libros-page {
  --lb-bg:
    #f5f6f8;

  --lb-surface:
    #ffffff;

  --lb-surface-soft:
    #f7f8fa;

  --lb-surface-hover:
    #f0f2f5;

  --lb-border:
    #d5dae2;

  --lb-border-strong:
    #b6bdc8;

  --lb-text:
    #050505;

  --lb-text-soft:
    #252525;

  --lb-violet:
    #6253a2;

  --lb-violet-soft:
    rgba(98, 83, 162, .08);

  --lb-blue:
    #31476f;

  --lb-success:
    #115d39;

  --lb-success-bg:
    #eaf7ef;

  --lb-success-border:
    #b8ddc8;

  --lb-warning:
    #704500;

  --lb-warning-bg:
    #fff5da;

  --lb-warning-border:
    #e8ce8b;

  --lb-danger:
    #8d1c1c;

  --lb-danger-bg:
    #fff0ef;

  --lb-danger-border:
    #efb3ae;

  --lb-info:
    #31517a;

  --lb-info-bg:
    #edf4fb;

  --lb-info-border:
    #c8d8eb;

  --lb-radius:
    14px;

  --lb-radius-sm:
    9px;

  --lb-transition:
    150ms cubic-bezier(.2, .8, .2, 1);

  width:
    100% !important;

  max-width:
    none !important;

  min-width:
    0 !important;

  margin:
    0 !important;

  padding:
    18px !important;

  overflow-x:
    clip !important;

  overflow-y:
    visible !important;

  box-sizing:
    border-box !important;

  color:
    var(--lb-text) !important;

  background:
    transparent;
}


/* =========================================================
   BOX SIZING
   ========================================================= */

#librosPage *,
#librosPage *::before,
#librosPage *::after,
.libros-page *,
.libros-page *::before,
.libros-page *::after {
  box-sizing:
    border-box;
}


/* =========================================================
   HEADER
   ========================================================= */

#librosPage .libros-page__header {
  width:
    100%;

  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    18px;

  margin-bottom:
    14px;
}


/* =========================================================
   TITLE
   ========================================================= */

#librosPage .libros-page__title {
  min-width:
    0;
}


#librosPage .libros-page__overline {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    6px;

  margin-bottom:
    4px;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1;

  letter-spacing:
    .14em;

  text-transform:
    uppercase;
}


#librosPage .libros-page__overline-dot {
  width:
    5px;

  height:
    5px;

  flex:
    0 0 5px;

  border-radius:
    50%;

  background:
    var(--lb-violet);
}


#librosPage .libros-page__title h1 {
  margin:
    0;

  color:
    #050505;

  font-size:
    27px;

  font-weight:
    900;

  line-height:
    1.05;

  letter-spacing:
    -.045em;
}


#librosPage .libros-page__title p {
  max-width:
    760px;

  margin:
    6px 0 0;

  color:
    #050505;

  font-size:
    11.5px;

  font-weight:
    700;

  line-height:
    1.4;
}


/* =========================================================
   HEADER ACTIONS
   ========================================================= */

#librosPage .libros-page__actions {
  flex:
    0 0 auto;

  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    8px;

  flex-wrap:
    wrap;
}


/* =========================================================
   BUTTONS
   ========================================================= */

#librosPage .libros-btn,
.libros-modal .libros-btn {
  min-height:
    35px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  padding:
    0 12px;

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

  border-radius:
    9px;

  background:
    #ffffff;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    9.5px;

  font-weight:
    800;

  line-height:
    1;

  white-space:
    nowrap;

  cursor:
    pointer;

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


#librosPage .libros-btn svg,
.libros-modal .libros-btn svg {
  width:
    14px;

  height:
    14px;

  flex:
    0 0 14px;

  stroke-width:
    2.2;
}


#librosPage .libros-btn:hover:not(:disabled),
.libros-modal .libros-btn:hover:not(:disabled) {
  border-color:
    var(--lb-border-strong);

  transform:
    translateY(-1px);
}


#librosPage .libros-btn:active:not(:disabled),
.libros-modal .libros-btn:active:not(:disabled) {
  transform:
    scale(.97);
}


#librosPage .libros-btn:disabled,
.libros-modal .libros-btn:disabled {
  cursor:
    not-allowed;

  opacity:
    .42;
}


/* =========================================================
   PRIMARY BUTTON
   ========================================================= */

#librosPage .libros-btn--primary,
.libros-modal .libros-btn--primary {
  border-color:
    #423970;

  background:
    linear-gradient(
      120deg,
      #31476f 0%,
      #51488a 50%,
      #6655a4 100%
    );

  color:
    #ffffff;
}


#librosPage .libros-btn--primary:hover:not(:disabled),
.libros-modal .libros-btn--primary:hover:not(:disabled) {
  border-color:
    #362e61;

  background:
    linear-gradient(
      120deg,
      #2b4168 0%,
      #493f80 50%,
      #5d4d99 100%
    );

  color:
    #ffffff;
}


/* =========================================================
   SECONDARY BUTTON
   ========================================================= */

#librosPage .libros-btn--secondary,
.libros-modal .libros-btn--secondary {
  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


/* =========================================================
   FILTER BUTTON ACTIVE
   ========================================================= */

#librosPage .libros-btn--filters.is-active {
  border-color:
    rgba(98, 83, 162, .40);

  background:
    var(--lb-violet-soft);
}


/* =========================================================
   METRICS
   ========================================================= */

#librosPage .libros-metrics {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  gap:
    9px;

  margin-bottom:
    12px;
}


/* =========================================================
   METRIC
   ========================================================= */

#librosPage .libros-metric {
  position:
    relative;

  min-width:
    0;

  min-height:
    78px;

  display:
    flex;

  align-items:
    center;

  gap:
    10px;

  padding:
    11px;

  overflow:
    hidden;

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

  border-radius:
    12px;

  background:
    var(--lb-surface);

  color:
    #050505;

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


#librosPage .libros-metric::before {
  content:
    "";

  position:
    absolute;

  top:
    0;

  left:
    0;

  width:
    3px;

  height:
    100%;

  background:
    #605297;

  opacity:
    .78;
}


#librosPage .libros-metric:hover {
  border-color:
    var(--lb-border-strong);

  transform:
    translateY(-1px);
}


#librosPage .libros-metric--warning::before {
  background:
    #9a6200;
}


/* =========================================================
   METRIC ICON
   ========================================================= */

#librosPage .libros-metric__icon {
  width:
    34px;

  height:
    34px;

  flex:
    0 0 34px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


#librosPage .libros-metric__icon svg {
  width:
    16px;

  height:
    16px;

  stroke-width:
    2.2;
}


/* =========================================================
   METRIC CONTENT
   ========================================================= */

#librosPage .libros-metric__content {
  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  gap:
    1px;
}


#librosPage .libros-metric__content > span {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    850;

  line-height:
    1.15;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-metric__content > strong {
  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    18px;

  font-weight:
    900;

  line-height:
    1.05;

  letter-spacing:
    -.035em;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-metric__content > small {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    650;

  line-height:
    1.15;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   SKELETON
   ========================================================= */

#librosPage .libros-skeleton {
  position:
    relative;

  overflow:
    hidden;

  border-radius:
    6px;

  background:
    #e8eaf0;
}


#librosPage .libros-skeleton::after {
  content:
    "";

  position:
    absolute;

  inset:
    0;

  transform:
    translateX(-100%);

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255, 255, 255, .85),
      transparent
    );

  animation:
    librosSkeleton
    1.1s
    ease-in-out
    infinite;
}


@keyframes librosSkeleton {
  to {
    transform:
      translateX(100%);
  }
}


#librosPage .libros-skeleton--icon {
  width:
    34px;

  height:
    34px;

  flex:
    0 0 34px;
}


#librosPage .libros-skeleton--label {
  width:
    66px;

  height:
    7px;
}


#librosPage .libros-skeleton--value {
  width:
    50px;

  height:
    17px;

  margin-top:
    4px;
}


#librosPage .libros-skeleton--helper {
  width:
    84px;

  height:
    6px;

  margin-top:
    3px;
}


/* =========================================================
   PANEL
   ========================================================= */

#librosPage .libros-panel {
  width:
    100%;

  min-width:
    0;

  overflow:
    visible;

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

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

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


/* =========================================================
   TOOLBAR
   ========================================================= */

#librosPage .libros-toolbar {
  width:
    100%;

  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  padding:
    10px;

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

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


/* =========================================================
   SEARCH
   ========================================================= */

#librosPage .libros-search {
  position:
    relative;

  min-width:
    260px;

  width:
    min(
      100%,
      500px
    );

  height:
    36px;

  display:
    flex;

  align-items:
    center;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);

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


#librosPage .libros-search:focus-within {
  border-color:
    var(--lb-violet);

  background:
    #ffffff;
}


#librosPage .libros-search > svg {
  width:
    14px;

  height:
    14px;

  flex:
    0 0 14px;

  margin-left:
    11px;

  color:
    #050505;

  stroke-width:
    2.1;
}


#librosPage .libros-search input {
  min-width:
    0;

  flex:
    1;

  height:
    100%;

  padding:
    0 8px;

  border:
    0;

  outline:
    0;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    10.5px;

  font-weight:
    750;
}


#librosPage .libros-search input::placeholder {
  color:
    #050505;

  opacity:
    .68;

  font-weight:
    650;
}


/* =========================================================
   SEARCH CLEAR
   ========================================================= */

#librosPage .libros-search__clear {
  width:
    31px;

  height:
    31px;

  flex:
    0 0 31px;

  display:
    grid;

  place-items:
    center;

  margin-right:
    2px;

  border:
    0;

  border-radius:
    7px;

  background:
    transparent;

  color:
    #050505;

  cursor:
    pointer;

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


#librosPage .libros-search__clear:hover {
  background:
    #e8eaf0;
}


#librosPage .libros-search__clear:active {
  transform:
    scale(.92);
}


#librosPage .libros-search__clear[hidden] {
  display:
    none !important;
}


#librosPage .libros-search__clear svg {
  width:
    13px;

  height:
    13px;

  stroke-width:
    2.3;
}


/* =========================================================
   TOOLBAR FILTERS
   ========================================================= */

#librosPage .libros-toolbar__filters {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    7px;
}


/* =========================================================
   FILTER
   ========================================================= */

#librosPage .libros-filter {
  min-width:
    0;

  height:
    36px;

  display:
    flex;

  align-items:
    center;

  gap:
    6px;

  padding:
    0 8px;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;

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


#librosPage .libros-filter:hover,
#librosPage .libros-filter:focus-within {
  border-color:
    var(--lb-border-strong);

  background:
    #ffffff;
}


#librosPage .libros-filter > svg {
  width:
    13px;

  height:
    13px;

  flex:
    0 0 13px;

  stroke-width:
    2.2;
}


/* =========================================================
   SELECT
   ========================================================= */

#librosPage .libros-select {
  min-width:
    120px;

  max-width:
    175px;

  height:
    100%;

  padding:
    0 18px 0 0;

  border:
    0;

  outline:
    0;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    9px;

  font-weight:
    750;

  cursor:
    pointer;
}


#librosPage .libros-select--small {
  min-width:
    82px;
}


/* =========================================================
   ADVANCED FILTERS
   ========================================================= */

#librosPage .libros-advanced-filters {
  width:
    100%;

  min-width:
    0;

  padding:
    10px;

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

  background:
    var(--lb-surface-soft);

  animation:
    librosFiltersIn
    150ms
    cubic-bezier(.2, .8, .2, 1);
}


#librosPage .libros-advanced-filters[hidden] {
  display:
    none !important;
}


@keyframes librosFiltersIn {

  from {
    opacity:
      0;

    transform:
      translateY(-4px);
  }

  to {
    opacity:
      1;

    transform:
      translateY(0);
  }

}


/* =========================================================
   ADVANCED FILTERS GRID
   ========================================================= */

#librosPage .libros-advanced-filters__grid {
  display:
    grid;

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

  gap:
    8px;
}


/* =========================================================
   FILTER FIELD
   ========================================================= */

#librosPage .libros-filter-field {
  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  gap:
    5px;
}


#librosPage .libros-filter-field__label {
  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  color:
    #050505;
}


#librosPage .libros-filter-field__label svg {
  width:
    11px;

  height:
    11px;

  flex:
    0 0 11px;

  stroke-width:
    2.2;
}


#librosPage .libros-filter-field__label span {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    850;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-filter-field input,
#librosPage .libros-filter-field select {
  width:
    100%;

  min-width:
    0;

  height:
    35px;

  padding:
    0 9px;

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

  border-radius:
    8px;

  outline:
    0;

  background:
    #ffffff;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    9px;

  font-weight:
    750;

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


#librosPage .libros-filter-field input:focus,
#librosPage .libros-filter-field select:focus {
  border-color:
    var(--lb-violet);
}


/* =========================================================
   ADVANCED FOOTER
   ========================================================= */

#librosPage .libros-advanced-filters__footer {
  display:
    flex;

  justify-content:
    flex-end;

  margin-top:
    8px;
}


/* =========================================================
   TABLE AREA
   ========================================================= */

#librosPage .libros-table-area {
  position:
    relative;

  width:
    100%;

  min-width:
    0;

  overflow:
    visible;

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


/* =========================================================
   TABLE WRAP
   ========================================================= */

#librosPage .libros-table-wrap {
  width:
    100%;

  min-width:
    0;

  overflow:
    visible;
}


/* =========================================================
   TABLE
   ========================================================= */

#librosPage .libros-table {
  width:
    100%;

  min-width:
    0;

  table-layout:
    fixed;

  border-collapse:
    separate;

  border-spacing:
    0;

  color:
    #050505;
}


/* =========================================================
   TABLE HEADER
   ========================================================= */

#librosPage .libros-table thead th {
  height:
    38px;

  padding:
    0 7px;

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

  background:
    var(--lb-surface-soft);

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    900;

  line-height:
    1;

  text-align:
    left;

  vertical-align:
    middle;

  white-space:
    nowrap;
}


/* =========================================================
   TABLE WIDTHS
   ========================================================= */

#librosPage .libros-table thead th:nth-child(1) {
  width:
    52px;
}


#librosPage .libros-table thead th:nth-child(2) {
  width:
    9%;
}


#librosPage .libros-table thead th:nth-child(3) {
  width:
    10%;
}


#librosPage .libros-table thead th:nth-child(4) {
  width:
    22%;
}


#librosPage .libros-table thead th:nth-child(5) {
  width:
    12%;
}


#librosPage .libros-table thead th:nth-child(6) {
  width:
    12%;
}


#librosPage .libros-table thead th:nth-child(7) {
  width:
    11%;
}


#librosPage .libros-table thead th:nth-child(8) {
  width:
    9%;
}


#librosPage .libros-table thead th:nth-child(9) {
  width:
    9%;
}


#librosPage .libros-table thead th:nth-child(10) {
  width:
    48px;
}


/* =========================================================
   SORT
   ========================================================= */

#librosPage .libros-sort {
  max-width:
    100%;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    4px;

  padding:
    0;

  border:
    0;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    inherit;

  font-weight:
    900;

  cursor:
    pointer;
}


#librosPage .libros-sort span {
  overflow:
    hidden;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-sort svg {
  width:
    10px;

  height:
    10px;

  flex:
    0 0 10px;

  stroke-width:
    2.4;
}


#librosPage .libros-sort.is-active {
  color:
    var(--lb-violet);
}


/* =========================================================
   TABLE BODY
   ========================================================= */

#librosPage .libros-table tbody tr {
  position:
    relative;

  z-index:
    1;

  transition:
    background var(--lb-transition);
}


#librosPage .libros-table tbody tr:hover {
  background:
    var(--lb-surface-soft);
}


#librosPage .libros-table tbody tr:has(.libros-row-menu) {
  z-index:
    120;
}


#librosPage .libros-table tbody td {
  height:
    58px;

  min-width:
    0;

  padding:
    6px 7px;

  overflow:
    visible;

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

  color:
    #050505;

  font-size:
    9px;

  font-weight:
    700;

  line-height:
    1.25;

  vertical-align:
    middle;
}


#librosPage .libros-table tbody tr:last-child td {
  border-bottom:
    0;
}


/* =========================================================
   COVER BUTTON
   ========================================================= */

#librosPage .libros-cover-button {
  display:
    block;

  padding:
    0;

  border:
    0;

  background:
    transparent;

  cursor:
    pointer;
}


/* =========================================================
   COVER
   ========================================================= */

#librosPage .libros-cover {
  width:
    36px;

  height:
    44px;

  display:
    grid;

  place-items:
    center;

  overflow:
    hidden;

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

  border-radius:
    8px;

  background:
    linear-gradient(
      145deg,
      #eef0f4,
      #ffffff
    );

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    900;

  transition:
    transform var(--lb-transition),
    border-color var(--lb-transition);
}


#librosPage .libros-cover-button:hover
.libros-cover {
  border-color:
    var(--lb-border-strong);

  transform:
    translateY(-1px);
}


#librosPage .libros-cover img {
  width:
    100%;

  height:
    100%;

  display:
    block;

  object-fit:
    cover;

  object-position:
    center;
}


#librosPage .libros-cover span {
  width:
    100%;

  height:
    100%;

  display:
    grid;

  place-items:
    center;
}


/* =========================================================
   CODE
   ========================================================= */

#librosPage .libros-code {
  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  gap:
    2px;
}


#librosPage .libros-code strong {
  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-code small {
  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    650;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   ISBN
   ========================================================= */

#librosPage .libros-isbn {
  display:
    block;

  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    750;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   BOOK CELL
   ========================================================= */

#librosPage .libros-book {
  width:
    100%;

  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

  gap:
    2px;

  padding:
    0;

  border:
    0;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  text-align:
    left;

  cursor:
    pointer;
}


#librosPage .libros-book > strong {
  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9.8px;

  font-weight:
    900;

  line-height:
    1.18;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-book > small {
  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    650;

  line-height:
    1.15;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   MINI BADGES
   ========================================================= */

#librosPage .libros-book__badges {
  display:
    flex;

  align-items:
    center;

  gap:
    4px;

  margin-top:
    2px;

  flex-wrap:
    wrap;
}


#librosPage .libros-mini-badge {
  min-height:
    17px;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    3px;

  padding:
    0 5px;

  border:
    1px solid rgba(98, 83, 162, .22);

  border-radius:
    999px;

  background:
    var(--lb-violet-soft);

  color:
    #050505;

  font-size:
    6.5px;

  font-weight:
    850;

  line-height:
    1;

  white-space:
    nowrap;
}


#librosPage .libros-mini-badge svg {
  width:
    8px;

  height:
    8px;

  stroke-width:
    2.4;
}


/* =========================================================
   GENERIC CELL TEXT
   ========================================================= */

#librosPage .libros-cell-text {
  display:
    block;

  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    750;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   FORMAT
   ========================================================= */

#librosPage .libros-format {
  min-height:
    21px;

  max-width:
    100%;

  display:
    inline-flex;

  align-items:
    center;

  padding:
    0 7px;

  overflow:
    hidden;

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

  border-radius:
    999px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    850;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   STATUS
   ========================================================= */

#librosPage .libros-status {
  min-height:
    22px;

  max-width:
    100%;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    5px;

  padding:
    0 7px;

  overflow:
    hidden;

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

  border-radius:
    999px;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


#librosPage .libros-status svg {
  width:
    10px;

  height:
    10px;

  flex:
    0 0 10px;

  stroke-width:
    2.4;
}


#librosPage .libros-status--active {
  border-color:
    var(--lb-success-border);

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

  color:
    #0c5032;
}


#librosPage .libros-status--inactive {
  border-color:
    #cfd3d9;

  background:
    #f0f1f3;

  color:
    #050505;
}


/* =========================================================
   ACTION COLUMN
   ========================================================= */

#librosPage .libros-col-actions {
  position:
    relative;

  overflow:
    visible !important;

  text-align:
    center;
}


#librosPage .libros-row-actions {
  position:
    relative;

  z-index:
    20;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  overflow:
    visible;
}


/* =========================================================
   ICON BUTTON
   ========================================================= */

#librosPage .libros-icon-btn,
.libros-modal .libros-icon-btn {
  width:
    30px;

  height:
    30px;

  flex:
    0 0 30px;

  display:
    grid;

  place-items:
    center;

  padding:
    0;

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

  border-radius:
    8px;

  background:
    var(--lb-surface);

  color:
    #050505;

  text-decoration:
    none;

  cursor:
    pointer;

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


#librosPage .libros-icon-btn:hover:not(:disabled),
.libros-modal .libros-icon-btn:hover:not(:disabled) {
  border-color:
    var(--lb-border-strong);

  background:
    var(--lb-surface-hover);

  transform:
    translateY(-1px);
}


#librosPage .libros-icon-btn:active:not(:disabled),
.libros-modal .libros-icon-btn:active:not(:disabled) {
  transform:
    scale(.93);
}


#librosPage .libros-icon-btn:disabled,
.libros-modal .libros-icon-btn:disabled {
  cursor:
    not-allowed;

  opacity:
    .35;
}


#librosPage .libros-icon-btn svg,
.libros-modal .libros-icon-btn svg {
  width:
    14px;

  height:
    14px;

  stroke-width:
    2.2;
}


#librosPage .libros-icon-btn--danger,
.libros-modal .libros-icon-btn--danger {
  color:
    #7e1b1b;
}


/* =========================================================
   ROW MENU
   ========================================================= */

#librosPage .libros-row-menu {
  position:
    absolute;

  top:
    calc(100% + 6px);

  right:
    0;

  bottom:
    auto;

  left:
    auto;

  z-index:
    500;

  width:
    205px;

  max-width:
    calc(100vw - 24px);

  overflow:
    hidden;

  padding:
    5px;

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

  border-radius:
    10px;

  background:
    #ffffff;

  color:
    #050505;

  animation:
    librosMenuIn
    140ms
    cubic-bezier(.2, .8, .2, 1);
}


@keyframes librosMenuIn {

  from {
    opacity:
      0;

    transform:
      translateY(-4px)
      scale(.98);
  }

  to {
    opacity:
      1;

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

}


#librosPage .libros-row-menu button {
  width:
    100%;

  min-height:
    33px;

  display:
    flex;

  align-items:
    center;

  gap:
    8px;

  padding:
    0 9px;

  border:
    0;

  border-radius:
    7px;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    9px;

  font-weight:
    800;

  text-align:
    left;

  cursor:
    pointer;

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


#librosPage .libros-row-menu button:hover {
  background:
    var(--lb-surface-hover);

  transform:
    translateX(1px);
}


#librosPage .libros-row-menu button svg {
  width:
    13px;

  height:
    13px;

  flex:
    0 0 13px;

  stroke-width:
    2.2;
}


#librosPage .libros-row-menu button.is-danger {
  color:
    #7e1b1b;
}


#librosPage .libros-row-menu button.is-success {
  color:
    #0c5032;
}


#librosPage .libros-row-menu__separator {
  display:
    block;

  width:
    100%;

  height:
    1px;

  margin:
    4px 0;

  background:
    var(--lb-border);
}


/* =========================================================
   PAGINATION
   ========================================================= */

#librosPage .libros-pagination {
  min-height:
    48px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  padding:
    8px 10px;

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

  color:
    #050505;
}


#librosPage .libros-pagination__info {
  display:
    flex;

  align-items:
    center;

  gap:
    4px;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    700;
}


#librosPage .libros-pagination__info strong {
  color:
    #050505;

  font-weight:
    900;
}


#librosPage .libros-pagination__right {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    8px;
}


#librosPage .libros-pagination__limit-wrap {
  min-height:
    30px;

  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  padding:
    0 7px;

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

  border-radius:
    8px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


#librosPage .libros-pagination__limit-wrap svg {
  width:
    11px;

  height:
    11px;

  flex:
    0 0 11px;

  stroke-width:
    2.2;
}


#librosPage .libros-pagination__limit {
  min-width:
    94px;

  height:
    28px;

  border:
    0;

  outline:
    0;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    8px;

  font-weight:
    750;
}


#librosPage .libros-pagination__controls {
  display:
    flex;

  align-items:
    center;

  gap:
    8px;
}


#librosPage .libros-pagination__controls > span {
  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    700;
}


#librosPage .libros-pagination__controls strong {
  color:
    #050505;

  font-weight:
    900;
}


/* =========================================================
   LOADING
   ========================================================= */

#librosPage .libros-loading {
  min-height:
    260px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    11px;

  padding:
    24px;

  color:
    #050505;

  text-align:
    center;
}


#librosPage .libros-loading > div {
  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-start;

  gap:
    3px;
}


#librosPage .libros-loading strong {
  color:
    #050505;

  font-size:
    11px;

  font-weight:
    900;
}


#librosPage .libros-loading span:not(.libros-spinner) {
  color:
    #050505;

  font-size:
    9px;

  font-weight:
    650;
}


/* =========================================================
   EMPTY
   ========================================================= */

#librosPage .libros-empty {
  min-height:
    260px;

  display:
    flex;

  flex-direction:
    column;

  align-items:
    center;

  justify-content:
    center;

  gap:
    7px;

  padding:
    24px;

  color:
    #050505;

  text-align:
    center;
}


#librosPage .libros-empty__icon {
  width:
    42px;

  height:
    42px;

  display:
    grid;

  place-items:
    center;

  margin-bottom:
    3px;

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

  border-radius:
    11px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


#librosPage .libros-empty__icon svg {
  width:
    20px;

  height:
    20px;

  stroke-width:
    2.1;
}


#librosPage .libros-empty strong {
  color:
    #050505;

  font-size:
    11px;

  font-weight:
    900;
}


#librosPage .libros-empty > span {
  color:
    #050505;

  font-size:
    9px;

  font-weight:
    650;
}


/* =========================================================
   SPINNER
   ========================================================= */

#librosPage .libros-spinner,
.libros-btn-spinner {
  width:
    22px;

  height:
    22px;

  flex:
    0 0 22px;

  border:
    2px solid var(--lb-border);

  border-top-color:
    #050505;

  border-radius:
    50%;

  animation:
    librosSpin
    600ms
    linear
    infinite;
}


.libros-btn-spinner {
  width:
    12px;

  height:
    12px;

  flex-basis:
    12px;

  border-color:
    rgba(255, 255, 255, .35);

  border-top-color:
    #ffffff;
}


@keyframes librosSpin {

  to {
    transform:
      rotate(360deg);
  }

}


/* =========================================================
   PARTE 1 DE 4 FINALIZA ACÁ

   PARTE 2:
   - MODALES
   - FICHA
   - TABS
   - INFO GRID
   - DESCRIPCIÓN
   - FORMULARIOS
   - CAMPOS OBLIGATORIOS
   - SWITCHES
   ========================================================= *//* =========================================================
   MODAL BACKDROP
   ========================================================= */

.libros-modal-backdrop {
  position:
    fixed;

  inset:
    0;

  z-index:
    1000;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  padding:
    20px;

  overflow-y:
    auto;

  overflow-x:
    hidden;

  background:
    rgba(3, 5, 12, .72);

  animation:
    librosBackdropIn
    150ms
    ease;
}


@keyframes librosBackdropIn {

  from {
    opacity:
      0;
  }

  to {
    opacity:
      1;
  }

}


html.libros-modal-open,
html.libros-modal-open body {
  overflow:
    hidden;
}


/* =========================================================
   MODAL BASE
   ========================================================= */

.libros-modal {
  --lb-bg:
    #f5f6f8;

  --lb-surface:
    #ffffff;

  --lb-surface-soft:
    #f7f8fa;

  --lb-surface-hover:
    #f0f2f5;

  --lb-border:
    #d5dae2;

  --lb-border-strong:
    #b6bdc8;

  --lb-text:
    #050505;

  --lb-violet:
    #6253a2;

  --lb-violet-soft:
    rgba(98, 83, 162, .08);

  --lb-success-bg:
    #eaf7ef;

  --lb-success-border:
    #b8ddc8;

  --lb-danger-bg:
    #fff0ef;

  --lb-danger-border:
    #efb3ae;

  --lb-transition:
    150ms cubic-bezier(.2, .8, .2, 1);

  width:
    min(
      100%,
      520px
    );

  max-height:
    calc(100dvh - 40px);

  display:
    flex;

  flex-direction:
    column;

  overflow:
    hidden;

  border:
    1px solid #cfd4dc;

  border-radius:
    15px;

  background:
    #ffffff;

  color:
    #050505;

  animation:
    librosModalIn
    170ms
    cubic-bezier(.2, .8, .2, 1);
}


.libros-modal--large {
  width:
    min(
      100%,
      780px
    );
}


.libros-modal--xlarge {
  width:
    min(
      100%,
      1060px
    );
}


@keyframes librosModalIn {

  from {
    opacity:
      0;

    transform:
      translateY(8px)
      scale(.985);
  }

  to {
    opacity:
      1;

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

}


/* =========================================================
   MODAL HEADER
   ========================================================= */

.libros-modal__header {
  min-height:
    58px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    12px;

  padding:
    10px 12px;

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

  background:
    #ffffff;

  color:
    #050505;
}


/* =========================================================
   MODAL HEADING
   ========================================================= */

.libros-modal__heading {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    10px;
}


.libros-modal__heading-icon {
  width:
    34px;

  height:
    34px;

  flex:
    0 0 34px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


.libros-modal__heading-icon svg {
  width:
    16px;

  height:
    16px;

  stroke-width:
    2.2;
}


.libros-modal__heading-copy {
  min-width:
    0;
}


.libros-modal__heading-copy > span {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    900;

  line-height:
    1;

  letter-spacing:
    .10em;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-modal__heading-copy h2 {
  max-width:
    100%;

  margin:
    3px 0 0;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    14px;

  font-weight:
    900;

  line-height:
    1.2;

  letter-spacing:
    -.025em;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   MODAL BODY
   ========================================================= */

.libros-modal__body {
  min-height:
    0;

  flex:
    1;

  padding:
    14px;

  overflow-y:
    auto;

  overflow-x:
    hidden;

  color:
    #050505;
}


/* =========================================================
   MODAL FOOTER
   ========================================================= */

.libros-modal__footer {
  min-height:
    54px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  gap:
    8px;

  padding:
    9px 12px;

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

  background:
    var(--lb-surface-soft);
}


/* =========================================================
   DETAIL
   ========================================================= */

.libros-detail {
  width:
    100%;

  min-width:
    0;
}


/* =========================================================
   DETAIL HERO
   ========================================================= */

.libros-detail-hero {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  align-items:
    center;

  gap:
    13px;

  margin-bottom:
    12px;

  padding:
    11px;

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

  border-radius:
    11px;

  background:
    var(--lb-surface-soft);
}


/* =========================================================
   DETAIL COVER
   ========================================================= */

.libros-detail-hero__cover {
  width:
    76px;

  height:
    94px;

  display:
    grid;

  place-items:
    center;

  overflow:
    hidden;

  padding:
    0;

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

  border-radius:
    10px;

  background:
    #ffffff;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    14px;

  font-weight:
    900;

  cursor:
    pointer;

  transition:
    border-color var(--lb-transition),
    transform var(--lb-transition);
}


.libros-detail-hero__cover:hover {
  border-color:
    var(--lb-border-strong);

  transform:
    translateY(-1px);
}


.libros-detail-hero__cover img {
  width:
    100%;

  height:
    100%;

  display:
    block;

  object-fit:
    cover;
}


/* =========================================================
   DETAIL INFO
   ========================================================= */

.libros-detail-hero__info {
  min-width:
    0;
}


.libros-detail-hero__top {
  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  margin-bottom:
    6px;

  flex-wrap:
    wrap;
}


.libros-detail-hero__info h3 {
  max-width:
    100%;

  margin:
    0;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    17px;

  font-weight:
    900;

  line-height:
    1.18;

  letter-spacing:
    -.035em;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-detail-hero__subtitle {
  max-width:
    100%;

  margin:
    4px 0 0;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9.5px;

  font-weight:
    700;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   DETAIL META
   ========================================================= */

.libros-detail-hero__meta {
  display:
    flex;

  align-items:
    center;

  gap:
    8px;

  margin-top:
    8px;

  flex-wrap:
    wrap;
}


.libros-detail-hero__meta span {
  display:
    inline-flex;

  align-items:
    center;

  gap:
    4px;

  min-width:
    0;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    700;
}


.libros-detail-hero__meta svg {
  width:
    10px;

  height:
    10px;

  flex:
    0 0 10px;

  stroke-width:
    2.2;
}


/* =========================================================
   CHIP
   ========================================================= */

.libros-chip {
  min-height:
    21px;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    4px;

  padding:
    0 7px;

  border:
    1px solid rgba(98, 83, 162, .24);

  border-radius:
    999px;

  background:
    var(--lb-violet-soft);

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;

  line-height:
    1;

  white-space:
    nowrap;
}


.libros-chip svg {
  width:
    9px;

  height:
    9px;

  stroke-width:
    2.4;
}


.libros-chip--success {
  border-color:
    var(--lb-success-border);

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

  color:
    #0c5032;
}


.libros-chip--inactive {
  border-color:
    #cfd3d9;

  background:
    #f0f1f3;

  color:
    #050505;
}


/* =========================================================
   DETAIL TABS
   ========================================================= */

.libros-detail-tabs {
  width:
    100%;

  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    4px;

  margin-bottom:
    10px;

  padding:
    4px;

  overflow-x:
    auto;

  overflow-y:
    hidden;

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

  border-radius:
    10px;

  background:
    var(--lb-surface-soft);

  scrollbar-width:
    none;
}


.libros-detail-tabs::-webkit-scrollbar {
  display:
    none;
}


/* =========================================================
   DETAIL TAB
   ========================================================= */

.libros-detail-tab {
  min-height:
    31px;

  flex:
    0 0 auto;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    5px;

  padding:
    0 9px;

  border:
    1px solid transparent;

  border-radius:
    7px;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    8px;

  font-weight:
    800;

  cursor:
    pointer;

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


.libros-detail-tab svg {
  width:
    11px;

  height:
    11px;

  stroke-width:
    2.2;
}


.libros-detail-tab:hover {
  background:
    #ffffff;
}


.libros-detail-tab.is-active {
  border-color:
    var(--lb-border-strong);

  background:
    #ffffff;
}


.libros-detail-tab:active {
  transform:
    scale(.97);
}


/* =========================================================
   DETAIL CONTENT
   ========================================================= */

.libros-detail__content {
  width:
    100%;

  min-width:
    0;
}


/* =========================================================
   INFO GRID
   ========================================================= */

.libros-info-grid {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  overflow:
    hidden;

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

  border-radius:
    10px;

  background:
    #ffffff;
}


.libros-info-grid--physical {
  grid-template-columns:
    repeat(
      4,
      minmax(0, 1fr)
    );
}


/* =========================================================
   INFO FIELD
   ========================================================= */

.libros-info-field {
  min-width:
    0;

  min-height:
    66px;

  padding:
    10px;

  border-right:
    1px solid var(--lb-border);

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

  background:
    #ffffff;
}


.libros-info-grid:not(.libros-info-grid--physical)
.libros-info-field:nth-child(3n) {
  border-right:
    0;
}


.libros-info-grid:not(.libros-info-grid--physical)
.libros-info-field:nth-last-child(-n + 3) {
  border-bottom:
    0;
}


.libros-info-grid--physical
.libros-info-field:nth-child(4n) {
  border-right:
    0;
}


.libros-info-grid--physical
.libros-info-field:nth-last-child(-n + 4) {
  border-bottom:
    0;
}


.libros-info-field__label {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  color:
    #050505;
}


.libros-info-field__label svg {
  width:
    11px;

  height:
    11px;

  flex:
    0 0 11px;

  stroke-width:
    2.2;
}


.libros-info-field__label span {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    850;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-info-field > strong {
  display:
    block;

  max-width:
    100%;

  margin-top:
    6px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9.5px;

  font-weight:
    900;

  line-height:
    1.3;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-info-field > strong.is-empty {
  font-weight:
    700;

  opacity:
    .62;
}


/* =========================================================
   DETAIL SECTION
   ========================================================= */

.libros-detail-section {
  margin-top:
    12px;
}


.libros-detail-section__title {
  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  margin-bottom:
    7px;
}


.libros-detail-section__title > div {
  min-width:
    0;
}


.libros-detail-section__title span {
  display:
    block;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;

  letter-spacing:
    .08em;
}


.libros-detail-section__title strong {
  display:
    block;

  margin-top:
    2px;

  color:
    #050505;

  font-size:
    10px;

  font-weight:
    900;
}


.libros-detail-section__title > svg {
  width:
    15px;

  height:
    15px;

  flex:
    0 0 15px;

  color:
    #050505;

  stroke-width:
    2.2;
}


/* =========================================================
   TEXT SECTIONS
   ========================================================= */

.libros-text-sections {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

  gap:
    8px;
}


/* =========================================================
   TEXT SECTION
   ========================================================= */

.libros-text-section {
  width:
    100%;

  min-width:
    0;

  overflow:
    hidden;

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

  border-radius:
    10px;

  background:
    #ffffff;
}


.libros-text-section--internal {
  border-color:
    rgba(98, 83, 162, .28);

  background:
    var(--lb-violet-soft);
}


/* =========================================================
   TEXT SECTION HEADER
   ========================================================= */

.libros-text-section__header {
  min-height:
    36px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  padding:
    8px 10px;

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

  background:
    var(--lb-surface-soft);
}


.libros-text-section__header > div {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    6px;
}


.libros-text-section__header svg {
  width:
    12px;

  height:
    12px;

  flex:
    0 0 12px;

  color:
    #050505;

  stroke-width:
    2.2;
}


.libros-text-section__header span {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   TEXT SECTION CONTENT
   ========================================================= */

.libros-text-section > p {
  margin:
    0;

  padding:
    11px;

  color:
    #050505;

  font-size:
    9px;

  font-weight:
    650;

  line-height:
    1.55;

  white-space:
    pre-wrap;
}


.libros-text-section > p.is-empty {
  opacity:
    .62;

  font-style:
    italic;
}


/* =========================================================
   LONG INFO
   ========================================================= */

.libros-long-info {
  margin-top:
    8px;

  padding:
    10px;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);
}


.libros-long-info > span {
  display:
    block;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    900;

  letter-spacing:
    .05em;

  text-transform:
    uppercase;
}


.libros-long-info > p {
  margin:
    5px 0 0;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    650;

  line-height:
    1.5;
}


/* =========================================================
   TAGS
   ========================================================= */

.libros-tags {
  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  flex-wrap:
    wrap;
}


.libros-tags > span {
  min-height:
    23px;

  display:
    inline-flex;

  align-items:
    center;

  padding:
    0 8px;

  border:
    1px solid rgba(98, 83, 162, .24);

  border-radius:
    999px;

  background:
    var(--lb-violet-soft);

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    850;
}


/* =========================================================
   INLINE EMPTY
   ========================================================= */

.libros-inline-empty {
  min-height:
    170px;

  display:
    flex;

  flex-direction:
    column;

  align-items:
    center;

  justify-content:
    center;

  gap:
    6px;

  padding:
    22px;

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

  border-radius:
    10px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;

  text-align:
    center;
}


.libros-inline-empty > svg {
  width:
    23px;

  height:
    23px;

  stroke-width:
    2;
}


.libros-inline-empty > strong {
  color:
    #050505;

  font-size:
    10px;

  font-weight:
    900;
}


.libros-inline-empty > span:not(.libros-spinner) {
  max-width:
    380px;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    650;

  line-height:
    1.4;
}


/* =========================================================
   FORM
   ========================================================= */

.libros-form {
  width:
    100%;

  min-width:
    0;
}


/* =========================================================
   FORM TABS
   ========================================================= */

.libros-form-tabs {
  width:
    100%;

  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    4px;

  margin-bottom:
    10px;

  padding:
    4px;

  overflow-x:
    auto;

  overflow-y:
    hidden;

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

  border-radius:
    10px;

  background:
    var(--lb-surface-soft);

  scrollbar-width:
    none;
}


.libros-form-tabs::-webkit-scrollbar {
  display:
    none;
}


/* =========================================================
   FORM TAB
   ========================================================= */

.libros-form-tab {
  min-height:
    31px;

  flex:
    0 0 auto;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  gap:
    5px;

  padding:
    0 9px;

  border:
    1px solid transparent;

  border-radius:
    7px;

  background:
    transparent;

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    8px;

  font-weight:
    850;

  cursor:
    pointer;

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


.libros-form-tab svg {
  width:
    11px;

  height:
    11px;

  stroke-width:
    2.2;
}


.libros-form-tab:hover {
  background:
    #ffffff;
}


.libros-form-tab.is-active {
  border-color:
    var(--lb-border-strong);

  background:
    #ffffff;
}


.libros-form-tab:active {
  transform:
    scale(.97);
}


/* =========================================================
   FORM SECTIONS
   ========================================================= */

.libros-form-sections {
  width:
    100%;

  min-width:
    0;
}


.libros-form-section {
  display:
    none;

  width:
    100%;

  min-width:
    0;
}


.libros-form-section.is-active {
  display:
    block;

  animation:
    librosFormSectionIn
    150ms
    ease;
}


@keyframes librosFormSectionIn {

  from {
    opacity:
      0;

    transform:
      translateY(3px);
  }

  to {
    opacity:
      1;

    transform:
      translateY(0);
  }

}


/* =========================================================
   FORM SECTION HEADER
   ========================================================= */

.libros-form-section__header {
  min-height:
    48px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  margin-bottom:
    10px;

  padding:
    9px 10px;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);
}


.libros-form-section__header > div {
  min-width:
    0;
}


.libros-form-section__header span {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;

  letter-spacing:
    .08em;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-form-section__header strong {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    10px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-form-section__header > svg {
  width:
    15px;

  height:
    15px;

  flex:
    0 0 15px;

  color:
    #050505;

  stroke-width:
    2.2;
}


/* =========================================================
   FORM GRID
   ========================================================= */

.libros-form-grid {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  gap:
    10px;
}


/* =========================================================
   FIELD
   ========================================================= */

.libros-field {
  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  gap:
    6px;
}


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


/* =========================================================
   FIELD LABEL
   ========================================================= */

.libros-field__label {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    5px;

  color:
    #050505;
}


.libros-field__label svg {
  width:
    11px;

  height:
    11px;

  flex:
    0 0 11px;

  stroke-width:
    2.2;
}


.libros-field__label > span {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    850;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-field__label > b {
  color:
    #8d1c1c;

  font-size:
    10px;

  font-weight:
    900;

  line-height:
    1;
}


/* =========================================================
   FIELD CONTROL
   ========================================================= */

.libros-field__control {
  position:
    relative;

  min-width:
    0;
}


/* =========================================================
   INPUT / SELECT / TEXTAREA
   ========================================================= */

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

  min-width:
    0;

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

  border-radius:
    9px;

  outline:
    0;

  background:
    var(--lb-surface-soft);

  color:
    #050505;

  font-family:
    inherit;

  font-size:
    9.5px;

  font-weight:
    700;

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


.libros-field input,
.libros-field select {
  height:
    38px;

  padding:
    0 10px;
}


.libros-field textarea {
  min-height:
    92px;

  padding:
    9px 10px;

  resize:
    vertical;

  line-height:
    1.45;
}


.libros-field input:hover,
.libros-field select:hover,
.libros-field textarea:hover {
  border-color:
    var(--lb-border-strong);
}


.libros-field input:focus,
.libros-field select:focus,
.libros-field textarea:focus {
  border-color:
    var(--lb-violet);

  background:
    #ffffff;
}


.libros-field input::placeholder,
.libros-field textarea::placeholder {
  color:
    #050505;

  opacity:
    .62;

  font-weight:
    600;
}


/* =========================================================
   REQUIRED
   ========================================================= */

.libros-field input:required,
.libros-field select:required {
  border-left-width:
    2px;
}


.libros-field input:required:invalid:not(:placeholder-shown),
.libros-field select:required:invalid {
  border-color:
    var(--lb-danger-border);
}


.libros-field input:required:valid,
.libros-field select:required:valid {
  border-color:
    var(--lb-border);
}


/* =========================================================
   NUMBER
   ========================================================= */

.libros-field input[type="number"] {
  appearance:
    textfield;
}


.libros-field input[type="number"]::-webkit-inner-spin-button,
.libros-field input[type="number"]::-webkit-outer-spin-button {
  margin:
    0;

  appearance:
    none;
}


/* =========================================================
   FIELD SUFFIX
   ========================================================= */

.libros-field__control.has-suffix input {
  padding-right:
    43px;
}


.libros-field__suffix {
  position:
    absolute;

  top:
    50%;

  right:
    10px;

  transform:
    translateY(-50%);

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    850;

  pointer-events:
    none;
}


/* =========================================================
   FORM SWITCHES
   ========================================================= */

.libros-form-switches {
  display:
    grid;

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

  gap:
    8px;

  margin-top:
    10px;
}


/* =========================================================
   SWITCH
   ========================================================= */

.libros-switch {
  position:
    relative;

  min-width:
    0;

  min-height:
    66px;

  display:
    grid;

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

  align-items:
    center;

  gap:
    9px;

  padding:
    9px;

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

  border-radius:
    10px;

  background:
    var(--lb-surface-soft);

  cursor:
    pointer;

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


.libros-switch:hover {
  border-color:
    var(--lb-border-strong);

  background:
    #ffffff;

  transform:
    translateY(-1px);
}


.libros-switch > input {
  position:
    absolute;

  opacity:
    0;

  pointer-events:
    none;
}


/* =========================================================
   SWITCH ICON
   ========================================================= */

.libros-switch__icon {
  width:
    32px;

  height:
    32px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    8px;

  background:
    #ffffff;

  color:
    #050505;
}


.libros-switch__icon svg {
  width:
    14px;

  height:
    14px;

  stroke-width:
    2.2;
}


/* =========================================================
   SWITCH CONTENT
   ========================================================= */

.libros-switch__content {
  min-width:
    0;

  display:
    flex;

  flex-direction:
    column;

  gap:
    2px;
}


.libros-switch__content strong {
  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-switch__content small {
  color:
    #050505;

  font-size:
    7px;

  font-weight:
    650;

  line-height:
    1.3;
}


/* =========================================================
   SWITCH CONTROL
   ========================================================= */

.libros-switch__control {
  position:
    relative;

  width:
    36px;

  height:
    21px;

  flex:
    0 0 36px;

  display:
    block;

  border:
    1px solid #aeb5c0;

  border-radius:
    999px;

  background:
    #e5e7eb;

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


.libros-switch__control > span {
  position:
    absolute;

  top:
    3px;

  left:
    3px;

  width:
    13px;

  height:
    13px;

  border-radius:
    50%;

  background:
    #050505;

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


.libros-switch >
input:checked ~
.libros-switch__control {
  border-color:
    #51438f;

  background:
    #6253a2;
}


.libros-switch >
input:checked ~
.libros-switch__control >
span {
  background:
    #ffffff;

  transform:
    translateX(15px);
}


/* =========================================================
   PARTE 2 DE 4 FINALIZA ACÁ

   PARTE 3:
   - STOCK COMPLETO
   - DEPÓSITOS
   - NOTICE STOCK
   - GALERÍA
   - IMÁGENES
   - ARCHIVOS
   - MEDIA MANAGER
   - PREVIEW
   - TOASTS
   ========================================================= *//* =========================================================
   STOCK
   ========================================================= */

.libros-stock-detail,
.libros-stock-form {
  width:
    100%;

  min-width:
    0;
}


/* =========================================================
   STOCK NOTICE
   ========================================================= */

.libros-stock-form-notice {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  align-items:
    center;

  gap:
    9px;

  margin-bottom:
    10px;

  padding:
    9px;

  border:
    1px solid var(--lb-info-border);

  border-radius:
    10px;

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

  color:
    #050505;
}


.libros-stock-form-notice__icon {
  width:
    34px;

  height:
    34px;

  display:
    grid;

  place-items:
    center;

  border:
    1px solid var(--lb-info-border);

  border-radius:
    8px;

  background:
    #ffffff;

  color:
    #050505;
}


.libros-stock-form-notice__icon svg {
  width:
    15px;

  height:
    15px;

  stroke-width:
    2.2;
}


.libros-stock-form-notice > div:last-child {
  min-width:
    0;
}


.libros-stock-form-notice strong {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    900;

  line-height:
    1.25;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-stock-form-notice span {
  display:
    block;

  margin-top:
    2px;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    650;

  line-height:
    1.35;
}


/* =========================================================
   STOCK SUMMARY
   ========================================================= */

.libros-stock-form-summary {
  width:
    100%;

  min-width:
    0;

  margin-top:
    10px;
}


.libros-stock-form-summary > div {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  gap:
    7px;

  padding:
    8px 9px;

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

  border-radius:
    9px;

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

  color:
    #0c5032;
}


.libros-stock-form-summary svg {
  width:
    13px;

  height:
    13px;

  flex:
    0 0 13px;

  stroke-width:
    2.2;
}


.libros-stock-form-summary span {
  min-width:
    0;

  color:
    inherit;

  font-size:
    7.5px;

  font-weight:
    750;

  line-height:
    1.35;
}


/* =========================================================
   STOCK DEPOSITS
   ========================================================= */

.libros-stock-deposits {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  gap:
    8px;
}


/* =========================================================
   STOCK DEPOSIT
   ========================================================= */

.libros-stock-deposit {
  min-width:
    0;

  display:
    grid;

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

  align-items:
    center;

  gap:
    9px;

  padding:
    9px;

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

  border-radius:
    10px;

  background:
    #ffffff;

  color:
    #050505;

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


.libros-stock-deposit:hover {
  border-color:
    var(--lb-border-strong);

  background:
    var(--lb-surface-soft);

  transform:
    translateY(-1px);
}


/* =========================================================
   STOCK DEPOSIT ICON
   ========================================================= */

.libros-stock-deposit__icon {
  width:
    34px;

  height:
    34px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    8px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


.libros-stock-deposit__icon svg {
  width:
    15px;

  height:
    15px;

  stroke-width:
    2.2;
}


/* =========================================================
   STOCK DEPOSIT INFO
   ========================================================= */

.libros-stock-deposit__info {
  min-width:
    0;
}


.libros-stock-deposit__info strong {
  display:
    block;

  max-width:
    100%;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    900;

  line-height:
    1.2;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-stock-deposit__info span {
  display:
    block;

  max-width:
    100%;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    650;

  line-height:
    1.25;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   STOCK DEPOSIT VALUE
   ========================================================= */

.libros-stock-deposit__value {
  min-width:
    64px;

  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-end;

  justify-content:
    center;

  gap:
    1px;
}


.libros-stock-deposit__value span {
  color:
    #050505;

  font-size:
    6.5px;

  font-weight:
    800;

  text-transform:
    uppercase;

  letter-spacing:
    .06em;
}


.libros-stock-deposit__value strong {
  color:
    #050505;

  font-size:
    12px;

  font-weight:
    900;

  line-height:
    1;
}


/* =========================================================
   GALLERY
   ========================================================= */

.libros-gallery {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  gap:
    8px;
}


/* =========================================================
   GALLERY ITEM
   ========================================================= */

.libros-gallery__item {
  min-width:
    0;

  overflow:
    hidden;

  padding:
    0;

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

  border-radius:
    10px;

  background:
    #ffffff;

  color:
    #050505;

  font-family:
    inherit;

  text-align:
    left;

  cursor:
    pointer;

  transition:
    border-color var(--lb-transition),
    transform var(--lb-transition);
}


.libros-gallery__item:hover {
  border-color:
    var(--lb-border-strong);

  transform:
    translateY(-1px);
}


/* =========================================================
   GALLERY IMAGE
   ========================================================= */

.libros-gallery__image {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    4 / 5;

  overflow:
    hidden;

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

  background:
    var(--lb-surface-soft);
}


.libros-gallery__image img {
  width:
    100%;

  height:
    100%;

  display:
    block;

  object-fit:
    cover;

  object-position:
    center;
}


.libros-gallery__image > span {
  position:
    absolute;

  top:
    7px;

  left:
    7px;

  min-height:
    21px;

  display:
    inline-flex;

  align-items:
    center;

  padding:
    0 7px;

  border:
    1px solid rgba(98, 83, 162, .32);

  border-radius:
    999px;

  background:
    rgba(255, 255, 255, .94);

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;
}


/* =========================================================
   GALLERY INFO
   ========================================================= */

.libros-gallery__info {
  min-width:
    0;

  padding:
    8px;
}


.libros-gallery__info strong {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-gallery__info small {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    650;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   FILES LIST
   ========================================================= */

.libros-files-list {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

  gap:
    7px;
}


/* =========================================================
   FILE CARD
   ========================================================= */

.libros-file-card {
  min-width:
    0;

  display:
    grid;

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

  align-items:
    center;

  gap:
    9px;

  padding:
    9px;

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

  border-radius:
    9px;

  background:
    #ffffff;

  color:
    #050505;

  text-decoration:
    none;

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


.libros-file-card:hover {
  border-color:
    var(--lb-border-strong);

  background:
    var(--lb-surface-soft);

  transform:
    translateY(-1px);
}


/* =========================================================
   FILE CARD ICON
   ========================================================= */

.libros-file-card__icon {
  width:
    36px;

  height:
    36px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


.libros-file-card__icon svg {
  width:
    16px;

  height:
    16px;

  stroke-width:
    2.2;
}


/* =========================================================
   FILE CARD INFO
   ========================================================= */

.libros-file-card__info {
  min-width:
    0;
}


.libros-file-card__info strong {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-file-card__info span {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.5px;

  font-weight:
    700;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-file-card__info small {
  display:
    block;

  margin-top:
    3px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7.2px;

  font-weight:
    600;

  line-height:
    1.35;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-file-card__open {
  width:
    14px;

  height:
    14px;

  color:
    #050505;

  stroke-width:
    2.2;
}


/* =========================================================
   MEDIA LAYOUT
   ========================================================= */

.libros-media-layout {
  width:
    100%;

  min-width:
    0;

  display:
    grid;

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

  align-items:
    start;

  gap:
    12px;
}


/* =========================================================
   MEDIA MAIN / SIDE
   ========================================================= */

.libros-media-main,
.libros-media-side {
  min-width:
    0;
}


/* =========================================================
   MEDIA HEADER
   ========================================================= */

.libros-media-header {
  min-height:
    43px;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    10px;

  margin-bottom:
    8px;

  padding:
    8px 9px;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);
}


.libros-media-header > div {
  min-width:
    0;
}


.libros-media-header span {
  display:
    block;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;

  letter-spacing:
    .08em;
}


.libros-media-header strong {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9.5px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-media-count {
  min-width:
    26px;

  height:
    26px;

  display:
    grid !important;

  place-items:
    center;

  flex:
    0 0 26px;

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

  border-radius:
    8px;

  background:
    #ffffff;

  color:
    #050505 !important;

  font-size:
    8px !important;

  font-weight:
    900 !important;

  letter-spacing:
    0 !important;
}


/* =========================================================
   MEDIA GRID
   ========================================================= */

.libros-media-grid {
  display:
    grid;

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

  gap:
    8px;
}


/* =========================================================
   IMAGE CARD
   ========================================================= */

.libros-image-card {
  min-width:
    0;

  overflow:
    hidden;

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

  border-radius:
    10px;

  background:
    #ffffff;

  transition:
    border-color var(--lb-transition),
    transform var(--lb-transition);
}


.libros-image-card:hover {
  border-color:
    var(--lb-border-strong);

  transform:
    translateY(-1px);
}


.libros-image-card.is-main {
  border-color:
    rgba(98, 83, 162, .42);
}


/* =========================================================
   IMAGE CARD PREVIEW
   ========================================================= */

.libros-image-card__preview {
  position:
    relative;

  width:
    100%;

  aspect-ratio:
    4 / 5;

  display:
    block;

  overflow:
    hidden;

  padding:
    0;

  border:
    0;

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

  background:
    var(--lb-surface-soft);

  cursor:
    pointer;
}


.libros-image-card__preview img {
  width:
    100%;

  height:
    100%;

  display:
    block;

  object-fit:
    cover;

  transition:
    transform
    180ms
    ease;
}


.libros-image-card__preview:hover img {
  transform:
    scale(1.02);
}


/* =========================================================
   MAIN BADGE
   ========================================================= */

.libros-image-card__main-badge {
  position:
    absolute;

  top:
    7px;

  left:
    7px;

  min-height:
    21px;

  display:
    inline-flex;

  align-items:
    center;

  gap:
    4px;

  padding:
    0 7px;

  border:
    1px solid rgba(98, 83, 162, .34);

  border-radius:
    999px;

  background:
    rgba(255, 255, 255, .94);

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;
}


.libros-image-card__main-badge svg {
  width:
    9px;

  height:
    9px;

  stroke-width:
    2.4;
}


/* =========================================================
   IMAGE CARD CONTENT
   ========================================================= */

.libros-image-card__content {
  min-width:
    0;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    7px;

  padding:
    7px;
}


.libros-image-card__info {
  min-width:
    0;
}


.libros-image-card__info strong {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-image-card__info span {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    650;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-image-card__actions {
  flex:
    0 0 auto;

  display:
    flex;

  align-items:
    center;

  gap:
    4px;
}


/* =========================================================
   FILE MANAGER
   ========================================================= */

.libros-files-manager {
  display:
    grid;

  gap:
    7px;
}


/* =========================================================
   FILE MANAGER CARD
   ========================================================= */

.libros-file-manager-card {
  min-width:
    0;

  display:
    grid;

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

  align-items:
    center;

  gap:
    9px;

  padding:
    8px;

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

  border-radius:
    9px;

  background:
    #ffffff;

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


.libros-file-manager-card:hover {
  border-color:
    var(--lb-border-strong);

  background:
    var(--lb-surface-soft);
}


.libros-file-manager-card__icon {
  width:
    36px;

  height:
    36px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    9px;

  background:
    var(--lb-surface-soft);

  color:
    #050505;
}


.libros-file-manager-card__icon svg {
  width:
    16px;

  height:
    16px;

  stroke-width:
    2.2;
}


.libros-file-manager-card__content {
  min-width:
    0;
}


.libros-file-manager-card__content strong {
  display:
    block;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    8.5px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-file-manager-card__content span {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    700;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-file-manager-card__content small {
  display:
    block;

  margin-top:
    3px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    600;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


.libros-file-manager-card__actions {
  display:
    flex;

  align-items:
    center;

  gap:
    4px;
}


/* =========================================================
   MEDIA FORM
   ========================================================= */

.libros-media-form {
  position:
    sticky;

  top:
    0;

  overflow:
    hidden;

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

  border-radius:
    10px;

  background:
    #ffffff;
}


/* =========================================================
   MEDIA FORM HEADER
   ========================================================= */

.libros-media-form__header {
  min-height:
    54px;

  display:
    flex;

  align-items:
    center;

  gap:
    9px;

  padding:
    9px;

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

  background:
    var(--lb-surface-soft);
}


.libros-media-form__icon {
  width:
    32px;

  height:
    32px;

  flex:
    0 0 32px;

  display:
    grid;

  place-items:
    center;

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

  border-radius:
    8px;

  background:
    #ffffff;

  color:
    #050505;
}


.libros-media-form__icon svg {
  width:
    14px;

  height:
    14px;

  stroke-width:
    2.2;
}


.libros-media-form__header > div:last-child {
  min-width:
    0;
}


.libros-media-form__header span {
  display:
    block;

  color:
    #050505;

  font-size:
    7px;

  font-weight:
    900;

  letter-spacing:
    .08em;
}


.libros-media-form__header strong {
  display:
    block;

  margin-top:
    2px;

  overflow:
    hidden;

  color:
    #050505;

  font-size:
    9.5px;

  font-weight:
    900;

  text-overflow:
    ellipsis;

  white-space:
    nowrap;
}


/* =========================================================
   MEDIA FORM BODY
   ========================================================= */

.libros-media-form__body {
  display:
    grid;

  gap:
    9px;

  padding:
    9px;
}


.libros-media-form__body .libros-field--full {
  grid-column:
    auto;
}


/* =========================================================
   MEDIA FORM FOOTER
   ========================================================= */

.libros-media-form__footer {
  padding:
    8px 9px;

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

  background:
    var(--lb-surface-soft);
}


.libros-media-form__footer .libros-btn {
  width:
    100%;
}


/* =========================================================
   IMAGE PREVIEW
   ========================================================= */

.libros-image-preview {
  position:
    fixed;

  inset:
    0;

  z-index:
    1400;

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  padding:
    20px;

  background:
    rgba(3, 5, 12, .84);

  animation:
    librosPreviewIn
    150ms
    ease;
}


@keyframes librosPreviewIn {

  from {
    opacity:
      0;
  }

  to {
    opacity:
      1;
  }

}


/* =========================================================
   IMAGE PREVIEW DIALOG
   ========================================================= */

.libros-image-preview__dialog {
  position:
    relative;

  width:
    min(
      100%,
      760px
    );

  max-height:
    calc(100dvh - 40px);

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;
}


.libros-image-preview__dialog img {
  display:
    block;

  width:
    auto;

  max-width:
    100%;

  height:
    auto;

  max-height:
    calc(100dvh - 40px);

  object-fit:
    contain;

  border:
    1px solid #34343c;

  border-radius:
    12px;
}


/* =========================================================
   IMAGE PREVIEW CLOSE
   ========================================================= */

.libros-image-preview__close {
  position:
    absolute;

  top:
    8px;

  right:
    8px;

  z-index:
    2;

  width:
    32px;

  height:
    32px;

  display:
    grid;

  place-items:
    center;

  padding:
    0;

  border:
    1px solid rgba(255, 255, 255, .3);

  border-radius:
    8px;

  background:
    rgba(5, 5, 5, .78);

  color:
    #ffffff;

  cursor:
    pointer;

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


.libros-image-preview__close:hover {
  background:
    #050505;

  transform:
    scale(.96);
}


.libros-image-preview__close svg {
  width:
    14px;

  height:
    14px;

  stroke-width:
    2.2;
}


/* =========================================================
   TOAST CONTAINER
   ========================================================= */

.libros-toast-container {
  position:
    fixed;

  top:
    62px;

  right:
    16px;

  z-index:
    1500;

  width:
    min(
      340px,
      calc(100vw - 32px)
    );

  display:
    flex;

  flex-direction:
    column;

  gap:
    7px;

  pointer-events:
    none;
}


/* =========================================================
   TOAST
   ========================================================= */

.libros-toast {
  min-height:
    44px;

  display:
    grid;

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

  align-items:
    center;

  gap:
    8px;

  padding:
    8px 10px;

  border:
    1px solid #cfd4dd;

  border-radius:
    10px;

  background:
    #ffffff;

  color:
    #050505;

  opacity:
    0;

  transform:
    translateX(12px);

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


.libros-toast.is-visible {
  opacity:
    1;

  transform:
    translateX(0);
}


.libros-toast__icon {
  width:
    28px;

  height:
    28px;

  display:
    grid;

  place-items:
    center;

  border:
    1px solid currentColor;

  border-radius:
    8px;
}


.libros-toast__icon svg {
  width:
    13px;

  height:
    13px;

  stroke-width:
    2.2;
}


.libros-toast > span {
  color:
    inherit;

  font-size:
    9px;

  font-weight:
    750;

  line-height:
    1.35;
}


.libros-toast--success {
  border-color:
    var(--lb-success-border);

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

  color:
    #0c5032;
}


.libros-toast--warning {
  border-color:
    var(--lb-warning-border);

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

  color:
    #624000;
}


.libros-toast--error {
  border-color:
    var(--lb-danger-border);

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

  color:
    #731717;
}


/* =========================================================
   PARTE 3 DE 4 FINALIZA ACÁ

   PARTE 4:
   - DARK MODE COMPLETO
   - FIX TEXTO / ICONOS DARK
   - CONTENEDORES PADRE
   - RESPONSIVE
   - TABLET
   - TABLA A CARDS MOBILE
   - MODALES MOBILE
   - STOCK MOBILE
   - GALERÍA / ARCHIVOS MOBILE
   - SCROLLBARS
   - MENÚ ACCIONES
   - REDUCED MOTION
   ========================================================= *//* =========================================================
   DARK MODE · TOKENS
   ========================================================= */

html[data-theme="dark"]
#librosPage,
body.dark
#librosPage,
.dark
#librosPage {
  --lb-bg:
    #050505;

  --lb-surface:
    #0b0b0d;

  --lb-surface-soft:
    #111114;

  --lb-surface-hover:
    #151519;

  --lb-border:
    #29292f;

  --lb-border-strong:
    #44444c;

  --lb-text:
    #ffffff;

  --lb-text-soft:
    #f3f3f5;

  --lb-violet:
    #a495dc;

  --lb-violet-soft:
    rgba(164, 149, 220, .10);

  --lb-success:
    #bdf2cf;

  --lb-success-bg:
    #0f1b14;

  --lb-success-border:
    #294837;

  --lb-warning:
    #f7d991;

  --lb-warning-bg:
    #1c1608;

  --lb-warning-border:
    #55441b;

  --lb-danger:
    #ffb3b3;

  --lb-danger-bg:
    #1f0d0d;

  --lb-danger-border:
    #5f2a2a;

  --lb-info:
    #c8dcff;

  --lb-info-bg:
    #0c1420;

  --lb-info-border:
    #293d59;

  color:
    #ffffff !important;
}


/* =========================================================
   DARK PAGE TEXT
   ========================================================= */

html[data-theme="dark"] #librosPage .libros-page__overline,
html[data-theme="dark"] #librosPage .libros-page__title h1,
html[data-theme="dark"] #librosPage .libros-page__title p,
html[data-theme="dark"] #librosPage .libros-btn--secondary,
html[data-theme="dark"] #librosPage .libros-metric,
html[data-theme="dark"] #librosPage .libros-metric__icon,
html[data-theme="dark"] #librosPage .libros-metric__content > span,
html[data-theme="dark"] #librosPage .libros-metric__content > strong,
html[data-theme="dark"] #librosPage .libros-metric__content > small,
html[data-theme="dark"] #librosPage .libros-search,
html[data-theme="dark"] #librosPage .libros-search > svg,
html[data-theme="dark"] #librosPage .libros-search input,
html[data-theme="dark"] #librosPage .libros-search input::placeholder,
html[data-theme="dark"] #librosPage .libros-search__clear,
html[data-theme="dark"] #librosPage .libros-filter,
html[data-theme="dark"] #librosPage .libros-select,
html[data-theme="dark"] #librosPage .libros-filter-field__label,
html[data-theme="dark"] #librosPage .libros-filter-field__label span,
html[data-theme="dark"] #librosPage .libros-filter-field input,
html[data-theme="dark"] #librosPage .libros-filter-field select,
html[data-theme="dark"] #librosPage .libros-table,
html[data-theme="dark"] #librosPage .libros-table thead th,
html[data-theme="dark"] #librosPage .libros-sort,
html[data-theme="dark"] #librosPage .libros-table tbody td,
html[data-theme="dark"] #librosPage .libros-code strong,
html[data-theme="dark"] #librosPage .libros-code small,
html[data-theme="dark"] #librosPage .libros-isbn,
html[data-theme="dark"] #librosPage .libros-book,
html[data-theme="dark"] #librosPage .libros-book > strong,
html[data-theme="dark"] #librosPage .libros-book > small,
html[data-theme="dark"] #librosPage .libros-mini-badge,
html[data-theme="dark"] #librosPage .libros-cell-text,
html[data-theme="dark"] #librosPage .libros-format,
html[data-theme="dark"] #librosPage .libros-status,
html[data-theme="dark"] #librosPage .libros-icon-btn,
html[data-theme="dark"] #librosPage .libros-pagination,
html[data-theme="dark"] #librosPage .libros-pagination__info,
html[data-theme="dark"] #librosPage .libros-pagination__info strong,
html[data-theme="dark"] #librosPage .libros-pagination__limit-wrap,
html[data-theme="dark"] #librosPage .libros-pagination__limit,
html[data-theme="dark"] #librosPage .libros-pagination__controls > span,
html[data-theme="dark"] #librosPage .libros-pagination__controls strong,
html[data-theme="dark"] #librosPage .libros-loading,
html[data-theme="dark"] #librosPage .libros-loading strong,
html[data-theme="dark"] #librosPage .libros-loading span,
html[data-theme="dark"] #librosPage .libros-empty,
html[data-theme="dark"] #librosPage .libros-empty strong,
html[data-theme="dark"] #librosPage .libros-empty > span,
html[data-theme="dark"] #librosPage .libros-empty__icon,
body.dark #librosPage .libros-page__overline,
body.dark #librosPage .libros-page__title h1,
body.dark #librosPage .libros-page__title p,
body.dark #librosPage .libros-btn--secondary,
body.dark #librosPage .libros-metric,
body.dark #librosPage .libros-metric__icon,
body.dark #librosPage .libros-metric__content > span,
body.dark #librosPage .libros-metric__content > strong,
body.dark #librosPage .libros-metric__content > small,
body.dark #librosPage .libros-search,
body.dark #librosPage .libros-search > svg,
body.dark #librosPage .libros-search input,
body.dark #librosPage .libros-search input::placeholder,
body.dark #librosPage .libros-search__clear,
body.dark #librosPage .libros-filter,
body.dark #librosPage .libros-select,
body.dark #librosPage .libros-filter-field__label,
body.dark #librosPage .libros-filter-field__label span,
body.dark #librosPage .libros-filter-field input,
body.dark #librosPage .libros-filter-field select,
body.dark #librosPage .libros-table,
body.dark #librosPage .libros-table thead th,
body.dark #librosPage .libros-sort,
body.dark #librosPage .libros-table tbody td,
body.dark #librosPage .libros-code strong,
body.dark #librosPage .libros-code small,
body.dark #librosPage .libros-isbn,
body.dark #librosPage .libros-book,
body.dark #librosPage .libros-book > strong,
body.dark #librosPage .libros-book > small,
body.dark #librosPage .libros-mini-badge,
body.dark #librosPage .libros-cell-text,
body.dark #librosPage .libros-format,
body.dark #librosPage .libros-status,
body.dark #librosPage .libros-icon-btn,
body.dark #librosPage .libros-pagination,
body.dark #librosPage .libros-pagination__info,
body.dark #librosPage .libros-pagination__info strong,
body.dark #librosPage .libros-pagination__limit-wrap,
body.dark #librosPage .libros-pagination__limit,
body.dark #librosPage .libros-pagination__controls > span,
body.dark #librosPage .libros-pagination__controls strong,
body.dark #librosPage .libros-loading,
body.dark #librosPage .libros-loading strong,
body.dark #librosPage .libros-loading span,
body.dark #librosPage .libros-empty,
body.dark #librosPage .libros-empty strong,
body.dark #librosPage .libros-empty > span,
body.dark #librosPage .libros-empty__icon {
  color:
    #ffffff !important;
}


/* =========================================================
   DARK PAGE SURFACES
   ========================================================= */

html[data-theme="dark"] #librosPage .libros-panel,
html[data-theme="dark"] #librosPage .libros-toolbar,
html[data-theme="dark"] #librosPage .libros-table-area,
html[data-theme="dark"] #librosPage .libros-metric,
body.dark #librosPage .libros-panel,
body.dark #librosPage .libros-toolbar,
body.dark #librosPage .libros-table-area,
body.dark #librosPage .libros-metric {
  background:
    #0b0b0d;
}


html[data-theme="dark"] #librosPage .libros-search,
html[data-theme="dark"] #librosPage .libros-filter,
html[data-theme="dark"] #librosPage .libros-table thead th,
html[data-theme="dark"] #librosPage .libros-metric__icon,
html[data-theme="dark"] #librosPage .libros-empty__icon,
html[data-theme="dark"] #librosPage .libros-pagination__limit-wrap,
html[data-theme="dark"] #librosPage .libros-advanced-filters,
body.dark #librosPage .libros-search,
body.dark #librosPage .libros-filter,
body.dark #librosPage .libros-table thead th,
body.dark #librosPage .libros-metric__icon,
body.dark #librosPage .libros-empty__icon,
body.dark #librosPage .libros-pagination__limit-wrap,
body.dark #librosPage .libros-advanced-filters {
  background:
    #111114;
}


html[data-theme="dark"] #librosPage .libros-search:focus-within,
html[data-theme="dark"] #librosPage .libros-filter:hover,
html[data-theme="dark"] #librosPage .libros-filter:focus-within,
body.dark #librosPage .libros-search:focus-within,
body.dark #librosPage .libros-filter:hover,
body.dark #librosPage .libros-filter:focus-within {
  background:
    #151519;
}


html[data-theme="dark"] #librosPage .libros-filter-field input,
html[data-theme="dark"] #librosPage .libros-filter-field select,
body.dark #librosPage .libros-filter-field input,
body.dark #librosPage .libros-filter-field select {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


/* =========================================================
   DARK TABLE
   ========================================================= */

html[data-theme="dark"] #librosPage .libros-table tbody tr:hover,
body.dark #librosPage .libros-table tbody tr:hover {
  background:
    #111114;
}


html[data-theme="dark"] #librosPage .libros-format,
body.dark #librosPage .libros-format {
  border-color:
    #35353d;

  background:
    #111114;
}


html[data-theme="dark"] #librosPage .libros-status--active,
body.dark #librosPage .libros-status--active {
  border-color:
    #294837;

  background:
    #0f1b14;

  color:
    #bdf2cf !important;
}


html[data-theme="dark"] #librosPage .libros-status--inactive,
body.dark #librosPage .libros-status--inactive {
  border-color:
    #35353d;

  background:
    #131317;

  color:
    #ffffff !important;
}


/* =========================================================
   DARK ROW MENU
   ========================================================= */

html[data-theme="dark"] #librosPage .libros-row-menu,
body.dark #librosPage .libros-row-menu {
  border-color:
    #3d3d45;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] #librosPage .libros-row-menu button,
body.dark #librosPage .libros-row-menu button {
  color:
    #ffffff;
}


html[data-theme="dark"] #librosPage .libros-row-menu button:hover,
body.dark #librosPage .libros-row-menu button:hover {
  background:
    #1a1a1f;
}


html[data-theme="dark"] #librosPage .libros-row-menu button.is-danger,
body.dark #librosPage .libros-row-menu button.is-danger {
  color:
    #ffb4b4;
}


html[data-theme="dark"] #librosPage .libros-row-menu button.is-success,
body.dark #librosPage .libros-row-menu button.is-success {
  color:
    #b6f3ce;
}


/* =========================================================
   DARK MODAL TOKENS
   ========================================================= */

html[data-theme="dark"] .libros-modal,
body.dark .libros-modal {
  --lb-bg:
    #050505;

  --lb-surface:
    #0b0b0d;

  --lb-surface-soft:
    #111114;

  --lb-surface-hover:
    #151519;

  --lb-border:
    #29292f;

  --lb-border-strong:
    #44444c;

  --lb-text:
    #ffffff;

  --lb-violet:
    #a495dc;

  --lb-violet-soft:
    rgba(164, 149, 220, .10);

  --lb-success-bg:
    #0f1b14;

  --lb-success-border:
    #294837;

  --lb-danger-bg:
    #1f0d0d;

  --lb-danger-border:
    #5f2a2a;

  --lb-info-bg:
    #0c1420;

  --lb-info-border:
    #293d59;

  border-color:
    #303038;

  background:
    #0b0b0d;

  color:
    #ffffff;
}


/* =========================================================
   DARK MODAL MAIN
   ========================================================= */

html[data-theme="dark"] .libros-modal__header,
html[data-theme="dark"] .libros-modal__footer,
body.dark .libros-modal__header,
body.dark .libros-modal__footer {
  border-color:
    #29292f;

  background:
    #0b0b0d;
}


html[data-theme="dark"] .libros-modal__heading-icon,
body.dark .libros-modal__heading-icon {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-modal__heading-copy > span,
html[data-theme="dark"] .libros-modal__heading-copy h2,
body.dark .libros-modal__heading-copy > span,
body.dark .libros-modal__heading-copy h2 {
  color:
    #ffffff;
}


/* =========================================================
   DARK DETAIL
   ========================================================= */

html[data-theme="dark"] .libros-detail-hero,
html[data-theme="dark"] .libros-detail-tabs,
html[data-theme="dark"] .libros-info-grid,
html[data-theme="dark"] .libros-info-field,
html[data-theme="dark"] .libros-text-section,
html[data-theme="dark"] .libros-long-info,
html[data-theme="dark"] .libros-inline-empty,
html[data-theme="dark"] .libros-stock-deposit,
html[data-theme="dark"] .libros-gallery__item,
html[data-theme="dark"] .libros-file-card,
html[data-theme="dark"] .libros-image-card,
html[data-theme="dark"] .libros-file-manager-card,
html[data-theme="dark"] .libros-media-form,
body.dark .libros-detail-hero,
body.dark .libros-detail-tabs,
body.dark .libros-info-grid,
body.dark .libros-info-field,
body.dark .libros-text-section,
body.dark .libros-long-info,
body.dark .libros-inline-empty,
body.dark .libros-stock-deposit,
body.dark .libros-gallery__item,
body.dark .libros-file-card,
body.dark .libros-image-card,
body.dark .libros-file-manager-card,
body.dark .libros-media-form {
  border-color:
    #29292f;

  background:
    #0f0f12;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-detail-hero,
html[data-theme="dark"] .libros-detail-tabs,
html[data-theme="dark"] .libros-long-info,
html[data-theme="dark"] .libros-inline-empty,
body.dark .libros-detail-hero,
body.dark .libros-detail-tabs,
body.dark .libros-long-info,
body.dark .libros-inline-empty {
  background:
    #111114;
}


html[data-theme="dark"] .libros-detail-hero__cover,
body.dark .libros-detail-hero__cover {
  border-color:
    #35353d;

  background:
    #111114;

  color:
    #ffffff;
}


/* =========================================================
   DARK DETAIL TEXT
   ========================================================= */

html[data-theme="dark"] .libros-detail-hero__info h3,
html[data-theme="dark"] .libros-detail-hero__subtitle,
html[data-theme="dark"] .libros-detail-hero__meta span,
html[data-theme="dark"] .libros-chip,
html[data-theme="dark"] .libros-detail-tab,
html[data-theme="dark"] .libros-info-field__label,
html[data-theme="dark"] .libros-info-field__label span,
html[data-theme="dark"] .libros-info-field > strong,
html[data-theme="dark"] .libros-detail-section__title span,
html[data-theme="dark"] .libros-detail-section__title strong,
html[data-theme="dark"] .libros-detail-section__title > svg,
html[data-theme="dark"] .libros-text-section__header,
html[data-theme="dark"] .libros-text-section__header span,
html[data-theme="dark"] .libros-text-section__header svg,
html[data-theme="dark"] .libros-text-section > p,
html[data-theme="dark"] .libros-long-info > span,
html[data-theme="dark"] .libros-long-info > p,
html[data-theme="dark"] .libros-tags > span,
html[data-theme="dark"] .libros-inline-empty,
html[data-theme="dark"] .libros-inline-empty > strong,
html[data-theme="dark"] .libros-inline-empty > span,
body.dark .libros-detail-hero__info h3,
body.dark .libros-detail-hero__subtitle,
body.dark .libros-detail-hero__meta span,
body.dark .libros-chip,
body.dark .libros-detail-tab,
body.dark .libros-info-field__label,
body.dark .libros-info-field__label span,
body.dark .libros-info-field > strong,
body.dark .libros-detail-section__title span,
body.dark .libros-detail-section__title strong,
body.dark .libros-detail-section__title > svg,
body.dark .libros-text-section__header,
body.dark .libros-text-section__header span,
body.dark .libros-text-section__header svg,
body.dark .libros-text-section > p,
body.dark .libros-long-info > span,
body.dark .libros-long-info > p,
body.dark .libros-tags > span,
body.dark .libros-inline-empty,
body.dark .libros-inline-empty > strong,
body.dark .libros-inline-empty > span {
  color:
    #ffffff !important;
}


/* =========================================================
   DARK DETAIL TABS
   ========================================================= */

html[data-theme="dark"] .libros-detail-tab:hover,
html[data-theme="dark"] .libros-detail-tab.is-active,
body.dark .libros-detail-tab:hover,
body.dark .libros-detail-tab.is-active {
  border-color:
    #44444c;

  background:
    #1a1a1f;

  color:
    #ffffff;
}


/* =========================================================
   DARK TEXT SECTION HEADER
   ========================================================= */

html[data-theme="dark"] .libros-text-section__header,
body.dark .libros-text-section__header {
  border-color:
    #29292f;

  background:
    #111114;
}


/* =========================================================
   DARK FORM
   ========================================================= */

html[data-theme="dark"] .libros-form-tabs,
html[data-theme="dark"] .libros-form-section__header,
html[data-theme="dark"] .libros-switch,
body.dark .libros-form-tabs,
body.dark .libros-form-section__header,
body.dark .libros-switch {
  border-color:
    #29292f;

  background:
    #111114;
}


html[data-theme="dark"] .libros-form-tab,
html[data-theme="dark"] .libros-form-section__header span,
html[data-theme="dark"] .libros-form-section__header strong,
html[data-theme="dark"] .libros-form-section__header > svg,
html[data-theme="dark"] .libros-field__label,
html[data-theme="dark"] .libros-field__label > span,
html[data-theme="dark"] .libros-field__suffix,
html[data-theme="dark"] .libros-switch__content strong,
html[data-theme="dark"] .libros-switch__content small,
body.dark .libros-form-tab,
body.dark .libros-form-section__header span,
body.dark .libros-form-section__header strong,
body.dark .libros-form-section__header > svg,
body.dark .libros-field__label,
body.dark .libros-field__label > span,
body.dark .libros-field__suffix,
body.dark .libros-switch__content strong,
body.dark .libros-switch__content small {
  color:
    #ffffff !important;
}


html[data-theme="dark"] .libros-form-tab:hover,
html[data-theme="dark"] .libros-form-tab.is-active,
body.dark .libros-form-tab:hover,
body.dark .libros-form-tab.is-active {
  border-color:
    #44444c;

  background:
    #1a1a1f;
}


html[data-theme="dark"] .libros-field input,
html[data-theme="dark"] .libros-field select,
html[data-theme="dark"] .libros-field textarea,
body.dark .libros-field input,
body.dark .libros-field select,
body.dark .libros-field textarea {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-field input:hover,
html[data-theme="dark"] .libros-field select:hover,
html[data-theme="dark"] .libros-field textarea:hover,
body.dark .libros-field input:hover,
body.dark .libros-field select:hover,
body.dark .libros-field textarea:hover {
  border-color:
    #44444c;
}


html[data-theme="dark"] .libros-field input:focus,
html[data-theme="dark"] .libros-field select:focus,
html[data-theme="dark"] .libros-field textarea:focus,
body.dark .libros-field input:focus,
body.dark .libros-field select:focus,
body.dark .libros-field textarea:focus {
  border-color:
    #a495dc;

  background:
    #151519;
}


html[data-theme="dark"] .libros-field input::placeholder,
html[data-theme="dark"] .libros-field textarea::placeholder,
body.dark .libros-field input::placeholder,
body.dark .libros-field textarea::placeholder {
  color:
    #ffffff;

  opacity:
    .58;
}


/* =========================================================
   DARK SWITCH
   ========================================================= */

html[data-theme="dark"] .libros-switch:hover,
body.dark .libros-switch:hover {
  border-color:
    #44444c;

  background:
    #151519;
}


html[data-theme="dark"] .libros-switch__icon,
body.dark .libros-switch__icon {
  border-color:
    #33333a;

  background:
    #0b0b0d;

  color:
    #ffffff;
}


/* =========================================================
   DARK STOCK
   ========================================================= */

html[data-theme="dark"] .libros-stock-form-notice,
body.dark .libros-stock-form-notice {
  border-color:
    #293d59;

  background:
    #0c1420;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-stock-form-notice__icon,
body.dark .libros-stock-form-notice__icon {
  border-color:
    #293d59;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-stock-form-notice strong,
html[data-theme="dark"] .libros-stock-form-notice span,
body.dark .libros-stock-form-notice strong,
body.dark .libros-stock-form-notice span {
  color:
    #ffffff;
}


html[data-theme="dark"] .libros-stock-form-summary > div,
body.dark .libros-stock-form-summary > div {
  border-color:
    #294837;

  background:
    #0f1b14;

  color:
    #bdf2cf;
}


html[data-theme="dark"] .libros-stock-deposit__icon,
body.dark .libros-stock-deposit__icon {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-stock-deposit__info strong,
html[data-theme="dark"] .libros-stock-deposit__info span,
html[data-theme="dark"] .libros-stock-deposit__value span,
html[data-theme="dark"] .libros-stock-deposit__value strong,
body.dark .libros-stock-deposit__info strong,
body.dark .libros-stock-deposit__info span,
body.dark .libros-stock-deposit__value span,
body.dark .libros-stock-deposit__value strong {
  color:
    #ffffff;
}


/* =========================================================
   DARK MEDIA
   ========================================================= */

html[data-theme="dark"] .libros-media-header,
html[data-theme="dark"] .libros-media-form__header,
html[data-theme="dark"] .libros-media-form__footer,
body.dark .libros-media-header,
body.dark .libros-media-form__header,
body.dark .libros-media-form__footer {
  border-color:
    #29292f;

  background:
    #111114;
}


html[data-theme="dark"] .libros-media-header span,
html[data-theme="dark"] .libros-media-header strong,
html[data-theme="dark"] .libros-image-card__info strong,
html[data-theme="dark"] .libros-image-card__info span,
html[data-theme="dark"] .libros-file-card,
html[data-theme="dark"] .libros-file-card__info strong,
html[data-theme="dark"] .libros-file-card__info span,
html[data-theme="dark"] .libros-file-card__info small,
html[data-theme="dark"] .libros-file-card__open,
html[data-theme="dark"] .libros-file-manager-card__content strong,
html[data-theme="dark"] .libros-file-manager-card__content span,
html[data-theme="dark"] .libros-file-manager-card__content small,
html[data-theme="dark"] .libros-media-form__header span,
html[data-theme="dark"] .libros-media-form__header strong,
body.dark .libros-media-header span,
body.dark .libros-media-header strong,
body.dark .libros-image-card__info strong,
body.dark .libros-image-card__info span,
body.dark .libros-file-card,
body.dark .libros-file-card__info strong,
body.dark .libros-file-card__info span,
body.dark .libros-file-card__info small,
body.dark .libros-file-card__open,
body.dark .libros-file-manager-card__content strong,
body.dark .libros-file-manager-card__content span,
body.dark .libros-file-manager-card__content small,
body.dark .libros-media-form__header span,
body.dark .libros-media-form__header strong {
  color:
    #ffffff !important;
}


html[data-theme="dark"] .libros-media-count,
body.dark .libros-media-count {
  border-color:
    #33333a;

  background:
    #0b0b0d;

  color:
    #ffffff !important;
}


html[data-theme="dark"] .libros-media-form__icon,
html[data-theme="dark"] .libros-file-card__icon,
html[data-theme="dark"] .libros-file-manager-card__icon,
body.dark .libros-media-form__icon,
body.dark .libros-file-card__icon,
body.dark .libros-file-manager-card__icon {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] .libros-image-card__preview,
html[data-theme="dark"] .libros-gallery__image,
body.dark .libros-image-card__preview,
body.dark .libros-gallery__image {
  border-color:
    #29292f;

  background:
    #111114;
}


/* =========================================================
   DARK BUTTONS
   ========================================================= */

html[data-theme="dark"] #librosPage .libros-btn--secondary,
html[data-theme="dark"] .libros-modal .libros-btn--secondary,
body.dark #librosPage .libros-btn--secondary,
body.dark .libros-modal .libros-btn--secondary {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] #librosPage .libros-icon-btn,
html[data-theme="dark"] .libros-modal .libros-icon-btn,
body.dark #librosPage .libros-icon-btn,
body.dark .libros-modal .libros-icon-btn {
  border-color:
    #33333a;

  background:
    #111114;

  color:
    #ffffff;
}


html[data-theme="dark"] #librosPage .libros-icon-btn:hover,
html[data-theme="dark"] .libros-modal .libros-icon-btn:hover,
body.dark #librosPage .libros-icon-btn:hover,
body.dark .libros-modal .libros-icon-btn:hover {
  border-color:
    #44444c;

  background:
    #18181d;
}


/* =========================================================
   APP MOUNT / FULL WIDTH
   ========================================================= */

#librosPageMount {
  width:
    100%;

  max-width:
    none;

  min-width:
    0;

  margin:
    0;

  padding:
    0;

  overflow:
    visible;
}


.app-content:has(#librosPageMount),
main:has(#librosPageMount),
.content:has(#librosPageMount),
.page-content:has(#librosPageMount) {
  width:
    100%;

  max-width:
    none;

  min-width:
    0;

  overflow-x:
    clip;
}


/* =========================================================
   SCROLLBARS
   ========================================================= */

.libros-modal__body,
.libros-detail-tabs,
.libros-form-tabs {
  scrollbar-width:
    thin;

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


.libros-modal__body::-webkit-scrollbar {
  width:
    7px;
}


.libros-modal__body::-webkit-scrollbar-track {
  background:
    transparent;
}


.libros-modal__body::-webkit-scrollbar-thumb {
  border-radius:
    999px;

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


/* =========================================================
   RESPONSIVE · 1350
   ========================================================= */

@media (
  max-width:
    1350px
) {

  #librosPage .libros-metrics {
    grid-template-columns:
      repeat(
        5,
        minmax(0, 1fr)
      );
  }


  #librosPage .libros-toolbar {
    align-items:
      stretch;
  }


  #librosPage .libros-search {
    width:
      min(
        100%,
        430px
      );
  }


  #librosPage .libros-select {
    min-width:
      105px;
  }


  .libros-media-layout {
    grid-template-columns:
      minmax(0, 1fr)
      260px;
  }

}


/* =========================================================
   RESPONSIVE · 1100
   ========================================================= */

@media (
  max-width:
    1100px
) {

  #librosPage {
    padding:
      14px !important;
  }


  #librosPage .libros-page__header {
    align-items:
      flex-start;
  }


  #librosPage .libros-metrics {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );
  }


  #librosPage .libros-toolbar {
    flex-direction:
      column;
  }


  #librosPage .libros-search {
    width:
      100%;

    min-width:
      0;

    max-width:
      none;
  }


  #librosPage .libros-toolbar__filters {
    width:
      100%;

    justify-content:
      flex-start;

    flex-wrap:
      wrap;
  }


  #librosPage .libros-filter {
    flex:
      1 1 170px;
  }


  #librosPage .libros-select {
    width:
      100%;

    max-width:
      none;
  }


  #librosPage .libros-advanced-filters__grid {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );
  }


  #librosPage .libros-table thead th:nth-child(4) {
    width:
      19%;
  }


  #librosPage .libros-table thead th:nth-child(6),
  #librosPage .libros-table thead th:nth-child(7) {
    width:
      11%;
  }


  .libros-media-layout {
    grid-template-columns:
      1fr;
  }


  .libros-media-form {
    position:
      static;
  }


  .libros-media-grid {
    grid-template-columns:
      repeat(
        4,
        minmax(0, 1fr)
      );
  }

}


/* =========================================================
   RESPONSIVE · 900
   ========================================================= */

@media (
  max-width:
    900px
) {

  #librosPage .libros-page__header {
    flex-direction:
      column;

    gap:
      11px;
  }


  #librosPage .libros-page__actions {
    width:
      100%;

    justify-content:
      flex-start;
  }


  #librosPage .libros-metrics {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  #librosPage .libros-advanced-filters__grid {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


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


  .libros-info-grid:not(.libros-info-grid--physical)
  .libros-info-field:nth-child(3n),
  .libros-info-grid--physical
  .libros-info-field:nth-child(4n) {
    border-right:
      1px solid var(--lb-border);
  }


  .libros-info-grid
  .libros-info-field:nth-child(2n) {
    border-right:
      0;
  }


  .libros-info-grid:not(.libros-info-grid--physical)
  .libros-info-field:nth-last-child(-n + 3),
  .libros-info-grid--physical
  .libros-info-field:nth-last-child(-n + 4) {
    border-bottom:
      1px solid var(--lb-border);
  }


  .libros-info-grid
  .libros-info-field:nth-last-child(-n + 2) {
    border-bottom:
      0;
  }


  .libros-stock-deposits {
    grid-template-columns:
      1fr;
  }


  .libros-gallery {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );
  }


  .libros-media-grid {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      );
  }

}


/* =========================================================
   TABLET / MOBILE TABLE -> CARDS
   ========================================================= */

@media (
  max-width:
    760px
) {

  #librosPage {
    padding:
      10px !important;
  }


  #librosPage .libros-page__title h1 {
    font-size:
      24px;
  }


  #librosPage .libros-page__title p {
    font-size:
      10.5px;
  }


  #librosPage .libros-page__actions {
    display:
      grid;

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


  #librosPage .libros-page__actions .libros-btn {
    width:
      100%;
  }


  #librosPage .libros-toolbar__filters {
    display:
      grid;

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


  #librosPage .libros-filter,
  #librosPage .libros-toolbar__filters > .libros-btn {
    width:
      100%;

    min-width:
      0;
  }


  #librosPage .libros-advanced-filters__grid {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  #librosPage .libros-table-wrap {
    overflow:
      visible;
  }


  #librosPage .libros-table {
    display:
      block;
  }


  #librosPage .libros-table thead {
    display:
      none;
  }


  #librosPage .libros-table tbody {
    display:
      grid;

    gap:
      8px;

    padding:
      8px;
  }


  #librosPage .libros-table tbody tr {
    width:
      100%;

    min-width:
      0;

    display:
      grid;

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

    gap:
      0;

    overflow:
      visible;

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

    border-radius:
      11px;

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


  #librosPage .libros-table tbody tr:hover {
    background:
      var(--lb-surface);
  }


  #librosPage .libros-table tbody td {
    position:
      relative;

    min-height:
      52px;

    height:
      auto;

    display:
      flex;

    flex-direction:
      column;

    align-items:
      flex-start;

    justify-content:
      center;

    gap:
      4px;

    padding:
      20px 8px 7px;

    overflow:
      visible;

    border-right:
      1px solid var(--lb-border);

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


  #librosPage .libros-table tbody td::before {
    content:
      attr(data-label);

    position:
      absolute;

    top:
      6px;

    left:
      8px;

    max-width:
      calc(100% - 16px);

    overflow:
      hidden;

    color:
      var(--lb-text);

    font-size:
      6.5px;

    font-weight:
      900;

    line-height:
      1;

    letter-spacing:
      .05em;

    text-overflow:
      ellipsis;

    text-transform:
      uppercase;

    white-space:
      nowrap;

    opacity:
      .72;
  }


  #librosPage .libros-table tbody td:nth-child(3n) {
    border-right:
      0;
  }


  #librosPage .libros-table tbody td:nth-last-child(-n + 3) {
    border-bottom:
      0;
  }


  #librosPage .libros-table tbody td.libros-col-image {
    grid-row:
      span 2;

    min-height:
      104px;

    padding:
      8px;

    align-items:
      center;

    justify-content:
      center;
  }


  #librosPage .libros-table tbody td.libros-col-image::before {
    display:
      none;
  }


  #librosPage .libros-cover {
    width:
      38px;

    height:
      48px;
  }


  #librosPage .libros-cell-book {
    grid-column:
      span 2;
  }


  #librosPage .libros-col-actions {
    align-items:
      center !important;

    justify-content:
      center !important;
  }


  #librosPage .libros-row-actions {
    width:
      100%;

    justify-content:
      flex-start;
  }


  #librosPage .libros-row-menu {
    top:
      calc(100% + 5px);

    right:
      auto;

    left:
      0;

    width:
      min(
        220px,
        calc(100vw - 34px)
      );
  }


  #librosPage .libros-pagination {
    flex-direction:
      column;

    align-items:
      stretch;
  }


  #librosPage .libros-pagination__right {
    width:
      100%;

    justify-content:
      space-between;
  }


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


  .libros-field--full {
    grid-column:
      auto;
  }


  .libros-form-switches {
    grid-template-columns:
      1fr;
  }


  .libros-modal-backdrop {
    align-items:
      flex-start;

    padding:
      10px;
  }


  .libros-modal,
  .libros-modal--large,
  .libros-modal--xlarge {
    width:
      100%;

    max-height:
      calc(100dvh - 20px);

    border-radius:
      12px;
  }


  .libros-modal__body {
    padding:
      10px;
  }


  .libros-modal__footer {
    flex-wrap:
      wrap;
  }


  .libros-modal__footer .libros-btn {
    flex:
      1 1 150px;
  }


  .libros-detail-hero {
    grid-template-columns:
      64px
      minmax(0, 1fr);

    gap:
      10px;
  }


  .libros-detail-hero__cover {
    width:
      64px;

    height:
      80px;
  }


  .libros-detail-hero__info h3 {
    font-size:
      15px;
  }


  .libros-info-grid,
  .libros-info-grid--physical {
    grid-template-columns:
      1fr;
  }


  .libros-info-grid
  .libros-info-field,
  .libros-info-grid
  .libros-info-field:nth-child(2n),
  .libros-info-grid
  .libros-info-field:nth-child(3n),
  .libros-info-grid--physical
  .libros-info-field:nth-child(4n) {
    border-right:
      0;
  }


  .libros-info-grid
  .libros-info-field:nth-last-child(-n + 2),
  .libros-info-grid:not(.libros-info-grid--physical)
  .libros-info-field:nth-last-child(-n + 3),
  .libros-info-grid--physical
  .libros-info-field:nth-last-child(-n + 4) {
    border-bottom:
      1px solid var(--lb-border);
  }


  .libros-info-grid
  .libros-info-field:last-child {
    border-bottom:
      0;
  }


  .libros-stock-deposits {
    grid-template-columns:
      1fr;
  }


  .libros-gallery {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  .libros-media-grid {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }


  .libros-media-layout {
    grid-template-columns:
      1fr;
  }


  .libros-media-form {
    position:
      static;
  }

}


/* =========================================================
   MOBILE · 520
   ========================================================= */

@media (
  max-width:
    520px
) {

  #librosPage {
    padding:
      8px !important;
  }


  #librosPage .libros-page__header {
    margin-bottom:
      10px;
  }


  #librosPage .libros-page__actions {
    grid-template-columns:
      1fr;
  }


  #librosPage .libros-metrics {
    grid-template-columns:
      1fr;
  }


  #librosPage .libros-metric {
    min-height:
      68px;
  }


  #librosPage .libros-toolbar {
    padding:
      8px;
  }


  #librosPage .libros-toolbar__filters {
    grid-template-columns:
      1fr;
  }


  #librosPage .libros-advanced-filters__grid {
    grid-template-columns:
      1fr;
  }


  #librosPage .libros-advanced-filters__footer {
    justify-content:
      stretch;
  }


  #librosPage .libros-advanced-filters__footer .libros-btn {
    width:
      100%;
  }


  #librosPage .libros-table tbody {
    padding:
      6px;
  }


  #librosPage .libros-table tbody tr {
    grid-template-columns:
      46px
      minmax(0, 1fr);
  }


  #librosPage .libros-table tbody td {
    border-right:
      0;

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


  #librosPage .libros-table tbody td.libros-col-image {
    grid-row:
      span 3;
  }


  #librosPage .libros-cell-book {
    grid-column:
      auto;
  }


  #librosPage .libros-table tbody td:last-child {
    border-bottom:
      0;
  }


  #librosPage .libros-pagination__right {
    flex-direction:
      column;

    align-items:
      stretch;
  }


  #librosPage .libros-pagination__limit-wrap {
    width:
      100%;

    justify-content:
      center;
  }


  #librosPage .libros-pagination__controls {
    width:
      100%;

    justify-content:
      space-between;
  }


  .libros-modal-backdrop {
    padding:
      6px;
  }


  .libros-modal,
  .libros-modal--large,
  .libros-modal--xlarge {
    max-height:
      calc(100dvh - 12px);

    border-radius:
      10px;
  }


  .libros-modal__header {
    min-height:
      52px;

    padding:
      8px;
  }


  .libros-modal__heading-icon {
    width:
      30px;

    height:
      30px;

    flex-basis:
      30px;
  }


  .libros-modal__heading-copy h2 {
    font-size:
      12.5px;
  }


  .libros-modal__body {
    padding:
      8px;
  }


  .libros-modal__footer {
    padding:
      8px;

    display:
      grid;

    grid-template-columns:
      1fr;
  }


  .libros-modal__footer .libros-btn {
    width:
      100%;
  }


  .libros-detail-hero {
    grid-template-columns:
      56px
      minmax(0, 1fr);

    padding:
      8px;
  }


  .libros-detail-hero__cover {
    width:
      56px;

    height:
      70px;
  }


  .libros-detail-hero__info h3 {
    font-size:
      14px;
  }


  .libros-detail-hero__meta {
    gap:
      5px;
  }


  .libros-detail-tab,
  .libros-form-tab {
    min-height:
      30px;

    padding:
      0 8px;

    font-size:
      7.5px;
  }


  .libros-stock-form-notice {
    grid-template-columns:
      30px
      minmax(0, 1fr);

    padding:
      8px;
  }


  .libros-stock-form-notice__icon {
    width:
      30px;

    height:
      30px;
  }


  .libros-stock-form-notice strong {
    white-space:
      normal;
  }


  .libros-stock-deposit {
    grid-template-columns:
      30px
      minmax(0, 1fr)
      auto;

    padding:
      8px;
  }


  .libros-stock-deposit__icon {
    width:
      30px;

    height:
      30px;
  }


  .libros-gallery,
  .libros-media-grid {
    grid-template-columns:
      1fr;
  }


  .libros-file-card {
    grid-template-columns:
      32px
      minmax(0, 1fr)
      16px;
  }


  .libros-file-manager-card {
    grid-template-columns:
      32px
      minmax(0, 1fr);
  }


  .libros-file-manager-card__actions {
    grid-column:
      1 / -1;

    justify-content:
      flex-end;
  }


  .libros-file-card__icon,
  .libros-file-manager-card__icon {
    width:
      32px;

    height:
      32px;
  }


  .libros-toast-container {
    top:
      10px;

    right:
      10px;

    width:
      calc(100vw - 20px);
  }

}


/* =========================================================
   ACTION MENU ALWAYS VISIBLE
   ========================================================= */

#librosPage .libros-panel,
#librosPage .libros-table-area,
#librosPage .libros-table-wrap,
#librosPage .libros-table,
#librosPage .libros-table tbody,
#librosPage .libros-table tbody tr,
#librosPage .libros-table tbody td,
#librosPage .libros-col-actions,
#librosPage .libros-row-actions {
  overflow:
    visible;
}


#librosPage .libros-table tbody tr:has(.libros-row-menu) {
  z-index:
    999;
}


#librosPage .libros-row-actions:has(.libros-row-menu) {
  z-index:
    1000;
}


/* =========================================================
   DARK SVG / ICON FIX
   ========================================================= */

html[data-theme="dark"] #librosPage svg,
html[data-theme="dark"] .libros-modal svg,
body.dark #librosPage svg,
body.dark .libros-modal svg {
  color:
    currentColor;
}


html[data-theme="dark"] .libros-icon-btn--danger,
body.dark .libros-icon-btn--danger {
  color:
    #ffb4b4 !important;
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (
  prefers-reduced-motion:
    reduce
) {

  #librosPage *,
  #librosPage *::before,
  #librosPage *::after,
  .libros-modal,
  .libros-modal *,
  .libros-image-preview,
  .libros-toast {
    scroll-behavior:
      auto !important;

    animation-duration:
      .01ms !important;

    animation-iteration-count:
      1 !important;

    transition-duration:
      .01ms !important;
  }

}


/* =========================================================
   FIN
   ========================================================= */