/* MSL Automação - tela de login modernizada */

#login {
  background: radial-gradient(circle at 20% 20%, #1b3a57 0%, #10202f 45%, #0a1620 100%);
  overflow: hidden;
}

#login::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 85% 15%, rgba(41, 121, 255, 0.25), transparent 40%),
    radial-gradient(circle at 10% 85%, rgba(41, 121, 255, 0.18), transparent 45%);
  pointer-events: none;
}

#login img {
  width: 8em;
  height: auto;
  margin: 0 auto 1.2em;
  filter: drop-shadow(0 4px 18px rgba(0, 0, 0, 0.35));
}

#login h1 {
  display: none;
}

#login form {
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  padding: 2.5em 2em 2em;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
  max-width: 22em;
  width: 90%;
  animation: loginFadeIn 0.45s ease;
}

@keyframes loginFadeIn {
  from {
    opacity: 0;
    transform: translate(-50%, -46%);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%);
  }
}

#login .input {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  border-radius: 10px;
  padding: 0.75em 1em;
  transition: border-color 0.2s ease, background 0.2s ease;
}

#login .input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

#login .input:focus {
  background: rgba(255, 255, 255, 0.14);
  border-color: #2979ff;
  outline: none;
}

#login .input-group {
  margin-bottom: 1em;
}

#login .button--flat {
  color: rgba(255, 255, 255, 0.75);
}

#login button[type="submit"],
#login .button--block {
  background: linear-gradient(135deg, #2979ff, #1e88e5);
  border: none;
  border-radius: 10px;
  color: #fff;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0.85em 1em;
  margin-top: 0.5em;
  box-shadow: 0 8px 20px rgba(41, 121, 255, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

#login button[type="submit"]:hover,
#login .button--block:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(41, 121, 255, 0.45);
}

#login .wrong {
  border-radius: 10px;
  margin-bottom: 1em;
}

#login .logout-message {
  border-radius: 10px;
  margin-bottom: 1em;
}

#login p {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* MSL Automação - página pública de compartilhamento */

body:has(.share) {
  background: #f2f4f7;
}

.breadcrumbs {
  background: #fff !important;
  border-bottom: 1px solid #e6e9ee !important;
}

.share {
  gap: 1.25em;
  padding: 1.5em 1em 3em;
  align-items: flex-start !important;
}

.share__box {
  border: 1px solid #e6e9ee;
  border-radius: 16px !important;
  box-shadow: 0 8px 28px rgba(15, 30, 60, 0.08) !important;
  margin: 0 !important;
  overflow: hidden;
}

.share__box__header {
  background: linear-gradient(135deg, #2979ff, #1659c7);
  color: #fff !important;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 1em !important;
}

.share__box__element {
  border-top-color: #eef1f5 !important;
  padding: 1em 1.25em !important;
}

.share__box__icon i {
  color: #2979ff !important;
}

.share .button--flat {
  background: linear-gradient(135deg, #2979ff, #1e88e5);
  color: #fff !important;
  border-radius: 10px;
  padding: 0.7em 1.4em !important;
  font-weight: 600;
  box-shadow: 0 8px 20px rgba(41, 121, 255, 0.3);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.share .button--flat:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(41, 121, 255, 0.4);
}

.share__box__element canvas {
  border: 1px solid #eef1f5;
  border-radius: 10px;
  padding: 0.4em;
}

.share #listing .item {
  border-radius: 10px !important;
  margin-bottom: 0.4em !important;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.share #listing .item:hover {
  background: #f5f8ff !important;
  box-shadow: 0 4px 14px rgba(15, 30, 60, 0.08);
}

.share #listing .item .name {
  color: #1c2733;
}

.share #listing .item i {
  color: #2979ff !important;
}

/* Esconde o cartão "Baixar pasta / Pré-visualizar" inteiro na página
   pública de compartilhamento de pasta — sem o botão de baixar tudo
   como zip, sobrava só nome/tamanho/ícone genérico, sem utilidade.
   Continua aparecendo normalmente quando o link é de um arquivo
   individual (nesse caso #shareList não é renderizado). */
.share:has(#shareList) .share__box__info {
  display: none;
}

.share:has(#shareList) .share__box__items {
  flex: 1 1 auto;
  width: 100%;
  max-width: 960px;
  margin: 0 auto !important;
}

/* ================================================================
   MSL Automação - reskin geral do painel (app autenticado)
   Feito só com variáveis de tema + polimento visual (raio, sombra,
   transições). Nenhuma regra muda layout/estrutura, então nenhum
   recurso deixa de funcionar e futuras atualizações do File Browser
   continuam aplicando por cima normalmente.
   ================================================================ */

:root {
  --blue: #2979ff;
  --dark-blue: #1659c7;
}

:root.dark {
  --blue: #4c8dff;
  --dark-blue: #2979ff;
}

/* Botões sólidos (ação primária) ganham mais presença */
.button:not(.button--flat) {
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(41, 121, 255, 0.25);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.button:not(.button--flat):hover:not([disabled]) {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(41, 121, 255, 0.35);
}

.button--flat {
  border-radius: 6px !important;
  transition: background 0.15s ease;
}

/* Cartões e diálogos (prompts, configurações, upload) */
.card {
  border-radius: 14px !important;
  box-shadow: 0 10px 30px rgba(15, 30, 60, 0.12), 0 2px 8px rgba(15, 30, 60, 0.06) !important;
}

.card.floating {
  border-radius: 16px !important;
}

.overlay {
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

/* Barra lateral (sidebar) */
nav {
  box-shadow: 2px 0 16px rgba(0, 0, 0, 0.1) !important;
}

nav .action {
  border-radius: 8px;
  margin: 0.15em 0.5em;
  width: calc(100% - 1em) !important;
  transition: background 0.15s ease;
}

/* Cabeçalho principal do app */
header {
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Listagem de arquivos (área logada) - hover suave sem depender de
   cores fixas, para não quebrar o tema escuro */
#listing:not(.share *) .item {
  border-radius: 10px !important;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

#listing:not(.share *) .item:hover {
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

/* Abas de ordenação (nome/tamanho/modificado) */
.dashboard #nav ul li.active {
  font-weight: 600;
}

/* Barra de progresso de upload */
progress,
.progress {
  border-radius: 6px;
  overflow: hidden;
}