/* GaliVue V5.1.97 — Mobile Account Stability.
   Consolidates the overlapping V5.1.94 / V5.1.95 / V5.1.96 presentation layers.
   Scope: phone photographer header + mobile-browser login close target only.
   No auth/session API, route, Worker, D1, R2, project, Client Selection,
   Final Delivery, Admin or HERO behavior lives in this file. */

@media (max-width:767px){
  /* One authoritative phone workspace header. The extra .gv5158 selector is
     deliberate: it outranks the older App-strip rule that previously forced
     this header back to flex even after the V5.1.95 grid stylesheet loaded. */
  html body #dashboardPanel .workspace-head,
  html body #dashboardPanel .workspace-head.gv5158-has-app-slot{
    position:sticky!important;
    top:0!important;
    z-index:30!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto auto!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    justify-content:stretch!important;
    column-gap:7px!important;
    row-gap:0!important;
    flex-wrap:nowrap!important;
    width:calc(100% + 28px)!important;
    max-width:none!important;
    min-width:0!important;
    min-height:58px!important;
    margin:calc(-1 * max(8px,env(safe-area-inset-top))) -14px 10px!important;
    padding:max(8px,env(safe-area-inset-top)) 14px 8px!important;
    background:rgba(245,242,235,.97)!important;
    border-bottom:1px solid rgba(222,216,205,.85)!important;
    backdrop-filter:blur(12px)!important;
    box-sizing:border-box!important;
  }

  /* The optional App strip was the element that displaced account controls on
     narrow phones. It remains available outside the phone header. */
  html body #dashboardPanel .workspace-head.gv5158-has-app-slot > .gv5158-app-slot,
  html body #dashboardPanel .workspace-head > .gv5158-app-slot{
    display:none!important;
  }

  /* Flatten only the visual wrappers. Existing DOM, profile handlers, logout
     handler and language-picker behavior remain untouched. */
  /* V5.1.106: the App-strip stylesheet is injected after this file. Match its
     .gv5158-has-app-slot specificity so its older phone rule cannot hide the
     real logged-in brand/account controls and leave an empty top band. */
  html body #dashboardPanel .workspace-head.gv5158-has-app-slot > .workspace-brand,
  html body #dashboardPanel .workspace-head.gv5158-has-app-slot > .workspace-head-actions,
  html body #dashboardPanel .workspace-head > .workspace-brand,
  html body #dashboardPanel .workspace-head > .workspace-head-actions{
    display:contents!important;
    visibility:visible!important;
    opacity:1!important;
  }

  html body #dashboardPanel .workspace-head .workspace-brand-mark{
    grid-column:1!important;
    grid-row:1!important;
    display:inline-flex!important;
    align-items:center!important;
    min-width:0!important;
    margin:0!important;
  }
  html body #dashboardPanel .workspace-head .workspace-brand-mark img{
    display:block!important;
    width:auto!important;
    height:24px!important;
    max-width:78px!important;
  }

  html body #dashboardPanel .workspace-head .workspace-brand-copy{
    grid-column:2!important;
    grid-row:1!important;
    display:block!important;
    position:static!important;
    top:auto!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    overflow:hidden!important;
  }
  html body #dashboardPanel .workspace-head .workspace-brand-copy > small,
  html body #dashboardPanel .workspace-head .workspace-client-portal-shortcut,
  html body #dashboardPanel .workspace-head .workspace-photographer-ref,
  html body #dashboardPanel .workspace-head #openNewProject{
    display:none!important;
  }
  html body #dashboardPanel .workspace-head .workspace-title-nav{
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    overflow:hidden!important;
  }
  html body #dashboardPanel .workspace-head .workspace-brand h2{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-family:inherit!important;
    font-size:1rem!important;
    font-weight:900!important;
    line-height:1.1!important;
    letter-spacing:-.025em!important;
  }

  html body #dashboardPanel .workspace-head .workspace-language-switcher{
    grid-column:3!important;
    grid-row:1!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:60px!important;
    min-width:60px!important;
    max-width:60px!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0 3px!important;
    border:1px solid #e3ded4!important;
    border-radius:11px!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  html body #dashboardPanel .workspace-head .workspace-language-switcher .language-globe{
    display:none!important;
  }
  html body #dashboardPanel .workspace-head .workspace-language-switcher select{
    display:block!important;
    width:54px!important;
    min-width:54px!important;
    max-width:54px!important;
    height:36px!important;
    margin:0!important;
    padding:0 12px 0 2px!important;
    border:0!important;
    background-color:transparent!important;
    color:#252720!important;
    font-size:.65rem!important;
    line-height:36px!important;
    font-weight:900!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }

  html body #dashboardPanel .workspace-head .profile-menu-wrap{
    grid-column:4!important;
    grid-row:1!important;
    display:block!important;
    position:relative!important;
    width:38px!important;
    min-width:38px!important;
    margin:0!important;
  }
  html body #dashboardPanel .workspace-head .profile-avatar-button{
    display:grid!important;
    place-items:center!important;
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
    margin:0!important;
    border-radius:50%!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }

  /* Mobile browser login: keep the existing #closeLogin target visible and
     tappable. V5.1.94 owns the dedicated /login navigation; app.js owns the
     public-home overlay close. No second auth/session controller is added. */
  html:not([data-galivue-photographer-app="1"]) #loginDialog .gv3945-login-panel #closeLogin{
    display:grid!important;
    place-items:center!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:rgba(200,255,61,.28)!important;
    position:relative!important;
    z-index:30!important;
  }
  html:not([data-galivue-photographer-app="1"]) #loginDialog .gv3945-login-panel #closeLogin[hidden],
  html:not([data-galivue-photographer-app="1"]) #loginDialog .gv3945-login-panel #closeLogin:disabled{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
  }
  html[data-galivue-photographer-app="1"] #loginDialog .gv3945-login-panel #closeLogin{
    display:none!important;
  }
}

/* Standalone mode is non-dismissible even before the app-mode dataset is
   stamped, preventing a first-paint escape button in the installed PWA. */
@media (max-width:767px) and (display-mode:standalone){
  #loginDialog .gv3945-login-panel #closeLogin{display:none!important;}
}

@media (max-width:360px){
  html body #dashboardPanel .workspace-head,
  html body #dashboardPanel .workspace-head.gv5158-has-app-slot{
    column-gap:5px!important;
  }
  html body #dashboardPanel .workspace-head .workspace-brand-mark img{
    height:22px!important;
    max-width:70px!important;
  }
  html body #dashboardPanel .workspace-head .workspace-brand h2{
    font-size:.91rem!important;
  }
  html body #dashboardPanel .workspace-head .workspace-language-switcher{
    width:56px!important;
    min-width:56px!important;
    max-width:56px!important;
  }
  html body #dashboardPanel .workspace-head .workspace-language-switcher select{
    width:50px!important;
    min-width:50px!important;
    max-width:50px!important;
    font-size:.61rem!important;
  }
  html body #dashboardPanel .workspace-head .profile-menu-wrap,
  html body #dashboardPanel .workspace-head .profile-avatar-button{
    width:36px!important;
    min-width:36px!important;
  }
  html body #dashboardPanel .workspace-head .profile-avatar-button{
    height:36px!important;
    min-height:36px!important;
  }
}