/* Mis pinturas: comparte el lenguaje visual del catálogo de pinturas. */
.app-shell > main { overflow-x: clip; }

.inventory-hero {
  position: relative;
  min-height: 250px;
  margin: -30px -34px 16px;
  padding: 42px 48px;
  overflow: hidden;
  border-bottom: 1px solid #6f532e;
  background:
    linear-gradient(90deg, #080d10f5 0, #080d10dc 43%, #080d1060 72%, #080d1020),
    url("assets/generated/hero-miniarchivum-archive.png") center 41% / cover no-repeat;
}

.inventory-hero::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, #080d10d9), repeating-linear-gradient(90deg, transparent 0 49px, #d8a95808 50px 51px);
  content: "";
  pointer-events: none;
}

.inventory-hero > div:first-child,
.inventory-hero blockquote,
.inventory-hero-counts {
  position: relative;
  z-index: 1;
}

.inventory-hero h2 {
  max-width: 650px;
  margin: 8px 0 10px;
  color: #f1eee7;
  font: 700 54px/1 Georgia, serif;
  text-shadow: 0 4px 18px #000;
}

.inventory-hero > div:first-child > p:last-child {
  max-width: 640px;
  margin: 0;
  color: #b8c0c3;
  font: 16px/1.5 Georgia, serif;
}

.inventory-hero blockquote {
  position: absolute;
  right: 42px;
  bottom: 34px;
  margin: 0;
  color: #d4aa66;
  font: italic 13px Georgia, serif;
}

.inventory-hero-counts {
  display: flex;
  gap: 30px;
  margin-top: 30px;
}

.inventory-hero-counts span {
  color: #9ca6aa;
  font-size: 10px;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.inventory-hero-counts b {
  padding-right: 6px;
  color: #e2b45f;
  font: 700 20px Georgia, serif;
}

.inventory-library-tabs {
  margin: 0 0 12px;
}

.inventory-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 12px;
  border: 1px solid #5a452b;
  background: #0c1215;
}

.inventory-stats > div {
  display: grid;
  grid-template-columns: 34px auto 1fr;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 10px 18px;
  border-right: 1px solid #3c3428;
}

.inventory-stats > div:last-child { border-right: 0; }
.inventory-stats svg { width: 24px; height: 24px; fill: none; stroke: #d3a14d; stroke-width: 1.8; }
.inventory-stats b { color: #eee9df; font: 700 24px Georgia, serif; }
.inventory-stats span { color: #899398; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }

.inventory-catalog-controls {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto 94px;
  align-items: end;
  gap: 8px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid #303a3f;
  background: #0c1317;
}

.inventory-catalog-controls label { display: grid; gap: 6px; }
.inventory-catalog-controls label > span { color: #9b8765; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.inventory-catalog-controls select { min-width: 0; height: 42px; padding: 0 11px; border: 1px solid #354147; background: #111a1f; color: #e5e2da; }
.inventory-add-catalog { min-height: 42px; border-radius: 1px; white-space: nowrap; }
.inventory-catalog-controls .paint-view-switch { height: 42px; }

.inventory-results-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin: 18px 0 10px;
}

.inventory-results-head b { display: block; color: #eee9df; font: 700 24px Georgia, serif; }
.inventory-results-head small { display: block; margin-top: 4px; color: #d5a552; font-size: 11px; font-weight: 800; }
.inventory-results-head p { max-width: 480px; margin: 0; color: #879297; font-size: 12px; text-align: right; }

.inventory-paint-collection { display: grid; }
.inventory-grid-collection { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.inventory-list-collection { gap: 3px; padding: 5px; border: 1px solid #263239; background: #091014; }
.inventory-paint-entry { min-width: 0; }
.inventory-paint-entry > summary { list-style: none; }
.inventory-paint-entry > summary::-webkit-details-marker { display: none; }
.inventory-grid-entry > summary { min-height: 260px; cursor: pointer; }
.inventory-grid-entry[open] > summary,
.inventory-list-entry[open] > summary { border-color: #b8873f; box-shadow: inset 0 0 0 1px #b8873f55; }

.inventory-list-header { grid-template-columns: 82px minmax(220px, 2fr) minmax(145px, 1.05fr) minmax(145px, 1fr) minmax(110px, .75fr) minmax(150px, .95fr) 54px; }

.inventory-level { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; margin-top: 14px; }
.inventory-level > span { height: 5px; overflow: hidden; border: 1px solid #374248; background: #080d10; }
.inventory-level i { display: block; height: 100%; background: linear-gradient(90deg, #916126, #dfb35c); }
.inventory-level b { color: #d6aa59; font-size: 10px; }
.inventory-manage { display: flex; align-items: center; justify-content: flex-end; color: #d7ad61; font-size: 11px; font-weight: 800; }

.inventory-paint-editor {
  padding: 18px 20px 20px;
  border: 1px solid #524126;
  border-top: 0;
  background: linear-gradient(180deg, #11191d, #0a1013);
  box-shadow: 0 16px 28px #0008;
}

.inventory-editor-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding-bottom: 12px; border-bottom: 1px solid #303a3f; }
.inventory-editor-heading small { color: #c79648; font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.inventory-editor-heading h3 { margin: 4px 0 0; color: #eee9df; font: 700 21px Georgia, serif; }
.inventory-editor-heading strong { color: #d8ad5f; font-size: 12px; }
.inventory-paint-editor .form-grid { margin-bottom: 12px; }
.inventory-remove-full { padding: 9px 12px; border: 1px solid #6f3434; background: #211314; color: #d88989; cursor: pointer; }
.inventory-materials { margin-top: 34px; padding-top: 10px; border-top: 1px solid #554226; }
.inventory-materials .section-head > span { color: #d5a552; font-size: 11px; }
.inventory-empty { padding: 50px 20px; }

@media (max-width: 1500px) {
  .inventory-list-header { grid-template-columns: 66px minmax(150px, 2fr) minmax(90px, .9fr) 100px 80px 108px 42px; }
  .inventory-grid-collection { grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); }
}

@media (max-width: 1050px) {
  .inventory-catalog-controls { grid-template-columns: 1fr 1fr; }
  .inventory-add-catalog { grid-column: 1; }
  .inventory-catalog-controls .paint-view-switch { grid-column: 2; grid-row: 3; }
  .inventory-grid-collection { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 850px) {
  .inventory-hero { margin: -22px -22px 14px; padding: 34px 28px; }
  .inventory-hero h2 { font-size: 42px; }
  .inventory-hero blockquote { display: none; }
  .inventory-stats { grid-template-columns: repeat(2, 1fr); }
  .inventory-stats > div:nth-child(2) { border-right: 0; }
  .inventory-stats > div:nth-child(-n+2) { border-bottom: 1px solid #3c3428; }
  .inventory-list-header { display: none; }
  .inventory-list-entry .paint-list-row { grid-template-columns: 72px minmax(145px, 1fr) 100px 42px; }
  .inventory-list-entry .paint-list-brand,
  .inventory-list-entry .paint-list-reference,
  .inventory-list-entry .paint-list-status { display: none; }
}

@media (max-width: 600px) {
  .inventory-hero { min-height: 210px; margin: -16px -16px 12px; padding: 28px 20px; }
  .inventory-hero h2 { font-size: 36px; }
  .inventory-hero-counts { gap: 12px; flex-wrap: wrap; }
  .inventory-catalog-controls { grid-template-columns: 1fr; }
  .inventory-add-catalog,
  .inventory-catalog-controls .paint-view-switch { grid-column: auto; grid-row: auto; }
  .inventory-results-head { align-items: flex-start; flex-direction: column; }
  .inventory-results-head p { text-align: left; }
  .inventory-grid-collection { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .inventory-paint-editor { padding: 14px; }
}