/*
 * Taça das Peladinhas — v42 mobile refinement (presentation only).
 * Patch over the published v41. IDs, backend, JavaScript and database untouched.
 */

/* Finos heading: always anchored to the left, including the overline. */
#public-content #taca-dos-finos > .section-head {
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  text-align:left!important;
  width:100%!important;
  min-width:0!important;
  padding:17px 0 0 2px!important;
  margin:0 0 12px!important;
}
#public-content #taca-dos-finos > .section-head::before {
  left:2px!important;
  right:auto!important;
  top:0!important;
  text-align:left!important;
  white-space:nowrap;
}
#public-content #taca-dos-finos > .section-head > div {
  width:100%;
  min-width:0;
  margin:0!important;
  padding:0!important;
  text-align:left!important;
}
#public-content #taca-dos-finos > .section-head h2 {
  display:block!important;
  width:100%;
  margin:5px 0 0!important;
  text-align:left!important;
  line-height:1.12!important;
}
#public-content .dual-trophy-section,
#public-content #fan-league,
#public-content #classificacao {
  min-width:0;
  max-width:100%;
}

/* Consistent card edges and restrained contrast, matching the v41 visual direction. */
#public-content .stats-card,
#public-content .team-grid .team-card,
#public-content #schedule .match-card {
  border-color:#344151!important;
}
#public-content #schedule .match-card:focus-within,
#public-content .team-grid .team-card:focus-within {
  border-color:#b99446!important;
}
#public-content #fan-league .fan-league-head > div {text-align:left!important}
#public-content #fan-league .fan-league-head h3,
#public-content #fan-league .fan-league-description {text-align:left!important}

@media (max-width:800px) {
  html,body {max-width:100%}
  body:not(.admin-body) .header {
    border-bottom-color:#2e3947!important;
    box-shadow:0 7px 18px rgba(0,0,0,.20)!important;
  }
  body:not(.admin-body) .header .header-content {
    padding:9px 12px 10px!important;
    gap:2px!important;
    max-width:100%;
  }
  body:not(.admin-body) .header .brand {
    width:auto;
    max-width:100%;
    justify-content:center!important;
    margin:0 auto!important;
    gap:8px!important;
  }
  body:not(.admin-body) .header .brandlogo {
    width:43px!important;
    height:43px!important;
    min-width:43px!important;
  }
  body:not(.admin-body) .header .brand-lettering {
    width:min(220px,63vw)!important;
    max-width:min(220px,63vw)!important;
    height:auto!important;
  }
  body:not(.admin-body) .header-event {
    font-size:9px!important;
    line-height:1.35!important;
    padding:4px 0 0!important;
    color:#abb8c7!important;
    gap:8px!important;
  }
  body:not(.admin-body)>.page {
    padding:0 13px 42px!important;
    width:100%;
    max-width:100%;
  }
  #public-content #jogo-destaque.live-feature-section {
    margin:13px 0 21px!important;
  }
  #public-content #jogo-destaque #live-feature {
    border-radius:13px!important;
    box-shadow:0 8px 24px rgba(0,0,0,.25)!important;
  }
  #jogo-destaque .feature-main {margin:12px auto 12px!important}
  #public-content .dual-trophies {gap:13px!important}
  #public-content .dual-trophy-section > .section-head {
    max-width:100%!important;
  }
  #public-content #classificacao > .competition-section-head {
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:8px 10px!important;
    margin:0 0 12px!important;
  }
  #public-content #classificacao > .competition-section-head > div:first-child {min-width:0}
  #public-content #classificacao .competition-switch {
    margin:0 0 0 auto!important;
    padding:3px!important;
  }
  #public-content #classificacao .competition-switch-btn {
    min-height:34px!important;
    padding:7px 9px!important;
    font-size:11px!important;
  }
  #public-content #classificacao .competition-section-head h2 {
    font-size:clamp(20px,5.5vw,24px)!important;
    line-height:1.12!important;
    margin-top:2px!important;
  }
  #public-content #taca-dos-finos > .section-head {
    margin:3px 0 11px!important;
    min-height:50px!important;
    padding:17px 0 0 2px!important;
  }
  #public-content #taca-dos-finos > .section-head h2 {
    font-size:24px!important;
    margin-top:4px!important;
  }
  #public-content .standings-focus,
  #public-content .fan-league-box {
    border-radius:13px!important;
    box-shadow:0 7px 22px rgba(0,0,0,.19)!important;
  }
  #public-content .standings-focus .table-share {
    gap:7px!important;
    padding:9px 11px!important;
    background:#17212b!important;
  }
  #public-content [data-share-standings] {
    margin-left:auto!important;
    min-height:34px!important;
    white-space:nowrap;
    padding:7px 10px!important;
  }
  #public-content #full-standing .table-wrap,
  #public-content #full-standing-extra .table-wrap {
    width:100%;
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  #public-content #full-standing .league-table {width:100%!important}
  #public-content #full-standing .league-table .team-column {
    min-width:135px!important;
    text-align:left!important;
  }
  #public-content #full-standing .team-cell {gap:7px!important}
  #public-content #full-standing .team-logo-image {
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
  }
  #public-content #full-standing .league-table td {
    height:54px!important;
    padding:9px 6px!important;
  }
  #public-content #full-standing .league-table td.team-column {
    white-space:normal!important;
    overflow-wrap:break-word;
    line-height:1.2!important;
  }
  #public-content #full-standing .position {
    width:25px!important;height:27px!important;
    font-size:14px!important;
  }
  #public-content #full-standing .points {font-size:15px!important}
  #public-content #fan-league .fan-league-head {
    min-height:130px!important;
    padding:17px 15px!important;
    background-position:center,right center!important;
    border-radius:12px 12px 0 0!important;
  }
  #public-content #fan-league .fan-league-head > div {
    width:calc(100% - 79px)!important;
    max-width:calc(100% - 79px)!important;
    min-width:0!important;
  }
  #public-content #fan-league .fan-league-head h3 {
    font-size:15px!important;
    max-width:100%!important;
    line-height:1.24!important;
    overflow-wrap:break-word;
  }
  #public-content #fan-league .fan-league-description {
    margin-top:7px!important;
    font-size:10.5px!important;
    line-height:1.4!important;
  }
  #public-content #fan-league .fan-league-list {
    padding:3px 14px!important;
  }
  #public-content #fan-league .fan-league-row {
    min-height:53px!important;
    padding:10px 0!important;
    align-items:center!important;
  }
  #public-content #fan-league .fan-team-link {min-width:0!important}
  #public-content #fan-league .fan-team-link strong {
    line-height:1.25!important;
    overflow-wrap:break-word;
  }
  #public-content #calendario {
    margin-top:19px!important;
    padding:16px 14px 18px!important;
    border-radius:13px!important;
  }
  #public-content #calendario > .section-head {
    padding-bottom:12px!important;
    margin-bottom:13px!important;
    border-bottom-color:#665629!important;
  }
  #public-content #schedule .match-card {
    border-radius:11px!important;
    padding:14px 12px 13px!important;
  }
  #public-content #schedule .match-grid {gap:11px!important}
  #public-content .stats-duo-grid {gap:12px!important}
  #public-content .stats-card-head {padding:16px 15px!important}
  #public-content .team-grid {gap:10px!important}
  #public-content .team-grid .team-card {
    border-radius:11px!important;
    padding:14px 13px!important;
    gap:13px!important;
    min-width:0;
  }
  #public-content .team-grid .team-card strong {
    font-size:clamp(16px,4.5vw,20px)!important;
    line-height:1.2!important;
    overflow-wrap:break-word;
  }
  #public-content .phase-preview > summary {padding:15px 16px!important}
  #public-content .footer {font-size:11px;line-height:1.5}
}

@media (max-width:390px) {
  body:not(.admin-body)>.page {padding-inline:11px!important}
  #public-content #classificacao > .competition-section-head {gap:7px!important}
  #public-content #classificacao .competition-switch-btn {
    font-size:10px!important;
    padding-inline:7px!important;
  }
  #public-content #classificacao .competition-section-head h2 {font-size:21px!important}
  #public-content .standings-focus .table-share .fine {font-size:10px!important}
  #public-content #full-standing .league-table .team-column {min-width:123px!important}
  #public-content #full-standing .league-table td {font-size:10.5px!important;padding:8px 4px!important}
  #public-content #full-standing .team-cell {gap:5px!important}
  #public-content #fan-league .fan-league-head {padding:15px 12px!important}
  #public-content #fan-league .fan-league-head > div {
    width:calc(100% - 69px)!important;
    max-width:calc(100% - 69px)!important;
  }
  #public-content #fan-league .fan-league-head h3 {font-size:14px!important}
  #public-content #fan-league .fan-league-description {font-size:10px!important}
  #public-content #schedule .match-team .team-logo-image {width:39px!important;height:39px!important}
  #public-content #schedule .match-score {min-width:60px!important;font-size:25px!important}
}

@media (max-width:350px) {
  #public-content #classificacao > .competition-section-head {
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  #public-content #classificacao .competition-switch {margin-left:0!important}
  #public-content #fan-league .fan-league-head {
    background-position:center,75% center!important;
  }
}

@media (prefers-reduced-motion:reduce) {
  #public-content #schedule .match-card,
  #public-content .team-grid .team-card {transition:none!important}
}
