/* Shared LearnTurki footer — same band on every public page. */
html body .footer.site-footer,
html body .footer.site-chrome-footer.site-footer{
  display:block;
  width:100%;
  max-width:none;
  margin:28px 0 0;
  padding:0 0 28px;
  background:transparent;
  color:#5c6881;
  border:0;
  font-family:Tajawal,Tahoma,sans-serif;
  box-sizing:border-box;
}
html body .site-footer-rail{
  width:min(100% - 40px, 1440px);
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:14px;
  box-sizing:border-box;
}
html body .site-footer-tools{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px 18px;
  padding:0 4px;
  border-top:1px solid #e1e6f0;
  padding-top:16px;
}
html body .site-footer-about,
html body .site-footer-top{
  appearance:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0;
  padding:6px 2px;
  border:0;
  background:none;
  color:#152349;
  font:700 14px/1.5 Tajawal,Tahoma,sans-serif;
  cursor:pointer;
  text-align:start;
}
html body .site-footer-about:hover,
html body .site-footer-top:hover{color:#123acf}
html body .site-footer-about-chevron,
html body .site-footer-top-icon{
  display:inline-block;
  width:0;
  height:0;
  border-style:solid;
  flex-shrink:0;
}
html body .site-footer-about-chevron{
  border-width:5px 7px 5px 0;
  border-color:transparent currentColor transparent transparent;
}
html body .site-footer-top-icon{
  border-width:0 6px 8px 6px;
  border-color:transparent transparent currentColor transparent;
}
html body .site-footer-panel{
  background:#fff;
  border:1px solid #e8edf5;
  border-radius:18px;
  padding:26px 28px 18px;
  box-sizing:border-box;
  box-shadow:0 10px 28px #15234908;
}
html body .footer.site-footer .site-chrome-footer-grid,
html body .footer.site-chrome-footer.site-footer .site-chrome-footer-grid{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:16px;
  align-items:flex-start;
  justify-items:start;
  text-align:start;
  grid-template-columns:none;
}
html body .footer.site-footer .site-chrome-column,
html body .footer.site-chrome-footer.site-footer .site-chrome-column{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
}
html body .footer.site-footer .site-chrome-footer-text,
html body .footer.site-chrome-footer.site-footer .site-chrome-footer-text{
  margin:0;
  color:#6a7388;
  font:500 14px/1.7 Tajawal,Tahoma,sans-serif;
}
html body .footer.site-footer .site-chrome-links,
html body .footer.site-chrome-footer.site-footer .site-chrome-links{
  display:block;
  width:100%;
}
html body .footer.site-footer .site-chrome-links > strong{display:none}
html body .footer.site-footer .footer-links,
html body .footer.site-chrome-footer.site-footer .footer-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
  align-items:center;
  margin:0;
}
html body .footer.site-footer .footer-links a,
html body .footer.site-chrome-footer.site-footer .footer-links a{
  color:#152349;
  font:800 15px/1.4 Tajawal,Tahoma,sans-serif;
  text-decoration:none;
  margin:0;
}
html body .footer.site-footer .footer-links a:hover,
html body .footer.site-chrome-footer.site-footer .footer-links a:hover{
  color:#123acf;
}
html body .footer.site-footer .site-chrome-logo,
html body .footer.site-chrome-footer.site-footer .site-chrome-logo{
  margin-top:4px;
  max-width:min(280px, 100%);
}
html body .footer.site-footer .brand-mark--wide,
html body .footer.site-footer .brand-mark-img,
html body .footer.site-chrome-footer.site-footer .brand-mark--wide,
html body .footer.site-chrome-footer.site-footer .brand-mark-img{
  width:auto;
  max-width:100%;
  height:var(--brand-mark-size, 64px);
}
html body .footer.site-footer .site-chrome-footer-bar,
html body .footer.site-chrome-footer.site-footer .site-chrome-footer-bar{
  width:100%;
  max-width:none;
  margin:10px 0 0;
  padding:8px 0 0;
  justify-content:flex-start;
  background:transparent;
  border-top:0;
}
html body .footer.site-footer .site-chrome-copy,
html body .footer.site-chrome-footer.site-footer .site-chrome-copy{
  color:#9aa3b5;
  font:500 12px/1.5 Tajawal,Tahoma,sans-serif;
}

/* Static fallback markup (unpublished chrome) mirrors the published shell. */
html body .footer.site-footer .site-footer-tagline{
  margin:0;
  color:#6a7388;
  font:500 14px/1.7 Tajawal,Tahoma,sans-serif;
}
html body .footer.site-footer .site-footer-brand{
  display:inline-flex;
  max-width:min(280px, 100%);
}
html body .footer.site-footer .site-footer-brand img{
  display:block;
  width:auto;
  max-width:100%;
  height:64px;
}
html body .footer.site-footer .site-footer-copy{
  color:#9aa3b5;
  font:500 12px/1.5 Tajawal,Tahoma,sans-serif;
}

html body .site-footer-about-balloon{
  position:fixed;
  inset:0;
  z-index:90;
  display:grid;
  place-items:center;
  padding:20px;
  background:#15234955;
  backdrop-filter:blur(3px);
  box-sizing:border-box;
}
html body .site-footer-about-balloon[hidden]{display:none !important}
html body .site-footer-about-card{
  width:min(560px, 100%);
  max-height:min(78vh, 640px);
  overflow:auto;
  background:#fff;
  border:1px solid #e1e6f0;
  border-radius:18px;
  box-shadow:0 22px 60px #15234933;
  padding:18px 20px 20px;
  box-sizing:border-box;
}
html body .site-footer-about-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
html body .site-footer-about-head strong{
  color:#152349;
  font:800 18px/1.3 Tajawal,Tahoma,sans-serif;
}
html body .site-footer-about-close{
  appearance:none;
  border:0;
  background:#eef2fc;
  color:#152349;
  width:36px;
  height:36px;
  border-radius:10px;
  font:700 22px/1 Arial,sans-serif;
  cursor:pointer;
}
html body .site-footer-about-body{
  color:#5c6881;
  font:500 14px/1.8 Tajawal,Tahoma,sans-serif;
}
html body .site-footer-about-body p{margin:0 0 12px}
html body .site-footer-about-body p:last-child{margin-bottom:0}
html body .site-footer-about-note{
  margin-top:14px !important;
  padding-top:12px;
  border-top:1px solid #e8edf5;
  color:#8a93a8;
  font-size:12px !important;
}

/* Hide the legacy inline about accordion once the footer balloon owns it. */
html body details#about-content{display:none !important}

@media (max-width:760px){
  html body .site-footer-rail{width:min(100% - 24px, 1440px)}
  html body .site-footer-panel{padding:20px 18px 14px; border-radius:14px}
  html body .site-footer-tools{flex-direction:column; align-items:flex-start}
  html body .footer.site-footer .footer-links,
  html body .footer.site-chrome-footer.site-footer .footer-links{gap:8px 16px}
  html body .footer.site-footer .footer-links a,
  html body .footer.site-chrome-footer.site-footer .footer-links a{font-size:14px}
  html body .footer.site-footer .brand-mark-img,
  html body .footer.site-chrome-footer.site-footer .brand-mark-img,
  html body .footer.site-footer .site-footer-brand img{height:52px}
  /* Keep footer links above the listening dock when it is open. */
  html body:has(#player:not([hidden])) .footer.site-footer,
  html body:has(#player:not([hidden])) .footer.site-chrome-footer{
    padding-bottom:calc(24px + var(--player-dock-h, 168px));
  }
}