/* AMELIAPOS_LOGIN_RESPONSIVE_R16_5
   Single responsive authority while login is visible. */

/* Absolute isolation: operational shells can never remain visible behind login. */
html.amelia-login-only-r165,
html.amelia-login-only-r165 body{
  width:100%!important;
  max-width:100%!important;
  height:100%!important;
  min-height:100%!important;
  margin:0!important;
  overflow:hidden!important;
}

html.amelia-login-only-r165 body > :not(#login):not(#ameliaPrebootR164R2){
  display:none!important;
}

html.amelia-login-only-r165 #login{
  display:block!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

html.amelia-login-only-r165 #login.hidden,
html.amelia-login-only-r165 #login[hidden]{
  display:none!important;
}

html.amelia-login-only-r165 .gpos-topbar,
html.amelia-login-only-r165 #salonGlobalNav,
html.amelia-login-only-r165 #app{
  display:none!important;
}

/* Preload is always a full-screen program transition, never desktop-sized on phone. */
#ameliaPrebootR164R2{
  width:100vw!important;
  height:100dvh!important;
  min-height:100dvh!important;
  overflow:hidden!important;
}
#ameliaPrebootR164R2 .boot-card{
  width:min(440px,88vw)!important;
}
#ameliaPrebootR164R2 img{
  width:min(280px,68vw)!important;
  height:auto!important;
}

/* PHONE 0–767: compact, no page scroll, no desktop geometry. */
@media (max-width:767px){
  html.amelia-login-only-r165 body{
    position:fixed!important;
    inset:0!important;
  }

  html.amelia-login-only-r165 #login.pos-login-screen{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  html.amelia-login-only-r165 #loginForm.pos-login-shell{
    width:100%!important;
    height:100dvh!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:58px 92px minmax(150px,1fr) auto!important;
    grid-template-areas:
      "head"
      "users"
      "identity"
      "keypad"!important;
  }

  html.amelia-login-only-r165 #login .pos-login-header{
    grid-area:head!important;
    min-height:58px!important;
    height:58px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    padding:3px 12px!important;
    border-bottom:1px solid rgba(255,121,0,.18)!important;
  }
  html.amelia-login-only-r165 #login .pos-login-access,
  html.amelia-login-only-r165 #login .pos-login-context{
    display:none!important;
  }
  html.amelia-login-only-r165 #login .pos-login-brand{
    justify-self:center!important;
    align-items:center!important;
    gap:0!important;
  }
  html.amelia-login-only-r165 #login .amelia-logo-shell{
    width:min(176px,52vw)!important;
    height:48px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-brand>small{
    display:none!important;
  }

  html.amelia-login-only-r165 #login .pos-login-users{
    grid-area:users!important;
    width:100%!important;
    height:92px!important;
    min-width:0!important;
    min-height:0!important;
    padding:7px 10px!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.09)!important;
    overflow:hidden!important;
  }
  html.amelia-login-only-r165 #login .pos-login-section-title{
    margin:0 0 5px!important;
    gap:1px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-section-title>span{
    font-size:12px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-section-title>small{
    display:none!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-list{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    gap:7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:0 0 2px!important;
    scrollbar-width:none!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-list::-webkit-scrollbar{
    display:none!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user{
    flex:0 0 min(174px,66vw)!important;
    width:auto!important;
    min-width:0!important;
    min-height:54px!important;
    height:54px!important;
    grid-template-columns:38px minmax(0,1fr) auto!important;
    gap:8px!important;
    padding:5px 8px!important;
    border-radius:10px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-avatar{
    width:38px!important;
    height:38px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-copy{
    gap:1px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-copy strong{
    font-size:12px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-copy small{
    font-size:9px!important;
  }

  html.amelia-login-only-r165 #login .pos-login-identity{
    grid-area:identity!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:9px 14px 8px!important;
    border-right:0!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    justify-content:start!important;
    overflow:hidden!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-avatar{
    width:54px!important;
    height:54px!important;
    margin-top:0!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-copy{
    margin-top:5px!important;
    gap:1px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-copy>span{
    font-size:8px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-copy h1{
    font-size:21px!important;
    line-height:1.05!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-copy p{
    font-size:9px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-pin-label{
    margin:7px 0 4px!important;
    font-size:9px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-pin-wrap{
    width:100%!important;
    height:44px!important;
    grid-template-columns:minmax(0,1fr) 46px!important;
    border-radius:9px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-pin-wrap input{
    padding:0 12px!important;
    font-size:18px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-remember{
    margin-top:5px!important;
    gap:6px!important;
    font-size:9px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-remember input{
    width:15px!important;
    height:15px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-security,
  html.amelia-login-only-r165 #login .pos-login-feature-strip{
    display:none!important;
  }

  html.amelia-login-only-r165 #login .pos-login-keypad{
    grid-area:keypad!important;
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    padding:7px 10px 9px!important;
    border-left:0!important;
  }
  html.amelia-login-only-r165 #login .pos-login-keypad>.pos-login-section-title{
    display:none!important;
  }
  html.amelia-login-only-r165 #login .pos-login-key-grid{
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-key-grid button{
    width:100%!important;
    min-width:0!important;
    min-height:43px!important;
    height:43px!important;
    border-radius:8px!important;
    font-size:19px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-submit{
    width:100%!important;
    min-height:43px!important;
    height:43px!important;
    margin-top:6px!important;
    border-radius:8px!important;
    font-size:13px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-status{
    min-height:13px!important;
    margin-top:3px!important;
    font-size:8px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-footer{
    display:none!important;
  }

  #ameliaPrebootR164R2 .boot-card{
    width:min(330px,86vw)!important;
  }
  #ameliaPrebootR164R2 img{
    width:min(190px,58vw)!important;
  }
  #ameliaPrebootR164R2 h2{
    margin-top:14px!important;
    font-size:18px!important;
  }
  #ameliaPrebootR164R2 p{
    font-size:10px!important;
  }
  #ameliaPrebootR164R2 .boot-track{
    margin-top:14px!important;
  }
}

/* Short phones: remove nonessential decoration instead of enabling page scroll. */
@media (max-width:767px) and (max-height:700px){
  html.amelia-login-only-r165 #loginForm.pos-login-shell{
    grid-template-rows:52px 78px minmax(118px,1fr) auto!important;
  }
  html.amelia-login-only-r165 #login .pos-login-header{
    height:52px!important;
    min-height:52px!important;
  }
  html.amelia-login-only-r165 #login .amelia-logo-shell{
    width:154px!important;
    height:43px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-users{
    height:78px!important;
    padding-top:5px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user{
    height:47px!important;
    min-height:47px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-avatar{
    width:33px!important;height:33px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-avatar{
    width:42px!important;height:42px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-copy p,
  html.amelia-login-only-r165 #login .pos-login-remember{
    display:none!important;
  }
  html.amelia-login-only-r165 #login .pos-login-pin-label{
    margin-top:4px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-pin-wrap{
    height:40px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-key-grid button{
    height:38px!important;
    min-height:38px!important;
    font-size:17px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-submit{
    height:39px!important;
    min-height:39px!important;
  }
}

/* TABLET PORTRAIT 768–1023: two-column application-like layout. */
@media (min-width:768px) and (max-width:1023px) and (orientation:portrait){
  html.amelia-login-only-r165 #loginForm.pos-login-shell{
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
    grid-template-columns:230px minmax(0,1fr)!important;
    grid-template-rows:74px minmax(220px,1fr) auto 52px!important;
    grid-template-areas:
      "head head"
      "users identity"
      "users keypad"
      "foot foot"!important;
  }
  html.amelia-login-only-r165 #login .pos-login-header{
    min-height:74px!important;
    padding:7px 16px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-access{display:none!important}
  html.amelia-login-only-r165 #login .amelia-logo-shell{width:190px!important;height:58px!important}
  html.amelia-login-only-r165 #login .pos-login-users{
    padding:18px 12px!important;
    border-right:1px solid rgba(255,255,255,.10)!important;
    overflow:hidden!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-list{
    display:grid!important;
    gap:8px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user{
    min-height:64px!important;
    grid-template-columns:44px minmax(0,1fr) auto!important;
  }
  html.amelia-login-only-r165 #login .pos-login-user-avatar{width:42px!important;height:42px!important}
  html.amelia-login-only-r165 #login .pos-login-identity{
    padding:18px 24px 12px!important;
    border-right:0!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-avatar{width:72px!important;height:72px!important}
  html.amelia-login-only-r165 #login .pos-login-pin-label{margin-top:18px!important}
  html.amelia-login-only-r165 #login .pos-login-keypad{
    padding:10px 24px 16px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-key-grid button{
    min-height:52px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-feature-strip{display:none!important}
}

/* TABLET LANDSCAPE 768–1023: preserve a real three-column POS login. */
@media (min-width:768px) and (max-width:1023px) and (orientation:landscape){
  html.amelia-login-only-r165 #loginForm.pos-login-shell{
    grid-template-columns:220px minmax(300px,1fr) 260px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-header{
    min-height:72px!important;
    padding:6px 16px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-access{display:none!important}
  html.amelia-login-only-r165 #login .amelia-logo-shell{width:190px!important;height:56px!important}
  html.amelia-login-only-r165 #login .pos-login-users{padding:20px 12px!important}
  html.amelia-login-only-r165 #login .pos-login-identity{padding:18px 28px 70px!important}
  html.amelia-login-only-r165 #login .pos-login-keypad{padding:20px 16px!important}
  html.amelia-login-only-r165 #login .pos-login-key-grid button{min-height:54px!important}
}

/* NOTEBOOK / SMALL DESKTOP 1024–1366. */
@media (min-width:1024px) and (max-width:1366px){
  html.amelia-login-only-r165 #loginForm.pos-login-shell{
    grid-template-columns:
      clamp(245px,22vw,300px)
      minmax(360px,1fr)
      clamp(270px,24vw,320px)!important;
  }
  html.amelia-login-only-r165 #login .pos-login-header{
    min-height:78px!important;
    padding:7px 24px!important;
  }
  html.amelia-login-only-r165 #login .amelia-logo-shell{
    width:230px!important;
    height:62px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-users{
    padding:25px 16px 20px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-identity{
    padding:22px 42px 72px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-selected-avatar{
    width:88px!important;
    height:88px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-pin-label{
    margin-top:26px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-keypad{
    padding:26px 22px 20px!important;
  }
  html.amelia-login-only-r165 #login .pos-login-key-grid button{
    min-height:60px!important;
  }
}
