/* t314 — azan scroll + settings visibility + mushaf zen simple */

/* t311 used #view-azan { display:flex !important } which beat .view[hidden]
   and kept the azan page on screen (and height:auto killed scrolling). */
#view-azan[hidden] {
  display: none !important;
}
#stage {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
}
#view-azan:not([hidden]) {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y !important;
  overscroll-behavior: contain;
  padding-bottom: 28px !important;
}
#view-settings[hidden] {
  display: none !important;
}
#view-settings:not([hidden]) {
  display: block !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y !important;
}
#view-settings:not([hidden]) .settings-scroll {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#qibla-toggle-bar {
  display: flex !important;
  justify-content: center;
  order: 0;
  margin: 10px 0 8px !important;
}
body.qibla-open #qibla-toggle-bar {
  display: none !important;
}

/* —— Mushaf zen: only shrink + lock —— */
.mushaf-zen-simple {
  display: none;
  position: fixed;
  z-index: 80;
  left: 50%;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  align-items: center;
  gap: 14px;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(8, 20, 14, 0.55);
  border: 1px solid rgba(230, 198, 92, 0.35);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
  pointer-events: auto;
  transition: opacity 0.35s ease, transform 0.35s ease;
}
body.mushaf-zen-fullscreen .mushaf-zen-simple {
  display: flex !important;
}
body.mushaf-zen-fullscreen.mushaf-locked .mushaf-zen-simple {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.mushaf-zen-simple button {
  appearance: none;
  margin: 0;
  min-width: 52px;
  min-height: 52px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(230, 198, 92, 0.55);
  background: linear-gradient(180deg, #1b4d36, #0c2418);
  color: #fff3b0;
  font: 600 14px/1 "Cairo", "Tajawal", sans-serif;
  cursor: pointer;
  letter-spacing: 0;
}
.mushaf-zen-simple button:active {
  transform: scale(0.96);
}
#mushaf-zen-lock[aria-pressed="true"] {
  background: linear-gradient(180deg, #3a2a10, #1a1408);
  border-color: #e6c65c;
  box-shadow: 0 0 0 2px rgba(230, 198, 92, 0.35);
}
body.mushaf-zen-fullscreen.mushaf-locked #mushaf-zen-shrink {
  display: none !important;
}

body.mushaf-zen-fullscreen .top,
body.mushaf-zen-fullscreen .dock,
body.mushaf-zen-fullscreen #mushaf-top,
body.mushaf-zen-fullscreen #mushaf-bar,
body.mushaf-zen-fullscreen #mushaf-menu,
body.mushaf-zen-fullscreen #mushaf-tools-pool,
body.mushaf-zen-fullscreen #mushaf-reader-dock,
body.mushaf-zen-fullscreen .mushaf-reader-dock,
body.mushaf-zen-fullscreen #mushaf-zen-floating,
body.mushaf-zen-fullscreen .mushaf-zen-floating,
body.mushaf-zen-fullscreen #btn-mushaf-exit-fs,
body.mushaf-zen-fullscreen #btn-mushaf-fullscreen,
body.mushaf-zen-fullscreen #lock-shield,
body.mushaf-zen-fullscreen #sebha-reopen,
body.mushaf-zen-fullscreen #sebha-futura,
body.mushaf-zen-fullscreen .sebha-futura,
body.mushaf-zen-fullscreen .sf-root,
body.mushaf-zen-fullscreen #sf-panel,
body.mushaf-zen-fullscreen .mazen-root,
body.mushaf-zen-fullscreen #mazen-root,
body.mushaf-zen-fullscreen #mazen-fab,
body.mushaf-zen-fullscreen .mazen-dock,
body.mushaf-zen-fullscreen .mazen-face-btn,
body.mushaf-zen-fullscreen .mazen-welcome,
body.mushaf-zen-fullscreen .mazen-backdrop,
body.mushaf-zen-fullscreen .mushaf-collapsed-bar,
body.mushaf-zen-fullscreen .mushaf-smooth-zoom-row {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* soft shrink: chrome fades back in */
body.mushaf-zen-exit .top,
body.mushaf-zen-exit .dock,
body.mushaf-zen-exit #mushaf-reader-dock,
body.mushaf-zen-exit #sebha-reopen,
body.mushaf-zen-exit .mazen-dock,
body.mushaf-zen-exit #mazen-fab,
body.mushaf-zen-exit #mazen-root {
  animation: mushafChromeIn 0.38s ease;
}
@keyframes mushafChromeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}