/* =====================================================
   caretaker 4.2  |  Desktop-Ansicht für die Module
   Greift erst ab 1000 Pixel Breite (z. B. iMac).
   Am iPhone ändert diese Datei nichts.
   ===================================================== */
.spalten>div{min-width:0}
.nur-desktop{display:none}

@media (min-width:1000px){
  body{padding:0 0 56px 240px!important}
  .app{max-width:1240px;padding:0 44px}
  .app:not(:has(.spalten)){max-width:980px}
  .oben{padding-top:24px}
  .nav h1{font-size:40px;margin-top:16px}
  .nur-desktop{display:block}
  .nur-handy{display:none!important}

  @media (min-width:1500px){ .app:has(.spalten){max-width:1440px} }
  /* Zwei Spalten nebeneinander */
  .spalten{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 36px;align-items:start}
  .spalten.breit-links{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
  .spalten>div>:first-child{margin-top:14px!important}
  .app:has(.spalten)>.monat{max-width:calc((100% - 36px) / 2)}
  .personen{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
  .personen>.gruppe{margin:0!important}
  .kacheln{grid-template-columns:repeat(4,minmax(0,1fr))}

  /* Leiste links statt unten */
  .tabs{top:0;bottom:0;left:0;right:auto;width:240px;flex-direction:column;justify-content:flex-start;align-items:stretch;gap:2px;
    padding:26px 12px;border-top:0;border-right:.5px solid var(--sep)}
  .tabs::before{content:attr(data-titel);display:block;font-size:22px;font-weight:700;letter-spacing:-.01em;padding:0 12px 18px;color:var(--text)}
  .tabs button{flex:none;max-width:none;flex-direction:row;justify-content:flex-start;align-items:center;gap:12px;
    font-size:15px;font-weight:500;color:var(--text);padding:9px 12px;border-radius:10px;text-align:left}
  .tabs button svg{width:22px;height:22px;color:var(--accent);flex:none}
  .tabs button.an{background:var(--accent);color:#fff}
  .tabs button.an svg{color:#fff}
  .tabs .punkt{position:static;margin-left:auto}
  .tabs button.an .punkt{background:#fff;color:var(--accent)}

  /* Fenster in der Mitte statt Blatt von unten */
  .huelle{align-items:center;padding:32px}
  .sheet{max-width:680px;border-radius:18px;max-height:calc(100vh - 64px);padding-bottom:28px;
    transform:translateY(24px) scale(.98);opacity:0;transition:transform .28s cubic-bezier(.2,.85,.25,1),opacity .2s;
    box-shadow:0 30px 80px rgba(0,0,0,.35)}
  .huelle.an .sheet{transform:none;opacity:1}
  .sheet:has(.papier),.sheet:has(.scans){max-width:820px}

  .toast{bottom:32px;left:calc(50% + 120px)}

  /* Unterschrift am großen Bildschirm nicht endlos breit */
  .pad-flaeche{width:calc(100% - 24px);max-width:1000px;margin:0 auto}
  .pad-unten,.pad-merken{width:100%;max-width:1024px;margin-left:auto;margin-right:auto}
  .pad-dreh{display:none}

  @media (hover:hover){
    .tabs button:not(.an):hover{background:var(--fill)}
    .tipp:hover{background:var(--fill)}
    .knopf:hover,.gross:hover{filter:brightness(1.07)}
    .chips button:not(.an):hover,.seg button:not(.an):hover{background:color-mix(in srgb,var(--fill) 60%,transparent)}
    .zurueck:hover{opacity:.75}
  }
}
