/* Original navigation, without the test toolbar and its reserved space. */
:root{--demo-bar-height:0px!important}


/* Dashboard match cards — NEXT final layout overrides.
   This stylesheet loads after usb-app CSS, so these rules are authoritative. */
.match-tiles{
  align-items:start !important;
}
.match-tiles > .match-tile{
  height:auto !important;
  min-height:0 !important;
  align-self:start !important;
}
.match-tiles > .match-tile.expanded{
  grid-column:1 / -1 !important;
  width:100% !important;
  height:auto !important;
  align-self:start !important;
}
/* On an opened full-width card, keep the green date rail proportional instead
   of letting the content create an awkward narrow column impression. */
.match-tiles > .match-tile.expanded .mt-detail{
  padding-right:24px;
}
.match-tiles > .match-tile.expanded .mt-detail-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.mt-photos-link{
  display:inline-flex;
  align-items:center;
  gap:3px;
  font-size:11px;
  color:#1877f2;
  font-weight:600;
  background:rgba(24,119,242,.08);
  padding:2px 7px;
  border-radius:6px;
  margin-left:6px;
  text-decoration:none;
  position:relative;
  z-index:3;
}
.mt-photos-link:hover{
  text-decoration:underline;
  background:rgba(24,119,242,.14);
}
@media(max-width:540px){
  .match-tiles > .match-tile.expanded{
    grid-column:1 !important;
  }
  .match-tiles > .match-tile.expanded .mt-detail-grid{
    grid-template-columns:1fr;
  }
}


/* Natural height: names, meeting times and training notes must never be clipped. */
.match-tiles > .match-tile:not(.expanded){
  height:auto !important;
  min-height:164px !important;
  max-height:none !important;
  overflow:hidden !important;
}
.match-tiles > .match-tile:not(.expanded) .mt-top{
  min-height:68px;
  flex:0 0 68px;
}
.match-tiles > .match-tile:not(.expanded) .mt-body{
  flex:0 0 auto;
  min-height:min-content;
  justify-content:center;
  padding-top:7px;
  padding-bottom:7px;
}
.match-tiles > .match-tile:not(.expanded) .mt-vs{
  display:flex;
  overflow:visible;
  line-height:1.3;
  max-height:none;
}
.match-tiles > .match-tile:not(.expanded) .mt-subline{
  white-space:normal;
  overflow:visible;
  overflow-wrap:anywhere;
}

/* Le pied ne doit plus utiliser de positionnement absolu :
   Photos, Dom/Ext et chevron restent tous réellement cliquables/visibles. */
.match-tiles .mt-foot{
  min-height:34px;
  padding-top:4px;
  padding-bottom:8px;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  position:relative !important;
}
.match-tiles .mt-domext-tag{
  position:static !important;
  left:auto !important;
  transform:none !important;
  flex:0 0 auto;
}
.match-tiles .mt-photos-link{
  position:relative !important;
  z-index:10 !important;
  pointer-events:auto !important;
  flex:0 0 auto;
  margin-left:0 !important;
  cursor:pointer;
}
.match-tiles .mt-chevron{
  position:absolute;
  right:12px;
  margin-left:0 !important;
}

/* Une carte ouverte repasse en hauteur naturelle et pleine largeur. */
.match-tiles > .match-tile.expanded{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}
.match-tiles > .match-tile.expanded .mt-vs{
  display:flex;
  max-height:none;
  overflow:visible;
}

@media(max-width:540px){
  .match-tiles > .match-tile:not(.expanded){
    min-height:158px !important;
  }
}

.match-tiles > .match-tile{min-width:0;box-sizing:border-box}
.match-tiles .mt-body,.match-tiles .mt-detail-grid > div{min-width:0;overflow-wrap:anywhere}
.match-tiles .mt-topright{max-width:100%;box-sizing:border-box;white-space:normal;text-align:center}
.match-tiles .mt-foot{flex:0 0 auto;flex-wrap:wrap;padding-bottom:8px}
.match-tiles .mt-toggle{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:44px;padding:8px 10px;border:1px solid #d5e4da;border-radius:8px;
  background:#f3f8f4;color:#194c35;font-family:inherit;font-size:12px;font-weight:600;line-height:1.2;cursor:pointer;
  touch-action:manipulation;
}
.match-tiles .mt-toggle:focus-visible{outline:3px solid #5d9c73;outline-offset:2px}
.match-tiles .mt-toggle .mt-chevron{position:static}
.match-tiles > .training-tile{cursor:default}
@media(max-width:540px){
  .match-tiles{grid-template-columns:minmax(0,1fr)}
  .match-tiles .mt-topright.mt-time-entr{font-size:clamp(12px,3.7vw,15px);padding:6px}
  .match-tiles > .match-tile.expanded .mt-detail{padding-right:12px}
}
@media(hover:none){.match-tiles > .match-tile:hover{transform:none}}


/* Burger mobile NEXT — gabarit unique et correction du shell restauré.
   Le shell rapide posait display:block!important sur Mon espace / Mes équipes,
   ce qui cassait le flex mobile et empilait icône, texte et chevron. */
@media(max-width:760px){
  html[data-usb-ui-shell="1"] body #navLinks #nav-inscription,
  html[data-usb-ui-shell="1"][data-usb-has-team="1"] body #navLinks #nav-mon-equipe-link{
    display:flex !important;
  }

  #navLinks .nav-list-wrap{
    width:100%;
    box-sizing:border-box;
    padding:10px 12px !important;
    gap:4px !important;
  }

  #navLinks a.nav-card{
    display:flex;
    align-items:center !important;
    gap:12px !important;
    width:100% !important;
    min-height:64px !important;
    height:64px !important;
    box-sizing:border-box !important;
    padding:10px 12px !important;
    margin:0 !important;
    border-radius:10px !important;
  }

  #navLinks a.nav-card.active{
    min-height:64px !important;
    height:64px !important;
  }

  #navLinks .nav-card-icon{
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
  }

  #navLinks .nav-card-text{
    flex:1 1 auto !important;
    min-width:0 !important;
    display:block !important;
  }

  #navLinks .nav-card-title{
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    flex-wrap:wrap !important;
    line-height:1.2 !important;
  }

  #navLinks .nav-card-sub{
    display:block !important;
    margin-top:3px !important;
    line-height:1.2 !important;
  }

  #navLinks .nav-card-arrow{
    display:block !important;
    flex:0 0 auto !important;
    margin-left:auto !important;
    align-self:center !important;
    line-height:1 !important;
  }

  #navLinks .nav-welcome{
    box-sizing:border-box;
  }
}

/* Same-team invitations, scoped to a single match. */
.usb-match-selection{box-sizing:border-box;width:min(520px,calc(100% - 28px));max-height:85dvh;overflow:auto;border:1px solid #dce5dc;border-radius:18px;padding:24px;color:var(--vert,#194c35);background:#fff;font-family:inherit;box-shadow:0 20px 70px #123c3026}
.usb-match-selection::backdrop{background:#102a2366}
.usb-match-selection header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.usb-match-selection h2{font-size:20px;margin:0}
.usb-match-selection-event{font-weight:600;margin:14px 0}
.usb-match-selection-help{font-size:13px;line-height:1.5;color:#617568}
.usb-match-selection-count{font-size:13px;font-weight:700;margin:20px 0 8px}
.usb-match-player{display:flex;align-items:center;gap:12px;padding:12px 6px;border-bottom:1px solid #edf1eb;cursor:pointer;min-height:48px;box-sizing:border-box}
.usb-match-player input{width:21px;height:21px;flex:0 0 auto;accent-color:#194c35;cursor:pointer}
.usb-match-player span{flex:1;min-width:0;font-size:14px;overflow-wrap:anywhere}
.usb-match-player small{font-size:12px;color:#748078;white-space:nowrap}
.usb-match-player small[data-invited="true"]{color:#237a48}
.usb-match-player:has(input:disabled){cursor:default;opacity:.7}
.usb-match-selection-status{min-height:20px;font-size:13px;color:#237a48}
.usb-match-selection-status[data-state="error"]{color:#b3261e}
@media(max-width:440px){.usb-match-selection{padding:18px}.usb-match-selection h2{font-size:18px}.usb-match-player{gap:9px}}