/**
 * Unimarket - Marketplace Styles
 * Estilos para o marketplace Unitá no estilo do marketplace GLPI
 */

/* Container principal */
.marketplace.unita {
   display: flex;
   flex-direction: column;
   padding: 1rem;
}

.marketplace.unita .top-panel {
   display: flex;
   gap: 0.75rem;
   align-items: center;
   flex-wrap: wrap;
   margin-bottom: 1rem;
}

.marketplace.unita .top-panel .unimarket-filter {
   flex: 1 1 260px;
}

.marketplace.unita .top-panel .unimarket-sort {
   flex: 0 0 220px;
   max-width: 240px;
}

/* Lista de plugins */
.marketplace.unita .plugins {
   list-style: none;
   padding: 0;
   margin: 0;
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
   gap: 1rem;
}

/* Card de plugin */
.marketplace.unita li.plugin {
   border: 1px solid var(--tblr-border-color, #e6e7e9);
   border-radius: 0.375rem;
   background: var(--tblr-card-bg, #fff);
   padding: 1rem;
   display: flex;
   flex-direction: column;
   transition: box-shadow 0.15s ease-in-out, border-color 0.15s ease-in-out;
   position: relative;
}

.marketplace.unita li.plugin:hover {
   box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

/* Plugin com atualização disponível */
.marketplace.unita li.plugin.plugin-update-available {
   border-color: var(--tblr-warning, #f59f00);
   border-width: 2px;
}

.marketplace.unita li.plugin.plugin-update-available::before {
   content: '';
   position: absolute;
   top: -1px;
   right: -1px;
   width: 0;
   height: 0;
   border-style: solid;
   border-width: 0 28px 28px 0;
   border-color: transparent var(--tblr-warning, #f59f00) transparent transparent;
   border-radius: 0 0.375rem 0 0;
}

/* Main content do card */
.marketplace.unita li.plugin .main {
   display: flex;
   gap: 1rem;
   flex: 1;
}

/* Ícone do plugin */
.marketplace.unita li.plugin .icon {
   flex-shrink: 0;
   width: 48px;
   height: 48px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.marketplace.unita li.plugin .icon img,
.marketplace.unita li.plugin .icon .plugin-icon {
   max-width: 48px;
   max-height: 48px;
   border-radius: 0.25rem;
}

.marketplace.unita li.plugin .icon .icon-text {
   width: 48px;
   height: 48px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 600;
   font-size: 1.25rem;
   border-radius: 0.375rem;
   text-transform: uppercase;
}

/* Detalhes do plugin */
.marketplace.unita li.plugin .details {
   flex: 1;
   min-width: 0;
   display: flex;
   flex-direction: column;
}

.marketplace.unita li.plugin .title {
   margin: 0 0 0.25rem;
   font-size: 1rem;
   font-weight: 600;
   color: var(--tblr-body-color, #1e293b);
   line-height: 1.3;
}

.marketplace.unita li.plugin .description {
   color: var(--tblr-muted, #626976);
   font-size: 0.8125rem;
   margin: 0;
   line-height: 1.4;
   display: -webkit-box;
   line-clamp: 2;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
}

/* Botões de ação */
.marketplace.unita li.plugin .buttons {
   display: flex;
   gap: 0.25rem;
   align-items: flex-start;
   flex-shrink: 0;
}

.marketplace.unita li.plugin .buttons form {
   display: inline-flex;
}

.marketplace.unita li.plugin .buttons button,
.marketplace.unita li.plugin .buttons .modify_plugin {
   padding: 0.375rem 0.5rem;
   border: none;
   background: var(--tblr-bg-surface, #f8fafc);
   cursor: pointer;
   border-radius: 0.25rem;
   color: var(--tblr-body-color, #1e293b);
   transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: 32px;
   min-height: 32px;
}

.marketplace.unita li.plugin .buttons button:hover,
.marketplace.unita li.plugin .buttons .modify_plugin:hover {
   background: var(--tblr-primary-lt, #e7f1ff);
   color: var(--tblr-primary, #206bc4);
}

.marketplace.unita li.plugin .buttons button i,
.marketplace.unita li.plugin .buttons .modify_plugin i {
   font-size: 1rem;
}

.marketplace.unita li.plugin .buttons .text-warning {
   color: var(--tblr-warning, #f59f00) !important;
}

.marketplace.unita li.plugin .buttons .text-danger {
   color: var(--tblr-danger, #d63939) !important;
}

/* Faixa de instalação (plugin disponível): branch + botão instalar */
.marketplace.unita li.plugin .unimarket-install-bar {
   display: flex;
   align-items: center;
   gap: 0.5rem;
   margin-top: 0.75rem;
}

.marketplace.unita li.plugin .unimarket-install-bar .unimarket-branch-select {
   flex: 1 1 auto;
   min-width: 0;
   max-width: 100%;
   text-overflow: ellipsis;
   border-radius: 0.50rem;
}

.marketplace.unita li.plugin .unimarket-install-bar .unimarket-install-btn {
   flex: 0 0 auto;
   display: inline-flex;
   align-items: center;
   white-space: nowrap;
   padding: 0.375rem 0.75rem;
   border: none;
   border-radius: 0.50rem;
   cursor: pointer;
   background: var(--tblr-primary, #206bc4);
   color: #fff;
   font-size: 0.8125rem;
   transition: background-color 0.15s ease-in-out;
}

.marketplace.unita li.plugin .unimarket-install-bar .unimarket-install-btn:hover {
   background: var(--tblr-primary-dark, #1a579d);
}

/* Footer do card */
.marketplace.unita li.plugin .footer {
   margin-top: 0.75rem;
   padding-top: 0.75rem;
   border-top: 1px solid var(--tblr-border-color, #e6e7e9);
   display: flex;
   justify-content: space-between;
   align-items: center;
   font-size: 0.75rem;
   color: var(--tblr-muted, #626976);
}

.marketplace.unita li.plugin .footer .misc-left,
.marketplace.unita li.plugin .footer .misc-right {
   display: flex;
   align-items: center;
   gap: 0.5rem;
}

.marketplace.unita li.plugin .footer .version {
   display: flex;
   align-items: center;
   gap: 0.25rem;
}

.marketplace.unita li.plugin .footer .badge {
   font-size: 0.6875rem;
   padding: 0.25em 0.5em;
}

/* Badges de status */
.bg-success-lt {
   background-color: rgba(47, 179, 68, 0.1) !important;
   color: #2fb344 !important;
}

.bg-warning-lt {
   background-color: rgba(245, 159, 0, 0.1) !important;
   color: #f59f00 !important;
}

.bg-secondary-lt {
   background-color: rgba(98, 105, 118, 0.1) !important;
   color: #626976 !important;
}

/* Indicador de atualização no marketplace GLPI */
li.plugin.unimarket-update-available {
   border-color: var(--tblr-warning, #f59f00) !important;
}

.unimarket-update-btn {
   animation: pulse 2s infinite;
}

@keyframes pulse {
   0% {
      opacity: 1;
   }
   50% {
      opacity: 0.6;
   }
   100% {
      opacity: 1;
   }
}

/* Responsividade */
@media (max-width: 768px) {
   .marketplace.unita .plugins {
      grid-template-columns: 1fr;
   }

   .marketplace.unita li.plugin .main {
      flex-wrap: wrap;
   }

   .marketplace.unita li.plugin .buttons {
      width: 100%;
      justify-content: flex-end;
      margin-top: 0.5rem;
   }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
   .marketplace.unita li.plugin {
      background: var(--tblr-card-bg, #1e2433);
      border-color: var(--tblr-border-color, #2c3547);
   }

   .marketplace.unita li.plugin .buttons button,
   .marketplace.unita li.plugin .buttons .modify_plugin {
      background: var(--tblr-bg-surface, #edeff5);
   }
}

/* Aba Unitá no marketplace */
.unimarket-tab .nav-link {
   display: flex;
   align-items: center;
   gap: 0.25rem;
}

.unimarket-tab .nav-link i {
   font-size: 1rem;
}

/* ------------------------------------------------------------------ */
/* Refatoração local-first: nome comercial/técnico, status e nova aba  */
/* ------------------------------------------------------------------ */

/* Nome técnico/repositório (informação complementar sob o título) */
.unimarket-tech-name {
   font-size: 0.8rem;
   line-height: 1.1;
   margin-top: -0.15rem;
   margin-bottom: 0.35rem;
   opacity: 0.75;
   word-break: break-word;
}

/* Linha de branch injetada na coluna de infos (.misc-right), estilo nativo. */
.marketplace .plugin .misc-right .unimarket-branch {
   display: flex;
   align-items: center;
   justify-content: flex-start;
   gap: 4px;
   max-width: 100%;
   font-size: 12px;
   opacity: 0.85;
}

.marketplace .plugin .misc-right .unimarket-branch .unimarket-branch-name {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 140px;
}

/* Linha de status (badge compacto + data da última verificação em texto suave). */
.marketplace .plugin .misc-right .unimarket-status-line {
   display: flex;
   align-items: center;
   justify-content: flex-start;
   flex-wrap: wrap;
   gap: 4px;
   margin-top: 3px;
}

.marketplace .plugin .unimarket-status-badge {
   white-space: nowrap;
   font-weight: 500;
}

.marketplace .plugin .unimarket-checked {
   font-size: 11px;
   white-space: nowrap;
}

/* Aba e container de "Unitá Atualizações" */
.unimarket-updates-nav-tab .nav-link {
   display: inline-flex;
   align-items: center;
}

/* ============================================================ */
/* Central de Atualizações Unitá (aba "Unitá Atualizações")     */
/* ============================================================ */
.marketplace .marketplace-updates {
   padding: 1.25rem;
   max-width: 1100px;
   margin: 0 auto;
}

/* Cabeçalho */
.marketplace-updates .uu-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 1rem;
   flex-wrap: wrap;
   margin-bottom: 1.25rem;
}

.marketplace-updates .uu-title-main {
   display: flex;
   align-items: center;
   gap: 0.5rem;
   margin: 0;
   font-size: 1.25rem;
   font-weight: 600;
   color: var(--tblr-body-color, #1e293b);
}

.marketplace-updates .uu-title-main i {
   color: var(--tblr-warning, #f59f00);
}

.marketplace-updates .uu-subtitle {
   margin: 0.15rem 0 0;
   font-size: 0.85rem;
   color: var(--tblr-muted, #626976);
}

/* Botão "Buscar atualizações" — arredondado (pill) */
.marketplace-updates .unimarket-refresh-updates {
   display: inline-flex;
   align-items: center;
   gap: 0.4rem;
   padding: 0.5rem 1.15rem;
   border: none;
   border-radius: 50rem;
   background: var(--tblr-primary, #206bc4);
   color: #fff;
   font-size: 0.875rem;
   font-weight: 500;
   cursor: pointer;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
   transition: background-color 0.15s ease-in-out, transform 0.05s ease-in-out, box-shadow 0.15s ease-in-out;
   white-space: nowrap;
}

.marketplace-updates .unimarket-refresh-updates:hover {
   background: var(--tblr-primary-darken, #1a579e);
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.marketplace-updates .unimarket-refresh-updates:active {
   transform: translateY(1px);
}

.marketplace-updates .unimarket-refresh-updates:disabled {
   opacity: 0.65;
   cursor: default;
}

/* Contador */
.marketplace-updates .uu-count {
   font-size: 0.8rem;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.03em;
   color: var(--tblr-muted, #626976);
   margin-bottom: 0.6rem;
}

/* Lista de cards */
.marketplace-updates .uu-list {
   display: flex;
   flex-direction: column;
   gap: 0.75rem;
}

/* Paginação (15 por página) da aba Unitá Atualizações */
.marketplace-updates .uu-pagination {
   margin-top: 1rem;
}

.marketplace-updates .uu-card {
   display: flex;
   align-items: center;
   gap: 1rem;
   padding: 0.85rem 1rem;
   border: 1px solid var(--tblr-border-color, #e6e7e9);
   border-left: 3px solid var(--tblr-warning, #f59f00);
   border-radius: 0.5rem;
   background: var(--tblr-card-bg, #fff);
   transition: box-shadow 0.15s ease-in-out;
}

.marketplace-updates .uu-card:hover {
   box-shadow: 0 0.125rem 0.35rem rgba(0, 0, 0, 0.08);
}

.marketplace-updates .uu-icon {
   flex-shrink: 0;
   width: 42px;
   height: 42px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.marketplace-updates .uu-icon img,
.marketplace-updates .uu-icon .plugin-icon {
   max-width: 42px;
   max-height: 42px;
   border-radius: 0.35rem;
}

.marketplace-updates .uu-icon .icon-text {
   width: 42px;
   height: 42px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 600;
   font-size: 1.1rem;
   border-radius: 0.35rem;
   text-transform: uppercase;
}

.marketplace-updates .uu-info {
   flex: 1;
   min-width: 0;
}

.marketplace-updates .uu-name {
   font-weight: 600;
   font-size: 0.95rem;
   color: var(--tblr-body-color, #1e293b);
   line-height: 1.25;
}

.marketplace-updates .uu-tech {
   font-weight: 400;
   font-size: 0.78rem;
   color: var(--tblr-muted, #8a94a6);
   margin-left: 0.35rem;
}

.marketplace-updates .uu-meta {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 0.4rem 0.9rem;
   margin-top: 0.35rem;
   font-size: 0.8rem;
   color: var(--tblr-muted, #626976);
}

.marketplace-updates .uu-meta i {
   margin-right: 2px;
}

.marketplace-updates .uu-version .uu-v-old {
   color: var(--tblr-muted, #8a94a6);
   text-decoration: line-through;
}

.marketplace-updates .uu-version .uu-v-new {
   color: var(--tblr-success, #2fb344);
   font-weight: 600;
}

.marketplace-updates .uu-version .ti-arrow-right {
   color: var(--tblr-muted, #8a94a6);
}

/* Botão "Atualizar" por item — arredondado */
.marketplace-updates .unimarket-item-update {
   flex-shrink: 0;
   display: inline-flex;
   align-items: center;
   gap: 0.35rem;
   padding: 0.4rem 0.95rem;
   border: 1px solid var(--tblr-warning, #f59f00);
   border-radius: 50rem;
   background: transparent;
   color: #c07a00;
   font-size: 0.83rem;
   font-weight: 500;
   cursor: pointer;
   white-space: nowrap;
   transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

.marketplace-updates .unimarket-item-update:hover {
   background: var(--tblr-warning, #f59f00);
   color: #fff;
}

.marketplace-updates .unimarket-item-update:disabled {
   opacity: 0.65;
   cursor: default;
}

/* Estado vazio */
.marketplace-updates .uu-empty {
   text-align: center;
   padding: 3rem 1rem;
   color: var(--tblr-muted, #626976);
}

.marketplace-updates .uu-empty-icon {
   font-size: 3rem;
   color: var(--tblr-success, #2fb344);
   opacity: 0.85;
}

.marketplace-updates .uu-empty-title {
   margin-top: 0.5rem;
   font-size: 1.05rem;
   font-weight: 600;
   color: var(--tblr-body-color, #1e293b);
}

.marketplace-updates .uu-empty-text {
   margin-top: 0.25rem;
   font-size: 0.85rem;
}

/* Responsivo: empilha ação abaixo em telas estreitas */
@media (max-width: 540px) {
   .marketplace-updates .uu-card {
      flex-wrap: wrap;
   }
   .marketplace-updates .uu-info {
      flex-basis: calc(100% - 58px);
   }
   .marketplace-updates .unimarket-item-update {
      margin-left: 58px;
   }
}

/* Destaque dos cards com atualização disponível (aba Instalado/Unitá) */
.marketplace .plugin.plugin-update-available {
   border-color: #f59f00;
}

/* Dark mode: cards da central de atualizações */
@media (prefers-color-scheme: dark) {
   .marketplace-updates .uu-card {
      background: var(--tblr-card-bg, #1e2433);
      border-color: var(--tblr-border-color, #2c3547);
   }
}
