/* Retter-Portal v1.3.61
   Mobile Hydranten-Detailkarte kompakter und Monatsauswahl vollständig abgerundet. */

@media(max-width:760px){
  /* Die Detailkarte nutzt bewusst keine generischen Popup-/Button-Flächen mehr. */
  html body .water-mobile-sheet{
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    display:block!important;
    width:auto!important;
    max-width:none!important;
    max-height:min(82%,540px)!important;
    padding:0!important;
    overflow:auto!important;
    border:1px solid rgba(148,163,184,.24)!important;
    border-radius:24px!important;
    background:linear-gradient(155deg,rgba(10,24,42,.995),rgba(6,17,30,.99))!important;
    box-shadow:0 24px 72px rgba(2,6,23,.52),inset 0 1px 0 rgba(255,255,255,.05)!important;
    overscroll-behavior:contain!important;
  }
  html body .water-mobile-sheet__surface{
    display:block!important;
    min-width:0!important;
    width:100%!important;
    background:transparent!important;
  }
  html body .water-mobile-sheet__head{
    position:sticky!important;
    z-index:4!important;
    top:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 38px!important;
    align-items:start!important;
    gap:12px!important;
    min-width:0!important;
    padding:16px 16px 14px!important;
    border-bottom:1px solid rgba(148,163,184,.16)!important;
    background:linear-gradient(180deg,rgba(18,34,55,.995),rgba(10,24,42,.985))!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  html body .water-mobile-sheet__titles{
    display:grid!important;
    gap:5px!important;
    min-width:0!important;
    padding:0!important;
  }
  html body .water-mobile-sheet__titles strong{
    display:block!important;
    min-width:0!important;
    color:#fff!important;
    font-size:1.13rem!important;
    line-height:1.22!important;
    font-weight:950!important;
    letter-spacing:-.025em!important;
    overflow-wrap:anywhere!important;
  }
  html body .water-mobile-sheet__titles small{
    display:block!important;
    min-width:0!important;
    color:#b8c5d7!important;
    font-size:.82rem!important;
    line-height:1.35!important;
    font-weight:780!important;
    overflow-wrap:anywhere!important;
  }
  html body .water-mobile-sheet__close{
    position:static!important;
    inset:auto!important;
    display:grid!important;
    place-items:center!important;
    justify-self:end!important;
    align-self:start!important;
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:0!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:12px!important;
    background:rgba(30,41,59,.88)!important;
    color:#fff!important;
    box-shadow:none!important;
    font-size:1.24rem!important;
    line-height:1!important;
    font-weight:900!important;
    text-indent:0!important;
  }
  html body .water-mobile-sheet__body{
    display:grid!important;
    gap:13px!important;
    min-width:0!important;
    padding:15px 16px 17px!important;
  }
  html body .water-mobile-sheet__location{
    min-width:0!important;
    color:#f1f5f9!important;
    font-size:.96rem!important;
    line-height:1.42!important;
    font-weight:850!important;
    overflow-wrap:anywhere!important;
  }
  html body .water-mobile-sheet__facts{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
    min-width:0!important;
  }
  html body .water-mobile-sheet__facts>div{
    display:grid!important;
    align-content:start!important;
    gap:5px!important;
    min-width:0!important;
    min-height:78px!important;
    padding:12px 13px!important;
    border:1px solid rgba(148,163,184,.18)!important;
    border-radius:16px!important;
    background:rgba(30,41,59,.82)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  }
  html body .water-mobile-sheet__facts b{
    color:#aebbd0!important;
    font-size:.66rem!important;
    line-height:1.2!important;
    font-weight:900!important;
    letter-spacing:.09em!important;
    text-transform:uppercase!important;
  }
  html body .water-mobile-sheet__facts span{
    min-width:0!important;
    color:#fff!important;
    font-size:.94rem!important;
    line-height:1.3!important;
    font-weight:900!important;
    overflow-wrap:anywhere!important;
  }
  html body .water-mobile-sheet__actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:9px!important;
    min-width:0!important;
  }
  html body .water-mobile-sheet__actions>.btn,
  html body .water-mobile-sheet__actions .map-popup-links,
  html body .water-mobile-sheet__actions .map-popup-links>.btn{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  html body .water-mobile-sheet__actions>.btn,
  html body .water-mobile-sheet__actions .map-popup-links>.btn{
    min-height:48px!important;
    margin:0!important;
    border-radius:15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:nowrap!important;
    text-align:center!important;
    font-size:.94rem!important;
    font-weight:900!important;
  }
  html body .water-mobile-sheet__actions>.btn.primary{
    background:linear-gradient(135deg,#ef3154,#c8102e)!important;
    border-color:rgba(251,113,133,.34)!important;
    color:#fff!important;
    box-shadow:0 12px 26px rgba(225,29,72,.22)!important;
  }
  html body .water-mobile-sheet__actions .map-popup-links{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
    margin:0!important;
  }
  html body .water-mobile-sheet__actions .map-popup-links>.btn{
    background:#243244!important;
    border-color:rgba(255,255,255,.10)!important;
    color:#fff!important;
    box-shadow:none!important;
  }

  /* Monatsfeld erhält einen echten vollständigen Abschluss statt offener Unterkante. */
  html body .calendar-month-form input[type="month"]{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    border-bottom-left-radius:16px!important;
    border-bottom-right-radius:16px!important;
    overflow:hidden!important;
    background-clip:padding-box!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
    -webkit-mask-image:-webkit-radial-gradient(white,black)!important;
    clip-path:inset(0 round 16px)!important;
  }
}

@media(max-width:430px){
  html body .water-mobile-sheet{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
    max-height:84%!important;
    border-radius:21px!important;
  }
  html body .water-mobile-sheet__head{
    grid-template-columns:minmax(0,1fr) 36px!important;
    padding:14px 14px 12px!important;
  }
  html body .water-mobile-sheet__close{
    flex-basis:36px!important;
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
  }
  html body .water-mobile-sheet__body{
    padding:13px 14px 15px!important;
  }
  html body .water-mobile-sheet__facts,
  html body .water-mobile-sheet__actions .map-popup-links{
    grid-template-columns:minmax(0,1fr)!important;
  }
  html body .water-mobile-sheet__facts>div{
    min-height:0!important;
  }
}

body[data-theme="light"] .water-mobile-sheet{
  background:linear-gradient(155deg,#ffffff,#f3f7fb)!important;
  border-color:rgba(148,163,184,.30)!important;
  box-shadow:0 24px 64px rgba(71,85,105,.25),inset 0 1px 0 rgba(255,255,255,.8)!important;
}
body[data-theme="light"] .water-mobile-sheet__head{
  background:linear-gradient(180deg,rgba(255,255,255,.995),rgba(244,248,252,.985))!important;
  border-bottom-color:rgba(148,163,184,.20)!important;
}
body[data-theme="light"] .water-mobile-sheet__titles strong,
body[data-theme="light"] .water-mobile-sheet__location{color:#0f172a!important}
body[data-theme="light"] .water-mobile-sheet__titles small{color:#5b6b82!important}
body[data-theme="light"] .water-mobile-sheet__close{
  background:#eef3f8!important;
  border-color:rgba(148,163,184,.28)!important;
  color:#0f172a!important;
}
body[data-theme="light"] .water-mobile-sheet__facts>div{
  background:#f1f5f9!important;
  border-color:#d9e2ec!important;
}
body[data-theme="light"] .water-mobile-sheet__facts b{color:#64748b!important}
body[data-theme="light"] .water-mobile-sheet__facts span{color:#0f172a!important}
body[data-theme="light"] .water-mobile-sheet__actions .map-popup-links>.btn{
  background:#e8eef6!important;
  border-color:rgba(148,163,184,.28)!important;
  color:#0f172a!important;
}