/* --- tunables --- */
:root {
  --tt-photo-w: 75px;
  /* photo width (mobile) */
  --tt-photo-h: 100px;
  /* photo height (mobile) */
  --tt-gap: 6px;
  /* gap between photo and text */
  --tt-photo-radius: 12px;
  /* roundedness for photo wrapper */
  --email-icon-nudge: 2px;
  /* vertical nudge for email icon (unused now) */
}

/* Default (desktop): keep mobile clones hidden */
.tx-ttaddress .tt-head-mobile,
.tx-ttaddress .tt-address-mobile {
  display: none;
}

/* E-Mail Text/Icon Umschaltung (Desktop Standard, Mobile Icon) */
.tx-ttaddress .contact-email .email-link .email-icon { display: none; }
.tx-ttaddress .contact-email .email-link .email-text { display: inline; }

/* MOBILE ONLY */
@media (max-width: 768px) {

  /* Mobile: Icon statt Text */
  .tx-ttaddress .contact-email .email-link .email-text { display: none !important; }
  .tx-ttaddress .contact-email .email-link .email-icon { 
    display: inline-block !important;
    line-height: 1.25;
    margin-left: .35rem;
    vertical-align: text-bottom;
    width: 20px; height: 20px;
    position: relative; top: 1px;
    shape-rendering: crispEdges;
  }

  /* Card becomes a 2-col grid with explicit placement */
  .tx-ttaddress .teaser__item {
    display: grid !important;
    grid-template-columns: var(--tt-photo-w) 1fr !important;
    grid-auto-rows: auto;
    grid-template-areas: none !important;

    column-gap: var(--tt-gap) !important;
    row-gap: 2px;
    padding: 12px !important;
    border-radius: .25rem;
    font-size: .8rem;
    align-items: start;
  }

  /* Row 1: mobile head clone (full width) */
  .tx-ttaddress .tt-head-mobile {
    display: block !important;
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }

  .tx-ttaddress .tt-head-mobile p {
    margin: 0 !important;
    padding: 0 !important;
  }

  .tx-ttaddress .tt-head-mobile .tt-name {
    font-size: .85rem;
    font-weight: 700;
    margin: 0 0 2px;
    line-height: 1.25;
    margin-bottom: 5px !important;
  }

  .tx-ttaddress .tt-head-mobile .tt-position {
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 8px !important;
  }

  /* Row 2: contact (full width) */
  .tx-ttaddress .teaser__content {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    display: block !important;
  }

  .tx-ttaddress .teaser__content .tt-head {
    display: none !important;
  }

  .tx-ttaddress .teaser__content .address {
    display: none !important;
  }

  /* Align contact list with the head/photo */
  .tx-ttaddress .tt-contact,
  .tx-ttaddress .tt-contact ul {
    margin-left: 0 !important;
    padding-left: 0 !important;
    list-style: none !important;
  }

  .tx-ttaddress .tt-contact li {
    margin: 0 !important;
    line-height: 1.25;
  }

  .tx-ttaddress .tt-contact a[href^="tel"],
  .tx-ttaddress .tt-contact span[itemprop="telephone"] {
    white-space: nowrap;
  }

  /* Row 3 left: photo */
  .tx-ttaddress .teaser__media {
    grid-column: 1 !important;
    grid-row: 3 !important;
    width: var(--tt-photo-w) !important;
    height: var(--tt-photo-h) !important;
    margin: 0 !important;
    overflow: hidden;
    border-radius: var(--tt-photo-radius) !important;
    justify-self: start;
    align-self: start;
  }

  .tx-ttaddress .teaser__media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: 50% 20%;
    border-radius: inherit !important;
  }

  /* Row 3 right: mobile address clone */
  .tx-ttaddress .tt-address-mobile {
    /* Vertikal zentriert neben dem Bild */
    display: flex !important;
    flex-direction: column;
    justify-content: center; /* Mitte Block = Mitte Bild */
    grid-column: 2 !important;
    grid-row: 3 !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    min-height: var(--tt-photo-h); /* gleiche Höhe wie Bild für exakte Zentrierung */
    align-self: stretch;
  }

  .tx-ttaddress .tt-address-mobile,
  .tx-ttaddress .tt-address-mobile * {
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-indent: 0 !important;
  }

  .tx-ttaddress .tt-address-mobile address {
    margin: 0 !important;
  }

  /* ensure content spans full grid width (no extra offset) */
  .teaser__list .teaser__item .teaser__content {
    margin-left: 0rem !important;
    width: auto !important;
  }

  /* icon-only email link — mobil: Icon ein, Text aus */
  /* Mobil: Text aus, Icon sichtbar (auch ohne Wrapper) */
  .tx-ttaddress .contact-email .email-link .email-text,
  .contact-email .email-link .email-text { display: none !important; }
  .tx-ttaddress .contact-email .email-link .email-icon,
  .tx-ttaddress .contact-email svg,
  .contact-email .email-link .email-icon,
  .contact-email .email-link .email-icon svg,
  .contact-email .email-link svg { 
    display: inline-block !important;        
    line-height: 1.25;            
    margin-left: .35rem;
    vertical-align: text-bottom;  
    width: 20px; height: 20px;
    position: relative; top: 1px; 
    shape-rendering: crispEdges;
  }
}