/* APIs Page Premium Styles */

/* Container principal */
.apis-container {
  text-align: center;
}

.apis-loader {
  text-align: center;
  padding: 10px;
}

.api-logo-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Cards de API */
.api-logo {
  height: 38px;
  display: block;
  margin: 0 auto;
}

/* Centralizar links das imagens nos cards */
.md3-card > a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* Container do logo do Telegram com texto */
.telegram-logo-container {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0;
  text-decoration: none;
  color: inherit;
  cursor: default;
  width: 100%;
  margin: 0 auto;
}

.telegram-logo-container:hover {
  text-decoration: none;
  opacity: 1;
}

.telegram-logo {
  height: 38px;
  width: auto;
  margin-right: 0.5rem;
  display: block;
  margin-left: 0;
}

.telegram-text {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--color-text-primary, #1c1b1f);
  text-decoration: none;
}

/* Premium Dark Mode - Telegram text */
[data-theme='dark'] .telegram-text,
.adsx-premium .telegram-text {
  color: var(--adsx-text-bright, #ffffff) !important;
}

/* Card conectado - header com botão */
.api-card-connected {
  padding-top: 0.5rem;
  padding-right: 0.5rem;
}

.api-card-header {
  text-align: right;
}

/* Cursor pointer nos botões de deleção */
.api-card-header .icon-button {
  cursor: pointer;
}

/* Ícone de status conectado */
.api-status-icon {
  color: var(--color-online);
}

/* Premium Dark Mode Styles */
[data-theme='dark'] .api-card-header .icon-button,
.adsx-premium .api-card-header .icon-button {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0.5rem !important;
}

[data-theme='dark'] .api-card-header .icon-button:hover,
.adsx-premium .api-card-header .icon-button:hover {
  background-color: rgba(255, 255, 255, 0.05) !important;
  box-shadow: none !important;
}

[data-theme='dark'] .api-card-header .icon-button i,
.adsx-premium .api-card-header .icon-button i {
  color: var(--adsx-text-secondary, #a1a1aa) !important;
}

/* Status icon premium */
[data-theme='dark'] .api-status-icon,
.adsx-premium .api-status-icon {
  color: var(--adsx-success, #10b981) !important;
}

/* Card connected subtitle */
[data-theme='dark'] .card-connected,
.adsx-premium .card-connected {
  color: var(--adsx-text-secondary, #a1a1aa) !important;
}

/* GitHub logo - alternância por tema */
/* Padrão: light mode */
.github-logo-light {
  display: block !important;
}

.github-logo-dark {
  display: none !important;
}

/* Light mode - mesmo com adsx-premium */
[data-theme='light'] .github-logo-light,
[data-theme='light'] .adsx-premium .github-logo-light,
html:not([data-theme='dark']) .github-logo-light,
html:not([data-theme='dark']) .adsx-premium .github-logo-light {
  display: block !important;
}

[data-theme='light'] .github-logo-dark,
[data-theme='light'] .adsx-premium .github-logo-dark,
html:not([data-theme='dark']) .github-logo-dark,
html:not([data-theme='dark']) .adsx-premium .github-logo-dark {
  display: none !important;
}

/* Dark mode */
[data-theme='dark'] .github-logo-light,
[data-theme='dark'] .adsx-premium .github-logo-light {
  display: none !important;
}

[data-theme='dark'] .github-logo-dark,
[data-theme='dark'] .adsx-premium .github-logo-dark {
  display: block !important;
}

/* Cloudflare logo - alternância por tema */
/* Padrão: light mode */
.cloudflare-logo-light {
  display: block !important;
}

.cloudflare-logo-dark {
  display: none !important;
}

/* Light mode - mesmo com adsx-premium */
[data-theme='light'] .cloudflare-logo-light,
[data-theme='light'] .adsx-premium .cloudflare-logo-light,
html:not([data-theme='dark']) .cloudflare-logo-light,
html:not([data-theme='dark']) .adsx-premium .cloudflare-logo-light {
  display: block !important;
}

[data-theme='light'] .cloudflare-logo-dark,
[data-theme='light'] .adsx-premium .cloudflare-logo-dark,
html:not([data-theme='dark']) .cloudflare-logo-dark,
html:not([data-theme='dark']) .adsx-premium .cloudflare-logo-dark {
  display: none !important;
}

/* Dark mode */
[data-theme='dark'] .cloudflare-logo-light,
[data-theme='dark'] .adsx-premium .cloudflare-logo-light {
  display: none !important;
}

[data-theme='dark'] .cloudflare-logo-dark,
[data-theme='dark'] .adsx-premium .cloudflare-logo-dark {
  display: block !important;
}

/* Placeholder mais transparente para inputs dos cards de API */
[data-theme='dark'] .md3-card input::placeholder,
[data-theme='dark'] .md3-card input::-webkit-input-placeholder,
[data-theme='dark'] .md3-card input::-moz-placeholder,
[data-theme='dark'] .md3-card input:-ms-input-placeholder,
.adsx-premium .md3-card input::placeholder,
.adsx-premium .md3-card input::-webkit-input-placeholder,
.adsx-premium .md3-card input::-moz-placeholder,
.adsx-premium .md3-card input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.25) !important;
  opacity: 1 !important;
}