@import "../../elastic/styles/styles.min.css";

/* ===================== MOONS · Crypto.ba Mail ===================== */
/* accent */
a{color:#7c3aed}
a:hover{color:#8b5cf6}
.btn.btn-primary,button.btn.btn-primary,input.btn.btn-primary{background-color:#7c3aed;border-color:#7c3aed}
.btn.btn-primary:hover,button.btn.btn-primary:hover,input.btn.btn-primary:hover{background-color:#8b5cf6;border-color:#8b5cf6}
.listing tbody tr.selected>td,ul.listing li.selected>a,ul.treelist li.selected>a{background-color:rgba(124,58,237,.14)}
.form-control:focus{border-color:#8b5cf6;box-shadow:0 0 0 .12rem rgba(139,92,246,.28)}
#taskmenu a.selected,#taskmenu a.selected .inner,#taskmenu a:hover{color:#7c3aed}

/* ===================== LOGIN — svemirska konzola ===================== */
body.task-login{background:#0a0b16 !important}
body.task-login #layout,body.task-login #layout>.wrapper{background:transparent !important}
body.task-login #layout-content{
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:
    radial-gradient(60vw 46vh at 82% -8%,rgba(124,58,237,.24),transparent 60%),
    radial-gradient(56vw 46vh at 8% 108%,rgba(56,224,217,.12),transparent 60%),
    #0a0b16 !important;
  position:relative;overflow:hidden
}
body.task-login #layout-content::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  animation:moonstw 5s ease-in-out infinite alternate;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 22%,#fff,transparent),
    radial-gradient(1.2px 1.2px at 34% 68%,#c4b5fd,transparent),
    radial-gradient(1.5px 1.5px at 68% 34%,#38e0d9,transparent),
    radial-gradient(1.1px 1.1px at 82% 74%,#fff,transparent),
    radial-gradient(1.3px 1.3px at 52% 12%,#fff,transparent),
    radial-gradient(1.2px 1.2px at 24% 84%,#a5b4fc,transparent),
    radial-gradient(1.4px 1.4px at 90% 18%,#fff,transparent),
    radial-gradient(1px 1px at 46% 52%,#fff,transparent),
    radial-gradient(1.2px 1.2px at 6% 58%,#fff,transparent),
    radial-gradient(1.3px 1.3px at 74% 88%,#c4b5fd,transparent),
    radial-gradient(1px 1px at 60% 76%,#fff,transparent),
    radial-gradient(1.2px 1.2px at 16% 40%,#fff,transparent)
}
@keyframes moonstw{from{opacity:.3}to{opacity:.62}}
@media (prefers-reduced-motion:reduce){body.task-login #layout-content::before{animation:none}}

body.task-login #logo{position:relative;z-index:1;width:228px;height:auto;margin:0 auto 26px;display:block;filter:drop-shadow(0 0 16px rgba(139,92,246,.5))}

body.task-login #login-form{
  position:relative;z-index:1;width:min(92vw,384px);margin:0 auto;
  background:linear-gradient(180deg,rgba(24,28,56,.9),rgba(16,19,40,.96)) !important;
  border:1px solid #282d54 !important;border-radius:20px !important;padding:30px 28px !important;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.72);backdrop-filter:blur(8px)
}
body.task-login #login-form .form-control{background:#0b0d1c !important;border-color:#2a2f57 !important;color:#e9eaf7 !important}
body.task-login #login-form .form-control::placeholder{color:#565b82}
body.task-login #login-form label{color:#a6abcf !important}
body.task-login #login-form .input-group-text{color:#8b5cf6 !important;background:#0b0d1c !important;border-color:#2a2f57 !important}
body.task-login #login-form .btn.btn-primary,body.task-login #login-form button[type=submit]{
  width:100%;background:linear-gradient(180deg,#8b5cf6,#7c3aed) !important;border:0 !important;
  padding:12px !important;font-weight:600;letter-spacing:.02em;
  box-shadow:0 12px 30px -12px rgba(139,92,246,.6)
}
body.task-login #login-form .btn.btn-primary:hover{filter:brightness(1.08)}
body.task-login #login-footer{position:relative;z-index:1;color:#6b7099 !important;margin-top:16px}
body.task-login #login-footer a{color:#a6abcf !important}