/* We Live Quran — Quran teaching engine v10.4.1
   Text-first mobile layout + compact controls + low-latency interaction. */

.quran-box.v9-quran-focus{
  width:min(980px,96vw)!important;
  height:min(94dvh,940px)!important;
  max-height:94dvh!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.quran-box.v9-quran-focus .mo-title{
  position:sticky;
  top:0;
  z-index:8;
  background:var(--v9-surface,#fff);
  padding-bottom:8px;
}
.quran-box.v9-quran-focus .quran-source-note{flex:0 0 auto;margin:6px 0 8px}
.quran-box.v9-quran-focus .v9-quran-tabs{flex:0 0 auto;margin:4px 0 8px}
.quran-box.v9-quran-focus .quran-verse-content{
  flex:0 0 auto!important;
  min-height:clamp(220px,34dvh,360px)!important;
  max-height:42dvh!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  scroll-behavior:auto;
  font-size:28px;
  line-height:2.15;
  padding:18px 16px;
  margin:0;
}

.quran-engine-controls{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:end;
  gap:8px!important;
  margin-top:10px!important;
  flex:0 0 auto;
}
.quran-controls-head{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:10px;
  padding:2px 2px 1px;
}
.quran-controls-head b{font-size:13px;color:var(--v9-text,#203229)}
.quran-controls-head small{font-size:10px;color:var(--v9-muted,#68746d)}
.quran-engine-controls .fld{margin:0!important}
.quran-engine-controls .fld label{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:20px;
  margin-bottom:5px;
  font-size:11px;
  color:var(--v9-muted,#68746d);
  font-weight:700;
}
.quran-engine-controls .fld label span{font-size:9px;font-weight:600;opacity:.8}
.quran-engine-controls input[type="number"],
.quran-engine-controls select,
.quran-engine-toolbar select{
  min-height:42px!important;
  height:42px;
  padding-block:0!important;
  border-radius:11px!important;
  font-size:13px!important;
  background:var(--v9-surface,#fff)!important;
}
.quran-control-wide{grid-column:auto}
.quran-engine-controls input:disabled{opacity:.48;background:var(--v9-surface-2,#f1f4f2)!important}

.quran-selected-box{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid var(--v9-border,#dbe2de);
  border-radius:13px;
  padding:8px 10px;
  background:var(--v9-surface-2,#f1f4f2);
  min-height:48px;
}
.quran-selected-info{min-width:0;display:grid;gap:1px}
.quran-selected-info b{font-size:12px;color:var(--v9-primary,#0b5d3b)}
.quran-selected-info span{font-size:9px;color:var(--v9-muted,#68746d)}
.quran-compact-btn{
  border:1px solid color-mix(in srgb,var(--v9-primary,#0b5d3b) 24%,var(--v9-border,#dbe2de));
  background:var(--v9-surface,#fff);
  color:var(--v9-primary,#0b5d3b);
  border-radius:10px;
  min-height:36px;
  padding:0 13px;
  font:inherit;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
}
.quran-compact-btn:active{transform:translateY(1px)}

.quran-engine-toolbar{
  display:grid!important;
  grid-template-columns:minmax(260px,1fr) minmax(250px,auto)!important;
  gap:8px!important;
  align-items:end!important;
  margin-top:9px;
  flex:0 0 auto;
}
.quran-engine-toolbar .fld{margin:0!important}
.quran-play-actions{display:grid;grid-template-columns:minmax(150px,1fr) minmax(90px,.55fr);gap:7px}
.quran-action{
  min-height:42px;
  height:42px;
  border-radius:11px;
  border:1px solid var(--v9-border,#dbe2de);
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  transition:transform .08s ease,background .12s ease,border-color .12s ease;
}
.quran-action:active{transform:translateY(1px)}
.quran-action:disabled{opacity:.55;cursor:default;transform:none}
.quran-action-icon{font-size:11px;line-height:1}
.quran-action-primary{background:var(--v9-primary,#0b5d3b);border-color:var(--v9-primary,#0b5d3b);color:#fff}
.quran-action-secondary{background:var(--v9-surface,#fff);color:var(--v9-text,#203229)}
.quran-action-soft{background:var(--v9-surface,#fff);color:var(--v9-primary,#0b5d3b)}
.quran-action-danger-soft{background:var(--v9-surface,#fff);color:#9b3f3f;border-color:color-mix(in srgb,#9b3f3f 22%,var(--v9-border,#dbe2de))}

.quran-offline-tools{
  margin-top:8px;
  border:1px solid var(--v9-border,#dbe2de);
  border-radius:13px;
  background:var(--v9-surface,#fff);
  flex:0 0 auto;
  overflow:hidden;
}
.quran-offline-tools summary{
  list-style:none;
  cursor:pointer;
  min-height:48px;
  padding:9px 11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.quran-offline-tools summary::-webkit-details-marker{display:none}
.quran-offline-tools summary>span:first-child{display:grid;gap:2px;min-width:0}
.quran-offline-tools summary b{font-size:12px}
.quran-offline-tools summary small{font-size:9px;color:var(--v9-muted,#68746d);font-weight:500}
#quranOfflineStatus{font-size:9px;color:var(--v9-muted,#68746d);text-align:left;max-width:45%}
.quran-offline-tools[open] summary{border-bottom:1px solid var(--v9-border,#dbe2de)}
.quran-offline-body{padding:9px 10px 10px}
.quran-offline-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.quran-download-progress{height:5px;background:var(--v9-surface-2,#f1f4f2);border-radius:999px;overflow:hidden;margin-top:8px}
.quran-download-progress i{display:block;width:0;height:100%;background:var(--v9-primary,#0b5d3b);transition:width .18s ease}

#quranVerseContent .quran-ayah{
  cursor:pointer;
  border-radius:8px;
  padding:2px 2px;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:background .08s ease,box-shadow .08s ease;
}
#quranVerseContent .quran-ayah.selected{
  background:color-mix(in srgb,var(--v9-primary,#0b5d3b) 11%,transparent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--v9-primary,#0b5d3b) 26%,transparent);
}
#quranVerseContent .quran-ayah.playing{
  background:color-mix(in srgb,var(--v9-gold,#c7a23b) 18%,transparent);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--v9-gold,#c7a23b) 36%,transparent);
}

@media(max-width:850px){
  .quran-engine-controls{grid-template-columns:1fr 1fr!important}
  .quran-control-wide{grid-column:1/-1}
  .quran-selected-box{grid-column:1/-1}
  .quran-engine-toolbar{grid-template-columns:1fr!important}
  .quran-play-actions{grid-template-columns:1fr .65fr}
}

@media(max-width:600px){
  .quran-box.v9-quran-focus{
    width:100vw!important;
    height:94dvh!important;
    max-height:94dvh!important;
    border-radius:24px 24px 0 0!important;
    padding:14px 14px calc(16px + env(safe-area-inset-bottom))!important;
  }
  .quran-box.v9-quran-focus .mo-title{padding-top:2px}
  .quran-box.v9-quran-focus .quran-source-note{
    font-size:9px!important;
    line-height:1.55;
    padding:6px 8px!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .quran-box.v9-quran-focus .v9-quran-tabs{margin:3px 0 7px}
  .quran-box.v9-quran-focus .v9-quran-tabs button{min-height:38px}
  .quran-box.v9-quran-focus .quran-verse-content{
    min-height:32dvh!important;
    max-height:38dvh!important;
    font-size:26px!important;
    line-height:2.2!important;
    padding:13px 11px!important;
    border-radius:14px!important;
  }
  .quran-engine-controls{grid-template-columns:1fr 1fr!important;gap:7px!important;margin-top:8px!important}
  .quran-controls-head{padding-top:1px}
  .quran-controls-head small{display:none}
  .quran-engine-controls .fld label{font-size:10px;margin-bottom:4px}
  .quran-engine-controls input[type="number"],.quran-engine-controls select,.quran-engine-toolbar select{height:40px;min-height:40px!important;font-size:12px!important}
  .quran-selected-box{padding:7px 9px;min-height:44px}
  .quran-selected-info span{display:none}
  .quran-compact-btn{min-height:34px;padding-inline:11px}
  .quran-engine-toolbar{margin-top:8px;gap:7px!important}
  .quran-play-actions{grid-template-columns:1fr .62fr}
  .quran-action{height:40px;min-height:40px;padding:0 10px;font-size:11px}
  .quran-offline-tools{margin-top:7px}
  .quran-offline-tools summary{min-height:44px;padding:7px 9px}
  .quran-offline-tools summary small{display:none}
  #quranOfflineStatus{font-size:8.5px;max-width:48%}
}

@media(max-width:360px){
  .quran-box.v9-quran-focus .quran-verse-content{min-height:29dvh!important;font-size:24px!important}
  .quran-engine-controls{gap:6px!important}
  .quran-engine-controls .fld label{font-size:9.5px}
}