/* iRS Online — shared visual polish (UI only). Matches index.php palette. */
:root{
  --irs-bg:#f0f4ff;
  --irs-purple:#6c63ff;
  --irs-purple-2:#a855f7;
  --irs-orange:#f0a500;
  --irs-ink:#1e1e2e;
  --irs-muted:#9a97b0;
  --irs-card:#ffffff;
  --irs-border:#ede8ff;
  --irs-radius:18px;
  --irs-shadow:0 10px 30px rgba(108,99,255,.12);
}
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Fredoka+One&display=swap');

/* Soften AU theme shells used by older pages */
body.animsition,
body{
  font-family:'Nunito',sans-serif !important;
  background:var(--irs-bg) !important;
  color:var(--irs-ink);
}
.page-wrapper{background:transparent !important;}
.menu-sidebar{
  background:#fff !important;
  box-shadow:4px 0 24px rgba(0,0,0,.04) !important;
  border-right:1px solid var(--irs-border) !important;
}
.menu-sidebar .logo{
  background:linear-gradient(135deg,var(--irs-purple),var(--irs-purple-2)) !important;
  border-bottom:none !important;
  display:flex;align-items:center;justify-content:center;
  padding:18px !important;
}
.menu-sidebar .logo img{
  width:64px !important;height:64px !important;
  border-radius:50% !important;
  border:3px solid rgba(255,255,255,.85) !important;
  object-fit:cover;
}
.navbar-sidebar .navbar__list li a{
  border-radius:12px !important;
  margin:6px 10px !important;
  font-weight:800 !important;
  color:var(--irs-purple) !important;
}
.navbar-sidebar .navbar__list li.active > a,
.navbar-sidebar .navbar__list li a:hover{
  background:linear-gradient(135deg,#efeaff,#f8f0ff) !important;
  color:#5b54e6 !important;
}
.header-desktop,.header-mobile__bar{
  background:rgba(255,255,255,.9) !important;
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--irs-border) !important;
  box-shadow:0 2px 16px rgba(0,0,0,.04) !important;
}
.header-wrap .form-header p,
.header-wrap p{
  font-weight:800 !important;
  color:var(--irs-purple) !important;
  margin:0 !important;
}
.account-item .content a,
.account-item .content .js-acc-btn{
  font-weight:800 !important;
  color:var(--irs-ink) !important;
}
.account-item .image img,
.header-mobile img{
  border:2px solid var(--irs-orange) !important;
  border-radius:50% !important;
}
.main-content{background:transparent !important;padding-top:28px !important;}
.title-1,.title-3{
  font-family:'Fredoka One',cursive !important;
  color:var(--irs-purple) !important;
  letter-spacing:.3px;
}
.card{
  border:none !important;
  border-radius:var(--irs-radius) !important;
  box-shadow:var(--irs-shadow) !important;
  overflow:hidden;
}
.card-header{
  background:linear-gradient(135deg,var(--irs-purple),var(--irs-purple-2)) !important;
  color:#fff !important;
  font-weight:800 !important;
  border:none !important;
  padding:16px 20px !important;
  font-size:1.05rem !important;
}
.card-body{padding:22px !important;}
.form-control,textarea.form-control,.au-input{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  border:2px solid #cfc8f5 !important;
  border-radius:14px !important;
  padding:10px 16px !important;
  font-weight:700 !important;
  font-size:16px !important;
  color:#1e1e2e !important;
  background:#fff !important;
  min-height:46px !important;
}
textarea.form-control{min-height:140px !important;height:auto !important;line-height:1.45 !important;}
.form-control::placeholder,textarea.form-control::placeholder,.au-input::placeholder{
  color:#8b86a8 !important;
  opacity:1 !important;
  font-weight:600 !important;
}
.form-control:focus,textarea.form-control:focus,.au-input:focus{
  border-color:var(--irs-purple) !important;
  box-shadow:0 0 0 4px rgba(108,99,255,.22) !important;
  background:#fff !important;
}
.btn-primary,.au-btn--green,.au-btn--block{
  background:linear-gradient(135deg,var(--irs-purple),var(--irs-purple-2)) !important;
  border:none !important;
  border-radius:12px !important;
  font-weight:800 !important;
  padding:12px 18px !important;
  box-shadow:0 8px 20px rgba(108,99,255,.28) !important;
}
.btn-primary:hover,.au-btn--green:hover{
  filter:brightness(1.05);
  transform:translateY(-1px);
}
.table-earning thead th{
  background:linear-gradient(135deg,#efeaff,#f8f0ff) !important;
  color:var(--irs-purple) !important;
  font-weight:900 !important;
  border:none !important;
  border-radius:12px 12px 0 0;
}
.table-earning tbody td{
  background:#fff !important;
  border:none !important;
  border-bottom:1px solid #f1effa !important;
  font-weight:700 !important;
}
.table-earning tbody td a{
  display:flex;align-items:center;gap:10px;
  color:var(--irs-ink) !important;
  text-decoration:none !important;
  padding:10px 6px;
  border-radius:12px;
}
.table-earning tbody td a:hover{
  background:#f7f4ff;
  color:var(--irs-purple) !important;
}
.table-earning tbody td a i{
  width:34px;height:34px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--irs-purple),var(--irs-purple-2));
  color:#fff;
}
.copyright{
  text-align:center;color:var(--irs-muted);font-weight:700;font-size:12px;margin-top:28px;
}
.copyright a{color:var(--irs-purple);font-weight:800;}

/* Login page */
.irs-login-body{
  min-height:100vh;
  margin:0;
  font-family:'Nunito',sans-serif;
  background:
    radial-gradient(circle at 12% 18%,rgba(255,180,80,.25),transparent 42%),
    radial-gradient(circle at 88% 82%,rgba(108,99,255,.18),transparent 45%),
    var(--irs-bg);
  display:flex;align-items:center;justify-content:center;
  padding:28px 16px;
}
.irs-login-card{
  width:min(420px,100%);
  background:var(--irs-card);
  border-radius:24px;
  box-shadow:0 18px 50px rgba(40,30,90,.14);
  padding:34px 28px 28px;
  border:1px solid rgba(255,255,255,.8);
}
.irs-login-logo{
  width:108px;height:108px;border-radius:50%;
  object-fit:cover;display:block;margin:0 auto 14px;
  border:3px solid var(--irs-orange);
  box-shadow:0 8px 24px rgba(240,165,0,.28);
}
.irs-login-title{
  text-align:center;margin:0 0 4px;
  font-family:'Fredoka One',cursive;
  font-size:1.45rem;color:var(--irs-ink);
}
.irs-login-sub{
  text-align:center;margin:0 0 22px;
  color:var(--irs-muted);font-weight:700;font-size:.92rem;
}
.irs-login-label{
  display:block;font-weight:800;font-size:.82rem;
  color:#5b54e6;margin:0 0 6px;
}
.irs-login-input{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  min-height:46px;
  height:46px;
  border:2px solid #cfc8f5;
  border-radius:14px;
  padding:10px 16px;
  font:700 16px/1.3 Nunito,sans-serif;
  color:var(--irs-ink);
  margin:0 0 16px;
  background:#fff;
  outline:none;
  -webkit-appearance:none;
  appearance:none;
}
.irs-login-input::placeholder{
  color:#8b86a8;
  opacity:1;
  font-weight:600;
}
.irs-login-input:focus{
  border-color:var(--irs-purple);
  box-shadow:0 0 0 4px rgba(108,99,255,.22);
  background:#fff;
}
@media (max-width:480px){
  .irs-login-input{min-height:46px;height:46px;font-size:16px;padding:10px 16px;}
  .irs-login-card{padding:28px 18px 22px;}
}
.irs-login-btn{
  width:100%;border:0;border-radius:12px;cursor:pointer;
  padding:13px 16px;margin-top:4px;
  font:900 15px Nunito,sans-serif;color:#fff;letter-spacing:.3px;
  background:linear-gradient(135deg,var(--irs-purple),var(--irs-purple-2));
  box-shadow:0 10px 24px rgba(108,99,255,.3);
}
.irs-login-btn:hover{filter:brightness(1.05)}
.irs-login-error{color:#e11d48;font-weight:800;font-size:.86rem;margin:0 0 10px}
.irs-login-links{text-align:center;margin-top:18px;font-size:.86rem;font-weight:700;color:var(--irs-muted);line-height:1.7}
.irs-login-links a{color:var(--irs-purple);font-weight:900;text-decoration:none}
.irs-login-links a:hover{text-decoration:underline}
#popup{display:none;position:fixed;z-index:50;inset:0;background:rgba(20,16,40,.45);padding-top:12vh}
#popupContent{
  background:#fff;margin:auto;padding:22px;border-radius:18px;width:min(480px,92%);
  text-align:center;box-shadow:0 18px 40px rgba(0,0,0,.2);position:relative;
}
#popupContent .close{position:absolute;right:14px;top:8px;font-size:28px;color:#aaa;cursor:pointer}
.popup-text{font-size:16px;font-weight:700;color:#333;line-height:1.6}
.popup-text h2{font-family:'Fredoka One',cursive;color:var(--irs-purple);margin-bottom:10px}

/* Comment page hero chip */
.irs-page-chip{
  display:inline-flex;align-items:center;gap:8px;
  background:#fff;border:1.5px solid var(--irs-border);
  border-radius:999px;padding:8px 14px;margin-bottom:16px;
  font-weight:800;font-size:13px;color:var(--irs-purple);text-decoration:none;
}
.irs-page-chip:hover{background:#f7f4ff;color:#5b54e6;text-decoration:none}
.irs-maoni-hint{color:var(--irs-muted);font-weight:700;font-size:.9rem;margin-bottom:12px}


/* —— Soft consistency for modern pages (non-breaking) —— */
.topbar-brand{letter-spacing:.4px;}
.svc-card{transition:transform .15s ease, box-shadow .15s ease;}
.svc-card:hover{transform:translateY(-3px);}
.page-wrap .hero{border:1px solid rgba(255,255,255,.25);}

/* —— Quiz shells: dashboard.php / dashboarddd.php / dashboards.php —— */
.start-container,
#quiz-container,
.paper{
  font-family:'Nunito',sans-serif !important;
  border-radius:18px !important;
  box-shadow:0 12px 32px rgba(108,99,255,.14) !important;
  border:1px solid #ede8ff !important;
}
#header, .paper h1, .paper h2{
  font-family:'Fredoka One',cursive !important;
  color:#1e1e2e !important;
}
.btn-green{
  background:linear-gradient(135deg,#6c63ff,#a855f7) !important;
  border:none !important;
  border-radius:12px !important;
  font-weight:800 !important;
  box-shadow:0 8px 20px rgba(108,99,255,.28) !important;
}
.btn-green:hover{
  background:linear-gradient(135deg,#5b54e6,#9333ea) !important;
  color:#fff !important;
  border:none !important;
}
#answer-container label{
  border:1.5px solid #ede8ff !important;
  background:#faf9ff !important;
  border-radius:12px !important;
  font-weight:700 !important;
}
#answer-container label:hover{border-color:#6c63ff !important;}
#question{background:#f7f4ff !important;border:1px solid #ede8ff !important;}
.timer-safe{background:linear-gradient(135deg,#22c55e,#16a34a) !important;}
button{
  background:linear-gradient(135deg,#6c63ff,#a855f7) !important;
  border-radius:10px !important;
  font-weight:800 !important;
  font-family:'Nunito',sans-serif !important;
}
button:hover{filter:brightness(1.05); background:linear-gradient(135deg,#5b54e6,#9333ea) !important;}
.paper a h1{color:#6c63ff !important;font-size:1.2rem !important;}
