
/*== /styles/domain/kommunikation/komm-verlauf.css ==*/















.komm-sec-kopf { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-2); flex-wrap: wrap; }
.komm-sec-zahl {
  margin-left: var(--space-2); padding: 0 var(--space-1-5);
  border-radius: var(--radius-pill); background: var(--bg-secondary);
  color: var(--color-text-muted); font-size: var(--fs-caption); font-weight: var(--fw-semibold);
}



.komm-sec-zusatz { color: var(--color-text-muted); font-size: var(--fs-caption); }




.app-scope .komm-sec-facette {
  display: inline-flex; align-items: center; gap: var(--space-1);
  
  padding: var(--space-1) var(--space-3-5);
  border: 1px solid var(--color-border); border-radius: var(--radius-pill);
  background: var(--card-bg, #fff); color: var(--color-text-muted);
  font-size: var(--fs-caption); font-weight: var(--fw-medium); cursor: pointer;
}
.app-scope .komm-sec-facette:hover { border-color: var(--color-border-hover); color: var(--lod-darkblue-900); }
.app-scope .komm-sec-facette:focus-visible { outline: none; box-shadow: var(--lod-shadow-focus); }
.app-scope .komm-sec-facette.is-active {
  border-color: var(--lod-turquoise);
  background: color-mix(in srgb, var(--lod-turquoise) 10%, var(--card-bg, #fff));
  color: var(--lod-darkblue-900); font-weight: var(--fw-semibold);
}
.komm-sec-facette span { color: var(--color-text-muted); font-weight: var(--fw-regular); }
.komm-sec-facetten { display: flex; flex-wrap: wrap; gap: var(--space-1-5); margin: var(--space-2) 0 var(--space-3); }


.komm-sec-suche { max-width: 280px; margin-bottom: var(--space-3); }



.komm-sec-pins {
  margin-bottom: var(--space-3); padding: var(--space-2) var(--space-2-5);
  border: 1px solid var(--color-border-light); border-radius: var(--radius-lg);
  background: var(--bg-secondary);
}
.komm-sec-pins-titel {
  display: flex; align-items: center; gap: var(--space-1);
  margin: 0 0 var(--space-2);
  font-size: var(--fs-caption); font-weight: var(--fw-semibold);
  text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-muted);
}
.komm-sec-pins-titel .ui-ico img { width: 13px; height: 13px; opacity: .6; }






.komm-sec-vorschlaege { margin: var(--space-2) 0 var(--space-3); }
.komm-sec-vorschlaege-kopf { font-weight: var(--fw-semibold); margin-bottom: var(--space-2); }
.komm-vorschlag-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-1-5); }
.komm-vorschlag { display: flex; align-items: center; gap: var(--space-2); min-width: 0; }
.komm-vorschlag-text { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.komm-vorschlag-betreff { font-size: var(--fs-body); color: var(--color-text); }
.komm-vorschlag-meta { font-size: var(--fs-caption); color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.komm-vorschlag-btn { flex-shrink: 0; }



.komm-vorschlag-mehr { width: 100%; margin-top: var(--space-2); justify-content: center; }


.app-scope .komm-sec-mehr {
  display: block; width: 100%; margin-top: var(--space-2);
  padding: var(--space-1-5) var(--space-2);
  border: 1px dashed var(--color-border); border-radius: var(--radius-md);
  background: transparent; color: var(--lod-darkblue);
  font-size: var(--fs-caption); font-weight: var(--fw-medium); cursor: pointer;
}
.app-scope .komm-sec-mehr:hover { background: var(--bg-secondary); border-color: var(--color-border-hover); }
.app-scope .komm-sec-mehr:focus-visible { outline: none; box-shadow: var(--lod-shadow-focus); }






@media (max-width: 999px) {
  .app-scope .komm-sec-facette { min-height: var(--touch-ziel); }
  .app-scope .komm-sec-mehr { min-height: var(--touch-ziel); }
}



@media (max-width: 599px) {
  .komm-vorschlag { flex-direction: column; align-items: stretch; gap: var(--space-1); }
  .komm-vorschlag-btn { align-self: flex-start; }
}


/*== /styles/sections/mein-bereich/mb-outlook.css ==*/










































#mb-outlook-content .mbv-body { max-width: 1240px; }

.mbo-root {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  

}
























.mbo-kopf,
.mbo-haupt,
.mbo-tz,
.mbo-sig,
.mbo-team-zeile {
  border: 1px solid var(--color-border);
  border-radius: var(--surface-radius);
  background: var(--color-surface);
}





.mbo-kopf {
  display: flex;
  


  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  padding: var(--space-4) var(--space-5);
}
.mbo-kopf-ident {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}
.mbo-kopf-eyebrow {
  font-size: var(--font-size-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}


.mbo-kopf-postfach {
  font-size: var(--font-size-lg);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mbo-kopf-zustand {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}
.mbo-kopf-zustand-text {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}


.mbo-kopf-zahl {
  flex: 0 0 auto;
  display: grid;
  


  grid-template-columns: auto minmax(0, 22ch);
  grid-template-areas: 'wert text' 'wert wo';
  align-items: center;
  gap: 0 var(--space-3);
  padding-left: var(--space-5);
  border-left: 1px solid var(--color-border);
}
.mbo-kopf-zahl-wert {
  grid-area: wert;
  font-size: var(--font-size-xxl);
  font-weight: var(--fw-semibold);
  line-height: 1;
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
}
.mbo-kopf-zahl-text {
  grid-area: text;
  font-size: var(--font-size-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
}
.mbo-kopf-zahl-wo {
  grid-area: wo;
  


  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}







.mbo-fund-liste {
  list-style: none;
  margin: var(--space-2) 0 0;
  padding: 0;
  flex-basis: 100%;
  







  min-width: 0;
}
.mbo-fund-zeile {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
  padding: var(--space-1) 0;
  border-top: 1px solid var(--color-border-light);
  min-width: 0;
}
.mbo-fund-titel { flex: 1 1 auto; min-width: 0; font-size: var(--font-size-sm); color: var(--color-text); }
.mbo-fund-meta { flex: 0 1 auto; min-width: 0; font-size: var(--font-size-sm); color: var(--color-text-muted); }
.mbo-fund-link { flex: 0 0 auto; font-size: var(--font-size-sm); white-space: nowrap; }



.mbo-fund-link-leer { visibility: hidden; pointer-events: none; }
.mbo-fund-mehr { margin: var(--space-1) 0 0; font-size: var(--font-size-sm); color: var(--color-text-muted); }



.mbo-fund-mehr-btn { margin: var(--space-1) 0 0; align-self: flex-start; }



.mbo-kopf-zahl-teilung {
  flex-basis: 100%;
  

  min-width: 0;
  margin: var(--space-2) 0 0;
  font-size: var(--font-size-sm);
  color: var(--color-text);
}












.mbo-spalten {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: var(--space-5);
  align-items: start;
}
.mbo-haupt {
  order: -1;
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  min-width: 0;
  padding: var(--space-4) var(--space-5);
}






.mbo-spalten--nur-auskunft { grid-template-columns: minmax(0, 1fr); }





.mbo-kanal { min-width: 0; }
.mbo-kanal-kopf {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.mbo-kanal-titel {
  font-size: var(--font-size-base);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
  min-width: 0;
}
.mbo-kanal-was {
  margin: var(--space-1) 0 var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  max-width: 70ch;
}









.mbo-sperre {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3) 0;
  border-top: 1px solid var(--color-border);
}
.mbo-sperre-kopf {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.mbo-sperre-titel {
  font-size: var(--font-size-base);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
  min-width: 0;
}
.mbo-sperre-text {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  max-width: 70ch;
}





.mbo-hinweis {
  grid-column: 1 / -1;
  margin: 0 0 var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  border-left: 3px solid var(--color-border-hover);
  padding: var(--space-1) var(--space-2);
}




.mbo-geplant {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}
.mbo-geplant-label {
  font-size: var(--font-size-sm);
  
  color: var(--color-text-tertiary);
}










.mbo-sig {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
}
.mbo-sig-kopf {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.mbo-sig-titel {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
}



.mbo-sig-wahl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 11rem));
  gap: var(--space-2);
}
.mbo-sig-satz {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}


.mbo-sig-satz--leise { color: var(--color-text-muted); }



.mbo-sig-melden {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  padding-top: var(--space-1);
}





.mbo-sig-rahmen {
  width: 100%;
  height: 15rem;
  border: 1px solid var(--color-border);
  border-radius: var(--surface-radius);
  background: #fff;
}








.mbo-tz {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  


  padding: var(--space-4) var(--space-5);
}
.mbo-tz-kopf {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.mbo-tz-h {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
}
.mbo-tz-liste {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin: 0;
}
.mbo-tz-zeile {
  display: flex;
  flex-direction: column;
  gap: var(--space-xxs);
  min-width: 0;
}
.mbo-tz-label {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--font-size-xs);
  font-weight: var(--fw-semibold);
  letter-spacing: .03em;
  text-transform: uppercase;
}
.mbo-tz-wert {
  margin: 0;
  color: var(--color-text);
  font-size: var(--font-size-sm);
}
.mbo-tz-ul {
  margin: 0;
  padding-left: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-xxs);
}








.mbo-team {
  display: flex;
  flex-direction: column;
  gap: var(--space-1-5);
}
.mbo-team-h3 {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
}


.mbo-team-h4 {
  margin: var(--space-4) 0 0;
  font-size: var(--font-size-sm);
  font-weight: var(--fw-semibold);
  color: var(--color-text-muted);
}
.mbo-team-intro,
.mbo-team-leer,


.mbo-team-gekappt {
  margin: 0;
  font-size: var(--font-size-sm);
  
  color: var(--color-text-tertiary);
  max-width: 70ch;
}



.mbo-team-sperre {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text);
  max-width: 70ch;
}
.mbo-team-liste {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.mbo-team-zeile {
  display: grid;
  


  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    'kopf     kopf'
    'betreff  aktionen'
    'gegen    aktionen'
    'suche    suche';
  gap: var(--space-1) var(--space-2);
  padding: var(--space-3);
}
.mbo-team-kopf {
  grid-area: kopf;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}


.mbo-team-postfach {
  font-weight: var(--fw-semibold);
  color: var(--color-text);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mbo-team-zeit { flex: 0 0 auto; white-space: nowrap; }
.mbo-team-betreff { grid-area: betreff; color: var(--color-text); }
.mbo-team-gegen {
  grid-area: gegen;
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}
.mbo-team-aktionen {
  grid-area: aktionen;
  display: flex;
  align-items: flex-start;
  gap: var(--space-1-5);
}
.mbo-team-suche {
  grid-area: suche;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-top: var(--space-1);
  border-top: 1px solid var(--color-border);
}
.mbo-team-treffer {
  display: flex;
  flex-direction: column;
  gap: var(--space-xxs);
}


.mbo-root .mbo-team-treffer-btn {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  text-align: left;
  font: inherit;
  color: var(--color-text);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-1) var(--space-2);
  cursor: pointer;
}
.mbo-root .mbo-team-treffer-btn:hover {
  background: var(--color-bg-muted);
  border-color: var(--color-border-hover);
}
.mbo-team-treffer-titel { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mbo-team-treffer-typ {
  flex: 0 0 auto;
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  white-space: nowrap;
}




@media (max-width: 1399px) {
  #mb-outlook-content .mbv-body { max-width: none; }
  

  .mbo-spalten { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--space-4); }
}





@media (max-width: 999px) {
  















  .mbo-fund-link {
    display: inline-flex; align-items: center;
    min-height: var(--touch-ziel); padding: 0 var(--space-2);
    

    margin: 0 calc(var(--space-2) * -1);
  }
  


  .mbo-root .mbo-team-treffer-btn { min-height: var(--touch-ziel); }
  .mbo-spalten { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .mbo-haupt { order: 0; }
  .mbo-root { gap: var(--space-4); }
  

  .mbo-kopf { flex-wrap: wrap; }
  .mbo-kopf-zahl {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--color-border);
    padding-top: var(--space-3);
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr);
  }
}


@media (max-width: 599px) {
  .mbo-root { gap: var(--space-3); }
  .mbo-kopf { padding: var(--space-3); }
  .mbo-tz,
  .mbo-sig,
  .mbo-haupt { padding: var(--space-3); }
  


  .mbo-sig-wahl { grid-template-columns: minmax(0, 1fr); width: 100%; }
  
  .mbo-sig-rahmen { height: 12rem; }
  

  .mbo-team-zeile {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: 'kopf' 'betreff' 'gegen' 'aktionen' 'suche';
  }
  .mbo-team-aktionen { align-items: center; }
  



  .mbo-fund-zeile { flex-wrap: wrap; gap: var(--space-1) var(--space-3); }
  .mbo-fund-titel { flex-basis: 100%; }
  




  .mbo-fund-meta { flex: 1 1 0; }
  


  .mbo-fund-link-leer { display: none; }
}

