/* ==========================================================
   NUBO_CATEGORY_GLOBAL_INTEGRATION_V1_START
   ========================================================== */

.nubo-global-category-icon {
  display: grid;
  place-items: center;

  flex: 0 0 auto;

  color:
    var(--category-color);

  background:
    color-mix(
      in srgb,
      var(--category-color) 13%,
      #ffffff
    );
}

.nubo-global-category-icon svg {
  display: block;

  width: 100%;
  height: 100%;
}


/* Selector visual */

.nubo-category-picker {
  grid-template-columns:
    repeat(
      auto-fit,
      minmax(104px, 1fr)
    ) !important;

  max-height: 440px;

  padding:
    2px
    4px
    6px
    2px;

  overflow-y: auto;
  overscroll-behavior: contain;
}

.nubo-category-picker__item {
  border-color:
    var(
      --category-border,
      #e2e8f0
    ) !important;

  background:
    color-mix(
      in srgb,
      var(--category-bg, #f8fafc) 44%,
      #ffffff
    ) !important;
}

.nubo-category-picker__item:hover {
  border-color:
    color-mix(
      in srgb,
      var(--category-color) 55%,
      #ffffff
    ) !important;

  background:
    color-mix(
      in srgb,
      var(--category-color) 6%,
      #ffffff
    ) !important;
}

.nubo-category-picker__item.is-selected {
  border-color:
    var(--category-color) !important;

  background:
    color-mix(
      in srgb,
      var(--category-color) 9%,
      #ffffff
    ) !important;
}

.nubo-category-picker__icon {
  color:
    var(--category-color) !important;

  background:
    color-mix(
      in srgb,
      var(--category-color) 14%,
      #ffffff
    ) !important;
}

.nubo-category-picker__icon svg {
  width: 23px;
  height: 23px;
}


/* Chips en Movimientos */

.nubo-category-chip.is-global-category {
  display: inline-flex !important;
  align-items: center !important;

  gap: 7px !important;

  min-height: 32px !important;

  padding:
    4px
    10px
    4px
    5px !important;

  border:
    1px solid
    var(
      --category-border,
      #e2e8f0
    ) !important;

  border-radius:
    999px !important;

  color:
    color-mix(
      in srgb,
      var(--category-color) 80%,
      #17233b
    ) !important;

  background:
    color-mix(
      in srgb,
      var(--category-bg, #f8fafc) 62%,
      #ffffff
    ) !important;

  font-weight:
    720 !important;
}

.nubo-global-category-icon--chip {
  width: 23px;
  height: 23px;

  padding: 5px;

  border-radius: 8px;
}


/* Dashboard */

.nubo-global-category-icon--dashboard {
  width: 32px;
  height: 32px;

  padding: 8px;

  border-radius: 11px;

  box-shadow:
    0 5px 13px
    color-mix(
      in srgb,
      var(--category-color) 10%,
      transparent
    );
}


/* Leyenda de Análisis */

.nubo-analysis-legend__item {
  display: grid !important;

  grid-template-columns:
    27px
    minmax(0, 1fr)
    auto !important;

  align-items: center !important;

  column-gap: 9px !important;
}

.nubo-global-category-icon--legend {
  grid-column: 1;

  width: 27px;
  height: 27px;

  padding: 7px;

  border-radius: 9px;
}

.nubo-analysis-legend__item
> span:not(.nubo-global-category-icon) {
  grid-column: 2;

  min-width: 0;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;
}

.nubo-analysis-legend__item
> strong {
  grid-column: 3;

  min-width: 43px;

  text-align: right;

  white-space: nowrap;
}


/* Ranking de Análisis */

.nubo-analysis-row__head
> div:first-child {
  display: flex !important;
  align-items: center !important;

  gap: 9px !important;
}

.nubo-global-category-icon--analysis {
  width: 31px;
  height: 31px;

  padding: 8px;

  border-radius: 10px;
}


/* Modo oscuro */

html[data-theme="dark"]
.nubo-global-category-icon {
  background:
    color-mix(
      in srgb,
      var(--category-color) 18%,
      #172022
    );
}

html[data-theme="dark"]
.nubo-category-picker__item {
  border-color:
    color-mix(
      in srgb,
      var(--category-color) 25%,
      #334155
    ) !important;

  background:
    color-mix(
      in srgb,
      var(--category-color) 7%,
      #172022
    ) !important;
}

html[data-theme="dark"]
.nubo-category-chip.is-global-category {
  border-color:
    color-mix(
      in srgb,
      var(--category-color) 28%,
      #26343a
    ) !important;

  color:
    color-mix(
      in srgb,
      var(--category-color) 70%,
      #ffffff
    ) !important;

  background:
    color-mix(
      in srgb,
      var(--category-color) 12%,
      #172022
    ) !important;
}


/* Responsive */

@media (max-width: 760px) {
  .nubo-category-picker {
    grid-template-columns:
      repeat(
        3,
        minmax(0, 1fr)
      ) !important;

    max-height: 410px;
  }
}

@media (max-width: 430px) {
  .nubo-category-picker {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      ) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nubo-category-picker__item {
    transition: none !important;
    animation: none !important;
  }
}

/* NUBO_CATEGORY_GLOBAL_INTEGRATION_V1_END */