html.just-native-app.just-app-home{
  --home-user-header-bg:rgba(247,251,250,.94);
  --home-user-header-ink:#02343a;
  --home-user-header-muted:#6b7a7d;
  --home-user-header-green:#2ad067;
  --home-user-header-mint:#55bfa0;
}

.home-user-app-header,
.home-user-sheet,
.home-user-sheet-backdrop{
  display:none;
}

/* هذا التصميم يعمل داخل التطبيق/PWA فقط. */
html.just-native-app.just-app-home .home-page-standard-header{
  display:none!important;
}

html.just-native-app.just-app-home .home-user-app-header{
  display:block!important;
  background:var(--home-user-header-bg)!important;
  border-bottom:1px solid rgba(2,52,58,.06)!important;
  backdrop-filter:blur(22px) saturate(170%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(170%)!important;
}

html.just-native-app.just-app-home .home-user-header-inner{
  direction:rtl;
  width:calc(100% - 28px);
  max-width:720px;
  height:var(--header-h,72px);
  margin:0 auto;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) 48px;
  align-items:center;
  gap:13px;
}

html.just-native-app.just-app-home .home-user-avatar-button,
html.just-native-app.just-app-home .home-user-notification-button{
  position:relative;
  width:48px;
  height:48px;
  min-width:48px;
  border:0;
  padding:0;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:var(--home-user-header-ink);
  box-shadow:0 8px 24px rgba(2,52,58,.08);
  text-decoration:none;
  -webkit-tap-highlight-color:transparent;
}

html.just-native-app.just-app-home .home-user-avatar-button{
  cursor:pointer;
  outline:3px solid rgba(42,208,103,.12);
}

html.just-native-app.just-app-home .home-user-avatar-button img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:50%;
  border:2px solid #fff;
}

html.just-native-app.just-app-home .home-user-notification-button .material-symbols-rounded{
  font-size:25px;
  color:var(--home-user-header-green)!important;
}

html.just-native-app.just-app-home .home-user-header-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  text-align:right;
  line-height:1.2;
  overflow:hidden;
}

html.just-native-app.just-app-home .home-user-header-copy span{
  display:block;
  color:var(--home-user-header-muted);
  font-size:12px;
  font-weight:700;
  margin-bottom:4px;
}

html.just-native-app.just-app-home .home-user-header-copy strong{
  display:block;
  max-width:100%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  color:var(--home-user-header-ink);
  font-size:17px;
  font-weight:800;
}

html.just-native-app.just-app-home .home-user-app-header .header-notification-badge{
  top:-2px!important;
  left:-2px!important;
  right:auto!important;
}

html.just-native-app.just-app-home .home-user-sheet-backdrop{
  display:block;
  position:fixed;
  inset:0;
  z-index:999990;
  background:rgba(2,28,32,.34);
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  transition:opacity .22s ease;
}

html.just-native-app.just-app-home .home-user-sheet-backdrop.is-open{
  opacity:1;
  pointer-events:auto;
}

html.just-native-app.just-app-home .home-user-sheet{
  direction:rtl;
  display:block;
  position:fixed;
  z-index:999999;
  right:0;
  left:0;
  bottom:0;
  width:min(100%,620px);
  max-height:calc(100dvh - 36px);
  margin:0 auto;
  padding:9px 16px calc(18px + env(safe-area-inset-bottom,0px));
  overflow:auto;
  overscroll-behavior:contain;
  border-radius:30px 30px 0 0;
  background:#fff;
  box-shadow:0 -24px 70px rgba(2,52,58,.18);
  transform:translate3d(0,105%,0);
  visibility:hidden;
  transition:transform .26s cubic-bezier(.22,.8,.3,1),visibility 0s linear .26s;
}

html.just-native-app.just-app-home .home-user-sheet.is-open{
  transform:translate3d(0,0,0);
  visibility:visible;
  transition:transform .26s cubic-bezier(.22,.8,.3,1),visibility 0s;
}

html.just-native-app.just-app-home .home-user-sheet-handle{
  width:46px;
  height:5px;
  margin:2px auto 14px;
  border-radius:999px;
  background:#dce7e4;
}

html.just-native-app.just-app-home .home-user-sheet-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:4px 2px 17px;
  border-bottom:1px solid #edf2f1;
}

html.just-native-app.just-app-home .home-user-sheet-person{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
}

html.just-native-app.just-app-home .home-user-sheet-person img{
  width:54px;
  height:54px;
  flex:0 0 54px;
  object-fit:cover;
  border-radius:18px;
  border:2px solid #fff;
  outline:2px solid rgba(42,208,103,.14);
}

html.just-native-app.just-app-home .home-user-sheet-person div{
  min-width:0;
}

html.just-native-app.just-app-home .home-user-sheet-person strong,
html.just-native-app.just-app-home .home-user-sheet-person span{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

html.just-native-app.just-app-home .home-user-sheet-person strong{
  max-width:235px;
  color:var(--home-user-header-ink);
  font-size:16px;
  font-weight:800;
  margin-bottom:5px;
}

html.just-native-app.just-app-home .home-user-sheet-person span{
  color:var(--home-user-header-mint);
  font-size:12px;
  font-weight:800;
}

html.just-native-app.just-app-home .home-user-sheet-close{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:14px;
  background:#f2f7f5;
  color:var(--home-user-header-ink);
}

html.just-native-app.just-app-home .home-user-sheet-close .material-symbols-rounded{
  font-size:22px;
}

html.just-native-app.just-app-home .home-user-mode-switcher{
  margin-top:14px;
  padding:14px;
  border:1px solid #e8f0ee;
  border-radius:20px;
  background:linear-gradient(145deg,#f7fbfa 0%,#eff8f4 100%);
}

html.just-native-app.just-app-home .home-user-mode-copy{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

html.just-native-app.just-app-home .home-user-mode-copy > .material-symbols-rounded{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:13px;
  background:#fff;
  color:#159755;
  box-shadow:0 6px 18px rgba(2,52,58,.06);
  font-size:22px;
}

html.just-native-app.just-app-home .home-user-mode-copy div{
  min-width:0;
}

html.just-native-app.just-app-home .home-user-mode-copy strong,
html.just-native-app.just-app-home .home-user-mode-copy small{
  display:block;
}

html.just-native-app.just-app-home .home-user-mode-copy strong{
  color:var(--home-user-header-ink);
  font-size:14px;
  font-weight:800;
  margin-bottom:3px;
}

html.just-native-app.just-app-home .home-user-mode-copy small{
  color:#748481;
  font-size:11px;
  font-weight:700;
  line-height:1.6;
}

html.just-native-app.just-app-home .home-user-mode-options{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

html.just-native-app.just-app-home .home-user-mode-option{
  min-width:0;
  min-height:64px;
  padding:8px 5px;
  border:1px solid #e2ece9;
  border-radius:16px;
  background:#fff;
  color:#61716e;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  font-family:inherit;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}

html.just-native-app.just-app-home .home-user-mode-option .material-symbols-rounded{
  font-size:23px;
  color:inherit!important;
}

html.just-native-app.just-app-home .home-user-mode-option.is-active{
  color:#fff;
  border-color:#168e67;
  background:linear-gradient(145deg,#087864,#25ad7b);
  box-shadow:0 8px 20px rgba(8,120,100,.20);
}

html.just-native-app.just-app-home .home-user-mode-option:active{
  transform:scale(.975);
}

html.just-native-app.just-app-home .home-user-sheet.is-switching{
  pointer-events:none;
  opacity:.78;
}

html.just-native-app.just-app-home .home-user-sheet-menu{
  display:grid;
  gap:8px;
  padding-top:14px;
}

html.just-native-app.just-app-home .home-user-sheet-menu a{
  min-height:58px;
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 24px;
  align-items:center;
  gap:12px;
  padding:7px 12px;
  border-radius:18px;
  color:var(--home-user-header-ink);
  text-decoration:none;
  background:#f8fbfa;
  border:1px solid #edf3f1;
  -webkit-tap-highlight-color:transparent;
}

html.just-native-app.just-app-home .home-user-sheet-menu a:active{
  background:#eef7f3;
  transform:scale(.992);
}

html.just-native-app.just-app-home .home-user-sheet-icon{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:rgba(42,208,103,.11);
  color:#159755;
}

html.just-native-app.just-app-home .home-user-sheet-icon .material-symbols-rounded{
  font-size:23px;
}

html.just-native-app.just-app-home .home-user-sheet-label{
  font-size:14px;
  font-weight:800;
}

html.just-native-app.just-app-home .home-user-sheet-arrow{
  color:#a5b4b0;
  font-size:21px;
}

html.just-native-app.just-app-home .home-user-sheet-menu .home-user-sheet-logout{
  color:#d6453d;
  background:#fff8f7;
  border-color:#fde4e1;
}

html.just-native-app.just-app-home .home-user-sheet-menu .home-user-sheet-logout .home-user-sheet-icon{
  color:#d6453d;
  background:#feeceb;
}

html.just-native-app.just-app-home body.home-user-sheet-open{
  overflow:hidden!important;
  touch-action:none;
}

/* إزالة الكرت القديم في التطبيق فقط، مع إبقائه كما هو في الموقع والمتصفح. */
html.just-native-app.just-app-home .user-card{
  display:none!important;
}

html.just-native-app.just-app-home .home-main-banner{
  margin-top:2px!important;
}

html.just-native-app.just-app-home .home-user-mode-options-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

@media (max-width:390px){
  html.just-native-app.just-app-home .home-user-header-inner{
    width:calc(100% - 20px);
    grid-template-columns:48px minmax(0,1fr) 46px;
    gap:10px;
  }

  html.just-native-app.just-app-home .home-user-avatar-button,
  html.just-native-app.just-app-home .home-user-notification-button{
    width:44px;
    height:44px;
    min-width:44px;
  }

  html.just-native-app.just-app-home .home-user-header-copy strong{
    font-size:16px;
  }
}

/* =========================================================
   مبدّل الصلاحيات داخل القائمة السفلية — تصميم واضح وثابت
   تمت كتابة المحددات داخل القائمة نفسها لتفادي تعارضات CSS العامة.
========================================================= */
.home-user-sheet .home-user-mode-switcher{
  display:block!important;
  margin:14px 0 0!important;
  padding:14px!important;
  border:1.5px solid rgba(42,176,127,.46)!important;
  border-radius:22px!important;
  background:#fbfffd!important;
  box-shadow:none!important;
}

.home-user-sheet .home-user-mode-copy{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 12px!important;
  padding:0!important;
}

.home-user-sheet .home-user-mode-copy > .material-symbols-rounded{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(42,176,127,.32)!important;
  border-radius:15px!important;
  background:#effaf5!important;
  color:#11845f!important;
  box-shadow:none!important;
  font-size:23px!important;
}

.home-user-sheet .home-user-mode-copy div{
  min-width:0!important;
}

.home-user-sheet .home-user-mode-copy strong{
  display:block!important;
  margin:0 0 3px!important;
  color:#02343a!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1.4!important;
}

.home-user-sheet .home-user-mode-copy small{
  display:block!important;
  margin:0!important;
  color:#71817d!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1.6!important;
}

.home-user-sheet .home-user-mode-options{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:4px!important;
  width:100%!important;
  padding:4px!important;
  border:1px solid rgba(42,176,127,.42)!important;
  border-radius:19px!important;
  background:#f1faf6!important;
  box-shadow:none!important;
}

.home-user-sheet .home-user-mode-options-2{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

.home-user-sheet .home-user-mode-options-3{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

.home-user-sheet .home-user-mode-option{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:100%!important;
  min-width:0!important;
  min-height:62px!important;
  margin:0!important;
  padding:8px 5px!important;
  border:1px solid transparent!important;
  border-radius:15px!important;
  background:transparent!important;
  color:#5f706c!important;
  box-shadow:none!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  font-family:'Almarai',sans-serif!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1.3!important;
  text-align:center!important;
  cursor:pointer!important;
  -webkit-tap-highlight-color:transparent!important;
  transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease!important;
}

.home-user-sheet .home-user-mode-option .material-symbols-rounded{
  display:block!important;
  margin:0!important;
  color:inherit!important;
  font-size:23px!important;
  line-height:1!important;
}

.home-user-sheet .home-user-mode-option > span:last-child{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.home-user-sheet .home-user-mode-option.is-active,
.home-user-sheet .home-user-mode-option[aria-pressed="true"]{
  border-color:#128566!important;
  background:#087864!important;
  color:#fff!important;
  box-shadow:none!important;
}

.home-user-sheet .home-user-mode-option:active{
  transform:scale(.975)!important;
}

.home-user-sheet.is-switching .home-user-mode-switcher{
  opacity:.72!important;
  pointer-events:none!important;
}

@media (max-width:360px){
  .home-user-sheet .home-user-mode-option{
    min-height:58px!important;
    padding-inline:3px!important;
    font-size:10px!important;
  }
}