/* Villa Curadise 15.5.0 — één schone iPad-laag. Android en desktop worden niet geraakt. */
html.vc155-ipad,
html.vc155-ipad body{width:100%;max-width:100%;overflow-x:hidden}
html.vc155-ipad *{box-sizing:border-box}

/* Gedeeld op iPad */
html.vc155-ipad .content{min-width:0!important;max-width:none!important}
html.vc155-ipad #planboardWrap{
  overflow-x:auto!important;
  overflow-y:visible!important;
  scroll-snap-type:none!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x pan-y!important;
}
html.vc155-ipad .planboard-shell{max-width:100%!important;overflow:hidden!important}
html.vc155-ipad #dashboard .stat,
html.vc155-ipad #dashboard .stat>div{min-width:0!important}
html.vc155-ipad #dashboard .stat b{
  overflow:visible!important;
  text-overflow:clip!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
  font-variant-numeric:tabular-nums!important;
}

/* 16.0.105 — op sommige iPadOS/Safari-versies wordt de sticky zijbalk
   (landscape) boven een geopende dialoog gerenderd, een bekend WebKit-
   probleem tussen position:sticky en de dialog-toplayer. Zichtbaar effect:
   het linkerdeel van het formulier (bv. "Boeking wijzigen" in het
   Eigenarenportaal) lijkt achter de zijbalk te verdwijnen — titel en
   linkerkolomvelden zijn dan half afgesneden, terwijl de rechterkolom wel
   volledig zichtbaar is. Zolang er een dialoog open staat, wordt de
   zijbalk daarom tijdelijk niet-sticky gemaakt, zodat de dialoog er altijd
   volledig en gecentreerd overheen kan renderen. */
html.vc155-ipad body:has(dialog#dialog[open]) .sidebar{
  position:static!important;
}

/* Formulieren: velden scrollen, acties blijven in beeld. */
html.vc155-ipad dialog#dialog{max-height:calc(100dvh - 18px)!important;overflow:hidden!important}
html.vc155-ipad dialog#dialog .modal{
  max-height:calc(100dvh - 18px)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
html.vc155-ipad dialog#dialog #dialogFields{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
html.vc155-ipad dialog#dialog .modal-actions{
  flex:0 0 auto!important;
  position:sticky!important;
  bottom:0!important;
  z-index:5!important;
  margin:0!important;
  padding:12px 0 max(6px,env(safe-area-inset-bottom))!important;
  background:#fff!important;
  box-shadow:0 -8px 18px rgba(16,38,48,.07)!important;
}

/* iPad portrait */
html.vc155-ipad.vc155-portrait .app{display:block!important;min-height:100dvh!important}
html.vc155-ipad.vc155-portrait .sidebar{display:none!important}
html.vc155-ipad.vc155-portrait .mobile-nav{display:grid!important}
html.vc155-ipad.vc155-portrait .content{
  width:100%!important;
  margin:0!important;
  padding:18px 18px calc(92px + env(safe-area-inset-bottom))!important;
  overflow-x:hidden!important;
}
html.vc155-ipad.vc155-portrait #dashboard .topbar{display:flex!important;flex-wrap:wrap!important}
html.vc155-ipad.vc155-portrait #dashboard .stats{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
html.vc155-ipad.vc155-portrait #dashboard .stat{
  display:flex!important;
  width:auto!important;
  min-height:108px!important;
  padding:15px!important;
  gap:12px!important;
  overflow:hidden!important;
}
html.vc155-ipad.vc155-portrait #dashboard .stat b{
  white-space:nowrap!important;
  font-size:clamp(20px,3.2vw,27px)!important;
  line-height:1.08!important;
}
html.vc155-ipad.vc155-portrait #dashboard .dashboard-grid{grid-template-columns:1fr!important}

/* iPad landscape: desktopachtige zijbalk, maar met kaarten die volledige bedragen tonen. */
html.vc155-ipad.vc155-landscape .app{
  display:grid!important;
  grid-template-columns:190px minmax(0,1fr)!important;
  width:100%!important;
  min-height:100dvh!important;
}
html.vc155-ipad.vc155-landscape .sidebar{
  display:block!important;
  position:sticky!important;
  top:0!important;
  width:190px!important;
  height:100dvh!important;
  padding:11px 9px!important;
  overflow-y:auto!important;
}
html.vc155-ipad.vc155-landscape .brand{padding-bottom:12px!important;gap:8px!important}
html.vc155-ipad.vc155-landscape .brand img{width:42px!important;height:42px!important}
html.vc155-ipad.vc155-landscape .brand-name{font-size:16px!important}
html.vc155-ipad.vc155-landscape .brand-name small{font-size:7px!important;margin-top:5px!important}
html.vc155-ipad.vc155-landscape .nav{gap:2px!important}
html.vc155-ipad.vc155-landscape .nav button{padding:7px 8px!important;font-size:11.5px!important;border-radius:9px!important}
html.vc155-ipad.vc155-landscape .sidebar-info{margin-top:10px!important;padding:8px!important;font-size:10px!important}
html.vc155-ipad.vc155-landscape .mobile-nav{display:none!important}
html.vc155-ipad.vc155-landscape .content{
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:13px 14px 30px!important;
  overflow-x:hidden!important;
}
html.vc155-ipad.vc155-landscape #dashboard .topbar{margin-bottom:12px!important}
html.vc155-ipad.vc155-landscape #dashboard .topbar h1{font-size:25px!important}
html.vc155-ipad.vc155-landscape #dashboard .stats{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
html.vc155-ipad.vc155-landscape #dashboard .stat{
  display:grid!important;
  grid-template-columns:32px minmax(0,1fr)!important;
  align-items:center!important;
  min-width:0!important;
  min-height:86px!important;
  padding:9px!important;
  gap:7px!important;
  overflow:hidden!important;
}
html.vc155-ipad.vc155-landscape #dashboard .stat-icon{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  flex:0 0 32px!important;
  font-size:16px!important;
}
html.vc155-ipad.vc155-landscape #dashboard .stat b{
  display:block!important;
  white-space:nowrap!important;
  font-size:clamp(14px,1.55vw,17px)!important;
  line-height:1.08!important;
  letter-spacing:-.25px!important;
}
html.vc155-ipad.vc155-landscape #dashboard .stat span{
  display:block!important;
  margin-top:3px!important;
  font-size:10px!important;
  line-height:1.15!important;
}
html.vc155-ipad.vc155-landscape #dashboard .dashboard-grid{
  grid-template-columns:minmax(0,1.45fr) minmax(210px,.72fr)!important;
  gap:10px!important;
}
html.vc155-ipad.vc155-landscape #dashboardPayments{margin:11px 0!important}

/* Bij kleinere iPad-landscape viewport toch volledige bedragen: twee bij twee is beter dan afkappen. */
@media (orientation:landscape) and (max-width:900px){
  html.vc155-ipad.vc155-landscape #dashboard .stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
