/* AWL – Automatische Geräteansicht 1.0.1 */

/* Desktop bleibt optisch unverändert. Die folgenden Regeln greifen nur auf
   automatisch erkannten Touch-Geräten. */

html.awl-device-tablet .site-header .header-inner,
html.awl-device-phone .site-header .header-inner,
body.awl-device-tablet .site-header .header-inner,
body.awl-device-phone .site-header .header-inner{
  flex-direction:column!important;
  align-items:stretch!important;
  gap:12px!important;
  padding-top:10px!important;
  padding-bottom:12px!important;
}

html.awl-device-tablet .site-header .brand,
html.awl-device-phone .site-header .brand,
body.awl-device-tablet .site-header .brand,
body.awl-device-phone .site-header .brand{
  align-self:flex-start!important;
}

html.awl-device-tablet .site-header nav,
html.awl-device-phone .site-header nav,
body.awl-device-tablet .site-header nav,
body.awl-device-phone .site-header nav{
  width:100%!important;
}

html.awl-device-tablet .site-header .nav,
html.awl-device-tablet .site-header .menu,
html.awl-device-phone .site-header .nav,
html.awl-device-phone .site-header .menu,
body.awl-device-tablet .site-header .nav,
body.awl-device-tablet .site-header .menu,
body.awl-device-phone .site-header .nav,
body.awl-device-phone .site-header .menu{
  width:100%!important;
  display:grid!important;
  justify-content:stretch!important;
  align-items:stretch!important;
  gap:9px!important;
}

html.awl-device-tablet .site-header .nav,
html.awl-device-tablet .site-header .menu,
body.awl-device-tablet .site-header .nav,
body.awl-device-tablet .site-header .menu{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

html.awl-device-phone .site-header .nav,
html.awl-device-phone .site-header .menu,
body.awl-device-phone .site-header .nav,
body.awl-device-phone .site-header .menu{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

html.awl-device-tablet .site-header .nav li,
html.awl-device-tablet .site-header .menu li,
html.awl-device-phone .site-header .nav li,
html.awl-device-phone .site-header .menu li,
body.awl-device-tablet .site-header .nav li,
body.awl-device-tablet .site-header .menu li,
body.awl-device-phone .site-header .nav li,
body.awl-device-phone .site-header .menu li{
  width:100%!important;
}

html.awl-device-tablet .site-header .nav a,
html.awl-device-tablet .site-header .menu a,
body.awl-device-tablet .site-header .nav a,
body.awl-device-tablet .site-header .menu a{
  width:100%!important;
  min-height:58px!important;
  justify-content:center!important;
  align-items:center!important;
  padding:12px 14px!important;
  border:1px solid #cad7e9!important;
  border-radius:16px!important;
  background:#f7faff!important;
  color:#08244a!important;
  box-shadow:0 5px 14px rgba(8,36,74,.06)!important;
  font-size:1.08rem!important;
  font-weight:850!important;
  line-height:1.2!important;
  text-align:center!important;
}

html.awl-device-phone .site-header .nav a,
html.awl-device-phone .site-header .menu a,
body.awl-device-phone .site-header .nav a,
body.awl-device-phone .site-header .menu a{
  width:100%!important;
  min-height:56px!important;
  justify-content:center!important;
  align-items:center!important;
  padding:11px 10px!important;
  border:1px solid #cad7e9!important;
  border-radius:15px!important;
  background:#f7faff!important;
  color:#08244a!important;
  box-shadow:0 5px 14px rgba(8,36,74,.06)!important;
  font-size:1rem!important;
  font-weight:850!important;
  line-height:1.2!important;
  text-align:center!important;
}

html.awl-device-tablet .site-header .nav a:active,
html.awl-device-phone .site-header .nav a:active,
body.awl-device-tablet .site-header .nav a:active,
body.awl-device-phone .site-header .nav a:active{
  transform:scale(.985)!important;
}

/* Größere Touch-Ziele in den Lern-/Auswahlkacheln. */
html.awl-device-tablet .awl-cd-learning-grid,
body.awl-device-tablet .awl-cd-learning-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
}

html.awl-device-phone .awl-cd-learning-grid,
body.awl-device-phone .awl-cd-learning-grid{
  grid-template-columns:1fr!important;
  gap:13px!important;
}

html.awl-device-tablet .awl-cd-card-core,
body.awl-device-tablet .awl-cd-card-core{
  min-height:148px!important;
  padding:16px!important;
  gap:11px!important;
}
html.awl-device-phone .awl-cd-card-core,
body.awl-device-phone .awl-cd-card-core{
  min-height:140px!important;
  padding:16px!important;
  gap:11px!important;
}

html.awl-device-tablet .awl-cd-card-core>.awl-cd-card-title,
body.awl-device-tablet .awl-cd-card-core>.awl-cd-card-title{
  font-size:18px!important;
  line-height:1.3!important;
}
html.awl-device-phone .awl-cd-card-core>.awl-cd-card-title,
body.awl-device-phone .awl-cd-card-core>.awl-cd-card-title{
  font-size:19px!important;
  line-height:1.3!important;
}

html.awl-device-tablet .awl-cd-card-action,
html.awl-device-phone .awl-cd-card-action,
body.awl-device-tablet .awl-cd-card-action,
body.awl-device-phone .awl-cd-card-action,
html.awl-device-tablet .empty-button,
html.awl-device-phone .empty-button,
body.awl-device-tablet .empty-button,
body.awl-device-phone .empty-button,
html.awl-device-tablet .learning-link,
html.awl-device-phone .learning-link,
body.awl-device-tablet .learning-link,
body.awl-device-phone .learning-link{
  min-height:48px!important;
  padding:10px 13px!important;
  border-radius:14px!important;
  font-size:1rem!important;
  line-height:1.25!important;
  font-weight:850!important;
}

html.awl-device-tablet .learning-card h3,
body.awl-device-tablet .learning-card h3{
  font-size:1.35rem!important;
  line-height:1.2!important;
}
html.awl-device-phone .learning-card h3,
body.awl-device-phone .learning-card h3{
  font-size:1.4rem!important;
  line-height:1.2!important;
}

html.awl-device-tablet .learning-card-text,
html.awl-device-phone .learning-card-text,
body.awl-device-tablet .learning-card-text,
body.awl-device-phone .learning-card-text{
  font-size:1rem!important;
  line-height:1.5!important;
}

/* Übungsauswahl – größere Karten und besser lesbare Titel. */
html.awl-device-tablet .exercise-launch-grid,
body.awl-device-tablet .exercise-launch-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
}
html.awl-device-phone .exercise-launch-grid,
body.awl-device-phone .exercise-launch-grid{
  grid-template-columns:1fr!important;
  gap:13px!important;
}

html.awl-device-tablet .exercise-launch-card,
html.awl-device-phone .exercise-launch-card,
body.awl-device-tablet .exercise-launch-card,
body.awl-device-phone .exercise-launch-card{
  min-height:132px!important;
  padding:18px!important;
  border-radius:16px!important;
}
html.awl-device-tablet .exercise-launch-card strong,
body.awl-device-tablet .exercise-launch-card strong{
  font-size:1.08rem!important;
  line-height:1.28!important;
}
html.awl-device-phone .exercise-launch-card strong,
body.awl-device-phone .exercise-launch-card strong{
  font-size:1.18rem!important;
  line-height:1.3!important;
}
html.awl-device-tablet .exercise-launch-card span,
html.awl-device-tablet .exercise-launch-card small,
html.awl-device-phone .exercise-launch-card span,
html.awl-device-phone .exercise-launch-card small,
body.awl-device-tablet .exercise-launch-card span,
body.awl-device-tablet .exercise-launch-card small,
body.awl-device-phone .exercise-launch-card span,
body.awl-device-phone .exercise-launch-card small{
  font-size:.92rem!important;
  line-height:1.35!important;
}

/* Startseiten-Übungsindex – keine kleinen Textzeilen auf Touch-Geräten. */
html.awl-device-tablet .awl-front-exercise-index-item,
html.awl-device-phone .awl-front-exercise-index-item,
body.awl-device-tablet .awl-front-exercise-index-item,
body.awl-device-phone .awl-front-exercise-index-item{
  padding:15px 16px!important;
  border-radius:16px!important;
  min-height:70px!important;
}
html.awl-device-tablet .awl-front-exercise-index-item strong,
body.awl-device-tablet .awl-front-exercise-index-item strong{
  font-size:1.08rem!important;
  line-height:1.25!important;
}
html.awl-device-phone .awl-front-exercise-index-item strong,
body.awl-device-phone .awl-front-exercise-index-item strong{
  font-size:1.12rem!important;
  line-height:1.28!important;
}
html.awl-device-tablet .awl-front-exercise-index-item span,
html.awl-device-phone .awl-front-exercise-index-item span,
body.awl-device-tablet .awl-front-exercise-index-item span,
body.awl-device-phone .awl-front-exercise-index-item span{
  font-size:.9rem!important;
  line-height:1.35!important;
}

/* Der bisherige PC/Smartphone-Dialog wird durch die automatische Erkennung
   ersetzt. Sollte er von älterem JavaScript dennoch erzeugt werden, bleibt er
   unsichtbar und blockiert die Seite nicht. */
html.awl-device-aware .awl-device-modal,
body.awl-device-aware .awl-device-modal{
  display:none!important;
}
html.awl-device-aware body.awl-device-modal-open,
body.awl-device-aware.awl-device-modal-open{
  overflow:auto!important;
}

@media (max-width:520px){
  html.awl-device-phone .site-header .brand-logo,
  html.awl-device-phone .site-header .custom-logo,
  body.awl-device-phone .site-header .brand-logo,
  body.awl-device-phone .site-header .custom-logo{
    width:min(255px,82vw)!important;
    max-height:72px!important;
  }
}

/* -------------------------------------------------------------------------
   1.0.1 – Lernbereiche als echte Touch-Kacheln
   Auf Smartphones werden die bisher langen Lernbereichsboxen als zwei
   quadratische Kacheln pro Zeile dargestellt. Auf Tablets erscheinen drei
   kompakte Kacheln pro Zeile. Die Regeln greifen bewusst nur innerhalb der
   vom Kompaktdesign erkannten Lernbereichskarten.
   ------------------------------------------------------------------------- */

html.awl-device-phone .awl-cd-learning-grid,
body.awl-device-phone .awl-cd-learning-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  align-items:stretch!important;
}

html.awl-device-phone .awl-cd-learning-card,
body.awl-device-phone .awl-cd-learning-card{
  aspect-ratio:1 / 1!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  border:1px solid #cbd9e9!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,#ffffff 0%,#f7faff 100%)!important;
  box-shadow:0 8px 22px rgba(8,36,74,.08)!important;
  overflow:hidden!important;
}

html.awl-device-phone .awl-cd-learning-card:nth-child(3n+1),
body.awl-device-phone .awl-cd-learning-card:nth-child(3n+1){
  background:linear-gradient(145deg,#ffffff 0%,#fff8ef 100%)!important;
  border-color:#efd6b7!important;
}
html.awl-device-phone .awl-cd-learning-card:nth-child(3n+2),
body.awl-device-phone .awl-cd-learning-card:nth-child(3n+2){
  background:linear-gradient(145deg,#ffffff 0%,#f3f8ff 100%)!important;
}
html.awl-device-phone .awl-cd-learning-card:nth-child(3n),
body.awl-device-phone .awl-cd-learning-card:nth-child(3n){
  background:linear-gradient(145deg,#ffffff 0%,#f6fbf4 100%)!important;
  border-color:#cfdfca!important;
}

html.awl-device-phone .awl-cd-card-core,
body.awl-device-phone .awl-cd-card-core{
  box-sizing:border-box!important;
  min-height:0!important;
  height:100%!important;
  padding:13px 11px 11px!important;
  gap:8px!important;
  justify-content:space-between!important;
  align-items:stretch!important;
}

html.awl-device-phone .awl-cd-card-core>.awl-cd-card-title,
body.awl-device-phone .awl-cd-card-core>.awl-cd-card-title{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:1 1 auto!important;
  margin:0!important;
  padding:2px 2px!important;
  color:#08244a!important;
  font-size:clamp(17px,4.7vw,21px)!important;
  font-weight:900!important;
  line-height:1.12!important;
  letter-spacing:-.02em!important;
  text-align:center!important;
  overflow-wrap:anywhere!important;
  hyphens:auto!important;
}

html.awl-device-phone .awl-cd-card-actions,
body.awl-device-phone .awl-cd-card-actions{
  flex:0 0 auto!important;
  gap:6px!important;
  margin-top:0!important;
}

html.awl-device-phone .awl-cd-card-action,
body.awl-device-phone .awl-cd-card-action{
  min-height:38px!important;
  padding:7px 7px!important;
  border-radius:12px!important;
  font-size:clamp(13px,3.5vw,15px)!important;
  font-weight:900!important;
  line-height:1.1!important;
  text-align:center!important;
  white-space:normal!important;
}

html.awl-device-phone .awl-cd-card-action:first-child,
body.awl-device-phone .awl-cd-card-action:first-child{
  border:1px solid #efc490!important;
  background:#fff6ea!important;
  color:#c45a00!important;
}

/* Auf sehr schmalen Geräten bleiben zwei Kacheln pro Zeile erhalten; die
   Innenabstände werden reduziert, damit auch längere Fachbezeichnungen passen. */
@media (max-width:380px){
  html.awl-device-phone .awl-cd-learning-grid,
  body.awl-device-phone .awl-cd-learning-grid{
    gap:9px!important;
  }
  html.awl-device-phone .awl-cd-card-core,
  body.awl-device-phone .awl-cd-card-core{
    padding:10px 8px 8px!important;
  }
  html.awl-device-phone .awl-cd-card-core>.awl-cd-card-title,
  body.awl-device-phone .awl-cd-card-core>.awl-cd-card-title{
    font-size:clamp(16px,4.6vw,19px)!important;
  }
  html.awl-device-phone .awl-cd-card-action,
  body.awl-device-phone .awl-cd-card-action{
    min-height:34px!important;
    padding:6px 5px!important;
    font-size:12.5px!important;
  }
}

/* Tablet: kompaktere, kachelartige 3er-Anordnung mit größerer Schrift. */
html.awl-device-tablet .awl-cd-learning-grid,
body.awl-device-tablet .awl-cd-learning-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:15px!important;
}
html.awl-device-tablet .awl-cd-learning-card,
body.awl-device-tablet .awl-cd-learning-card{
  aspect-ratio:1 / 1!important;
  min-height:0!important;
  height:auto!important;
  border-radius:18px!important;
  box-shadow:0 8px 22px rgba(8,36,74,.08)!important;
}
html.awl-device-tablet .awl-cd-card-core,
body.awl-device-tablet .awl-cd-card-core{
  min-height:0!important;
  height:100%!important;
  padding:17px!important;
}
html.awl-device-tablet .awl-cd-card-core>.awl-cd-card-title,
body.awl-device-tablet .awl-cd-card-core>.awl-cd-card-title{
  font-size:clamp(19px,2.4vw,23px)!important;
  font-weight:900!important;
  line-height:1.18!important;
  text-align:center!important;
}


/* --------------------------------------------------------------------------
   1.0.2 – Smartphone: QR-Codes entfernen und Kartenbreite zurückgeben
   -------------------------------------------------------------------------- */
html.awl-device-phone .awl-qr-inline-trigger,
html.awl-device-phone .awl-qr-learning-button,
html.awl-device-phone .awl-qr-modal,
body.awl-device-phone .awl-qr-inline-trigger,
body.awl-device-phone .awl-qr-learning-button,
body.awl-device-phone .awl-qr-modal{
  display:none!important;
}

html.awl-device-phone .exercise-launch-card.has-awl-qr,
body.awl-device-phone .exercise-launch-card.has-awl-qr{
  padding-right:18px!important;
}

html.awl-device-phone .learning-card.has-awl-qr,
body.awl-device-phone .learning-card.has-awl-qr{
  padding-right:inherit!important;
}

html.awl-device-phone .exercise-launch-card.has-awl-qr>.awl-qr-card-main,
body.awl-device-phone .exercise-launch-card.has-awl-qr>.awl-qr-card-main{
  min-width:0!important;
  width:100%!important;
}

html.awl-device-phone body.awl-qr-modal-open,
body.awl-device-phone.awl-qr-modal-open{
  overflow:auto!important;
}
