/* Global modernization layer — loaded last, overrides legacy theme colors/shapes site-wide.
   Keeps all existing markup/classes; only restyles color, radius, shadow, spacing. */

:root{
  --mg-accent:#0f8a6b;
  --mg-accent-dark:#0b6d54;
  --mg-accent-soft:#e6f6f1;
  --mg-ink:#12212b;
  --mg-muted:#5c6b74;
  --mg-line:#e6ebee;
  --mg-radius:14px;
}

body{ -webkit-font-smoothing:antialiased; }

/* ---------- Top bar & header ---------- */
.top-bar{
  background:linear-gradient(120deg,#0b3d33,#0f8a6b 70%,#12a37f) !important;
}

.container-fluid.sticky_top{
  background:#fff;
  box-shadow:0 2px 14px rgba(18,33,43,.06);
}

.navbar-nav.nav-tabs .nav-link,
#headerMenuCollapse .nav-link{
  color:var(--mg-ink);
  font-weight:600;
  border:none !important;
}

.navbar-nav.nav-tabs .nav-link:hover,
.navbar-nav.nav-tabs .nav-link.active,
#headerMenuCollapse .nav-link:hover,
#headerMenuCollapse .nav-link.active{
  color:var(--mg-accent-dark) !important;
  background:transparent !important;
  border-bottom:2px solid var(--mg-accent) !important;
}

/* ---------- Buttons ---------- */
.btn{
  border-radius:999px;
  font-weight:600;
  letter-spacing:.01em;
}

.btn-primary,
.btn-purple{
  background:var(--mg-accent) !important;
  border-color:var(--mg-accent) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-purple:hover,
.btn-purple:focus{
  background:var(--mg-accent-dark) !important;
  border-color:var(--mg-accent-dark) !important;
}

.btn-outline-primary{
  color:var(--mg-accent) !important;
  border-color:var(--mg-accent) !important;
}

.btn-outline-primary:hover{
  background-color:var(--mg-accent) !important;
  border-color:var(--mg-accent) !important;
}

/* ---------- Cards / form pages (login, contact, terms, privacy, register, etc.) ---------- */
.body_background{
  background:linear-gradient(180deg,#f6f8f9,#eef2f3);
  min-height:calc(100vh - 200px);
}

.card{
  border:1px solid var(--mg-line);
  border-radius:var(--mg-radius);
  box-shadow:0 10px 30px rgba(18,33,43,.06);
  overflow:hidden;
}

.card.card-primary > .card-header{
  background:linear-gradient(120deg,#0b3d33,#0f8a6b 80%) !important;
  color:#fff;
  border:none;
  padding:22px 26px;
}

.card.card-primary > .card-header h4,
.card.card-primary > .card-header h3{
  margin:0;
  font-weight:700;
}

.card-body{
  padding:28px 26px;
}

/* ---------- Form controls ---------- */
.form-control,
.form-select,
.form-controll{
  border:1px solid var(--mg-line);
  border-radius:10px;
  padding:10px 14px;
  height:auto;
}

.form-control:focus,
.form-select:focus{
  border-color:var(--mg-accent);
  box-shadow:0 0 0 3px var(--mg-accent-soft);
}

.form-group label,
.control-label{
  font-weight:600;
  color:var(--mg-ink);
  font-size:.92rem;
}

a.text-small{
  color:var(--mg-accent-dark);
}

/* ---------- Pricing cards (used on other listing pages) ---------- */
.pricingTable{
  border-radius:18px;
  box-shadow:0 10px 26px rgba(18,33,43,.08);
  transition:transform .18s ease;
}

.pricingTable:hover{
  transform:translateY(-4px);
}

.pricingTable .price-value,
.pricingTable.blue .price-value{
  background:var(--mg-accent) !important;
}

.pricingTable .pricing-content li:before,
.pricingTable.blue .pricing-content li:before{
  background-color:var(--mg-accent) !important;
}

.pricingTable .pricingTable-signup a,
.pricingTable.blue .pricingTable-signup a{
  background:var(--mg-accent-dark) !important;
  border-radius:999px;
}

.pricingTable .pricingTable-signup a:hover,
.pricingTable.blue .pricingTable-signup a:hover{
  background:var(--mg-accent) !important;
}

/* ---------- Legacy purple tile buttons (exam/study/profile selection tiles) ---------- */
.first_grid_main,
.grid_m_fs{
  background:linear-gradient(to right,#12a37f,#0b6d54) !important;
  border-radius:var(--mg-radius) !important;
}

#questionnaire{
  background:linear-gradient(to right,#12a37f,#0b6d54) !important;
  border-radius:999px !important;
}

/* ---------- Category / quiz grid cards ---------- */
.grid figure.effect-ming{
  border-radius:var(--mg-radius);
  overflow:hidden;
  box-shadow:0 10px 24px rgba(18,33,43,.08);
}

.grid figure.effect-ming h2.category_name{
  font-weight:700;
}

.level-star.gold-star{
  color:#f5b301;
}

/* ---------- Footer ---------- */
.footer a:not(.btn):hover{
  color:var(--mg-accent-soft) !important;
}

.footer h4.text_heading{
  position:relative;
}

/* ---------- Misc ---------- */
.heading{
  font-weight:700;
  color:var(--mg-ink);
}

.alert-warning,
h1 span[style*="color: red"]{
  border-radius:12px;
}