/* Path to Islam v1.0.51 - final dock spacing standard
   Root-cause fix: load this file after all other CSS files so older mobile/tablet
   overrides cannot reintroduce oversized bottom gaps.
   Reference layout: Discover screen bottom spacing.
*/
:root {
  --iy-final-dock-bottom: 14px;
  --iy-final-dock-bottom-mobile: 14px;
  --iy-final-dock-bottom-tablet: 18px;
  --iy-final-dock-clearance: 88px;
  --iy-final-dock-clearance-mobile: 74px;
  --iy-final-dock-clearance-tablet: 96px;
  --iy-final-mask-height: 96px;
  --iy-final-mask-height-mobile: 90px;
  --iy-final-mask-height-tablet: 108px;
}

/* One equal bottom-spacing model for every screen. */
.iy-shell {
  padding-bottom: calc(var(--iy-final-dock-clearance) + env(safe-area-inset-bottom)) !important;
}
.iy-main,
.iy-app-main {
  padding-bottom: calc(var(--iy-final-dock-clearance) + env(safe-area-inset-bottom)) !important;
}
.iy-content-mount,
.iy-screen-mount,
.iy-app-screen,
.iy-content-mount.iy-subscreen-active,
.iy-home-focus-stack,
.iy-daily-screen-list-group,
.iy-compact-prayer-list,
.iy-lesson-timeline-list,
.iy-premium-discover-results,
.iy-premium-settings-grid {
  padding-bottom: 0 !important;
}
.iy-content-mount::after,
.iy-app-screen::after,
.iy-subscreen-active::after {
  content: "";
  display: block;
  min-height: 10px !important;
  width: 100%;
  pointer-events: none;
}
.iy-dynamic-card:last-child,
.iy-panel:last-child,
.iy-card:last-child,
.iy-daily-screen-list-group:last-child,
.iy-compact-prayer-list:last-child,
.iy-journey-program-card:last-child,
.iy-premium-settings-grid:last-child,
.iy-home-focus-stack:last-child,
.iy-start-grid:last-child {
  margin-bottom: 0 !important;
}

/* Keep the dock mask, but make it shorter/tighter. */
.iy-preview-frame-body::after {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: var(--iy-final-mask-height-mobile);
  z-index: 8995;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(2,22,17,0) 0%, rgba(3,26,20,.42) 40%, rgba(3,22,17,.82) 70%, rgba(2,18,14,1) 100%);
}
@media (max-width: 1024px) {
  body.iy-public-body:not(.iy-preview-frame-body)::after {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--iy-final-mask-height-mobile);
    z-index: 8995;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(2,22,17,0) 0%, rgba(3,26,20,.42) 40%, rgba(3,22,17,.82) 70%, rgba(2,18,14,1) 100%);
  }
}
.iy-bottom-nav.iy-premium-nav,
.iy-bottom-nav {
  z-index: 9010 !important;
  bottom: max(var(--iy-final-dock-bottom), env(safe-area-inset-bottom)) !important;
}
.iy-toast {
  z-index: 9020 !important;
  bottom: calc(var(--iy-final-dock-clearance) + env(safe-area-inset-bottom)) !important;
}

/* Desktop mobile preview: use the tightest spacing. */
.iy-preview-frame-body .iy-shell,
.iy-preview-frame-body .iy-app-main {
  padding-bottom: var(--iy-final-dock-clearance-mobile) !important;
}
.iy-preview-frame-body .iy-content-mount::after,
.iy-preview-frame-body .iy-app-screen::after,
.iy-preview-frame-body .iy-subscreen-active::after {
  min-height: 0 !important;
}
.iy-preview-frame-body .iy-bottom-nav.iy-premium-nav,
.iy-preview-frame-body .iy-bottom-nav {
  bottom: var(--iy-final-dock-bottom-mobile) !important;
}

/* Phone */
@media (max-width: 640px) {
  .iy-shell {
    padding-bottom: calc(var(--iy-final-dock-clearance-mobile) + env(safe-area-inset-bottom)) !important;
  }
  .iy-main,
  .iy-app-main {
    padding-bottom: calc(var(--iy-final-dock-clearance-mobile) + env(safe-area-inset-bottom)) !important;
  }
  .iy-content-mount::after,
  .iy-app-screen::after,
  .iy-subscreen-active::after {
    min-height: 0 !important;
  }
  .iy-bottom-nav.iy-premium-nav,
  .iy-bottom-nav {
    bottom: max(var(--iy-final-dock-bottom-mobile), env(safe-area-inset-bottom)) !important;
  }
  .iy-toast {
    bottom: calc(var(--iy-final-dock-clearance-mobile) + env(safe-area-inset-bottom)) !important;
  }
}

/* Tablet */
@media (min-width: 641px) and (max-width: 1024px) {
  .iy-shell {
    padding-bottom: calc(var(--iy-final-dock-clearance-tablet) + env(safe-area-inset-bottom)) !important;
  }
  .iy-main,
  .iy-app-main {
    padding-bottom: calc(var(--iy-final-dock-clearance-tablet) + env(safe-area-inset-bottom)) !important;
  }
  .iy-content-mount::after,
  .iy-app-screen::after,
  .iy-subscreen-active::after {
    min-height: 6px !important;
  }
  body.iy-public-body:not(.iy-preview-frame-body)::after,
  .iy-preview-frame-body::after {
    height: var(--iy-final-mask-height-tablet);
  }
  .iy-bottom-nav.iy-premium-nav,
  .iy-bottom-nav {
    bottom: max(var(--iy-final-dock-bottom-tablet), env(safe-area-inset-bottom)) !important;
  }
}

/* v1.0.55 - Home uses the exact same bottom spacing as other main screens.
   No home-specific min-height, auto margin, transform or negative spacing remains. */