/* ============================================================
   AETHEL L2 — Medieval 2026 theme (custom overlay, loads after style.css)
   ============================================================ */

:root{
  --ael-bg:#05070c;
  --ael-bg2:#0a0e18;
  --ael-panel:rgba(14,18,28,.82);
  --ael-border:rgba(199,158,84,.28);
  --ael-gold:#c79e54;
  --ael-gold2:#f0d8a0;
  --ael-ember:#c0272d;
  --ael-text:#ede3cf;
  --ael-text-muted:#a89a7c;
}

/* ---------- Global base ---------- */
body{
  background:var(--ael-bg) !important;
  color:var(--ael-text) !important;
  font-family:'Rajdhani',"Nunito",sans-serif !important;
  position:relative;
}
h1,h2,h3,h4,h5,h6,.sidebar-brand-text,.h4{
  font-family:'Cinzel',serif !important;
}

/* Fixed animated stone/ember backdrop behind everything */
body::before{
  content:'';
  position:fixed;inset:0;z-index:-3;
  background:
    radial-gradient(1000px 650px at 12% -8%, rgba(199,158,84,.14), transparent 60%),
    radial-gradient(900px 700px at 100% 8%, rgba(192,39,45,.12), transparent 55%),
    radial-gradient(1100px 850px at 50% 115%, rgba(199,158,84,.08), transparent 60%),
    linear-gradient(180deg,#04060a 0%, #0a0e16 45%, #04060a 100%);
  background-size:140% 140%,140% 140%,140% 140%,100% 100%;
  animation:aelBgDrift 24s ease-in-out infinite;
}
@keyframes aelBgDrift{
  0%,100%{background-position:0% 0%, 100% 0%, 50% 100%, 0 0;}
  50%{background-position:8% 6%, 92% 8%, 55% 90%, 0 0;}
}
body::after{
  content:'';
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 40%, rgba(0,0,0,.6) 100%);
}
#ael-embers{position:fixed;inset:0;z-index:-1;pointer-events:none;}

/* ---------- Login page ---------- */
body.bg-gradient-primary{
  background:var(--ael-bg) !important;
  padding-top:70px;
}
body.bg-gradient-primary .container{position:relative;z-index:2;}
body.bg-gradient-primary img[alt]{
  filter:drop-shadow(0 0 24px rgba(199,158,84,.45));
  max-height:420px;
  width:auto;
  max-width:92vw;
}
.ael-logo-wrap{animation:aelFadeUp .8s ease .3s both, aelFloat 5s ease-in-out infinite;}
.ael-logo-wrap img{animation:aelGlow 4s ease-in-out infinite;}
@keyframes aelFloat{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-12px);}
}
@keyframes aelGlow{
  0%,100%{filter:drop-shadow(0 0 24px rgba(199,158,84,.45));}
  50%{filter:drop-shadow(0 0 48px rgba(192,39,45,.6));}
}
@keyframes aelFadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}

.ael-hero-badge{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:fit-content;margin:0 auto 22px;
  padding:8px 20px;border-radius:999px;
  background:rgba(192,39,45,.1);border:1px solid rgba(192,39,45,.35);
  color:var(--ael-gold2);font-weight:600;letter-spacing:.08em;font-size:.8rem;
  text-transform:uppercase;
  animation:aelFadeUp .8s ease both;
}
.ael-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 8px #4ade80;animation:aelPulse 1.8s infinite;}
@keyframes aelPulse{0%,100%{opacity:1;}50%{opacity:.3;}}

.ael-hero-title{
  text-align:center;font-family:'Cinzel',serif !important;font-weight:900 !important;
  font-size:clamp(2.4rem,6vw,4rem) !important;letter-spacing:.04em;margin:0 0 8px !important;
  color:var(--ael-gold2) !important;
  background:linear-gradient(120deg,var(--ael-gold2) 0%, var(--ael-gold) 35%, var(--ael-ember) 70%, var(--ael-gold2) 100%);
  background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent !important;
  animation:aelShine 6s linear infinite, aelFadeUp .9s ease .1s both;
  text-shadow:0 0 50px rgba(199,158,84,.35);
}
@keyframes aelShine{to{background-position:200% center;}}
.ael-hero-sub{
  text-align:center;color:var(--ael-text-muted) !important;font-size:1.1rem;
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:0 !important;
  animation:aelFadeUp .9s ease .2s both;
}

.card{
  background:var(--ael-panel) !important;
  border:2px solid transparent !important;
  border-radius:18px !important;
  background-image:
    linear-gradient(var(--ael-panel), var(--ael-panel)),
    linear-gradient(135deg, var(--ael-gold2), var(--ael-ember) 35%, var(--ael-gold) 65%, var(--ael-gold2)) !important;
  background-origin:border-box !important;
  background-clip:padding-box, border-box !important;
  backdrop-filter:blur(14px);
  animation:aelFadeUp .9s ease .4s both;
  box-shadow:0 30px 90px rgba(0,0,0,.65), 0 0 40px rgba(192,39,45,.12), inset 0 1px 0 rgba(255,255,255,.05) !important;
  position:relative;overflow:hidden;
}
.card::before{
  content:'';position:absolute;inset:8px;pointer-events:none;border-radius:12px;
  border:1px solid rgba(199,158,84,.22);
}
.card::after{
  content:'';position:absolute;inset:0;pointer-events:none;border-radius:18px;
  background:
    linear-gradient(135deg, var(--ael-gold2) 0 3px, transparent 3px) top left / 30px 30px no-repeat,
    linear-gradient(-135deg, var(--ael-gold2) 0 3px, transparent 3px) top right / 30px 30px no-repeat,
    linear-gradient(45deg, var(--ael-gold2) 0 3px, transparent 3px) bottom left / 30px 30px no-repeat,
    linear-gradient(-45deg, var(--ael-gold2) 0 3px, transparent 3px) bottom right / 30px 30px no-repeat;
  opacity:.85;
  animation:aelCornerGlow 4s ease-in-out infinite;
}
@keyframes aelCornerGlow{0%,100%{opacity:.6;}50%{opacity:1;}}
.card .h4, .card h1{color:var(--ael-gold2) !important;letter-spacing:.03em;}

.form-control, .form-control-user{
  background:rgba(0,0,0,.35) !important;
  border:1px solid var(--ael-border) !important;
  color:var(--ael-text) !important;
  border-radius:10px !important;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.form-control::placeholder{color:var(--ael-text-muted) !important;}
.form-control:focus, .form-control-user:focus{
  border-color:var(--ael-gold) !important;
  box-shadow:0 0 0 3px rgba(199,158,84,.18) !important;
  background:rgba(0,0,0,.5) !important;
}

.btn-primary, .btn-user.btn-primary{
  background:linear-gradient(120deg,var(--ael-gold2),var(--ael-gold)) !important;
  border:none !important;
  color:#1a1305 !important;
  font-weight:700 !important;
  letter-spacing:.03em;
  box-shadow:0 10px 26px rgba(199,158,84,.28) !important;
  transition:transform .2s ease, box-shadow .2s ease !important;
}
.btn-primary:hover, .btn-user.btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(199,158,84,.42) !important;
}
.btn-secondary, .bordered-btn{
  background:rgba(255,255,255,.04) !important;
  border:1px solid var(--ael-border) !important;
  color:var(--ael-text) !important;
  transition:background .2s ease, border-color .2s ease;
}
.btn-secondary:hover, .bordered-btn:hover{
  background:rgba(199,158,84,.1) !important;
  border-color:var(--ael-gold) !important;
}
a, a.small, a.text-white{color:var(--ael-gold2) !important;}
a:hover{color:var(--ael-gold) !important;}
hr{border-color:var(--ael-border) !important;}
.bg-login-image{
  background:
    radial-gradient(circle at 50% 42%, rgba(199,158,84,.22), transparent 55%),
    linear-gradient(160deg, rgba(199,158,84,.1), rgba(192,39,45,.06)) !important;
  border-radius:18px 0 0 18px;
  position:relative;overflow:hidden;
  min-height:100%;
}
.ael-samurai-img{
  position:absolute;top:0;left:0;right:0;bottom:0;
  width:100%;height:100%;max-width:none;
  object-fit:contain;object-position:bottom 62%;
  filter:drop-shadow(0 0 40px rgba(199,158,84,.3)) drop-shadow(-30px 0 60px rgba(192,39,45,.25));
  animation:aelSamuraiFloat 6s ease-in-out infinite, aelFadeUp 1s ease .2s both;
  z-index:1;
}
@keyframes aelSamuraiFloat{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-8px);}
}
.ael-side-content{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:40px 44px 44px;text-align:left;
  background:linear-gradient(180deg, transparent, rgba(5,7,12,.75) 55%, rgba(5,7,12,.92));
}
.ael-side-icon{
  width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,rgba(199,158,84,.18),rgba(192,39,45,.18));
  border:1px solid rgba(199,158,84,.3);color:var(--ael-gold2);font-size:1.3rem;margin-bottom:16px;
  animation:aelFadeUp .8s ease .5s both;
}
.ael-side-title{
  font-family:'Cinzel',serif !important;font-weight:900 !important;color:var(--ael-gold2) !important;
  font-size:1.5rem !important;margin-bottom:4px !important;
  animation:aelFadeUp .8s ease .55s both;
}
.ael-side-tag{
  color:var(--ael-text-muted) !important;text-transform:uppercase;letter-spacing:.1em;font-size:.8rem;
  margin-bottom:20px !important;
  animation:aelFadeUp .8s ease .6s both;
}
.ael-side-list{list-style:none;padding:0;margin:0;}
.ael-side-list li{
  color:var(--ael-text) !important;font-size:.98rem;margin-bottom:10px;display:flex;align-items:center;gap:10px;
  animation:aelFadeUp .8s ease both;
}
.ael-side-list li:nth-child(1){animation-delay:.65s;}
.ael-side-list li:nth-child(2){animation-delay:.72s;}
.ael-side-list li:nth-child(3){animation-delay:.79s;}
.ael-side-list li:nth-child(4){animation-delay:.86s;}
.ael-side-list i{color:#4ade80;font-size:.85rem;}
.bg-login-image::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(115deg, transparent 42%, rgba(240,216,160,.18) 50%, transparent 58%);
  background-size:250% 250%;
  animation:aelShineSweep 5s ease-in-out infinite;
}
@keyframes aelShineSweep{
  0%{background-position:120% -20%;}
  45%,100%{background-position:-30% 60%;}
}

/* ---------- Dashboard shell ---------- */
.sidebar.sidebar-dark, .sidebar.bg-gradient-primary{
  background:linear-gradient(180deg,#0c1018 0%, #05070c 100%) !important;
  border-right:1px solid var(--ael-border);
}
.sidebar .nav-link, .sidebar-heading{color:var(--ael-text-muted) !important;}
.sidebar .nav-item.active .nav-link, .sidebar .nav-link:hover{
  color:var(--ael-gold2) !important;
}
.sidebar-brand-text{color:var(--ael-gold2) !important;letter-spacing:.06em;}
.sidebar-divider{border-color:var(--ael-border) !important;}
.collapse-inner{background:var(--ael-panel) !important;border:1px solid var(--ael-border);}
.collapse-item{color:var(--ael-text-muted) !important;}
.collapse-item.active, .collapse-item:hover{color:var(--ael-gold2) !important;background:rgba(199,158,84,.08) !important;}

.topbar.bg-white, nav.topbar{
  background:rgba(10,8,5,.75) !important;
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--ael-border) !important;
  box-shadow:0 6px 20px rgba(0,0,0,.35) !important;
}
.topbar .nav-link, .topbar span{color:var(--ael-text) !important;}
#content-wrapper, #content{background:transparent !important;}
.main-logo{filter:drop-shadow(0 0 14px rgba(199,158,84,.4));}

.dropdown-menu{
  background:var(--ael-panel) !important;
  border:1px solid var(--ael-border) !important;
}
.dropdown-item{color:var(--ael-text) !important;}
.dropdown-item:hover{background:rgba(199,158,84,.12) !important;color:var(--ael-gold2) !important;}

.table{color:var(--ael-text) !important;}
.table thead th{
  border-color:var(--ael-border) !important;
  color:var(--ael-gold2) !important;
  text-transform:uppercase;font-size:.78rem;letter-spacing:.08em;
}
.table td, .table th{border-color:rgba(255,255,255,.06) !important;}

.status .nav-link span{color:var(--ael-text-muted) !important;}

.scroll-to-top{
  background:linear-gradient(120deg,var(--ael-gold2),var(--ael-gold)) !important;
  color:#1a1305 !important;
}

/* ---------- Reveal-in animation for cards/panels ---------- */
.card, .col-lg-6#login-div, .col-lg-6#register-div, .col-lg-6#reset-div{
  animation:aelFadeUp .8s ease both;
}

.ael-credit span{
  color:var(--ael-text-muted) !important;
  font-size:.85rem;
}
.ael-credit strong{color:var(--ael-gold2);}

/* ---------- Dashboard content areas (tables, card headers, modals) ---------- */
.card-header{
  background:linear-gradient(90deg, rgba(199,158,84,.08), rgba(192,39,45,.06)) !important;
  border-bottom:1px solid var(--ael-border) !important;
}
.card-header h6, .card-header .text-primary{
  color:var(--ael-gold2) !important;
  font-family:'Cinzel',serif !important;
  letter-spacing:.03em;
}
.card-body{background:transparent !important;}

.table-responsive{background:transparent !important;}
.table{
  background:transparent !important;
  color:var(--ael-text) !important;
}
.table thead th{
  background:rgba(0,0,0,.35) !important;
  color:var(--ael-gold2) !important;
  border-color:var(--ael-border) !important;
  text-transform:uppercase;font-size:.78rem;letter-spacing:.08em;
}
.table tbody td, .table tfoot th, .table tfoot td{
  background:transparent !important;
  border-color:rgba(255,255,255,.06) !important;
  color:var(--ael-text) !important;
}
.table tfoot th{
  color:var(--ael-text-muted) !important;
  font-weight:600;
  background:rgba(0,0,0,.2) !important;
}
.table-bordered, .table-bordered td, .table-bordered th{
  border-color:rgba(199,158,84,.18) !important;
}
.table-hover tbody tr:hover{background:rgba(199,158,84,.06) !important;}

.badge-warning{background:linear-gradient(120deg,var(--ael-gold2),var(--ael-gold)) !important;color:#1a1305 !important;}
.badge-success{background:linear-gradient(120deg,#4ade80,#22c55e) !important;color:#052e12 !important;}

.modal-content{
  background:var(--ael-panel) !important;
  border:1px solid var(--ael-border) !important;
  color:var(--ael-text) !important;
}
.modal-header{border-bottom:1px solid var(--ael-border) !important;}
.modal-footer{border-top:1px solid var(--ael-border) !important;}
.modal-title{color:var(--ael-gold2) !important;font-family:'Cinzel',serif !important;}
.close{color:var(--ael-text) !important;text-shadow:none !important;}

h1.h3, h1, h2, h3, h4, h5{color:var(--ael-gold2) !important;font-family:'Cinzel',serif !important;}
p.mb-4, .text-gray-800{color:var(--ael-text-muted) !important;}

.btn-sm.btn-primary{
  background:linear-gradient(120deg,var(--ael-gold2),var(--ael-gold)) !important;
  border:none !important;color:#1a1305 !important;font-weight:700 !important;
}

.sticky-footer, .sticky-footer.bg-white{
  background:var(--ael-bg) !important;
  border-top:1px solid var(--ael-border) !important;
}
.sticky-footer .copyright span{color:var(--ael-text-muted) !important;}
.sticky-footer .copyright strong{color:var(--ael-gold2) !important;}

/* Custom cursor — sword */
html, body {
	cursor: url('../img/sword-cursor.png') 2 2, auto;
}
a, button, .btn, input[type=submit], .dropdown-toggle, .quick-link, .account-actions a {
	cursor: url('../img/sword-cursor.png') 2 2, pointer;
}
