/* SmartMuslim Home Redesign V2 — component visual match
   Approved target: editorial Calendario Islamico / ivory / forest green / soft gold.
   This file intentionally overrides the V1 redesign without touching app logic. */

:root{
  --sm26v2-ivory:#fbf7ef;
  --sm26v2-paper:#fffdf8;
  --sm26v2-paper-warm:#f8f0e3;
  --sm26v2-green:#0b513f;
  --sm26v2-green-dark:#073b30;
  --sm26v2-ink:#173f35;
  --sm26v2-gold:#b78d3f;
  --sm26v2-gold-soft:#d8bc79;
  --sm26v2-line:#ded1bc;
  --sm26v2-muted:#747873;
  --sm26v2-mint:#e7f3ed;
  --sm26v2-shadow:0 10px 26px rgba(59,48,31,.065);
}

body:not(.sm-dark-v2){
  background:
    radial-gradient(circle at 7% 0%,rgba(255,255,255,.9),transparent 19rem),
    radial-gradient(circle at 94% 25%,rgba(11,81,63,.035),transparent 22rem),
    var(--sm26v2-ivory)!important;
}
body:not(.sm-dark-v2) .app-container{
  background:
    radial-gradient(circle at 100% 5%,rgba(11,81,63,.025),transparent 17rem),
    linear-gradient(180deg,#fcf8ef 0%,#fbf7ef 100%)!important;
}

/* ---------- Header ---------- */
body:has(#view-home[style*="display: block"]) .app-container{
  padding-top:calc(8px + env(safe-area-inset-top,0px))!important;
}
body:has(#view-home[style*="display: block"]) .app-container>.home-main-header{
  display:flex!important;
  align-items:center!important;
  min-height:86px!important;
  height:86px!important;
  max-height:86px!important;
  margin:0 0 7px!important;
  padding:0 4px!important;
}
body:has(#view-home[style*="display: block"]) .home-header-brand{
  width:calc(100% - 104px)!important;
  height:64px!important;
  min-height:64px!important;
  grid-template-columns:58px minmax(0,1fr)!important;
  column-gap:10px!important;
}
body:has(#view-home[style*="display: block"]) .home-header-logo-mark{
  width:58px!important;
  height:58px!important;
  margin:0!important;
  border-radius:15px!important;
  box-shadow:0 7px 17px rgba(20,63,50,.13)!important;
}
body:has(#view-home[style*="display: block"]) .app-container>.home-main-header .home-header-brand>h1{
  margin:0!important;
  color:var(--sm26v2-green-dark)!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:clamp(1.6rem,7.1vw,2.05rem)!important;
  font-weight:700!important;
  line-height:.95!important;
  letter-spacing:-.032em!important;
}
body:has(#view-home[style*="display: block"]) .app-container>.home-main-header .home-header-brand>.brand-desc{
  margin:4px 0 0!important;
  color:#9b7535!important;
  font-family:Georgia,serif!important;
  font-size:.47rem!important;
  font-weight:700!important;
  line-height:1.1!important;
  letter-spacing:.28em!important;
  text-transform:uppercase!important;
}
body:has(#view-home[style*="display: block"]) .home-main-header .home-header-actions{
  top:max(12px,env(safe-area-inset-top,0px))!important;
  right:max(12px,calc((100vw - 430px)/2 + 12px))!important;
  gap:8px!important;
}
body:has(#view-home[style*="display: block"]) .home-header-icon-button{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  padding:9px!important;
  border:1px solid rgba(183,141,63,.58)!important;
  background:rgba(255,253,248,.98)!important;
  box-shadow:0 5px 13px rgba(65,49,27,.055)!important;
}
body:has(#view-home[style*="display: block"]) .home-header-icon-button svg{
  width:24px!important;
  height:24px!important;
  stroke-width:1.65!important;
}

/* ---------- Home stack ---------- */
#view-home[style*="display: block"]{
  gap:11px!important;
}
#view-home[style*="display: block"]>.home-islamic-calendar{order:-10!important}
#view-home[style*="display: block"]>.sm-home-primary-grid{order:-9!important}
#view-home[style*="display: block"]>.sm-home-inspiration{order:-8!important}
#view-home[style*="display: block"]>.sm-home-tools{order:-7!important}

/* ---------- Calendar hero ---------- */
#view-home .home-islamic-calendar{
  position:relative!important;
  margin:0!important;
  min-height:236px!important;
  padding:10px 11px!important;
  overflow:hidden!important;
  border:1px solid rgba(183,141,63,.72)!important;
  border-radius:22px!important;
  background:
    linear-gradient(135deg,rgba(255,253,248,.98),rgba(248,240,227,.95))!important;
  box-shadow:var(--sm26v2-shadow)!important;
  isolation:isolate;
}
#view-home .home-islamic-calendar::before{
  content:''!important;
  position:absolute!important;
  inset:5px!important;
  border:1px solid rgba(183,141,63,.26)!important;
  border-radius:17px!important;
  pointer-events:none!important;
  z-index:1!important;
}
#view-home .home-islamic-calendar::after{
  content:''!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  right:-20px!important;
  bottom:-14px!important;
  width:44%!important;
  height:78%!important;
  opacity:.11!important;
  background:
    linear-gradient(90deg,rgba(251,247,239,0),rgba(251,247,239,.08)),
    url("assets/ui/vita-v1/background/vita_sfondo_moschea.png") center bottom/cover no-repeat!important;
  border-radius:0!important;
  pointer-events:none!important;
}
#view-home .home-calendar-body{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  grid-template-columns:minmax(88px,29%) minmax(0,1fr)!important;
  gap:13px!important;
  min-height:214px!important;
  align-items:stretch!important;
}
#view-home .home-calendar-date{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  padding:2px 11px 2px 2px!important;
  border-right:1px solid rgba(183,141,63,.66)!important;
  color:var(--sm26v2-green)!important;
  text-align:center!important;
}
#view-home .home-calendar-date h2{display:none!important}
#view-home .home-calendar-emblem{
  width:44px!important;
  height:25px!important;
  margin:0 0 5px!important;
  color:var(--sm26v2-gold)!important;
}
#view-home .home-calendar-emblem::before{
  left:1px!important;
  top:-10px!important;
  font-size:2.35rem!important;
}
#view-home .home-calendar-emblem span{
  right:4px!important;
  top:0!important;
  font-size:.72rem!important;
}
#view-home #home-calendar-weekday{
  margin:1px 0 3px!important;
  color:var(--sm26v2-green)!important;
  font:700 .65rem/1 'Playfair Display',Georgia,serif!important;
  letter-spacing:.27em!important;
}
#view-home #home-calendar-day{
  color:var(--sm26v2-green-dark)!important;
  font:500 clamp(3.85rem,17vw,5rem)/.79 Georgia,'Times New Roman',serif!important;
  letter-spacing:-.075em!important;
}
#view-home #home-calendar-month{
  margin-top:5px!important;
  color:var(--sm26v2-green)!important;
  font:700 .62rem/1 Georgia,serif!important;
  letter-spacing:.2em!important;
  white-space:nowrap!important;
}
#view-home #home-calendar-year{
  width:82%!important;
  margin:7px auto 5px!important;
  padding-top:7px!important;
  border-top:1px solid rgba(183,141,63,.56)!important;
  color:#9a7332!important;
  font:700 .61rem/1 Georgia,serif!important;
  letter-spacing:.27em!important;
}
#view-home #home-calendar-hijri{
  margin-top:3px!important;
  color:var(--sm26v2-ink)!important;
  font:700 .47rem/1.15 Georgia,serif!important;
  white-space:nowrap!important;
}
#view-home .home-calendar-message{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-width:0!important;
  padding:5px 8px 4px 0!important;
  text-align:left!important;
}
#view-home .home-calendar-greeting{
  margin:0 0 6px!important;
  color:var(--sm26v2-green-dark)!important;
  font:700 clamp(1rem,4.5vw,1.25rem)/1.03 'Playfair Display',Georgia,serif!important;
  letter-spacing:-.015em!important;
}
#view-home #home-calendar-phrase{
  max-width:100%!important;
  margin:0!important;
  color:var(--sm26v2-ink)!important;
  font:500 clamp(.69rem,3.15vw,.83rem)/1.28 'Playfair Display',Georgia,serif!important;
}
#view-home #home-calendar-phrase mark,
#view-home #home-calendar-phrase .highlight,
#view-home #home-calendar-phrase strong{
  border-radius:7px!important;
  background:linear-gradient(180deg,transparent 16%,rgba(224,198,138,.38) 16% 88%,transparent 88%)!important;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
#view-home #home-calendar-source-box{display:none!important}

/* subtle editorial corner */
#view-home .home-calendar-message::after{
  content:'';
  position:absolute;
  right:5px;
  top:3px;
  width:76px;
  height:76px;
  opacity:.12;
  background:
    linear-gradient(45deg,transparent 45%,var(--sm26v2-gold) 46% 47%,transparent 48%) 0 0/14px 14px,
    linear-gradient(-45deg,transparent 45%,var(--sm26v2-gold) 46% 47%,transparent 48%) 0 0/14px 14px;
  -webkit-mask-image:linear-gradient(135deg,#000,transparent 72%);
  mask-image:linear-gradient(135deg,#000,transparent 72%);
  pointer-events:none;
}

/* ---------- Primary feature cards ---------- */
.sm-home-primary-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.sm-home-feature{
  position:relative!important;
  height:184px!important;
  min-height:184px!important;
  max-height:184px!important;
  padding:14px 13px 12px!important;
  overflow:hidden!important;
  border-radius:20px!important;
  text-align:left!important;
  box-shadow:0 9px 22px rgba(65,49,27,.06)!important;
}
.sm-home-feature--school{
  border:1px solid rgba(183,141,63,.78)!important;
  background:
    linear-gradient(145deg,rgba(13,90,69,.96),rgba(7,59,48,.98))!important;
  color:#fffdf8!important;
  box-shadow:
    inset 0 0 0 5px rgba(217,188,121,.30),
    inset 0 0 0 9px rgba(217,188,121,.13),
    0 10px 25px rgba(7,59,48,.14)!important;
}
.sm-home-feature--school::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  opacity:.11!important;
  background:
    url("assets/auth/smart-muslim-auth-mosque-bg.png") right bottom/cover no-repeat!important;
  pointer-events:none!important;
}
.sm-home-feature--school::after{
  content:''!important;
  position:absolute!important;
  inset:5px!important;
  border:1px solid rgba(230,202,141,.56)!important;
  border-radius:15px!important;
  pointer-events:none!important;
}
.sm-home-feature--community{
  border:1px solid rgba(183,141,63,.68)!important;
  background:
    linear-gradient(145deg,rgba(255,253,248,.99),rgba(248,240,227,.96))!important;
  color:var(--sm26v2-ink)!important;
  box-shadow:
    inset 0 0 0 5px rgba(183,141,63,.06),
    0 9px 22px rgba(65,49,27,.055)!important;
}
.sm-home-feature--community::before{
  content:''!important;
  position:absolute!important;
  inset:0!important;
  opacity:.07!important;
  background:url("assets/auth/smart-muslim-auth-mosque-bg.png") right bottom/cover no-repeat!important;
  pointer-events:none!important;
}
.sm-home-feature-icon{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  place-items:center!important;
  width:44px!important;
  height:44px!important;
  margin:0 0 10px!important;
  border-radius:50%!important;
  background:rgba(255,253,248,.045)!important;
}
.sm-home-feature--school .sm-home-feature-icon{
  border:1px solid rgba(230,202,141,.76)!important;
  color:#f1d08a!important;
}
.sm-home-feature--community .sm-home-feature-icon{
  border:1px solid rgba(183,141,63,.6)!important;
  background:rgba(255,253,248,.86)!important;
  color:var(--sm26v2-green)!important;
}
.sm-home-feature-icon svg{
  width:24px!important;
  height:24px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.7!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.sm-home-feature h2{
  position:relative!important;
  z-index:2!important;
  max-width:calc(100% - 42px)!important;
  margin:0 0 5px!important;
  font:700 clamp(1.15rem,5.7vw,1.52rem)/.98 'Playfair Display',Georgia,serif!important;
  letter-spacing:-.025em!important;
}
.sm-home-feature--school h2{color:#fffdf8!important}
.sm-home-feature--community h2{color:var(--sm26v2-green-dark)!important}
.sm-home-feature p{
  position:relative!important;
  z-index:2!important;
  max-width:15ch!important;
  margin:0!important;
  font:500 .67rem/1.27 'Playfair Display',Georgia,serif!important;
}
.sm-home-feature--school p{color:#fffdf8!important}
.sm-home-feature--community p{color:var(--sm26v2-ink)!important}
.sm-home-feature-arrow{
  position:absolute!important;
  z-index:3!important;
  right:11px!important;
  top:50%!important;
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid rgba(183,141,63,.34)!important;
  border-radius:50%!important;
  background:#ead49a!important;
  color:var(--sm26v2-green-dark)!important;
  box-shadow:none!important;
  transform:translateY(-50%)!important;
  font:700 1rem/1 var(--sm-sans)!important;
}
.sm-home-feature-meta{
  position:absolute!important;
  z-index:2!important;
  left:13px!important;
  right:13px!important;
  bottom:12px!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  min-width:0!important;
  padding-top:8px!important;
  border-top:1px solid currentColor!important;
  font:700 .42rem/1 var(--sm-sans)!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.sm-home-feature--school .sm-home-feature-meta{color:#f2ddaa!important}
.sm-home-feature--community .sm-home-feature-meta{color:#596b65!important}
.sm-home-feature-meta svg{
  flex:0 0 15px!important;
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.55!important;
}
.sm-home-feature-meta span{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* ---------- Inspiration ---------- */
.sm-home-inspiration{
  position:relative!important;
  display:grid!important;
  grid-template-columns:72px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  min-height:132px!important;
  height:auto!important;
  padding:13px 15px!important;
  overflow:hidden!important;
  border:1px solid rgba(183,141,63,.68)!important;
  border-radius:20px!important;
  background:linear-gradient(145deg,rgba(255,253,248,.98),rgba(248,240,227,.95))!important;
  box-shadow:var(--sm26v2-shadow)!important;
}
.sm-home-inspiration::before{
  inset:5px!important;
  border:1px solid rgba(183,141,63,.20)!important;
  border-radius:15px!important;
}
.sm-home-inspiration-art{
  width:68px!important;
  height:68px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 4px 3px rgba(65,49,27,.12))!important;
}
.sm-home-inspiration-copy{
  text-align:center!important;
}
.sm-home-inspiration-kicker{
  margin:0 0 5px!important;
  color:#7e6b48!important;
  font:700 .44rem/1 var(--sm-sans)!important;
  letter-spacing:.22em!important;
}
.sm-home-inspiration-arabic{
  margin:0 0 4px!important;
  color:var(--sm26v2-green)!important;
  font-size:1.14rem!important;
  line-height:1.35!important;
}
.sm-home-inspiration-text{
  margin:0!important;
  color:var(--sm26v2-ink)!important;
  font:500 .65rem/1.25 'Playfair Display',Georgia,serif!important;
}
.sm-home-inspiration-source{
  margin-top:5px!important;
  color:#a0772f!important;
  font:700 .48rem/1 var(--sm-sans)!important;
  letter-spacing:.14em!important;
}

/* ---------- Tools ---------- */
.sm-home-tools{
  margin:0!important;
}
.sm-home-tools-head{
  margin:0 2px 7px!important;
}
.sm-home-tools-head h3{
  margin:0!important;
  color:#6f6047!important;
  font:700 .56rem/1 var(--sm-sans)!important;
  letter-spacing:.23em!important;
}
.sm-home-tools-head span{
  color:#7d817c!important;
  font:500 .56rem/1 var(--sm-sans)!important;
}
.sm-home-tools-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
}
.sm-home-tool{
  display:grid!important;
  grid-template-columns:35px minmax(0,1fr) 8px!important;
  gap:6px!important;
  align-items:center!important;
  min-width:0!important;
  min-height:68px!important;
  padding:8px 7px!important;
  border:1px solid rgba(222,209,188,.9)!important;
  border-radius:15px!important;
  background:rgba(255,253,248,.98)!important;
  color:var(--sm26v2-ink)!important;
  box-shadow:0 6px 15px rgba(65,49,27,.045)!important;
}
.sm-home-tool-icon{
  width:35px!important;
  height:35px!important;
  border-radius:50%!important;
  background:#f3ecdc!important;
  color:var(--sm26v2-green)!important;
}
.sm-home-tool-icon svg{
  width:21px!important;
  height:21px!important;
  stroke-width:1.65!important;
}
.sm-home-tool-copy{min-width:0!important}
.sm-home-tool strong{
  display:block!important;
  max-width:100%!important;
  overflow:visible!important;
  color:var(--sm26v2-green-dark)!important;
  font:700 .61rem/1.03 'Playfair Display',Georgia,serif!important;
  white-space:normal!important;
  text-overflow:clip!important;
}
.sm-home-tool small{
  display:block!important;
  margin-top:3px!important;
  color:#747a75!important;
  font:500 .44rem/1.14 var(--sm-sans)!important;
}
.sm-home-tool-chevron{
  color:#5f6b66!important;
  font-size:.85rem!important;
}

/* ---------- Existing lower Home cards inherit the new system ---------- */
#view-home #home-location-panel,
#view-home #home-next-prayer-container>.home-next-prayer-card,
#view-home #home-mosque-feed{
  border-color:rgba(183,141,63,.36)!important;
  background:
    linear-gradient(145deg,rgba(255,253,248,.985),rgba(248,240,227,.91))!important;
  box-shadow:0 8px 20px rgba(65,49,27,.05)!important;
}
#view-home #home-location-panel,
#view-home #home-next-prayer-container>.home-next-prayer-card{
  border-radius:19px!important;
}
#view-home #home-next-prayer-container>.home-next-prayer-card{
  overflow:hidden!important;
}
#view-home .home-next-prayer-copy>span,
#view-home .home-next-prayer-copy footer button,
#view-home .home-mosque-feed-head h3{
  color:var(--sm26v2-green)!important;
}
#view-home .home-next-prayer-copy h3,
#view-home .home-next-prayer-copy>div>strong,
#view-home .home-mosque-story h4{
  color:var(--sm26v2-green-dark)!important;
}
#view-home .home-mosque-feed{
  border-radius:19px!important;
}
#view-home .home-mosque-story{
  border-color:rgba(222,209,188,.9)!important;
  background:rgba(255,253,248,.96)!important;
  box-shadow:0 5px 14px rgba(65,49,27,.045)!important;
}
#view-home .home-mosque-story button{
  background:linear-gradient(135deg,#0b5d48,#087056)!important;
  border-radius:10px!important;
}

/* ---------- Bottom navigation ---------- */
#view-tabs.bottom-nav.bottom-nav--smart-premium{
  width:min(calc(100% - 18px),430px)!important;
  height:72px!important;
  padding:5px 4px!important;
  border:1px solid rgba(222,209,188,.92)!important;
  border-radius:24px!important;
  background:rgba(255,253,248,.975)!important;
  box-shadow:0 9px 22px rgba(38,51,45,.095)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item{
  height:60px!important;
  border-radius:18px!important;
  color:#8a8e8b!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item::before{
  inset:2px 4px!important;
  border-radius:17px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item.active::before,
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item.is-active::before{
  background:var(--sm26v2-mint)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .home-nav-icon{
  width:27px!important;
  height:27px!important;
  flex-basis:27px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .home-nav-icon svg{
  width:24px!important;
  height:24px!important;
  stroke-width:1.65!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item>span:last-child{
  font:650 .57rem/1 var(--sm-sans)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item.active,
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item.is-active{
  color:var(--sm26v2-green)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item::after{
  width:3px!important;
  height:3px!important;
  margin-top:1px!important;
}
.app-container{padding-bottom:104px!important}

/* ---------- Explore ---------- */
.sm-explore-shell{
  color:var(--sm26v2-ink)!important;
}
.sm-explore-card{
  border-color:rgba(222,209,188,.9)!important;
  background:rgba(255,253,248,.98)!important;
  box-shadow:0 7px 17px rgba(65,49,27,.045)!important;
}
.sm-explore-card-icon{
  background:#f3ecdc!important;
  color:var(--sm26v2-green)!important;
}
.sm-explore-card strong{color:var(--sm26v2-green-dark)!important}

/* ---------- Compact Safari phones ---------- */
@media(max-width:400px){
  body:has(#view-home[style*="display: block"]) .app-container>.home-main-header{
    min-height:82px!important;height:82px!important;max-height:82px!important
  }
  body:has(#view-home[style*="display: block"]) .home-header-brand{
    width:calc(100% - 96px)!important;
    grid-template-columns:53px minmax(0,1fr)!important;
    height:58px!important;
    min-height:58px!important;
  }
  body:has(#view-home[style*="display: block"]) .home-header-logo-mark{width:53px!important;height:53px!important}
  body:has(#view-home[style*="display: block"]) .app-container>.home-main-header .home-header-brand>h1{font-size:1.48rem!important}
  body:has(#view-home[style*="display: block"]) .app-container>.home-main-header .home-header-brand>.brand-desc{font-size:.4rem!important;letter-spacing:.22em!important}
  body:has(#view-home[style*="display: block"]) .home-header-icon-button{
    width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:8px!important
  }
  #view-home .home-islamic-calendar{min-height:224px!important;padding:9px!important}
  #view-home .home-calendar-body{grid-template-columns:minmax(82px,29%) minmax(0,1fr)!important;gap:10px!important;min-height:204px!important}
  #view-home #home-calendar-day{font-size:3.65rem!important}
  #view-home #home-calendar-month{font-size:.56rem!important;letter-spacing:.17em!important}
  #view-home #home-calendar-hijri{font-size:.42rem!important}
  #view-home .home-calendar-greeting{font-size:.97rem!important}
  #view-home #home-calendar-phrase{font-size:.64rem!important;line-height:1.25!important}
  .sm-home-feature{height:175px!important;min-height:175px!important;max-height:175px!important;padding:13px 11px 11px!important}
  .sm-home-feature-icon{width:40px!important;height:40px!important;margin-bottom:8px!important}
  .sm-home-feature h2{font-size:1.08rem!important}
  .sm-home-feature p{font-size:.61rem!important}
  .sm-home-feature-meta{left:11px!important;right:11px!important;bottom:10px!important;font-size:.36rem!important;gap:4px!important}
  .sm-home-feature-meta svg{width:13px!important;height:13px!important;flex-basis:13px!important}
  .sm-home-feature-arrow{width:31px!important;height:31px!important;right:9px!important}
  .sm-home-inspiration{grid-template-columns:61px minmax(0,1fr)!important;min-height:122px!important;padding:11px!important}
  .sm-home-inspiration-art{width:58px!important;height:58px!important}
  .sm-home-inspiration-arabic{font-size:1rem!important}
  .sm-home-inspiration-text{font-size:.58rem!important}
  .sm-home-tools-grid{gap:6px!important}
  .sm-home-tool{grid-template-columns:31px minmax(0,1fr) 7px!important;gap:5px!important;min-height:64px!important;padding:7px 5px!important}
  .sm-home-tool-icon{width:31px!important;height:31px!important}
  .sm-home-tool-icon svg{width:18px!important;height:18px!important}
  .sm-home-tool strong{font-size:.56rem!important}
  .sm-home-tool small{font-size:.39rem!important}
  #view-tabs.bottom-nav.bottom-nav--smart-premium{height:69px!important;width:calc(100% - 14px)!important}
  #view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item{height:57px!important}
  #view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item>span:last-child{font-size:.53rem!important}
}

/* ---------- Dark mode ---------- */
body.sm-dark-v2 .sm-home-feature--community,
body.sm-dark-v2 .sm-home-inspiration,
body.sm-dark-v2 .sm-home-tool,
body.sm-dark-v2 #view-home .home-islamic-calendar{
  background:#0d2018!important;
  border-color:#3c4c44!important;
}
body.sm-dark-v2 .sm-home-feature--community h2,
body.sm-dark-v2 .sm-home-feature--community p,
body.sm-dark-v2 .sm-home-inspiration-text,
body.sm-dark-v2 .sm-home-tool strong,
body.sm-dark-v2 #view-home .home-calendar-greeting,
body.sm-dark-v2 #view-home #home-calendar-phrase{
  color:#f1ece0!important;
}

/* =========================================================
   V3 — Calendario unificato.
   La fonte/versetto/hadith torna dentro la stessa card del calendario.
   Nessun blocco "Ispirazione di oggi" separato.
   ========================================================= */
#view-home .sm-home-inspiration{display:none!important}

#view-home .home-islamic-calendar{
  min-height:344px!important;
}

#view-home .home-calendar-body{
  min-height:322px!important;
}

#view-home .home-calendar-message{
  position:relative!important;
  justify-content:flex-start!important;
  padding-top:13px!important;
  padding-bottom:8px!important;
}

#view-home #home-calendar-phrase{
  margin-bottom:10px!important;
}

#view-home #home-calendar-source-box[hidden]{
  display:none!important;
}

#view-home #home-calendar-source-box:not([hidden]){
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 54px!important;
  align-items:center!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin:auto 0 0!important;
  padding:9px 8px 8px 11px!important;
  overflow:hidden!important;
  border:1px solid rgba(183,141,63,.72)!important;
  border-radius:12px 18px 12px 18px!important;
  background:
    linear-gradient(145deg,rgba(255,253,248,.98),rgba(244,233,211,.91))!important;
  box-shadow:
    inset 0 0 0 3px rgba(255,253,248,.75),
    inset 0 0 0 4px rgba(183,141,63,.17)!important;
  text-align:center!important;
}

#view-home #home-calendar-source-box:not([hidden])::before,
#view-home #home-calendar-source-box:not([hidden])::after{
  content:'✦'!important;
  position:absolute!important;
  z-index:2!important;
  color:var(--sm26v2-gold)!important;
  font-size:.36rem!important;
}
#view-home #home-calendar-source-box:not([hidden])::before{top:5px!important;left:7px!important}
#view-home #home-calendar-source-box:not([hidden])::after{right:7px!important;bottom:5px!important}

#view-home .home-calendar-source-copy{
  min-width:0!important;
  padding:0 2px!important;
}

#view-home #home-calendar-source-arabic{
  display:block!important;
  margin:0!important;
  color:var(--sm26v2-green-dark)!important;
  font-family:'Noto Naskh Arabic','Amiri',serif!important;
  font-size:1rem!important;
  font-weight:600!important;
  line-height:1.32!important;
}

#view-home #home-calendar-source-text{
  display:block!important;
  margin-top:2px!important;
  color:var(--sm26v2-ink)!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:.49rem!important;
  line-height:1.22!important;
}

#view-home #home-calendar-source{
  display:block!important;
  margin-top:4px!important;
  color:#a1762f!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-size:.48rem!important;
  font-weight:700!important;
  line-height:1.08!important;
}

#view-home #home-calendar-source-decoration{
  display:grid!important;
  place-items:center!important;
  width:54px!important;
  height:50px!important;
  opacity:.96!important;
}

#view-home #home-calendar-source-decoration .home-calendar-quran-art{
  display:block!important;
  width:54px!important;
  height:50px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 3px 2px rgba(70,48,20,.14))!important;
}

/* Conserva il comportamento sorgente esistente senza creare un secondo componente. */
#view-home #home-calendar-source-box[data-source-type="hadith"] .home-calendar-hadith-art{
  display:none!important;
}
#view-home #home-calendar-source-box[data-source-type="hadith"] .home-calendar-quran-art{
  display:block!important;
}

@media(max-width:400px){
  #view-home .home-islamic-calendar{min-height:326px!important}
  #view-home .home-calendar-body{min-height:306px!important}
  #view-home .home-calendar-message{padding-top:10px!important;padding-bottom:6px!important}
  #view-home #home-calendar-source-box:not([hidden]){
    grid-template-columns:minmax(0,1fr) 47px!important;
    padding:8px 7px 7px 9px!important;
  }
  #view-home #home-calendar-source-arabic{font-size:.88rem!important}
  #view-home #home-calendar-source-text{font-size:.44rem!important}
  #view-home #home-calendar-source{font-size:.43rem!important}
  #view-home #home-calendar-source-decoration,
  #view-home #home-calendar-source-decoration .home-calendar-quran-art{
    width:47px!important;height:44px!important
  }
}

/* =========================================================
   V4 — Navigazione definitiva + strumenti inline.
   Top: Pannello + notifiche.
   Bottom: Home / Impara / Routine / Vita / Profilo.
   ========================================================= */

/* Il Pannello riusa il gate/permesso globale già esistente. */
body:has(#view-home[style*="display: block"]) .global-destination-nav .global-panel-icon:not([hidden]){
  display:grid!important;
  order:1!important;
}
body:has(#view-home[style*="display: block"]) .home-header-notification{
  display:block!important;
  order:2!important;
}
body:has(#view-home[style*="display: block"]) .global-destination-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
}

/* Il vecchio selettore V1 nascondeva Pannello in Home: questo è l'override definitivo. */
body:has(#view-home[style*="display: block"]) .global-destination-icon.global-panel-icon[data-global-destination="panel"]:not([hidden]){
  display:grid!important;
}

/* Strumenti utili: nessuna pagina Esplora, espansione inline. */
.sm-home-tools-toggle{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:5px!important;
  min-height:32px!important;
  padding:4px 0 4px 10px!important;
  border:0!important;
  background:transparent!important;
  color:var(--sm26v2-green)!important;
  font:700 .56rem/1 var(--sm-sans)!important;
  cursor:pointer!important;
  white-space:nowrap!important;
}
.sm-home-tools-toggle>span:last-child{
  display:inline-grid!important;
  place-items:center!important;
  width:18px!important;
  height:18px!important;
  color:var(--sm26v2-green)!important;
  font-size:.9rem!important;
  line-height:1!important;
}
.sm-home-tool--extra[hidden]{
  display:none!important;
}
.sm-home-tools.is-expanded .sm-home-tools-grid{
  row-gap:8px!important;
}
.sm-home-tools.is-expanded{
  padding-bottom:2px!important;
}

/* Bottom V4 — cinque domini stabili. */
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item[data-nav-key="impara"] .home-nav-icon,
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item[data-nav-key="routine"] .home-nav-icon,
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item[data-nav-key="vita"] .home-nav-icon,
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item[data-nav-key="profile"] .home-nav-icon{
  -webkit-mask:none!important;
  mask:none!important;
  background:transparent!important;
  background-color:transparent!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item[data-nav-key="profile"].active .home-nav-icon svg,
#view-tabs.bottom-nav.bottom-nav--smart-premium .bottom-nav-item[data-nav-key="profile"].is-active .home-nav-icon svg{
  stroke:var(--sm26v2-green)!important;
}

/* La vecchia schermata Esplora non fa più parte dell'architettura. */
#view-esplora-hub{display:none!important}

@media(max-width:400px){
  .sm-home-tools-toggle{
    font-size:.51rem!important;
    min-height:28px!important;
  }
}

/* =========================================================
   V5 — Bottom nav con icone originali Smart Muslim.
   Ripristina gli asset approvati invece degli SVG generici.
   ========================================================= */
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
  display:grid!important;
  place-items:center!important;
  width:31px!important;
  height:31px!important;
  flex:0 0 31px!important;
  overflow:visible!important;
  -webkit-mask:none!important;
  mask:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
  background:transparent!important;
  background-color:transparent!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img{
  position:static!important;
  display:block!important;
  width:31px!important;
  height:31px!important;
  max-width:none!important;
  object-fit:contain!important;
  opacity:.50!important;
  filter:grayscale(1) saturate(.35)!important;
  transform:none!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="impara"] .home-nav-icon img{
  width:32px!important;height:32px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="routine"] .home-nav-icon img{
  width:30px!important;height:30px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="vita"] .home-nav-icon img{
  width:30px!important;height:30px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
  width:27px!important;
  height:35px!important;
  object-fit:contain!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item.active .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item.is-active .home-nav-icon img{
  opacity:1!important;
  filter:none!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="home"].active .home-nav-icon,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="home"].is-active .home-nav-icon{
  background:transparent!important;
}
@media(max-width:400px){
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
    width:29px!important;height:29px!important;flex-basis:29px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img{
    width:29px!important;height:29px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
    width:25px!important;height:32px!important;
  }
}

/* V6 — micro tuning finale: icone bottom più grandi, nessun altro cambiamento. */
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
  width:37px!important;
  height:37px!important;
  flex:0 0 37px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img{
  width:37px!important;
  height:37px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="impara"] .home-nav-icon img{
  width:38px!important;
  height:38px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="routine"] .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="vita"] .home-nav-icon img{
  width:36px!important;
  height:36px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
  width:31px!important;
  height:40px!important;
}
@media(max-width:400px){
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
    width:35px!important;height:35px!important;flex-basis:35px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img{
    width:35px!important;height:35px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="impara"] .home-nav-icon img{
    width:36px!important;height:36px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="routine"] .home-nav-icon img,
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="vita"] .home-nav-icon img{
    width:34px!important;height:34px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
    width:29px!important;height:37px!important;
  }
}

/* V7 — equalizzazione visiva bottom nav: stesso asset family, stesso box per tutte le icone. */
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="home"] .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="impara"] .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="routine"] .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="vita"] .home-nav-icon img,
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
  width:38px!important;
  height:38px!important;
  object-fit:contain!important;
  transform:none!important;
}
@media(max-width:400px){
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
    width:36px!important;
    height:36px!important;
    flex:0 0 36px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img,
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="home"] .home-nav-icon img,
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="impara"] .home-nav-icon img,
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="routine"] .home-nav-icon img,
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="vita"] .home-nav-icon img,
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
    width:36px!important;
    height:36px!important;
  }
}

/* V8 — equalizzazione percettiva: Profilo H5 ripristinato, altre icone ingrandite otticamente. */
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
  overflow:visible!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img{
  position:static!important;
  display:block!important;
  width:38px!important;
  height:38px!important;
  object-fit:contain!important;
  transform-origin:center center!important;
}

/* Compensazione dei margini trasparenti interni degli asset originali. */
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="home"] .home-nav-icon img{
  transform:scale(1.22)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="impara"] .home-nav-icon img{
  transform:scale(1.29)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="routine"] .home-nav-icon img{
  transform:scale(1.36)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="vita"] .home-nav-icon img{
  transform:scale(1.27)!important;
}
#view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
  width:30px!important;
  height:39px!important;
  transform:none!important;
}

/* Mantieni la stessa geometria anche sui telefoni compatti: cambia solo la resa dell'icona. */
@media(max-width:400px){
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item .home-nav-icon img{
    width:38px!important;
    height:38px!important;
  }
  #view-tabs.bottom-nav.bottom-nav--smart-premium[class] .bottom-nav-item[data-nav-key="profile"] .home-nav-icon img{
    width:30px!important;
    height:39px!important;
  }
}

/* =========================================================
   V9 — Calendario più compatto + correzione 19/SETTEMBRE.
   Nessun cambiamento a navigazione o card Scuola/Community.
   ========================================================= */
#view-home .home-islamic-calendar{
  min-height:298px!important;
  padding:8px 9px!important;
}

#view-home .home-calendar-body{
  min-height:278px!important;
  gap:11px!important;
}

#view-home .home-calendar-date{
  padding:2px 10px 2px 1px!important;
}

/* Il numero non deve mai invadere il mese. */
#view-home #home-calendar-day{
  margin:0 0 8px!important;
  font-size:clamp(3.25rem,14.5vw,4.2rem)!important;
  line-height:.82!important;
  letter-spacing:-.065em!important;
}
#view-home #home-calendar-month{
  margin:0!important;
  font-size:.60rem!important;
  line-height:1.05!important;
  letter-spacing:.18em!important;
}
#view-home #home-calendar-year{
  margin:6px auto 4px!important;
  padding-top:6px!important;
}
#view-home #home-calendar-hijri{
  margin-top:2px!important;
}

/* Compatta la colonna testuale senza sacrificare leggibilità. */
#view-home .home-calendar-message{
  padding-top:9px!important;
  padding-bottom:6px!important;
}
#view-home .home-calendar-greeting{
  margin-bottom:5px!important;
  font-size:clamp(.96rem,4.2vw,1.16rem)!important;
}
#view-home #home-calendar-phrase{
  margin-bottom:7px!important;
  font-size:clamp(.66rem,3vw,.79rem)!important;
  line-height:1.25!important;
}

/* Fonte integrata: leggermente più compatta, ancora pienamente leggibile. */
#view-home #home-calendar-source-box:not([hidden]){
  grid-template-columns:minmax(0,1fr) 49px!important;
  margin:auto 0 0!important;
  padding:7px 7px 6px 9px!important;
}
#view-home #home-calendar-source-arabic{
  font-size:.92rem!important;
  line-height:1.26!important;
}
#view-home #home-calendar-source-text{
  margin-top:1px!important;
  font-size:.46rem!important;
  line-height:1.18!important;
}
#view-home #home-calendar-source{
  margin-top:3px!important;
  font-size:.45rem!important;
}
#view-home #home-calendar-source-decoration,
#view-home #home-calendar-source-decoration .home-calendar-quran-art{
  width:49px!important;
  height:45px!important;
}

@media(max-width:400px){
  #view-home .home-islamic-calendar{
    min-height:286px!important;
    padding:7px 8px!important;
  }
  #view-home .home-calendar-body{
    min-height:266px!important;
    gap:9px!important;
  }
  #view-home #home-calendar-day{
    margin:0 0 7px!important;
    font-size:3.18rem!important;
    line-height:.82!important;
  }
  #view-home #home-calendar-month{
    font-size:.55rem!important;
    letter-spacing:.16em!important;
  }
  #view-home .home-calendar-greeting{
    font-size:.92rem!important;
  }
  #view-home #home-calendar-phrase{
    font-size:.62rem!important;
    line-height:1.23!important;
  }
  #view-home #home-calendar-source-box:not([hidden]){
    grid-template-columns:minmax(0,1fr) 43px!important;
    padding:6px 6px 5px 8px!important;
  }
  #view-home #home-calendar-source-arabic{font-size:.82rem!important}
  #view-home #home-calendar-source-text{font-size:.41rem!important}
  #view-home #home-calendar-source{font-size:.41rem!important}
  #view-home #home-calendar-source-decoration,
  #view-home #home-calendar-source-decoration .home-calendar-quran-art{
    width:43px!important;
    height:40px!important;
  }
}

/* =========================================================
   V10 — Home visual polish finale.
   Solo resa estetica: texture, profondità, cornici, card e header.
   Bottom/nav/routing invariati.
   ========================================================= */

/* Carta/avorio: texture appena percettibile, senza immagini artificiali pesanti. */
body:has(#view-home[style*="display: block"]):not(.sm-dark-v2) .app-container{
  background:
    radial-gradient(circle at 15% 8%,rgba(255,255,255,.74),transparent 19rem),
    radial-gradient(circle at 88% 22%,rgba(183,141,63,.028),transparent 15rem),
    repeating-linear-gradient(0deg,rgba(110,88,50,.012) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(90deg,rgba(110,88,50,.009) 0 1px,transparent 1px 5px),
    #fbf7ee!important;
}

/* Header: bordi più fini, meno effetto bottone standard. */
body:has(#view-home[style*="display: block"]) .home-header-icon-button{
  border-color:rgba(183,141,63,.62)!important;
  background:linear-gradient(145deg,#fffdf8,#faf3e7)!important;
  box-shadow:
    0 5px 13px rgba(61,47,27,.045),
    inset 0 0 0 1px rgba(255,255,255,.72)!important;
}
body:has(#view-home[style*="display: block"]) .home-header-icon-button svg{
  stroke-width:1.55!important;
}
body:has(#view-home[style*="display: block"]) .home-header-logo-mark{
  box-shadow:
    0 8px 18px rgba(19,61,49,.13),
    0 1px 0 rgba(255,255,255,.9)!important;
}

/* Calendario: più materia e dettagli editoriali, mantenendo identico il layout V9. */
#view-home .home-islamic-calendar{
  background:
    linear-gradient(135deg,rgba(255,253,248,.985),rgba(248,239,223,.955))!important;
  border-color:rgba(177,133,53,.80)!important;
  box-shadow:
    0 10px 25px rgba(68,51,27,.055),
    inset 0 0 0 1px rgba(255,255,255,.70)!important;
}
#view-home .home-islamic-calendar::before{
  border-color:rgba(177,133,53,.30)!important;
  box-shadow:inset 0 0 0 3px rgba(255,253,248,.46)!important;
}
#view-home .home-islamic-calendar::after{
  opacity:.145!important;
  width:46%!important;
  height:80%!important;
  right:-24px!important;
  bottom:-15px!important;
  filter:sepia(.08) saturate(.88)!important;
}

/* Motivo geometrico più elegante nell'angolo alto destro del calendario. */
#view-home .home-calendar-message::after{
  width:88px!important;
  height:88px!important;
  right:-2px!important;
  top:-1px!important;
  opacity:.115!important;
  background:
    linear-gradient(45deg,transparent 44%,rgba(177,133,53,.82) 45% 46%,transparent 47%) 0 0/16px 16px,
    linear-gradient(-45deg,transparent 44%,rgba(177,133,53,.82) 45% 46%,transparent 47%) 0 0/16px 16px!important;
  -webkit-mask-image:linear-gradient(135deg,#000 0 18%,rgba(0,0,0,.62) 52%,transparent 77%)!important;
  mask-image:linear-gradient(135deg,#000 0 18%,rgba(0,0,0,.62) 52%,transparent 77%)!important;
}

/* Fonte interna: più parte del foglio, meno card appoggiata. */
#view-home #home-calendar-source-box:not([hidden]){
  border-color:rgba(177,133,53,.66)!important;
  background:
    radial-gradient(circle at 92% 12%,rgba(183,141,63,.065),transparent 36%),
    linear-gradient(145deg,rgba(255,253,248,.90),rgba(246,235,213,.75))!important;
  box-shadow:
    inset 0 0 0 3px rgba(255,253,248,.64),
    inset 0 0 0 4px rgba(177,133,53,.14),
    0 3px 8px rgba(73,55,31,.025)!important;
}

/* Scuola: verde più profondo, cornici oro nette e architettura più leggibile. */
.sm-home-feature--school{
  border-color:rgba(177,133,53,.88)!important;
  background:
    radial-gradient(circle at 14% 0%,rgba(255,255,255,.065),transparent 28%),
    linear-gradient(145deg,rgba(11,88,66,.985),rgba(5,54,43,.99))!important;
  box-shadow:
    inset 0 0 0 4px rgba(223,194,126,.34),
    inset 0 0 0 8px rgba(223,194,126,.12),
    0 10px 24px rgba(5,54,43,.14)!important;
}
.sm-home-feature--school::before{
  opacity:.17!important;
  background:
    linear-gradient(180deg,rgba(7,59,48,.02),rgba(7,59,48,.28)),
    url("assets/auth/smart-muslim-auth-mosque-bg.png") 68% 60%/cover no-repeat!important;
  filter:sepia(.08) saturate(.78)!important;
}
.sm-home-feature--school::after{
  inset:6px!important;
  border-color:rgba(232,204,139,.68)!important;
  box-shadow:inset 0 0 0 3px rgba(232,204,139,.08)!important;
}
.sm-home-feature--school .sm-home-feature-icon{
  background:rgba(8,67,52,.50)!important;
  border-color:rgba(232,204,139,.86)!important;
  box-shadow:inset 0 0 0 3px rgba(232,204,139,.055)!important;
}
.sm-home-feature--school h2{
  text-shadow:0 1px 0 rgba(0,0,0,.09)!important;
}
.sm-home-feature--school .sm-home-feature-meta{
  border-top-color:rgba(239,219,173,.58)!important;
  color:#f2deaa!important;
}

/* Community: meno vuota, più profondità avorio + moschea sfumata. */
.sm-home-feature--community{
  border-color:rgba(177,133,53,.75)!important;
  background:
    radial-gradient(circle at 13% 6%,rgba(255,255,255,.72),transparent 28%),
    linear-gradient(145deg,#fffdf8,#f6ecdc)!important;
  box-shadow:
    inset 0 0 0 4px rgba(177,133,53,.065),
    inset 0 0 0 7px rgba(255,255,255,.58),
    0 9px 22px rgba(65,49,27,.052)!important;
}
.sm-home-feature--community::before{
  opacity:.115!important;
  background:
    linear-gradient(180deg,rgba(255,253,248,.15),rgba(255,253,248,.28)),
    url("assets/auth/smart-muslim-auth-mosque-bg.png") 67% 61%/cover no-repeat!important;
  filter:sepia(.12) saturate(.72)!important;
}
.sm-home-feature--community::after{
  content:''!important;
  position:absolute!important;
  inset:6px!important;
  border:1px solid rgba(177,133,53,.23)!important;
  border-radius:14px!important;
  pointer-events:none!important;
}
.sm-home-feature--community .sm-home-feature-icon{
  background:rgba(255,253,248,.84)!important;
  border-color:rgba(177,133,53,.63)!important;
  box-shadow:inset 0 0 0 3px rgba(177,133,53,.035)!important;
}
.sm-home-feature--community .sm-home-feature-meta{
  border-top-color:rgba(11,81,63,.56)!important;
}

/* Titoli delle due card più editoriali e meno "UI standard". */
.sm-home-feature h2{
  font-family:'Playfair Display',Georgia,serif!important;
  font-weight:700!important;
  letter-spacing:-.032em!important;
}
.sm-home-feature p{
  font-family:'Playfair Display',Georgia,serif!important;
  letter-spacing:.002em!important;
}

/* Frecce: più oro carta e meno pulsante generico. */
.sm-home-feature-arrow{
  border-color:rgba(177,133,53,.55)!important;
  background:
    radial-gradient(circle at 34% 28%,#f6e2ab,#e7ca80 72%)!important;
  box-shadow:
    0 3px 8px rgba(104,76,29,.065),
    inset 0 1px 0 rgba(255,255,255,.55)!important;
}

/* Strumenti: card più premium, CTA "Vedi tutti" editoriale. */
.sm-home-tools-head h3{
  color:#64563f!important;
  letter-spacing:.245em!important;
}
.sm-home-tools-toggle{
  color:#726650!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-weight:600!important;
  letter-spacing:.01em!important;
}
.sm-home-tools-toggle>span:last-child{
  color:var(--sm26v2-green)!important;
}
.sm-home-tool{
  border-color:rgba(215,199,174,.94)!important;
  background:
    radial-gradient(circle at 16% 12%,rgba(255,255,255,.78),transparent 38%),
    linear-gradient(145deg,#fffdf9,#f8f1e6)!important;
  box-shadow:
    0 6px 14px rgba(65,49,27,.040),
    inset 0 1px 0 rgba(255,255,255,.72)!important;
}
.sm-home-tool-icon{
  background:
    radial-gradient(circle at 35% 28%,#faf4e7,#eee3cf)!important;
  border:1px solid rgba(183,141,63,.10)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.70)!important;
}
.sm-home-tool strong{
  color:#0a4b3b!important;
  font-family:'Playfair Display',Georgia,serif!important;
  font-weight:700!important;
}
.sm-home-tool small{
  color:#737873!important;
}
.sm-home-tool-chevron{
  color:#50625b!important;
}

/* Le card successive della Home condividono lo stesso materiale avorio. */
#view-home #home-location-panel,
#view-home #home-next-prayer-container>.home-next-prayer-card,
#view-home #home-mosque-feed{
  background:
    radial-gradient(circle at 91% 7%,rgba(183,141,63,.035),transparent 33%),
    linear-gradient(145deg,rgba(255,253,248,.99),rgba(248,240,227,.925))!important;
  border-color:rgba(183,141,63,.32)!important;
}

/* Non toccare la bottom: blocco intenzionalmente assente. */

/* =========================================================
   V11 — Premium visual pass ad alta evidenza.
   Solo estetica: nessun cambiamento a layout, bottom, routing o logica.
   ========================================================= */

/* Home: niente più effetto "griglia". Carta avorio organica + arabesque visibile. */
body:has(#view-home[style*="display: block"]):not(.sm-dark-v2) .app-container{
  background:
    url("assets/ui/home-redesign-v11-corner.svg") right -18px top 92px/138px 138px no-repeat,
    radial-gradient(ellipse at 18% 8%,rgba(255,255,255,.78),transparent 26rem),
    radial-gradient(ellipse at 92% 32%,rgba(182,141,64,.055),transparent 23rem),
    radial-gradient(ellipse at 12% 78%,rgba(13,81,63,.026),transparent 22rem),
    linear-gradient(180deg,#fcf8ef 0%,#f9f3e8 100%)!important;
}

/* Calendario: arabesque reale in alto a destra + moschea più leggibile. */
#view-home .home-islamic-calendar{
  background:
    url("assets/ui/home-redesign-v11-corner.svg") right -2px top -2px/108px 108px no-repeat,
    radial-gradient(ellipse at 91% 84%,rgba(11,81,63,.045),transparent 42%),
    linear-gradient(135deg,#fffdf8 0%,#f7eddc 100%)!important;
  border-color:rgba(174,129,47,.88)!important;
  box-shadow:
    0 11px 26px rgba(67,49,25,.07),
    inset 0 0 0 1px rgba(255,255,255,.76)!important;
}
#view-home .home-islamic-calendar::before{
  border-color:rgba(174,129,47,.38)!important;
  box-shadow:
    inset 0 0 0 3px rgba(255,253,248,.58),
    inset 0 0 0 4px rgba(174,129,47,.09)!important;
}
#view-home .home-islamic-calendar::after{
  opacity:.22!important;
  width:49%!important;
  height:86%!important;
  right:-22px!important;
  bottom:-18px!important;
  background:
    linear-gradient(90deg,rgba(249,243,232,0) 0%,rgba(249,243,232,.08) 20%,rgba(249,243,232,.22) 100%),
    url("assets/ui/vita-v1/background/vita_sfondo_moschea.png") center bottom/cover no-repeat!important;
  filter:sepia(.10) saturate(.96) contrast(.96)!important;
}
/* Il vecchio pattern CSS viene sostituito dall'arabesque asset. */
#view-home .home-calendar-message::after{
  display:none!important;
}

/* Divider centrale più editoriale. */
#view-home .home-calendar-date{
  border-right-color:rgba(174,129,47,.78)!important;
}
#view-home .home-calendar-date::before{
  color:#b78d3f!important;
}

/* Hadith/versetto: sembra parte della stessa pagina, non una card separata. */
#view-home #home-calendar-source-box:not([hidden]){
  border:1px solid rgba(174,129,47,.72)!important;
  border-radius:10px 16px 10px 16px!important;
  background:
    radial-gradient(ellipse at 92% 20%,rgba(183,141,63,.07),transparent 36%),
    rgba(255,252,245,.58)!important;
  box-shadow:
    inset 0 0 0 2px rgba(255,253,248,.72),
    inset 0 0 0 3px rgba(174,129,47,.13)!important;
}
#view-home #home-calendar-source-arabic{
  color:#064a38!important;
}
#view-home #home-calendar-source-decoration .home-calendar-quran-art{
  filter:drop-shadow(0 4px 3px rgba(68,45,16,.18))!important;
}

/* Scuola: più ricca, cornici più simili al render approvato. */
.sm-home-feature--school{
  background:
    url("assets/ui/home-redesign-v11-corner.svg") right -14px top -14px/92px 92px no-repeat,
    radial-gradient(circle at 14% 0%,rgba(255,255,255,.075),transparent 28%),
    linear-gradient(145deg,#0c6049 0%,#064333 58%,#05392d 100%)!important;
  border-color:rgba(211,174,95,.94)!important;
  box-shadow:
    inset 0 0 0 4px rgba(221,188,111,.40),
    inset 0 0 0 8px rgba(221,188,111,.15),
    0 11px 24px rgba(5,54,43,.16)!important;
}
.sm-home-feature--school::before{
  opacity:.24!important;
  background:
    linear-gradient(180deg,rgba(5,57,45,.03),rgba(5,57,45,.20)),
    url("assets/auth/smart-muslim-auth-mosque-bg.png") 63% 58%/cover no-repeat!important;
  filter:sepia(.08) saturate(.84) contrast(1.02)!important;
}
.sm-home-feature--school::after{
  inset:6px!important;
  border:1px solid rgba(233,203,134,.78)!important;
  border-radius:15px!important;
  box-shadow:
    inset 0 0 0 3px rgba(233,203,134,.10),
    inset 0 0 0 4px rgba(8,74,56,.14)!important;
}
.sm-home-feature--school .sm-home-feature-icon{
  background:rgba(7,70,53,.64)!important;
  border-color:rgba(235,207,143,.92)!important;
  box-shadow:
    inset 0 0 0 3px rgba(235,207,143,.07),
    0 2px 7px rgba(0,0,0,.04)!important;
}

/* Community: più piena e leggibile come il mockup, senza diventare scura. */
.sm-home-feature--community{
  background:
    url("assets/ui/home-redesign-v11-corner.svg") right -12px top -12px/96px 96px no-repeat,
    radial-gradient(ellipse at 75% 70%,rgba(13,81,63,.055),transparent 44%),
    linear-gradient(145deg,#fffdf8 0%,#f6ecdc 100%)!important;
  border-color:rgba(188,145,61,.82)!important;
  box-shadow:
    inset 0 0 0 4px rgba(184,141,60,.085),
    inset 0 0 0 7px rgba(255,255,255,.62),
    0 10px 22px rgba(65,49,27,.065)!important;
}
.sm-home-feature--community::before{
  opacity:.21!important;
  background:
    linear-gradient(180deg,rgba(255,253,248,.08),rgba(255,253,248,.20)),
    url("assets/auth/smart-muslim-auth-mosque-bg.png") 66% 58%/cover no-repeat!important;
  filter:sepia(.10) saturate(.74) contrast(.96)!important;
}
.sm-home-feature--community::after{
  inset:6px!important;
  border-color:rgba(188,145,61,.36)!important;
  box-shadow:inset 0 0 0 3px rgba(188,145,61,.035)!important;
}
.sm-home-feature--community .sm-home-feature-icon{
  background:rgba(255,253,248,.92)!important;
  border-color:rgba(188,145,61,.70)!important;
}

/* Le frecce devono sembrare piccoli bottoni gioiello, non pallini piatti. */
.sm-home-feature-arrow{
  border-color:rgba(173,127,43,.68)!important;
  background:
    radial-gradient(circle at 35% 25%,#fae9b8 0%,#e9ca7e 68%,#dfbd68 100%)!important;
  box-shadow:
    0 4px 9px rgba(112,79,25,.09),
    inset 0 1px 0 rgba(255,255,255,.68)!important;
}

/* Strumenti utili: più contrasto e presenza, sempre leggeri. */
.sm-home-tools-head{
  margin-top:2px!important;
}
.sm-home-tools-head h3{
  color:#5f513a!important;
  font-weight:800!important;
}
.sm-home-tools-toggle{
  color:#0b513f!important;
  font-weight:700!important;
}
.sm-home-tool{
  border-color:rgba(202,180,144,.88)!important;
  background:
    radial-gradient(circle at 13% 13%,rgba(255,255,255,.92),transparent 38%),
    linear-gradient(145deg,#fffdf8,#f5ecdf)!important;
  box-shadow:
    0 7px 16px rgba(69,51,27,.055),
    inset 0 1px 0 rgba(255,255,255,.85)!important;
}
.sm-home-tool-icon{
  background:linear-gradient(145deg,#f8f0df,#eadcc2)!important;
  border-color:rgba(183,141,63,.18)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.82),
    0 2px 5px rgba(67,49,25,.025)!important;
}
.sm-home-tool-icon svg{
  stroke-width:1.8!important;
}
.sm-home-tool strong{
  color:#074a39!important;
}

/* Ornamento discreto anche sul blocco strumenti espanso. */
.sm-home-tools.is-expanded{
  position:relative!important;
}
.sm-home-tools.is-expanded::after{
  content:''!important;
  position:absolute!important;
  z-index:-1!important;
  right:-14px!important;
  bottom:-10px!important;
  width:96px!important;
  height:96px!important;
  background:url("assets/ui/home-redesign-v11-corner.svg") center/contain no-repeat!important;
  opacity:.34!important;
  transform:rotate(180deg)!important;
  pointer-events:none!important;
}

/* V11.1 hotfix — rimuove l'arabesque invasivo mantenendo il polish premium V11. */
body:has(#view-home[style*="display: block"]):not(.sm-dark-v2) .app-container{
  background:
    radial-gradient(ellipse at 18% 8%,rgba(255,255,255,.78),transparent 26rem),
    radial-gradient(ellipse at 92% 32%,rgba(182,141,64,.055),transparent 23rem),
    radial-gradient(ellipse at 12% 78%,rgba(13,81,63,.026),transparent 22rem),
    linear-gradient(180deg,#fcf8ef 0%,#f9f3e8 100%)!important;
}

#view-home .home-islamic-calendar{
  background:
    radial-gradient(ellipse at 91% 84%,rgba(11,81,63,.045),transparent 42%),
    linear-gradient(135deg,#fffdf8 0%,#f7eddc 100%)!important;
}

.sm-home-feature--school{
  background:
    radial-gradient(circle at 14% 0%,rgba(255,255,255,.075),transparent 28%),
    linear-gradient(145deg,#0c6049 0%,#064333 58%,#05392d 100%)!important;
}

.sm-home-feature--community{
  background:
    radial-gradient(ellipse at 75% 70%,rgba(13,81,63,.055),transparent 44%),
    linear-gradient(145deg,#fffdf8 0%,#f6ecdc 100%)!important;
}

.sm-home-tools.is-expanded::after{
  display:none!important;
}

/* =========================================================
   V12 — Dalla tua moschea compatto.
   Rimuove stretching e altezze fisse che creavano spazio vuoto.
   Nessun cambiamento alle altre sezioni Home.
   ========================================================= */
#view-home .home-mosque-feed{
  padding-bottom:8px!important;
}

/* Le card non devono più avere tutte l'altezza della più alta. */
#view-home .home-mosque-carousel{
  align-items:flex-start!important;
}

/* Altezza naturale per contenuti normali. */
#view-home .home-mosque-story{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}

/* Il bottone segue il contenuto: niente "deserto" bianco prima della CTA. */
#view-home .home-mosque-story>button{
  margin-top:14px!important;
}

/* Media: compatte ma leggibili. */
#view-home .home-mosque-media-preview{
  height:118px!important;
  margin-bottom:8px!important;
}

/* Fundraiser: elimina il vecchio blocco fisso da 408px. */
#view-home .home-mosque-story.is-fundraiser,
#view-home .home-mosque-story.is-fundraiser.has-project-photo{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}

/* La foto progetto non deve occupare mezza Home. */
#view-home .home-mosque-project-media{
  height:132px!important;
  aspect-ratio:auto!important;
  margin-bottom:10px!important;
}

/* Contenuti progetto più stretti verticalmente. */
#view-home .home-mosque-story.is-fundraiser .home-mosque-fundraiser-content{
  gap:6px!important;
  margin-bottom:7px!important;
}

/* CTA progetto segue il contenuto come le altre card. */
#view-home .home-mosque-story.is-fundraiser>button{
  margin-top:12px!important;
}

/* Pallini immediatamente sotto il carousel. */
#view-home .home-mosque-dots{
  padding-top:8px!important;
}

/* Compattezza sui telefoni stretti. */
@media(max-width:400px){
  #view-home .home-mosque-story{
    padding:12px!important;
  }
  #view-home .home-mosque-media-preview{
    height:108px!important;
  }
  #view-home .home-mosque-project-media{
    height:120px!important;
    width:calc(100% + 24px)!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
    margin-top:-12px!important;
  }
}

/* =========================================================
   V13 — Home compact top bar durante lo scroll.
   Logo/titolo scorrono via; Pannello + notifiche restano in alto
   dentro una fascia avorio/blur, come una app iOS.
   ========================================================= */
body:has(#view-home[style*="display: block"]) .home-main-header::before{
  content:''!important;
  position:fixed!important;
  z-index:1300!important;
  top:0!important;
  left:50%!important;
  width:min(100%,430px)!important;
  height:calc(64px + env(safe-area-inset-top,0px))!important;
  transform:translateX(-50%)!important;
  pointer-events:none!important;
  opacity:0!important;
  background:rgba(251,247,239,.94)!important;
  border-bottom:1px solid rgba(199,181,150,.56)!important;
  box-shadow:0 6px 18px rgba(49,42,30,.045)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  transition:opacity .18s ease!important;
}

body.sm-home-compact-topbar:has(#view-home[style*="display: block"]) .home-main-header::before{
  opacity:1!important;
}

/* Le azioni restano sopra la fascia; nessun cambio a posizione/dimensione. */
body.sm-home-compact-topbar:has(#view-home[style*="display: block"]) .home-main-header .home-header-actions{
  z-index:1305!important;
}

/* In modalità compatta alleggerisci appena le ombre dei due controlli. */
body.sm-home-compact-topbar:has(#view-home[style*="display: block"]) .home-header-icon-button{
  box-shadow:
    0 3px 10px rgba(61,47,27,.045),
    inset 0 0 0 1px rgba(255,255,255,.74)!important;
}

/* =========================================================
   V14 — Home topbar portaled to body for iOS-stable fixed behavior.
   ========================================================= */

/* Disattiva la piastra V13 dentro l'header: la barra ora vive nel body portal. */
body:has(#view-home[style*="display: block"]) .home-main-header::before{
  display:none!important;
}

/* Contenitore fixed direttamente sotto body: non scorre con la Home. */
body.sm-home-topbar-portal-active #sm-global-topbar-host{
  display:block!important;
  position:fixed!important;
  z-index:1400!important;
  top:0!important;
  left:50%!important;
  width:min(100%,430px)!important;
  height:calc(64px + env(safe-area-inset-top,0px))!important;
  margin:0!important;
  padding:0!important;
  transform:translateX(-50%)!important;
  background:rgba(251,247,239,.94)!important;
  border-bottom:1px solid rgba(199,181,150,.56)!important;
  box-shadow:0 6px 18px rgba(49,42,30,.045)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  pointer-events:none!important;
}

/* Le azioni sono assolute dentro la barra fixed del body. */
body.sm-home-topbar-portal-active #sm-global-topbar-host .home-header-actions{
  position:absolute!important;
  z-index:1!important;
  top:calc(10px + env(safe-area-inset-top,0px))!important;
  left:12px!important;
  right:12px!important;
  width:auto!important;
  height:44px!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  pointer-events:auto!important;
}

/* Mantieni visibili solo le azioni già approvate: Pannello + notifiche. */
body.sm-home-topbar-portal-active #sm-global-topbar-host .global-destination-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
}

/* Il vecchio header resta nel flusso solo per logo/titolo iniziali. */
body.sm-home-topbar-portal-active > .app-container > .home-main-header{
  display:flex!important;
}

/* Dark companion, se necessario. */
html.sm-dark-v2 body.sm-dark-v2.sm-home-topbar-portal-active #sm-global-topbar-host{
  background:rgba(15,29,24,.94)!important;
  border-bottom-color:rgba(58,81,72,.70)!important;
  box-shadow:0 7px 20px rgba(0,0,0,.16)!important;
}

/* =========================================================
   V15 — Home floating actions only.
   Pannello + notifiche restano fissi al viewport senza alcuna barra.
   ========================================================= */
body.sm-home-topbar-portal-active #sm-global-topbar-host{
  background:transparent!important;
  border:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* Nessuna piastra, nessun blur: solo i due pulsanti originali. */
body.sm-home-topbar-portal-active #sm-global-topbar-host::before,
body.sm-home-topbar-portal-active #sm-global-topbar-host::after{
  display:none!important;
  content:none!important;
}

/* Mantieni esattamente la posizione approvata dei controlli. */
body.sm-home-topbar-portal-active #sm-global-topbar-host .home-header-actions{
  top:calc(10px + env(safe-area-inset-top,0px))!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Anche in dark mode nessuna barra visibile. */
html.sm-dark-v2 body.sm-dark-v2.sm-home-topbar-portal-active #sm-global-topbar-host{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}

/* =========================================================
   V16 — riquadro fonte del Calendario leggermente più grande.
   Card Calendario esterna invariata.
   ========================================================= */
#view-home #home-calendar-phrase{
  margin-bottom:4px!important;
}

#view-home #home-calendar-source-box:not([hidden]){
  grid-template-columns:minmax(0,1fr) 56px!important;
  margin:auto -3px 0 -3px!important;
  padding:9px 9px 8px 11px!important;
  width:calc(100% + 6px)!important;
}

#view-home #home-calendar-source-arabic{
  font-size:1.02rem!important;
  line-height:1.28!important;
}

#view-home #home-calendar-source-text{
  margin-top:2px!important;
  font-size:.50rem!important;
  line-height:1.20!important;
}

#view-home #home-calendar-source{
  margin-top:4px!important;
  font-size:.48rem!important;
}

#view-home #home-calendar-source-decoration,
#view-home #home-calendar-source-decoration .home-calendar-quran-art{
  width:56px!important;
  height:51px!important;
}

@media(max-width:400px){
  #view-home #home-calendar-phrase{
    margin-bottom:3px!important;
  }
  #view-home #home-calendar-source-box:not([hidden]){
    grid-template-columns:minmax(0,1fr) 51px!important;
    margin:auto -2px 0 -2px!important;
    padding:8px 8px 7px 10px!important;
    width:calc(100% + 4px)!important;
  }
  #view-home #home-calendar-source-arabic{
    font-size:.94rem!important;
    line-height:1.26!important;
  }
  #view-home #home-calendar-source-text{
    font-size:.46rem!important;
    line-height:1.18!important;
  }
  #view-home #home-calendar-source{
    font-size:.44rem!important;
  }
  #view-home #home-calendar-source-decoration,
  #view-home #home-calendar-source-decoration .home-calendar-quran-art{
    width:51px!important;
    height:47px!important;
  }
}

/* =========================================================
   V17 — Community Preview reale nella Home.
   Dati live, swipe orizzontale, tap sul post, freccia apre Community.
   ========================================================= */
.sm-home-community-live{
  cursor:default!important;
  touch-action:pan-y!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}

.sm-home-community-live .sm-home-feature-icon{
  margin-bottom:8px!important;
}

.sm-home-community-badge{
  position:absolute!important;
  z-index:3!important;
  top:20px!important;
  left:64px!important;
  max-width:72px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  padding:4px 8px!important;
  border:1px solid rgba(183,141,63,.16)!important;
  border-radius:999px!important;
  background:rgba(244,231,202,.72)!important;
  color:#9a7332!important;
  font:750 .39rem/1 var(--sm-sans)!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
}

.sm-home-community-dots{
  position:absolute!important;
  z-index:3!important;
  top:21px!important;
  right:14px!important;
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  height:12px!important;
}

.sm-home-community-dots i{
  display:block!important;
  width:5px!important;
  height:5px!important;
  border:1px solid rgba(86,95,91,.58)!important;
  border-radius:50%!important;
  background:transparent!important;
}

.sm-home-community-dots i.is-active{
  border-color:#59635f!important;
  background:#59635f!important;
}

.sm-home-community-live h2{
  margin-bottom:2px!important;
  max-width:calc(100% - 42px)!important;
}

.sm-home-community-preview{
  position:relative!important;
  z-index:3!important;
  display:block!important;
  width:calc(100% - 38px)!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--sm26v2-ink)!important;
  box-shadow:none!important;
  text-align:left!important;
  cursor:pointer!important;
  font:inherit!important;
  transform:none!important;
}

.sm-home-community-preview:active{
  transform:none!important;
}

.sm-home-community-preview small{
  display:block!important;
  min-height:.58rem!important;
  margin:0 0 2px!important;
  color:#737873!important;
  font:650 .43rem/1.05 var(--sm-sans)!important;
}

.sm-home-community-preview strong{
  display:block!important;
  overflow:hidden!important;
  margin:0!important;
  color:var(--sm26v2-green-dark)!important;
  font:700 .72rem/1.05 'Playfair Display',Georgia,serif!important;
  letter-spacing:-.015em!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}

.sm-home-community-excerpt{
  display:block!important;
  overflow:hidden!important;
  margin-top:3px!important;
  color:#626b67!important;
  font:500 .50rem/1.12 var(--sm-sans)!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}

.sm-home-community-metrics{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin-top:4px!important;
  color:#69716e!important;
  font:650 .45rem/1 var(--sm-sans)!important;
}

.sm-home-community-metrics[hidden]{
  display:none!important;
}

.sm-home-community-metrics span{
  display:inline-flex!important;
  align-items:center!important;
  gap:3px!important;
}

.sm-home-community-metrics b{
  color:inherit!important;
  font:inherit!important;
}

.sm-home-community-live.is-loading .sm-home-community-preview strong,
.sm-home-community-live.is-loading .sm-home-community-excerpt{
  opacity:.52!important;
}

.sm-home-community-live .sm-home-feature-arrow{
  appearance:none!important;
  -webkit-appearance:none!important;
  padding:0!important;
  cursor:pointer!important;
}

@media(max-width:400px){
  .sm-home-community-badge{
    top:18px!important;
    left:58px!important;
    max-width:66px!important;
    padding:3px 7px!important;
    font-size:.35rem!important;
  }
  .sm-home-community-dots{
    top:19px!important;
    right:12px!important;
  }
  .sm-home-community-preview{
    width:calc(100% - 34px)!important;
  }
  .sm-home-community-preview strong{
    font-size:.66rem!important;
  }
  .sm-home-community-excerpt{
    font-size:.45rem!important;
  }
  .sm-home-community-preview small,
  .sm-home-community-metrics{
    font-size:.40rem!important;
  }
}

/* =========================================================
   V18 — Community carousel fisico.
   La slide segue il dito, mostra la successiva durante il drag e fa snap.
   ========================================================= */
.sm-home-community-preview{
  overflow:hidden!important;
  height:61px!important;
  min-height:61px!important;
  touch-action:pan-y!important;
  -webkit-tap-highlight-color:transparent!important;
}

.sm-home-community-track{
  display:flex!important;
  align-items:stretch!important;
  height:100%!important;
  min-height:0!important;
  will-change:transform!important;
  transform:translate3d(0,0,0);
}

.sm-home-community-slide{
  display:block!important;
  flex:0 0 100%;
  min-width:0!important;
  height:100%!important;
  padding-right:6px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  transition:opacity .18s ease,transform .18s ease!important;
}

.sm-home-community-preview.is-touching{
  cursor:grabbing!important;
}

.sm-home-community-preview.is-touching .sm-home-community-slide{
  opacity:.96!important;
  transform:scale(.992)!important;
}

.sm-home-community-preview::after{
  content:''!important;
  position:absolute!important;
  z-index:5!important;
  top:0!important;
  right:0!important;
  width:14px!important;
  height:100%!important;
  opacity:0!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,transparent,rgba(183,141,63,.12))!important;
  transition:opacity .16s ease!important;
}

.sm-home-community-preview.is-touching::after{
  opacity:1!important;
}

.sm-home-community-slide small,
.sm-home-community-slide strong,
.sm-home-community-slide .sm-home-community-excerpt,
.sm-home-community-slide .sm-home-community-metrics{
  position:relative!important;
  z-index:1!important;
}

@media(max-width:400px){
  .sm-home-community-preview{
    height:58px!important;
    min-height:58px!important;
  }
}

/* =========================================================
   V21 — Home order hard lock.
   Fix legacy flex-order rules overriding DOM order.
   ========================================================= */
#view-home[style*="display: block"]>.home-islamic-calendar{order:-10!important}
#view-home[style*="display: block"]>.sm-home-primary-grid{order:-9!important}
#view-home[style*="display: block"]>.home-prayer-priority{order:-8!important}
#view-home[style*="display: block"]>.home-mosque-feed{order:-7!important}
#view-home[style*="display: block"]>.sm-home-tools{order:-6!important}
#view-home[style*="display: block"]>.home-continue-section{order:-5!important}
#view-home[style*="display: block"]>.home-shortcuts{order:-4!important}