/* Polaris Tecnologia — identidade sobre o File Browser oficial (branding.files). Sem fork: só sobrescreve.
   Cor da marca = a do site polaristecnologia.com.br (#236B8E). Login no mesmo desenho do sistema Arthrom:
   painel azul de boas-vindas à esquerda, cartão branco de acesso à direita; no celular, só o cartão. */
:root {
  --blue: #236B8E;
  --dark-blue: #1a5370;
  --icon-blue: #236B8E;
}

/* A página não pula quando a barra de rolagem aparece/some. */
html { scrollbar-gutter: stable; background: #fff; }

/* ------------------------------------------------------------------ login */
#login {
  background:
    radial-gradient(circle at 0 0, rgba(255, 255, 255, .08) 0 140px, transparent 141px),
    radial-gradient(circle at 72% 108%, rgba(255, 255, 255, .07) 0 280px, transparent 281px),
    linear-gradient(160deg, #2b7ca6 0%, #236B8E 42%, #163c52 100%);
  --cartao: min(540px, 40vw);
  --texto: min(520px, 44vw);
}
/* Boas-vindas (lado azul), centralizadas no espaço à esquerda do cartão. */
#login::before,
#login::after {
  position: fixed;
  left: calc((100vw - var(--cartao) - var(--texto)) / 2);
  width: var(--texto);
  color: #fff;
  font-family: Roboto, "Segoe UI", Arial, sans-serif;
  white-space: pre-line;
}
#login::before {
  content: "Bem-vindo ao\A Painel de Backup";
  top: calc(50% - 150px);
  font-size: 40px;
  font-weight: 700;
  line-height: 1.15;
}
#login::after {
  content: "Seus backups guardados com segurança e disponíveis quando você precisar.\A\A"
           "\2713  Acesso de qualquer lugar, com conexão protegida\A"
           "\2713  Cada usuário vê apenas as próprias pastas\A"
           "\2713  Cópias preservadas: nada é alterado sem autorização";
  top: calc(50% - 30px);
  font-size: 16px;
  line-height: 1.75;
  color: rgba(255, 255, 255, .86);
}

/* Cartão de acesso (lado branco). */
#login form {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  transform: none;
  width: var(--cartao);
  max-width: none;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: safe center;
  overflow-y: auto;
  padding: 48px clamp(28px, 4.5vw, 72px) 64px;
  background: #fff;
  border-radius: 56px 0 0 56px;
  box-shadow: -24px 0 60px rgba(10, 30, 45, .18);
}
#login form::before {
  content: "\00A9  2026 Polaris Tecnologia";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 22px;
  text-align: center;
  font-size: 12px;
  color: #7b8794;
}
#login img { order: 0; width: 15em; max-width: 100%; height: auto; margin: 0 auto 2.4em; display: block; }
#login h1 { order: 1; font-size: 0; margin: 0 0 6px; text-align: left; }
#login h1::before {
  content: "ACESSO";
  display: block;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .18em;
  color: #236B8E;
}
#login h1::after { content: "Entrar"; display: block; font-size: 30px; font-weight: 700; line-height: 1.2; color: #1b2733; }
#login form::after { content: "Informe suas credenciais para acessar."; order: 2; margin: 0 0 20px; font-size: 15px; color: #5f6b7a; }
#login form > :not(img):not(h1) { order: 3; }

#login .input {
  height: 50px;
  margin: 0 0 14px;
  padding: 0 14px 0 50px;
  border: 1px solid #d6dee6;
  border-radius: 10px;
  background-color: #f4f7fa;
  background-repeat: no-repeat;
  background-position: 17px center;
  background-size: 18px 18px;
  font-size: 15px;
  color: #1b2733;
  box-sizing: border-box;
}
#login .input:focus { border-color: #236B8E; background-color: #fff; box-shadow: 0 0 0 3px rgba(35, 107, 142, .15); }
#login .input[type="text"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23236B8E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-7 8-7s8 3 8 7'/%3E%3C/svg%3E");
}
#login .input[type="password"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23236B8E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E");
}
/* Botão: o texto do File Browser ("Login") vira "Entrar" com ícone, desenhado por cima. */
#login .button {
  height: 52px;
  margin-top: 8px;
  border: 0;
  border-radius: 10px;
  font-size: 0;
  color: transparent;
  cursor: pointer;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='24' viewBox='0 0 120 24'%3E%3Cg fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 4h4a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2h-4'/%3E%3Cpath d='M10 17l5-5-5-5M15 12H3'/%3E%3C/g%3E%3Ctext x='32' y='18' fill='white' font-family='Roboto, Segoe UI, Arial, sans-serif' font-size='17' font-weight='700'%3EEntrar%3C/text%3E%3C/svg%3E") center / 120px 24px no-repeat,
    linear-gradient(180deg, #2a7ba3 0%, #1a5370 100%);
  box-shadow: 0 10px 22px rgba(35, 107, 142, .28);
}
#login .button:hover { filter: brightness(1.08); }
#login .wrong { border-radius: 10px; margin: 0 0 14px; }

/* Celular e tablet em pé: some o painel azul, o cartão ocupa a tela. */
@media (max-width: 900px) {
  #login {
    background:
      radial-gradient(circle at 0 0, #eef3f7 0 140px, transparent 141px),
      radial-gradient(circle at 100% 100%, #eef3f7 0 220px, transparent 221px),
      #fff;
  }
  #login::before, #login::after { display: none; }
  #login form {
    width: 100%;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    padding: 40px max(24px, calc(50% - 210px)) 64px;
  }
}

/* ------------------------------------------------------------------ dentro do sistema */
/* Topo: a logo é larga, então fixa a altura e deixa a largura proporcional. */
header img { height: 2.1em; width: auto; }

/* Azuis fixos do File Browser que não usam a variável. */
.progress div,
.upload-files .file .file-progress div { background-color: #236B8E; }
.share__box__icon i { color: #236B8E; }
.Vue-Toastification__toast--info { background-color: #236B8E; }