/* Keep the original board-page styles isolated from the store header. */
.reference-quizzes {font:16px/1.5 Ubuntu,sans-serif;background:#fff;color:#00163b;padding:0;}
.reference-quizzes *, .reference-quizzes *::before, .reference-quizzes *::after {box-sizing:border-box;}
.reference-quizzes .hero {min-height:0;padding:0;background:none;display:block;overflow:visible;}
.reference-quizzes .hero::before,.reference-quizzes .hero::after{display:none;}
.reference-quizzes h1,.reference-quizzes h2,.reference-quizzes h3{font-family:Ubuntu,sans-serif;letter-spacing:normal;font-weight:700;}
.reference-quizzes :focus-visible{outline:3px solid #ffba25;outline-offset:4px;}
@media(prefers-reduced-motion:reduce){.reference-quizzes *{transition:none!important;animation:none!important;}}


/* Custom Modal Styles */
.reference-quizzes .app-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
}

.reference-quizzes .app-modal .modal-content {
  background-color: #fefefe;
  margin: 15% auto;
  padding: 20px;
  border: 1px solid #888;
  width: 100%;
  border-radius: 10px;
  text-align: center;
  position: relative;
  max-width: 380px;
  color: #000;
}

.reference-quizzes .app-modal .modal-buttons {
    margin-top: 20px;
}

.reference-quizzes .app-modal .btn {
    padding: 12px 24px;
    margin: 8px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    display: inline-block;
}

.reference-quizzes .app-modal .btn-android {
    background-color: #4CAF50;
    color: white;
}

.reference-quizzes .app-modal .btn-ios {
    background-color: #007AFF;
    color: white;
}

.reference-quizzes .app-modal .btn:hover {
    opacity: 0.8;
    transform: translateY(-2px);
}

.reference-quizzes .app-modal .close-modal {
  color: #fff;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  position: absolute;
  right: -13px;
  background: #000;
  width: 30px;
  height: 30px;
  line-height: 30px;
  border-radius: 100%;
  top: -10px;
}

.reference-quizzes .app-modal .close-modal:hover {
    color: #fff;
}
.reference-quizzes .app-modal .modal-content .downloa-app.v1 {
  flex-wrap: inherit;
}
.reference-quizzes .app-modal h3 {
  font-size: 20px;
  line-height: 30px;
  margin-top: 0;
}

@media(max-width:575px){
    .reference-quizzes .app-modal .modal-content {
  margin: 25% auto;
  padding: 15px;
  max-width: 340px;
}
.reference-quizzes .app-modal .modal-content h3 {
  font-size: 24px;
}
  .reference-quizzes .home .app-modal .app-btn span {
    font-size: 12px;
  }
  .reference-quizzes .app-modal .downloa-app.v1 .app-btn{width:auto;}
}

/* Status Badge Styles */
.reference-quizzes .status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 10px;
  font-weight: bold;
  margin-left: 8px;
  text-transform: uppercase;
}
.reference-quizzes .status-badge.ongoing {
  background-color: #4CAF50;
  color: white;
}
.reference-quizzes .status-badge.upcoming {
  background-color: #2196F3;
  color: white;
}
.reference-quizzes .status-badge.result-awaited {
  background-color: #FF9800;
  color: white;
}
.reference-quizzes .status-badge.result-declared {
  background-color: #9C27B0;
  color: white;
}
.reference-quizzes .status-badge.completed {
  background-color: #607D8B;
  color: white;
}
/* Exam Type Badge Styles */
.reference-quizzes .exam-type-badge {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 9px;
  font-weight: bold;
  margin-left: 8px;
  text-transform: uppercase;
}
.reference-quizzes .exam-type-badge.objective {
  background-color: #E3F2FD;
  color: #1565C0;
  border: 1px solid #1565C0;
}
.reference-quizzes .exam-type-badge.subjective {
  background-color: #FFF3E0;
  color: #E65100;
  border: 1px solid #E65100;
}
.reference-quizzes .quizcard.ongoing {
  border-left: 4px solid #4CAF50;
}
.reference-quizzes .quizcard.future {
  border-left: 4px solid #efc174;
}
.reference-quizzes .quizcard.result_awaited {
  border-left: 4px solid #FF9800;
}
.reference-quizzes .quizcard.result_declared {
  border-left: 4px solid #9C27B0;
}
.reference-quizzes .quizcard.completed {
  border-left: 4px solid #607D8B;
}


.reference-quizzes [hidden]{display:none!important;}
.reference-quizzes [role="tabpanel"]:not([hidden]){display:block;}
.reference-quizzes .quiz-list>p{padding:20px;text-align:center;color:#6b7280;}
.reference-quizzes .quiz-details{font-size:14px;color:#878787;padding-top:5px;}
.reference-quizzes .quiz-section{background:none;padding:0;}
.reference-quizzes .quizzes-app-dialog{position:fixed;margin:auto;padding:24px;width:min(430px,92vw);border:1px solid #bbdefb;border-radius:12px;background:#fff;color:#00163b;max-height:90vh;}
.reference-quizzes .quizzes-app-dialog::backdrop{background:#0008;}
.reference-quizzes .quizzes-app-dialog .modal-content{position:static;display:block;border:0;padding:0;box-shadow:none;width:100%;background:white;}
.reference-quizzes .quizzes-app-dialog h3{font-size:22px;line-height:1.4;margin:20px 0;}
.reference-quizzes .quizzes-app-dialog .close-modal{position:absolute;top:8px;right:12px;font-size:28px;background:none;border:0;cursor:pointer;}
.reference-quizzes .quizzes-app-dialog .downloa-app{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;}
.reference-quizzes .quiz-error{color:#b91c1c!important;}
.reference-quizzes .quiz-retry{padding:10px 16px;cursor:pointer;}

/* Suppress the shared landing-page trophy decoration on quiz listings. */
.reference-quizzes .quiz-section::before{content:none;display:none;}
