/*
 * Sayyarati V84.20 — unified responsive overlays, popup dialogs and wizards.
 * Every popup stays inside the real visual viewport on phones, tablets and desktops.
 */
:root{
  --sayyarati-visual-height:100dvh;
  --sayyarati-visual-top:0px;
  --sayyarati-modal-gap:16px;
  --sayyarati-modal-safe-top:max(8px,env(safe-area-inset-top,0px));
  --sayyarati-modal-safe-bottom:max(8px,env(safe-area-inset-bottom,0px));
}

html.has-responsive-popup,
body.has-responsive-popup{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}

/* Overlay layers always use the browser viewport, never a page/container width. */
.content-wizard-v8419,
.admin-public-wizard-v8418,
.project-modal-v763,
.showroom-edit-v77,
.external-navigation-modal,
.auth-choice-modal,
.balance-topup-modal,
.publish-preview-modal,
.admin-fuel-edit-modal,
.fullscreen-search-modal{
  position:fixed!important;
  inset:0!important;
  top:var(--sayyarati-visual-top,0px)!important;
  bottom:auto!important;
  width:100%!important;
  max-width:none!important;
  height:var(--sayyarati-visual-height,100dvh)!important;
  max-height:var(--sayyarati-visual-height,100dvh)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  overscroll-behavior:contain!important;
}

/* Hidden overlays must never be revived by the universal rules. */
.content-wizard-v8419[hidden],
.admin-public-wizard-v8418[hidden],
.project-modal-v763[hidden],
.showroom-edit-v77[hidden],
.external-navigation-modal[hidden],
.admin-fuel-edit-modal[hidden]{display:none!important}

/* Shared dialog geometry. */
.content-wizard-v8419__dialog,
.admin-public-wizard-v8418__dialog,
.project-modal-v763__dialog,
.showroom-edit-v77__dialog,
.auth-choice-box,
.balance-topup-box,
.publish-preview-dialog,
.admin-fuel-edit-card{
  box-sizing:border-box!important;
  width:min(760px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important;
  max-width:calc(100vw - (var(--sayyarati-modal-gap) * 2))!important;
  max-height:calc(var(--sayyarati-visual-height,100dvh) - (var(--sayyarati-modal-gap) * 2))!important;
  min-height:0!important;
  margin:auto!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  isolation:isolate!important;
}
.content-wizard-v8419__dialog{width:min(680px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important}
.admin-public-wizard-v8418__dialog{width:min(680px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important}
.project-modal-v763__dialog{width:min(820px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important}
.showroom-edit-v77__dialog,.admin-fuel-edit-card{width:min(880px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important}
.auth-choice-box,.balance-topup-box{width:min(460px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important}
.publish-preview-dialog{width:min(560px,calc(100vw - (var(--sayyarati-modal-gap) * 2)))!important}

/* Nothing inside a popup may force horizontal overflow. */
.content-wizard-v8419__dialog *,
.admin-public-wizard-v8418__dialog *,
.project-modal-v763__dialog *,
.showroom-edit-v77__dialog *,
.auth-choice-box *,
.balance-topup-box *,
.publish-preview-dialog *,
.admin-fuel-edit-card *,
.external-navigation-modal__sheet *{
  min-width:0;
  box-sizing:border-box;
}
.content-wizard-v8419__dialog img,
.admin-public-wizard-v8418__dialog img,
.project-modal-v763__dialog img,
.showroom-edit-v77__dialog img,
.publish-preview-dialog img,
.admin-fuel-edit-card img{max-width:100%;height:auto}

/* Fixed heads/progress; only the useful content scrolls. */
.content-wizard-v8419__head,
.content-wizard-v8419__progress,
.admin-public-wizard-v8418__head,
.admin-public-wizard-v8418__progress,
.project-modal-v763__head,
.project-wizard-v763__progress,
.project-settings-tabs-v763,
.showroom-edit-v77__head,
.showroom-edit-v77__tabs{
  flex:0 0 auto!important;
  position:relative!important;
  z-index:4!important;
}

.content-wizard-v8419__dialog>form,
.admin-public-wizard-v8418__dialog>form,
.content-wizard-v8419__dialog>.content-wizard-v8419__login,
.project-settings-form-v763,
.showroom-edit-v77__form,
.admin-fuel-edit-card>form,
.auth-choice-box,
.balance-topup-box,
.publish-preview-dialog{
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-gutter:stable;
}

/* Project publishing wizard keeps the footer visible and scrolls the active step. */
.project-wizard-v763{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
.project-wizard-v763__step{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
}
.project-wizard-v763__actions,
.project-settings-modal-v763__actions,
.content-wizard-v8419__actions,
.admin-public-wizard-v8418__actions,
.showroom-edit-v77__form footer{
  flex:0 0 auto!important;
  position:sticky!important;
  bottom:0!important;
  z-index:8!important;
  background:linear-gradient(180deg,rgba(255,255,255,.86),#fff 24%)!important;
  padding-bottom:max(12px,env(safe-area-inset-bottom,0px))!important;
}

/* Inputs and grids never exceed their dialog. */
.content-wizard-v8419 input,
.content-wizard-v8419 select,
.content-wizard-v8419 textarea,
.admin-public-wizard-v8418 input,
.admin-public-wizard-v8418 select,
.admin-public-wizard-v8418 textarea,
.project-modal-v763 input,
.project-modal-v763 select,
.project-modal-v763 textarea,
.showroom-edit-v77 input,
.showroom-edit-v77 select,
.showroom-edit-v77 textarea,
.admin-fuel-edit-card input,
.admin-fuel-edit-card select,
.admin-fuel-edit-card textarea{
  max-width:100%!important;
}

/* Compact and fully visible directions popup. */
.external-navigation-modal{
  display:grid!important;
  place-items:end center!important;
  padding:var(--sayyarati-modal-safe-top) 8px var(--sayyarati-modal-safe-bottom)!important;
}
.external-navigation-modal__sheet{
  position:relative!important;
  width:min(460px,calc(100vw - 16px))!important;
  max-width:calc(100vw - 16px)!important;
  height:auto!important;
  min-height:0!important;
  max-height:calc(var(--sayyarati-visual-height,100dvh) - var(--sayyarati-modal-safe-top) - var(--sayyarati-modal-safe-bottom))!important;
  margin:0 auto!important;
  border-radius:25px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  padding-bottom:max(14px,env(safe-area-inset-bottom,0px))!important;
}
.external-navigation-modal__heading,
.external-navigation-modal__handle{flex:0 0 auto!important}
.external-navigation-modal__providers{
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
  padding-bottom:2px!important;
}

/* Notification popover remains on-screen even after browser zoom/rotation. */
.home-notification-popover{
  width:min(390px,calc(100vw - 16px))!important;
  max-width:calc(100vw - 16px)!important;
  max-height:calc(var(--sayyarati-visual-height,100dvh) - var(--notification-popover-top,76px) - 8px)!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.home-notification-popover[hidden]{display:none!important}
.home-notification-list,
.home-notification-popover__list,
[data-notification-list]{
  min-height:0!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  -webkit-overflow-scrolling:touch!important;
}
.home-notification-popover__head,
.home-notification-popover__footer{flex:0 0 auto!important}

/* Full-screen search follows the visual viewport and scrolls when the keyboard opens. */
.fullscreen-search-panel{
  width:100%!important;
  height:var(--sayyarati-visual-height,100dvh)!important;
  min-height:0!important;
  max-height:var(--sayyarati-visual-height,100dvh)!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  padding-top:var(--sayyarati-modal-safe-top)!important;
  padding-bottom:var(--sayyarati-modal-safe-bottom)!important;
}

/* Medium screens: collapse wide grids before they can overflow. */
@media(max-width:760px){
  :root{--sayyarati-modal-gap:8px}
  .content-wizard-v8419__grid,
  .content-wizard-v8419__review,
  .admin-public-wizard-v8418__contacts,
  .project-modal-v763 .form-grid.two-col,
  .showroom-edit-v77 .form-grid.two-col,
  .admin-fuel-edit-card .form-grid.two-col{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .food-library-picker-v8419{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* Phone layout: consistent floating bottom sheet with no cut content. */
@media(max-width:700px){
  :root{--sayyarati-modal-gap:6px}
  .content-wizard-v8419:not([hidden]),
  .admin-public-wizard-v8418:not([hidden]),
  .project-modal-v763:not([hidden]),
  .showroom-edit-v77:not([hidden]),
  .auth-choice-modal.is-open,
  .balance-topup-modal.is-open,
  .publish-preview-modal.is-open,
  .admin-fuel-edit-modal:not([hidden]){
    display:flex!important;
    align-items:flex-end!important;
    justify-content:center!important;
    padding:var(--sayyarati-modal-safe-top) var(--sayyarati-modal-gap) var(--sayyarati-modal-safe-bottom)!important;
  }
  .content-wizard-v8419__dialog,
  .admin-public-wizard-v8418__dialog,
  .project-modal-v763__dialog,
  .showroom-edit-v77__dialog,
  .auth-choice-box,
  .balance-topup-box,
  .publish-preview-dialog,
  .admin-fuel-edit-card{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(var(--sayyarati-visual-height,100dvh) - var(--sayyarati-modal-safe-top) - var(--sayyarati-modal-safe-bottom))!important;
    margin:0!important;
    border-radius:24px!important;
  }
  .content-wizard-v8419__head,
  .admin-public-wizard-v8418__head,
  .project-modal-v763__head,
  .showroom-edit-v77__head{
    padding:12px 13px!important;
  }
  .content-wizard-v8419__head h2,
  .admin-public-wizard-v8418__head h2,
  .project-modal-v763__head h2,
  .showroom-edit-v77__head h2{
    font-size:18px!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .content-wizard-v8419__progress,
  .admin-public-wizard-v8418__progress,
  .project-wizard-v763__progress{
    padding:9px 10px 7px!important;
  }
  .content-wizard-v8419__dialog>form,
  .admin-public-wizard-v8418__dialog>form{
    padding-inline:12px!important;
  }
  .content-wizard-v8419__actions,
  .admin-public-wizard-v8418__actions,
  .project-wizard-v763__actions{
    gap:7px!important;
    margin-top:12px!important;
    padding-top:10px!important;
  }
  .content-wizard-v8419__actions .btn,
  .admin-public-wizard-v8418__actions .btn,
  .project-wizard-v763__actions .btn{
    min-width:0!important;
    min-height:44px!important;
    padding-inline:10px!important;
    font-size:12px!important;
  }
  .external-navigation-provider{
    min-height:68px!important;
    grid-template-columns:48px minmax(0,1fr) 18px!important;
    padding:9px 11px!important;
  }
  .external-navigation-provider__icon{width:48px!important;height:48px!important;border-radius:15px!important}
  .external-navigation-modal__heading{padding-top:3px!important;padding-bottom:11px!important}
  .home-notification-popover{
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-width:none!important;
  }
  .auth-choice-head strong,.balance-topup-head>strong{font-size:21px!important}
  .fullscreen-search-form{grid-template-columns:minmax(0,1fr)!important}
  .fullscreen-search-form input,.fullscreen-search-form button{height:56px!important;font-size:16px!important}
}

@media(max-width:390px){
  .content-wizard-v8419__head>span,
  .admin-public-wizard-v8418__icon{display:none!important}
  .content-wizard-v8419__head,
  .admin-public-wizard-v8418__head{grid-template-columns:minmax(0,1fr) 36px!important}
  .content-wizard-v8419__progress span,
  .admin-public-wizard-v8418__progress small,
  .project-wizard-v763__progress span{display:none!important}
  .food-library-picker-v8419{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .external-navigation-modal__heading p{max-width:190px!important}
}

/* Short landscape screens and open virtual keyboard. */
@media(max-height:560px){
  .content-wizard-v8419__head,
  .admin-public-wizard-v8418__head,
  .project-modal-v763__head,
  .showroom-edit-v77__head{padding-block:8px!important}
  .content-wizard-v8419__head>span,
  .admin-public-wizard-v8418__icon{width:38px!important;height:38px!important;font-size:20px!important}
  .content-wizard-v8419__progress,
  .admin-public-wizard-v8418__progress,
  .project-wizard-v763__progress{padding-block:6px!important}
  .content-wizard-v8419__step-title p,
  .project-wizard-v763__step-head p{display:none!important}
  .external-navigation-modal__heading{padding-block:2px 8px!important}
  .external-navigation-modal__pin{width:44px!important;height:44px!important;flex-basis:44px!important;font-size:24px!important}
  .external-navigation-provider{min-height:58px!important}
}
