/* Extraido de: /aplicacao/visualizacoes/autenticacao/login.php
   Em: 2026-04-23 03:56 */
/* Fundo escuro geral da página */
body {
    background: #0a0f1a !important;
    overflow: hidden !important;
}

/* Parede de tijolos */
.lp-wall {
    position: fixed; inset: 0; z-index: 0;
    background-color: #111827;
    background-image: url("data:image/svg+xml,%3Csvg width='120' height='60' viewBox='0 0 120 60' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='58' height='28' x='1' y='1' rx='2' fill='none' stroke='rgba(255,255,255,0.045)' stroke-width='1'/%3E%3Crect width='58' height='28' x='61' y='1' rx='2' fill='none' stroke='rgba(255,255,255,0.045)' stroke-width='1'/%3E%3Crect width='58' height='28' x='-29' y='31' rx='2' fill='none' stroke='rgba(255,255,255,0.045)' stroke-width='1'/%3E%3Crect width='58' height='28' x='31' y='31' rx='2' fill='none' stroke='rgba(255,255,255,0.045)' stroke-width='1'/%3E%3Crect width='58' height='28' x='91' y='31' rx='2' fill='none' stroke='rgba(255,255,255,0.045)' stroke-width='1'/%3E%3C/svg%3E");
    background-size: 120px 60px;
}

/* Luminária */
.lp-lamp {
    position: fixed; top: 0; left: 50%;
    transform: translateX(-50%);
    z-index: 20;
    display: flex; flex-direction: column; align-items: center;
    animation: lpSwing 4s ease-in-out infinite;
    transform-origin: top center;
    pointer-events: none;
}
@keyframes lpSwing {
    0%,100% { transform: translateX(-50%) rotate(0deg); }
    25%      { transform: translateX(-50%) rotate(1.5deg); }
    75%      { transform: translateX(-50%) rotate(-1.5deg); }
}
.lp-wire {
    width: 2px; height: 56px;
    background: linear-gradient(to bottom, rgba(255,255,255,.1), rgba(255,255,255,.25));
}
.lp-body {
    width: 130px; height: 46px;
    background: linear-gradient(180deg, #374151 0%, #1f2937 100%);
    clip-path: polygon(18% 0%, 82% 0%, 100% 100%, 0% 100%);
    border-radius: 0 0 4px 4px;
    position: relative;
    box-shadow: 0 2px 10px rgba(0,0,0,.5);
}
.lp-bulb {
    position: absolute; bottom: -9px; left: 50%;
    transform: translateX(-50%);
    width: 18px; height: 18px;
    background: #fbbf24;
    border-radius: 50%;
    box-shadow: 0 0 20px #fbbf24, 0 0 60px rgba(251,191,36,.5), 0 0 110px rgba(251,191,36,.3);
    animation: lpPulse 3s ease-in-out infinite;
}
@keyframes lpPulse {
    0%,100% { box-shadow: 0 0 20px #fbbf24, 0 0 60px rgba(251,191,36,.5), 0 0 110px rgba(251,191,36,.3); }
    50%      { box-shadow: 0 0 28px #fbbf24, 0 0 75px rgba(251,191,36,.6), 0 0 130px rgba(251,191,36,.38); }
}

/* Cone e glow da luz */
.lp-cone {
    position: fixed; top: 102px; left: 50%;
    transform: translateX(-50%);
    width: 0; height: 0;
    border-left: 260px solid transparent;
    border-right: 260px solid transparent;
    border-top: 580px solid rgba(251,191,36,.055);
    z-index: 1; pointer-events: none;
    filter: blur(28px);
    animation: lpSwing 4s ease-in-out infinite;
    transform-origin: top center;
}
.lp-glow {
    position: fixed; top: 95px; left: 50%;
    transform: translateX(-50%);
    width: 480px; height: 680px;
    background: radial-gradient(ellipse 50% 60% at 50% 0%,
        rgba(251,191,36,.10) 0%, rgba(251,191,36,.04) 42%, transparent 70%);
    z-index: 1; pointer-events: none;
    animation: lpSwing 4s ease-in-out infinite;
    transform-origin: top center;
}
.lp-wall-glow {
    position: fixed; top: 0; left: 50%;
    transform: translateX(-50%);
    width: 560px; height: 260px;
    background: radial-gradient(ellipse at 50% 100%,
        rgba(251,191,36,.07) 0%, transparent 70%);
    z-index: 1; pointer-events: none;
}

/* Partículas de poeira */
.lp-dust { position: fixed; top: 100px; left: calc(50% - 190px); width: 380px; height: 480px; z-index: 2; pointer-events: none; overflow: hidden; }
.lp-d { position: absolute; width: 3px; height: 3px; background: rgba(251,191,36,.35); border-radius: 50%; animation: lpDust linear infinite; }
.lp-d:nth-child(1) { left:18%; top:12%; animation-duration:8s;  animation-delay:0s; }
.lp-d:nth-child(2) { left:52%; top:28%; animation-duration:11s; animation-delay:-3s; width:2px; height:2px; }
.lp-d:nth-child(3) { left:34%; top:52%; animation-duration:10s; animation-delay:-6s; }
.lp-d:nth-child(4) { left:68%; top:18%; animation-duration:9s;  animation-delay:-2s; width:2px; height:2px; }
.lp-d:nth-child(5) { left:44%; top:62%; animation-duration:13s; animation-delay:-4s; }
.lp-d:nth-child(6) { left:14%; top:38%; animation-duration:12s; animation-delay:-7s; width:2px; height:2px; }
.lp-d:nth-child(7) { left:78%; top:44%; animation-duration:7s;  animation-delay:-1s; }
.lp-d:nth-child(8) { left:60%; top:10%; animation-duration:14s; animation-delay:-5s; width:2px; height:2px; }
@keyframes lpDust {
    0%   { transform:translate(0,0) scale(1); opacity:0; }
    10%  { opacity:.7; }
    50%  { transform:translate(12px,28px) scale(1.2); opacity:.4; }
    90%  { opacity:.5; }
    100% { transform:translate(-8px,55px) scale(.8); opacity:0; }
}

/* ── Adaptações do card para o tema escuro ── */
.ag-login-page {
    background: transparent !important;
    background-image: none !important;
    position: relative; z-index: 10;
    min-height: 100vh;
    margin-top: 70px; /* desloca para baixo da luminária */
    overflow-y: auto;
}
.ag-login-card {
    background: rgba(15, 23, 42, 0.80) !important;
    border: 1px solid rgba(96,165,250,.14) !important;
    backdrop-filter: blur(22px) !important;
    -webkit-backdrop-filter: blur(22px) !important;
    box-shadow: 0 0 0 1px rgba(251,191,36,.05),
                0 40px 80px rgba(0,0,0,.55),
                inset 0 1px 0 rgba(255,255,255,.06) !important;
    position: relative;
    overflow: hidden;
}
/* Fio de luz no topo do card */
.ag-login-card::before {
    content: '';
    position: absolute; top: -1px; left: 50%;
    transform: translateX(-50%);
    width: 180px; height: 3px;
    background: linear-gradient(90deg, transparent, rgba(251,191,36,.45), transparent);
    border-radius: 0 0 50% 50%;
}
.ag-login-card::after {
    content: '';
    position: absolute; top: 0; left: 50%;
    transform: translateX(-50%);
    width: 280px; height: 90px;
    background: radial-gradient(ellipse at 50% 0%, rgba(251,191,36,.06) 0%, transparent 70%);
    pointer-events: none;
}

/* Logo personalizado */
.lp-logo-wrap { text-align: center; margin-bottom: 26px; position: relative; z-index: 1; }
.lp-logo-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 56px; height: 56px; border-radius: 14px;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%);
    box-shadow: 0 8px 24px rgba(30,64,175,.5), 0 0 0 1px rgba(96,165,250,.3);
    margin-bottom: 12px;
    transition: transform .3s, box-shadow .3s;
}
.lp-logo-icon:hover { transform: scale(1.08); box-shadow: 0 12px 32px rgba(30,64,175,.65); }
.lp-logo-icon i { font-size: 1.5rem; color: #fff; }
.lp-logo-title {
    font-size: 1.9rem; font-weight: 900; color: #e2e8f0;
    letter-spacing: .04em; line-height: 1; display: block;
}
.lp-logo-title span { color: #60a5fa; }
.lp-logo-sub {
    font-size: .65rem; color: #f59e0b;
    letter-spacing: .35em; text-transform: uppercase;
    margin-top: 5px; font-weight: 600; display: block;
}

/* Divider */
.lp-divider {
    display: flex; align-items: center; gap: 10px;
    margin-bottom: 20px; position: relative; z-index: 1;
}
.lp-divider::before, .lp-divider::after {
    content: ''; flex: 1; height: 1px;
    background: linear-gradient(to right, transparent, rgba(96,165,250,.15), transparent);
}
.lp-divider span { font-size: .62rem; color: rgba(226,232,240,.35); letter-spacing: 2px; text-transform: uppercase; }

/* Campos e labels no escuro */
.ag-form-grupo label { color: rgba(226,232,240,.55) !important; font-size: .7rem !important; letter-spacing: 1.5px !important; }
.ag-input {
    background: rgba(255,255,255,.04) !important;
    border-color: rgba(96,165,250,.2) !important;
    color: #e2e8f0 !important;
    border-radius: 10px !important;
}
.ag-input::placeholder { color: rgba(226,232,240,.3) !important; }
.ag-input:focus {
    border-color: #fbbf24 !important;
    background: rgba(251,191,36,.04) !important;
    box-shadow: 0 0 0 3px rgba(251,191,36,.12) !important;
}
.ag-input:disabled { background: rgba(255,255,255,.02) !important; color: rgba(226,232,240,.3) !important; }
select.ag-input option { background: #1f2937; color: #e2e8f0; }
.ag-input-icone { color: rgba(226,232,240,.35) !important; }
.ag-input-wrapper:focus-within .ag-input-icone { color: #fbbf24 !important; }
.ag-input-toggle-senha { color: rgba(226,232,240,.35) !important; background: transparent !important; }
.ag-input-toggle-senha:hover { color: #fbbf24 !important; background: rgba(251,191,36,.06) !important; }

/* Botão Entrar */
.ag-btn-primario {
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%) !important;
    color: #fff !important; border: none !important;
    box-shadow: 0 4px 20px rgba(30,64,175,.5) !important;
    font-size: .9rem !important; font-weight: 700 !important;
    border-radius: 10px !important;
    position: relative; overflow: hidden;
    transition: transform .2s, box-shadow .2s !important;
}
.ag-btn-primario:hover:not(:disabled) {
    box-shadow: 0 6px 28px rgba(30,64,175,.7) !important;
    transform: translateY(-1px) !important;
}
.ag-btn-primario:disabled { opacity: .55 !important; }
/* Shimmer */
.ag-btn-primario::after {
    content: ''; position: absolute; top: 0; left: -100%;
    width: 100%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
    animation: lpShimmer 3s infinite;
}
@keyframes lpShimmer { 0% { left:-100%; } 100% { left:100%; } }

/* Alertas adaptados */
.ag-alerta-erro  { background: rgba(220,53,69,.12) !important; border-color: rgba(220,53,69,.3) !important; color: #fca5a5 !important; }
.ag-alerta-aviso { background: rgba(245,158,11,.1)  !important; border-color: rgba(245,158,11,.3) !important; color: #fde68a !important; }

/* Rodapé do card */
.ag-login-rodape { margin-top: 20px; text-align: center; }
.ag-login-link { color: rgba(226,232,240,.4) !important; font-size: .82rem !important; }
.ag-login-link:hover { color: #60a5fa !important; }

/* Links do rodapé LGPD */
.lp-footer-links { border-top: 1px solid rgba(96,165,250,.1) !important; margin-top: 18px; padding-top: 14px; text-align: center; }
.lp-footer-links p { color: rgba(226,232,240,.28) !important; font-size: .7rem; margin-bottom: 8px; }
.lp-footer-links a { color: rgba(226,232,240,.35) !important; font-size: .74rem; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.lp-footer-links a:hover { color: #f59e0b !important; }

/* Responsivo */
@media (max-width: 480px) {
    .ag-login-page { margin-top: 50px; }
    .lp-body { width: 96px; height: 36px; }
    .lp-wire { height: 38px; }
    .lp-cone { border-left-width: 170px; border-right-width: 170px; border-top-width: 500px; }
    .lp-logo-title { font-size: 1.5rem; }
}