/* GTGF v17.30 — screenshot-driven mobile visual repair.
 * Focus: working mobile menu, event-card action layout, Tour for Life mobile hero,
 * and dark-card readability in Knowledge articles.
 */

/* -------------------------------------------------------------------------
 * 1. MOBILE HEADER MENU
 * v17.25 shell CSS intentionally hides both toggle and panel. The mobile layer
 * restores the toggle, but the opened panel could remain display:none. Make the
 * hidden attribute the only source of visibility truth on mobile.
 * ---------------------------------------------------------------------- */
@media (max-width:1020px){
  html body.gtgf-v14.gtgf-v1730-mobile-repair .v14-site-header .v14-mobile-toggle{
    display:grid!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    position:relative!important;
    z-index:10070!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair .v14-site-header .v14-mobile-menu[hidden]{
    display:none!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair .v14-site-header .v14-mobile-menu:not([hidden]){
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  html.v14-menu-open,
  html.v14-menu-open body.gtgf-v14{
    overflow:hidden!important;
  }
}

/* -------------------------------------------------------------------------
 * 2. EVENTS — MOBILE ACTION LAYOUT
 * Older event layers define grid columns while the action container remains flex.
 * Rebuild only the mobile card action zone as an explicit grid.
 * ---------------------------------------------------------------------- */
@media (max-width:760px){
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1587-event-row{
    overflow:hidden!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1587-event-row .v1596-event-actions.v1587-event-actions{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    grid-auto-flow:row!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    padding:12px 14px 8px!important;
    margin:0!important;
    overflow:visible!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions > *{
    position:static!important;
    inset:auto!important;
    float:none!important;
    transform:none!important;
    margin:0!important;
    min-width:0!important;
    max-width:none!important;
    z-index:auto!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1596-row-community{
    grid-column:1/-1!important;
    width:100%!important;
    min-height:40px!important;
    padding:0 2px 8px!important;
    border:0!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1596-inline-attendance,
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1596-inline-login{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    height:48px!important;
    min-height:48px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    background:#181a18!important;
    color:#f7f7f4!important;
    -webkit-text-fill-color:#f7f7f4!important;
    border-radius:0!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1596-inline-attendance button{
    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:46px!important;
    padding:0 10px!important;
    background:transparent!important;
    color:#f7f7f4!important;
    -webkit-text-fill-color:#f7f7f4!important;
    border:0!important;
    font-size:.68rem!important;
    line-height:1.1!important;
    white-space:normal!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1596-event-view{
    grid-column:2!important;
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    padding:0 10px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    background:#0d0f0d!important;
    color:#f7f7f4!important;
    -webkit-text-fill-color:#f7f7f4!important;
    font-size:.68rem!important;
    line-height:1.1!important;
    white-space:normal!important;
    text-align:center!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1587-event-plan{
    grid-column:1/-1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:50px!important;
    padding:0 16px!important;
    border:1px solid #ff5a00!important;
    border-radius:0!important;
    background:#ff5a00!important;
    color:#101210!important;
    -webkit-text-fill-color:#101210!important;
    font-size:.72rem!important;
    font-weight:950!important;
    line-height:1.1!important;
    letter-spacing:.075em!important;
    text-align:center!important;
    text-transform:uppercase!important;
    white-space:normal!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1587-event-plan::after{
    display:none!important;
    content:none!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1587-event-more{
    grid-column:1/-1!important;
    width:100%!important;
    border:0!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions .v1587-event-more>summary{
    min-height:44px!important;
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    padding:8px 2px!important;
    color:#d8ddd7!important;
    -webkit-text-fill-color:#d8ddd7!important;
  }
}

/* On very narrow screens use one action per row: no cramped labels. */
@media (max-width:390px){
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1587-event-row .v1596-event-actions.v1587-event-actions{
    grid-template-columns:1fr!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1596-event-actions :is(.v1596-inline-attendance,.v1596-inline-login,.v1596-event-view,.v1587-event-plan,.v1587-event-more,.v1596-row-community){
    grid-column:1!important;
  }
}

/* -------------------------------------------------------------------------
 * 3. TOUR FOR LIFE FEATURED HERO — MOBILE WIDTH / WORD WRAP
 * Old high-specificity event layers can keep the desktop two-column sizing.
 * Mobile should be a single readable flow over the photo.
 * ---------------------------------------------------------------------- */
@media (max-width:760px){
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__hero{
    min-width:0!important;
    overflow:hidden!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__overlay{
    display:block!important;
    grid-template-columns:none!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:0!important;
    padding:18px!important;
    overflow:visible!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__content{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    padding:18px!important;
    margin:0!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__content h2{
    width:auto!important;
    max-width:10.5ch!important;
    min-width:0!important;
    margin:10px 0 16px!important;
    font-size:clamp(2.75rem,13vw,4rem)!important;
    line-height:.88!important;
    letter-spacing:-.055em!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
    text-wrap:balance!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__content h2 span{
    display:inline!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__lead{
    width:100%!important;
    max-width:30ch!important;
    min-width:0!important;
    margin:0 0 18px!important;
    font-size:1rem!important;
    line-height:1.55!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__facts{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content .v1665-tour-life__mini-card{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:14px 0 0!important;
    transform:none!important;
  }
}

/* -------------------------------------------------------------------------
 * 4. KNOWLEDGE ARTICLE — DARK CARD CONTENT
 * Article-wide rules can correctly turn normal content dark, but must not reach
 * the two intentionally dark editorial cards.
 * ---------------------------------------------------------------------- */
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v151-learning-goal{
  color:#f7f6f2!important;
  -webkit-text-fill-color:#f7f6f2!important;
}
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v151-learning-goal>span{
  color:#ff8240!important;
  -webkit-text-fill-color:#ff8240!important;
  opacity:1!important;
}
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v151-learning-goal>strong{
  display:block!important;
  color:#f7f6f2!important;
  -webkit-text-fill-color:#f7f6f2!important;
  opacity:1!important;
  visibility:visible!important;
}
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v157-evidence-card{
  color:#f7f6f2!important;
  -webkit-text-fill-color:#f7f6f2!important;
}
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v157-evidence-card>span{
  color:#ff8240!important;
  -webkit-text-fill-color:#ff8240!important;
  opacity:1!important;
}
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v157-evidence-card>strong{
  color:#f7f6f2!important;
  -webkit-text-fill-color:#f7f6f2!important;
  opacity:1!important;
}
html body.gtgf-v14.gtgf-v1730-mobile-repair #main-content.v1696-article-page .v159975-article-content .v157-evidence-card>p{
  color:#d6dbd5!important;
  -webkit-text-fill-color:#d6dbd5!important;
  opacity:1!important;
}

@media (max-width:1020px){
  html body.gtgf-v14.gtgf-v1730-mobile-repair .v14-mobile-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)!important}
  html body.gtgf-v14.gtgf-v1730-mobile-repair .v14-mobile-toggle[aria-expanded="true"] span:nth-child(2){opacity:0!important}
  html body.gtgf-v14.gtgf-v1730-mobile-repair .v14-mobile-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)!important}
}