/* =========================================================
   MSSL v2 Styling
   Namespace: mssl2-*
   ========================================================= */

.mssl2-wrap{
  max-width: 1100px;
  margin: 0 auto;
  padding: 22px 16px 40px;
}

.mssl2-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap:16px;
}

@media (min-width: 920px){
  .mssl2-grid--top{
	grid-template-columns: 1.25fr .75fr;
	align-items: start;
  }
  .mssl2-grid--mid{
	grid-template-columns: 1fr;
  }
}

.mssl2-card{
  background:#fff;
  border:1px solid rgba(35,31,32,.16);
  border-radius:14px;
  box-shadow: 0 10px 24px rgba(35,31,32,.07);
  overflow:hidden;
}

.mssl2-card__hd{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:52px;
  padding:13px 16px;
  border-bottom:0;
  background: linear-gradient(135deg, #275e96 0%, #17466f 100%);
}

.mssl2-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-family: "Outfit", sans-serif;
  letter-spacing:.05em;
  font-weight:600; /* lighter per request */
  margin:0;
  font-size: 16px;
  text-transform: uppercase;
  color:#fff;
}

.mssl2-title-b{
  display:flex;
  align-items:center;
  gap:10px;
  font-family: "Outfit", sans-serif;
  letter-spacing:.04em;
  font-weight:300; /* lighter per request */
  margin:0;
  font-size: 18px;
  text-transform: uppercase;
  color:#231f20;
}

.mssl2-ico{
  display:inline-block;
  width:18px;
  text-align:center;
}

.mssl2-card__hd .mssl2-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:999px;
  background:rgba(255,255,255,.16);
}

.mssl2-ico::before{
  font-family: "Font Awesome 7 Pro", "Font Awesome 7 Free";
  font-weight:900;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  speak:never;
  content:"";
}
.mssl2-ico[data-ico="team"]::before{ content:"\e6d7"; }
.mssl2-ico[data-ico="current-registrations"]::before{ content:"\e784"; }
.mssl2-ico[data-ico="pay"]::before{ content:"\f09d"; }
.mssl2-ico[data-ico="payment-history"]::before{ content:"\f873"; }
.mssl2-ico[data-ico="league-credit"]::before{ content:"\f657"; }
.mssl2-ico[data-ico="schedule"]::before{ content:"\f073"; }
.mssl2-ico[data-ico="upcoming-games"]::before{ content:"\e0d2"; }
.mssl2-ico[data-ico="profile-photo"]::before{ content:"\f030"; }
.mssl2-ico[data-ico="account-information"]::before{ content:"\f7f3"; }
.mssl2-ico[data-ico="billing-information"]::before{ content:"\f53c"; }
.mssl2-ico[data-ico="password"]::before{ content:"\f084"; }
.mssl2-ico[data-ico="waiver"]::before{ content:"\f56c"; }
.mssl2-ico[data-ico="waiver-status"]::before{ content:"\f274"; }
.mssl2-ico[data-ico="waiver-alert"]::before{ content:"\e46e"; }
.mssl2-ico[data-ico="tools"]::before{ content:"\e533"; }
.mssl2-ico[data-ico="phone"]::before{ content:"\f3cd"; }
.mssl2-ico[data-ico="email"]::before{ content:"\e10c"; }
.mssl2-ico[data-ico="contact-message"]::before{ content:"\e1d8"; }
.mssl2-ico[data-ico="x"]::before{ content:"\f00d"; }
.mssl2-ico[data-ico="download"]::before{ content:"\f56f"; }
.mssl2-ico[data-ico="users"]::before{ content:"\f00d"; }
.mssl2-ico[data-ico="plus"]::before{ content:"\e7ab"; }
.mssl2-ico[data-ico="search"]::before{ content:"\f002"; }
.mssl2-ico[data-ico="play-on"]::before{ content:"\f70c"; }
.mssl2-ico[data-ico="free-agent"]::before{ content:"\f2bd"; }
.mssl2-ico[data-ico="status"]::before{ content:"\f14a"; }
.mssl2-ico[data-ico="registration-choice"]::before{ content:"\e6d7"; }
.mssl2-ico[data-ico="registration-info"]::before{ content:"\f2bd"; }
.mssl2-ico[data-ico="registration-league"]::before{ content:"\f433"; }
.mssl2-ico[data-ico="registration-free-agent-details"]::before{ content:"\f70c"; }
.mssl2-ico[data-ico="registration-team-details"]::before{ content:"\e533"; }
.mssl2-ico[data-ico="registration-agreement"]::before{ content:"\f56c"; }

.mssl2-card__bd{
  padding: 14px 16px;
  background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
}

.mssl2-kv{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:10px;
  padding:8px 0;
}
.mssl2-kv + .mssl2-kv{ border-top:1px dashed rgba(0,0,0,.10); }

.mssl2-k{ color: rgba(0,0,0,.65); font-size:15px; }
.mssl2-v{ color: rgba(0,0,0,.85); font-weight:600; font-size:15px; }

.mssl2-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.mssl2-pill--good{ background: rgba(46,125,50,.12); color:#2e7d32; }
.mssl2-pill--bad{ background: rgba(183,28,28,.10); color:#b71c1c; }
.mssl2-pill--info{ background: rgba(24,98,175,.12); color:#1a63af; }

.mssl2-wrap--payments .woocommerce-notices-wrapper{
  margin-bottom: 16px;
}

.mssl2-wrap--payments .woocommerce-message,
.mssl2-wrap--payments .woocommerce-info,
.mssl2-wrap--payments .woocommerce-error{
  border: 1px solid #231f20;
  border-radius: 12px;
  background: rgba(255,255,255,.92);
  color: #231f20;
  box-shadow: none;
}

.mssl2-accountTable{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #231f20;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

.mssl2-accountTable thead th{
  background: #f5f7fa;
  color: #231f20;
  font-family: "Outfit", sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(35,31,32,.14);
}

.mssl2-accountTable tbody th,
.mssl2-accountTable tbody td{
  padding: 14px;
  font-size: 14px;
  color: rgba(0,0,0,.82);
  border-bottom: 1px solid rgba(35,31,32,.10);
  background: #fff;
  vertical-align: middle;
}

.mssl2-accountTable tbody tr:last-child th,
.mssl2-accountTable tbody tr:last-child td{
  border-bottom: 0;
}

.mssl2-accountTable a{
  color: #1a63af;
  text-decoration: none;
}

.mssl2-accountTable a:hover{
  color: #0b4a75;
}

.mssl2-accountTable .button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 12px;
  border: 0;
  border-radius: 10px;
  background: #275e96;
  color: #fff;
  font-family: "Outfit", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  text-decoration: none !important;
  text-transform: uppercase;
  box-shadow: none;
}

.mssl2-accountTable .button:hover{
  background: #231f20;
  color: #fff;
}

.mssl2-upcomingDateMobile{
  display: none;
}

.mssl2-upcomingScheduleActionHead,
.mssl2-upcomingScheduleActionCell{
  width: 56px;
  text-align: center;
}

.mssl2-upcomingScheduleLink{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  text-decoration: none !important;
}

.mssl2-upcomingScheduleLink--mobile{
  display: none;
  margin-left: 8px;
  vertical-align: middle;
}

.mssl2-accountPagination{
  margin-top: 14px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.mssl2-accountPagination .button{
  text-decoration: none !important;
}

@media (max-width: 767px){
  .mssl2-accountAvatarPanel{
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .mssl2-accountHero__main{
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .mssl2-accountTable thead{
    display: none;
  }

  .mssl2-accountTable,
  .mssl2-accountTable tbody,
  .mssl2-accountTable tr,
  .mssl2-accountTable th,
  .mssl2-accountTable td{
    display: block;
    width: 100%;
  }

  .mssl2-accountTable{
    border: 0;
    background: transparent;
  }

  .mssl2-accountTable tr{
    border: 1px solid #231f20;
    border-radius: 12px;
    background: #fff;
    margin-bottom: 12px;
    overflow: hidden;
  }

  .mssl2-accountTable tbody th,
  .mssl2-accountTable tbody td{
    border-bottom: 1px solid rgba(35,31,32,.08);
  }

  .mssl2-accountTable tbody tr:last-child td:last-child,
  .mssl2-accountTable tbody tr:last-child th:last-child{
    border-bottom: 0;
  }

  .mssl2-accountTable--upcoming .mssl2-upcomingDateDesktop{
    display: none;
  }

  .mssl2-accountTable--upcoming .mssl2-upcomingDateMobile{
    display: inline;
    font-weight: 600;
  }

  .mssl2-accountTable--upcoming .mssl2-upcomingTimeCell{
    display: none;
  }

  .mssl2-accountTable--upcoming .mssl2-upcomingFacilityCell{
    display: none;
  }

  .mssl2-accountTable--upcoming .mssl2-upcomingScheduleActionHead,
  .mssl2-accountTable--upcoming .mssl2-upcomingScheduleActionCell{
    display: none;
  }

  .mssl2-accountTable--upcoming .mssl2-upcomingScheduleLink--mobile{
    display: inline-flex;
  }
}

.mssl2-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 14px;
  border-radius:12px;
  border:0;
  cursor:pointer;
  font-weight:400;
  letter-spacing:.03em;
  text-decoration:none !important;
  white-space:nowrap;
}
.mssl2-btn:link,.mssl2-btn:visited{ color:#fff; }

.mssl2-btn--blue{ 
	background:#1a63af; 
	color:#fff !important; 
	font-family: "Outfit", sans-serif;
    font-weight: 700;
	font-size: 20px;
	text-transform: uppercase;
}

.mssl2-btn--blue:hover{ background: #231f20; }

.mssl2-btn--danger{ 
	background:#8b2d2d; 
	color:#fff !important; 
	font-family: "Outfit", sans-serif;
	font-size: 20px;
	text-transform: uppercase;
}

.mssl2-btn--danger:hover{ filter:brightness(.95) !important; }

.mssl2-btn--good{ 
  background:#2e7d32; 
  color:#fff !important; 
  font-family: "Outfit", sans-serif;
  font-size: 20px;
  text-transform: uppercase;
}

.mssl2-btn--good:hover{ filter:brightness(.95) !important; }

.mssl2-btn--ghost{
  background: rgba(24,98,175,.08);
  color:#1a63af !important;
  border:1px solid rgba(24,98,175,.28);
}
.mssl2-btn--ghost:hover{ background: rgba(24,98,175,.12) !important; }

.mssl2-btn--wide{ width:100%; }

.mssl2-input{
  width:100%;
  padding:12px 12px;
  border:1px solid rgba(0,0,0,.15);
  border-radius:12px;
  font-weight:700;
  text-align:center;
}

.mssl2-actions{
  display:grid;
  grid-template-columns: 1fr;
  gap:10px;
  margin-top:12px;
}

.mssl2-actions--2{
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 480px){
  .mssl2-actions--2{ grid-template-columns: 1fr; }
}

.mssl2-note{
  margin-top:10px;
  color: rgba(0,0,0,.65);
  font-size:15px;
  line-height:1.35;
}

.mssl2-headerCard .mssl2-card__bd{
  display:grid;
  gap:10px;
}

.mssl2-accountAvatarPanel{
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: 88px minmax(0, 1fr);
}

.mssl2-accountAvatarPreview{
  align-items: center;
  background: rgba(39,94,150,.08);
  border: 1px solid rgba(35,31,32,.12);
  border-radius: 999px;
  display: flex;
  height: 88px;
  justify-content: center;
  overflow: visible;
  position: relative;
  width: 88px;
}

.mssl2-accountAvatarImage{
  border-radius: 999px;
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.mssl2-accountAvatarFallback{
  align-items: center;
  background: rgba(39,94,150,.08);
  border-radius: 999px;
  color: #275e96;
  display: flex;
  font-family: "Outfit", sans-serif;
  font-size: 32px;
  font-weight: 700;
  height: 100%;
  justify-content: center;
  line-height: 1;
  text-transform: uppercase;
  width: 100%;
}

.mssl2-accountAvatarMeta{
  display: grid;
  gap: 8px;
}

.mssl2-accountAvatarMeta label{
  color: #231f20;
  font-family: "Outfit", sans-serif;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.mssl2-accountAvatarMeta input[type="file"]{
  max-width: 100%;
}

.mssl2-accountHero__main{
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: 72px minmax(0, 1fr);
}

.mssl2-accountHero__avatar{
  height: 72px;
  width: 72px;
}

.mssl2-accountAvatarBadge{
  color: #c78a00;
  display: inline-flex;
  font-family: "Font Awesome 7 Pro", "Font Awesome 7 Free";
  font-size: 32px;
  font-weight: 900;
  line-height: 1;
  position: absolute;
  left: -8px;
  top: -18px;
  transform: rotate(-28deg);
  text-shadow: 0 2px 6px rgba(0,0,0,.18);
  z-index: 2;
}

.mssl2-accountAvatarBadge--champ::before{
  content: "\f521";
}

.mssl2-note--champ{
  color: #0b2238;
  font-family: "Outfit", sans-serif;
  font-weight: 700;
}
.mssl2-teamName{
  font-family: "Outfit", sans-serif;
  font-size:22px;
  letter-spacing:.02em;
  margin:0;
  color:#0b2238;
}
.mssl2-leagueLine{
  margin: 0px 0px !important;
  color: rgba(0,0,0,.70);
  font-size:14px;
}

/* =========================================================
   Roster + Payments Table (modern responsive)
   - Desktop: real table
   - Mobile: row cards
   ========================================================= */

.mssl2-tableWrap{ overflow:auto; }
.mssl2-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width: 760px;
}
.mssl2-table thead th{
  text-align:center;
  font-size:16px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color: rgba(255,255,255,.92);
  background:#1a63af;
  padding:12px 12px;
  position: sticky;
  top: 0;
  z-index: 1;
}
.mssl2-table thead .mssl2-tableTitle th{
  text-align:center;
  font-family: "Outfit", sans-serif;
  font-size:18px;
  font-weight: 500;
  padding:14px 12px;
  border-bottom: 3px solid #fff;
  border-radius: 14px;
}
.mssl2-table tbody td{
  padding:12px 7px;
  border-bottom:1px solid rgba(0,0,0,.08);
  vertical-align:top;
  font-size:14px;
}
.mssl2-table tbody tr:hover td{ background: rgba(24,98,175,.04); }

.mssl2-payCell{
  display:grid;
  gap:4px;
  font-size:13px;
}
.mssl2-payLine{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.mssl2-payLabel{ font-weight:800; letter-spacing:.04em; text-transform:uppercase; font-size:11px; }
.mssl2-payAmt{ font-weight:800; }
.mssl2-payCell.is-good .mssl2-payLabel{ color:#2e7d32; }
.mssl2-payCell.is-bad  .mssl2-payLabel{ color:#b71c1c; }
.mssl2-paySub{ color: rgba(0,0,0,.65); font-size:12px; }

.mssl2-removeBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:10px;
  border:1px solid rgba(183,28,28,.35);
  background: rgba(183,28,28,.08);
  color:#b71c1c;
  cursor:pointer;
}
.mssl2-removeBtn:hover{ background: rgba(183,28,28,.12); }

/* Mobile row cards */
@media (max-width: 860px){
  .mssl2-table{
	min-width: 0;
  }
  .mssl2-table thead{ display:none; }
  .mssl2-table, .mssl2-table tbody, .mssl2-table tr, .mssl2-table td{
	display:block;
	width:100%;
  }
  .mssl2-table tbody tr{
	border:1px solid rgba(0,0,0,.10);
	border-radius:14px;
	overflow:hidden;
	margin-bottom:12px;
	background:#fff;
	box-shadow: 0 6px 18px rgba(0,0,0,.06);
  }
  .mssl2-table tbody td{
	border-bottom:1px solid rgba(0,0,0,.08);
	padding:12px 12px;
  }
  .mssl2-table tbody td:last-child{ border-bottom:0; }

  .mssl2-mRow{
	display:grid;
	grid-template-columns: 22px 1fr;
	gap:10px;
	align-items:start;
  }
  .mssl2-mLabel{
	padding-top:2px;
  }
  .mssl2-mVal{
	font-weight:700;
	color: rgba(0,0,0,.82);
	word-break:break-word;
  }
  .mssl2-mSub{
	margin-top:4px;
	font-size:12px;
	font-weight:600;
	color: rgba(0,0,0,.65);
  }
  .mssl2-actionsCell{
	display:flex;
	justify-content:flex-end;
  }
}

.mssl2-roster-title{ display:none; }
  
  @media (max-width: 640px){
	.mssl2-roster-title{
	  display:block;
	  margin: 10px 0 8px;
	  font-family:"Outfit", sans-serif;
	  text-transform:uppercase;
	  text-align: center;
	  letter-spacing:.06em;
	  font-size:18px;
	  font-weight: 500;
	  background-color: #1a63af;
	  color: #fff;
	  border-radius: 3px;
	  padding: 10px 0px;
	}
  }
  
  .mssl2-paySepWrap{
	position: relative;
	margin: 14px 0 10px;
	text-align: center;
  }
  
  .mssl2-paySepWrap:before{
	content:"";
	position:absolute;
	left:0;
	right:0;
	top:50%;
	height:1px;
	background: rgba(0,0,0,.12);
	transform: translateY(-50%);
  }
  
  .mssl2-paySepWrap span{
	position: relative;
	display:inline-block;
	padding: 0 10px;
	background: #fff; /* assumes your card body is white */
	font-size: 16px;
	color: rgba(0,0,0,.72);
  }
  
  /* =========================================================
	 MSSL2 – Add Players / Import Roster (override legacy)
	 Scope: only inside the new template wrapper
	 ========================================================= */
  
  /* ---------- Import Old Roster (override legacy ID rules) ---------- */
  
  /* Wrapper should just behave like a normal block inside card */
  .mssl2-wrap #previous_rosters_wrapper{
	margin-top: 0 !important;
	transition: none !important;
	user-select: none !important;
  }
  
  /* Legacy toggles wrapper styles via .in_view — keep class, change visuals */
  .mssl2-wrap #previous_rosters_wrapper.in_view{
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
  }
  
  /* Your new template uses a real button now.
	 Override the old "blue pill" ID styles so it matches mssl2 buttons. */
  .mssl2-wrap #toggle_previous_rosters{
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
  
	padding: 12px 14px !important;
	border-radius: 10px !important;
  
	background: #1a63af !important; /* brand */
	color: #fff !important;
  
	font-family: "Outfit", sans-serif !important;
	text-transform: uppercase !important;
	letter-spacing: .06em !important;
	font-size: 13px !important;
  
	border: 0 !important;
	cursor: pointer !important;
  }
  
  .mssl2-wrap #toggle_previous_rosters:hover{
	background: #0B4A75 !important; /* brand dark */
	color: #fff !important;
  }
  
  /* The span swap logic stays the same; just ensure it doesn't get weird spacing */
  .mssl2-wrap #toggle_previous_rosters span{
	display: inline !important;
  }
  
  /* Roster list container */
  .mssl2-wrap #previous_rosters{
	display: none; /* JS will show */
	margin-top: 12px !important;
  }
  
  /* Individual previous team tiles: make them "cards" */
  .mssl2-wrap #previous_rosters .previous_team{
	display: block !important; /* override legacy inline-block tiles */
	margin: 0 0 10px 0 !important;
	padding: 12px !important;
  
	border-radius: 12px !important;
	border: 1px solid rgba(0,0,0,.12) !important;
  
	background: #fff !important;
	color: #231f20 !important;
  
	text-align: left !important;
	cursor: pointer !important;
  }
  
  .mssl2-wrap #previous_rosters .previous_team:hover{
	border-color: rgba(24,98,175,.55) !important;
	background: rgba(24,98,175,.06) !important;
  }
  
  /* Typography inside tile */
  .mssl2-wrap #previous_rosters .previous_team .team_name{
	font-family: "Outfit", sans-serif !important;
	text-transform: uppercase !important;
	font-size: 14px !important;
	letter-spacing: .06em !important;
  }
  
  .mssl2-wrap #previous_rosters .previous_team .team_league{
	margin-top: 4px !important;
	font-size: 11px !important;
	opacity: .75 !important;
	font-family: 'Open Sans', serif;
  }
  
  /* =========================================================
	 Import roster toggle button label swap (v2)
	 ========================================================= */
  
  /* Default state: show "Import", hide "Close" */
  #previous_rosters_wrapper #toggle_previous_rosters .not_in_view{
	display: inline !important;
  }
  #previous_rosters_wrapper #toggle_previous_rosters .in_view{
	display: none !important;
  }
  
  /* Open state (.in_view on wrapper): show "Close", hide "Import" */
  #previous_rosters_wrapper.in_view #toggle_previous_rosters .not_in_view{
	display: none !important;
  }
  #previous_rosters_wrapper.in_view #toggle_previous_rosters .in_view{
	display: inline !important;
  }
  
  /* =========================================================
   Simplified Roster View on Mobile (Add Players + Single League)
   ========================================================= */
  
  @media (max-width: 640px){
  
	/* Hide headers */
	.mssl2-table thead{
	  display:none !important;
	}
  
	/* Each row becomes a 2-row grid */
	.mssl2-table tbody tr{
	  display:grid !important;
	  grid-template-columns: 1fr auto;
	  grid-template-areas:
		"name status"
		"email status";
	  gap: 6px 10px;
	  padding: 12px 10px;
	  border: 1px solid rgba(0,0,0,.12);
	  border-radius: 12px;
	  margin-bottom: 10px;
	  background: #fff;
	}
  
	/* Remove “table cell” feel */
	.mssl2-table tbody td{
	  border: 0 !important;
	  padding: 0 !important;
	}
  
	.mssl2-roster-td--name{
	  grid-area: name;
	  font-weight: 600;
	  line-height: 1.2;
	}
  
	.mssl2-roster-td--email{
	  grid-area: email;
	  font-size: 13px;
	  opacity: .75;
	  line-height: 1.2;
	}
  
	.mssl2-roster-td--status{
	  grid-area: status;
	  align-self: center;
	  justify-self: end;
	  white-space: nowrap;
	}
  
	/* Optional: prevent long emails from wrecking layout */
	.mssl2-roster-td--email a{
	  display:inline-block;
	  max-width: 100%;
	  overflow:hidden;
	  text-overflow: ellipsis;
	  white-space: nowrap;
	}
  }
  
  /* My Teams card grid */
  .mssl2-grid--teams{
    display:grid;
    grid-template-columns: 1fr;
    gap:12px;
  }
  
  @media (min-width: 720px){
    .mssl2-grid--teams{
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  
  @media (min-width: 1024px){
    .mssl2-grid--teams{
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  
  /* =========================================================
     Registration Reminder Teams
     ========================================================= */

  .mssl-registration__card.mssl-registration__card--registered{
    border-color: rgba(39,94,150,.22);
  }

  .mssl2-myTeamsWidget--mini{
    max-width: 1100px;
    margin: 0 auto 14px;
    border-color: rgba(35,31,32,.16);
    box-shadow: 0 10px 24px rgba(35,31,32,.07);
  }

  .mssl-registration__summaryIntro{
    background: rgba(39,94,150,.08);
    border: 1px solid rgba(39,94,150,.16);
    border-radius: 12px;
    color: rgba(11,34,56,.82);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    margin: 0;
    padding: 10px 12px;
  }
  
  .mssl2-miniGrid{
    display:grid;
    grid-template-columns: 1fr;
    gap:10px;
  }
  
  @media (min-width: 860px){
    .mssl2-miniGrid{
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap:10px;
    }
  }
  
  .mssl2-miniTeam{
    background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
    border: 1px solid rgba(35,31,32,.12);
    border-radius: 12px;
    box-shadow: 0 6px 14px rgba(35,31,32,.05);
    padding: 10px 12px;
  }
  
  .mssl2-miniTeam__top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  
  .mssl2-miniTeam__name{
    font-family: "Outfit", sans-serif;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .03em;
    color: #0b2238;
    line-height: 1.2;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
  }
  
  .mssl2-miniTeam__meta{
    display:flex;
    align-items:center;
    gap:8px;
    flex: 0 0 auto;
  }
  
  .mssl2-miniTeam__sub{
    margin-top: 6px;
    font-size: 12px;
    color: rgba(0,0,0,.62);
    line-height: 1.2;
    overflow:hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  
  .mssl-registration__card--registered .mssl2-pill{
    padding: 4px 8px;
    font-size: 10px;
    letter-spacing: .06em;
  }

  .mssl2-myTeamsWidget--mini .mssl2-pill{
    padding: 4px 8px;
    font-size: 10px;
    letter-spacing: .06em;
  }
  
  /* Mini button variant (used in My Teams widget) */
  .mssl2-btn--mini{
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 11px;
    letter-spacing: .06em;
    font-weight: 400;
    text-transform: uppercase;
  }

  .mssl2-myTeamsWidget--mini .mssl2-card__bd{
    padding: 10px 12px;
  }
  
  .mssl2-pillMob { display:none; }
  
  @media (max-width: 640px){
    .mssl2-pillDesk { display:none; }
    .mssl2-pillMob  { display:inline; text-align: center; }
  }
  
  /* =========================================================
   IN-LINE ROSTER EDITING ON TEAM DETAILS
   ========================================================= */
  .mssl2-rosterInline .mssl2-rosterInline__removeBtn{ opacity:.35; pointer-events:none; }
  
  .mssl2-rosterInline.is-editing .mssl2-rosterInline__removeBtn{ opacity:1; pointer-events:auto; }
  
  /* =========================================================
     Import Previous Team card visibility fix (scoped)
     ========================================================= */
  
  #mssl2-previous_rosters .mssl2-previous_team{
   background: #1a63af !important;
   color: #fff !important;
  }
  
#mssl2-previous_rosters .mssl2-previous_team:hover{
   background: #231f20 !important;
   color: #fff !important;
  }
  
/* Remove buttons should NOT look clickable unless edit mode is active */
  .mssl2-rosterInline .mssl2-rosterInline__removeBtn {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
  }
  
  /* When editing, enable */
  .mssl2-rosterInline.is-editing .mssl2-rosterInline__removeBtn {
    opacity: 1;
    cursor: pointer;
    pointer-events: auto;
  }
  
  /* Optional: kill any hover effects while not editing */
  .mssl2-rosterInline .mssl2-rosterInline__removeBtn:hover {
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }
  .mssl2-rosterInline.is-editing .mssl2-rosterInline__removeBtn:hover {
    /* let your normal hover styling apply, or remove this block entirely */
  }
  
  /* =========================================================
   "SAVING" styles
   ========================================================= */
  
  .mssl2-btn.is-saving,
  .mssl2-btn:disabled{
    opacity: .55;
    cursor: not-allowed;
    pointer-events: none;
  }
  
  .mssl2-btn.is-saving::after{
    content: " ";
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 8px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    vertical-align: -2px;
    animation: mssl2spin .8s linear infinite;
  }
  
  @keyframes mssl2spin{
    to { transform: rotate(360deg); }
  }
  
  /* =========================================================
   IN-LINE EDIT STATUS BAR
   ========================================================= */
  
  .mssl2-rosterInline__status {
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.4;
  }
  
  .mssl2-rosterInline__status.is-good {
    background: #e8f5ee;
    color: #1b6e3c;
  }
  
  .mssl2-rosterInline__status.is-bad {
    background: #fdeaea;
    color: #8a1f1f;
  }
  
  .mssl2-rosterInline__status.is-info {
    background: #eef3f9;
    color: #274b7a;
  }
  
  /* =========================================================
   NOT ACTIVE ROSTER STATUS
   ========================================================= */
  
  /* Inactive/removed roster row */
  .mssl2-row--inactive {
    opacity: 0.72;
  }
  
  .mssl2-row--inactive td {
    color: rgba(0,0,0,.55);
  }
  
  /* Optional: keep links readable but muted */
  .mssl2-row--inactive a {
    color: inherit;
    pointer-events: none; /* remove if you still want mailto/tel clickable */
    text-decoration: none;
  }
  
  /* Yellow REMOVED pill */
  .mssl2-statusPill {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 800;
    letter-spacing: .06em;
    font-size: 12px;
    line-height: 1;
    margin-top: 6px;
    text-transform: uppercase;
  }
  
  .mssl2-statusPill--inactive {
    background: rgba(245, 158, 11, 0.18); /* yellow-ish */
    border: 1px solid rgba(245, 158, 11, 0.45);
    color: rgba(120, 53, 15, 0.95);       /* brown text */
  }
  
  .mssl2-pill--warn{
    background: rgba(245, 158, 11, 0.18);
    border: 1px solid rgba(245, 158, 11, 0.45);
    color: rgba(120, 53, 15, 0.95);
  }

  .mssb-hp{
    position:absolute !important;
    left:-9999px !important;
    width:1px;
    height:1px;
    overflow:hidden;
    opacity:0;
    pointer-events:none;
  }

  .mssl-security-fields{
    position:relative;
    width:100%;
  }

  .mssl-turnstile{
    display:flex;
    justify-content:center;
    align-items:flex-start;
    width:100%;
    max-width:100%;
    margin:16px 0 12px;
    min-height:65px;
    overflow:hidden;
  }

  .mssl-turnstile > div,
  .mssl-turnstile iframe{
    max-width:100%;
  }

  /* =========================================================
   CUSTOM REGISTRATION FORM
   ========================================================= */

  .mssl-registration {
    --mssl-reg-blue: #275e96;
    --mssl-reg-blue-dark: #17466f;
    --mssl-reg-ink: #231f20;
    --mssl-reg-muted: #647084;
    --mssl-reg-line: rgba(35,31,32,.16);
    --mssl-reg-line-strong: rgba(35,31,32,.28);
    --mssl-reg-soft: #f5f7fa;
    --mssl-reg-soft-blue: #eef5fb;
    --mssl-reg-error: #8a1f1f;
    --mssl-reg-success: #166534;
    max-width: 960px;
    margin: 0 auto 52px;
    padding: 2px 0;
    color: var(--mssl-reg-ink);
  }

  .mssl-registration [hidden] {
    display: none !important;
  }

  .mssl-registration__form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 18px;
  }

  .mssl-registration__intro {
    grid-column: 1 / -1;
    margin: 0;
    padding: 15px 18px;
    border: 1px solid rgba(39,94,150,.18);
    border-radius: 12px;
    background: linear-gradient(180deg, #f8fbfe 0%, #eef5fb 100%);
    color: var(--mssl-reg-ink);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
    text-align: center;
  }

  .mssl-registration__card {
    grid-column: 1 / -1;
    border: 1px solid var(--mssl-reg-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(35,31,32,.07);
    overflow: hidden;
  }

  .mssl-registration__card .mssl2-card__hd {
    min-height: 52px;
    padding: 13px 16px;
    border-bottom: 0;
    background: linear-gradient(135deg, var(--mssl-reg-blue) 0%, var(--mssl-reg-blue-dark) 100%);
  }

  .mssl-registration__card .mssl2-title {
    letter-spacing: .05em;
    font-size: 16px;
  }

  .mssl-registration__card .mssl2-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
  }

  .mssl-registration__card--split {
    grid-column: auto;
  }

  .mssl-registration__cardBody {
    padding: 22px;
    background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
  }

  .mssl-registration__cardBody > :last-child {
    margin-bottom: 0;
  }

  .mssl-registration__choiceRow {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .mssl-registration__choiceRow label {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 58px;
    padding: 13px 14px;
    border: 1px solid var(--mssl-reg-line);
    border-radius: 12px;
    background: #fff;
    color: var(--mssl-reg-ink);
    cursor: pointer;
    font-family: "Outfit", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, color .16s ease;
  }

  .mssl-registration__choiceRow label:hover {
    border-color: rgba(39,94,150,.48);
    background: var(--mssl-reg-soft-blue);
    box-shadow: 0 8px 18px rgba(39,94,150,.10);
  }

  .mssl-registration__choiceRow label:has(input:checked) {
    border-color: rgba(39,94,150,.48);
    background: var(--mssl-reg-soft-blue);
    box-shadow: 0 8px 18px rgba(39,94,150,.10);
  }

  .mssl-registration__choiceRow input,
  .mssl-registration__checkboxGrid input {
    flex: 0 0 auto;
    margin: 0;
    accent-color: var(--mssl-reg-blue);
  }

  .mssl-registration__choiceDescription {
    margin: 14px 0 0;
    padding: 12px 14px;
    border: 1px solid rgba(39,94,150,.14);
    border-radius: 10px;
    background: var(--mssl-reg-soft-blue);
    color: var(--mssl-reg-ink);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
  }

  .mssl-registration__account {
    display: grid;
    grid-template-columns: minmax(70px, 92px) minmax(0, 1fr);
    column-gap: 12px;
    row-gap: 0;
    align-items: start;
    margin: 0;
  }

  .mssl-registration__account dt {
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid rgba(35,31,32,.08);
    color: var(--mssl-reg-muted);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  .mssl-registration__account dd {
    min-width: 0;
    margin: 0;
    padding: 10px 0;
    border-bottom: 1px solid rgba(35,31,32,.08);
    font-weight: 700;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .mssl-registration__account dt:nth-last-of-type(1),
  .mssl-registration__account dd:nth-last-of-type(1) {
    border-bottom: 0;
  }

  .mssl-registration__field {
    display: grid;
    gap: 8px;
    margin: 0 0 16px;
    font-weight: 700;
  }

  .mssl-registration__field > span {
    color: var(--mssl-reg-ink);
    font-family: "Outfit", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1.25;
    text-transform: uppercase;
  }

  .mssl-registration__field strong {
    color: #b71c1c;
  }

  .mssl-registration__field input,
  .mssl-registration__field select,
  .mssl-registration__field textarea {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid var(--mssl-reg-line);
    border-radius: 10px;
    background: #fff;
    color: var(--mssl-reg-ink);
    font: inherit;
    font-weight: 600;
    box-shadow: inset 0 1px 2px rgba(35,31,32,.04);
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
  }

  .mssl-registration__field select {
    -webkit-appearance: none;
    appearance: none;
    padding-right: 38px;
    background-image: linear-gradient(45deg, transparent 50%, var(--mssl-reg-blue) 50%), linear-gradient(135deg, var(--mssl-reg-blue) 50%, transparent 50%);
    background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50%;
    background-repeat: no-repeat;
    background-size: 6px 6px, 6px 6px;
  }

  .mssl-registration__field input:focus,
  .mssl-registration__field select:focus,
  .mssl-registration__field textarea:focus {
    border-color: rgba(39,94,150,.68);
    box-shadow: 0 0 0 3px rgba(39,94,150,.12), inset 0 1px 2px rgba(35,31,32,.04);
    outline: 0;
  }

  .mssl-registration__field input:disabled,
  .mssl-registration__field select:disabled,
  .mssl-registration__field textarea:disabled {
    background-color: #f1f4f8;
    color: #7b8796;
    cursor: not-allowed;
  }

  .mssl-registration__field textarea {
    min-height: 112px;
    resize: vertical;
  }

  .mssl-registration__cardBody .description {
    margin: -4px 0 16px;
    padding: 11px 13px;
    border-left: 3px solid rgba(39,94,150,.55);
    border-radius: 8px;
    background: var(--mssl-reg-soft);
    color: var(--mssl-reg-muted);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
  }

  .mssl-registration__checkboxGrid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin: 0;
  }

  .mssl-registration__checkboxGrid label {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid var(--mssl-reg-line);
    border-radius: 10px;
    background: #fff;
    color: var(--mssl-reg-ink);
    font-weight: 800;
    line-height: 1.25;
    cursor: pointer;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
  }

  .mssl-registration__checkboxGrid label:hover {
    border-color: rgba(39,94,150,.45);
    background: var(--mssl-reg-soft-blue);
    box-shadow: 0 6px 14px rgba(39,94,150,.08);
  }

  .mssl-registration__checkboxGrid label:has(input:checked) {
    border-color: rgba(39,94,150,.45);
    background: var(--mssl-reg-soft-blue);
    box-shadow: 0 6px 14px rgba(39,94,150,.08);
  }

  .mssl-registration__help,
  .mssl-registration__empty {
    margin: 14px auto 0;
    padding: 12px 14px;
    border: 1px solid rgba(185, 28, 28, 0.22);
    border-radius: 10px;
    background: rgba(185, 28, 28, 0.08);
    color: var(--mssl-reg-error);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
  }

  .mssl-registration__error {
    margin: 16px 0 0;
    padding: 12px 14px;
    border: 1px solid rgba(185, 28, 28, 0.2);
    border-radius: 10px;
    background: rgba(185, 28, 28, 0.08);
    color: var(--mssl-reg-error);
    font-weight: 700;
  }

  .mssl-registration__error + p {
    margin: 12px 0 0;
  }

  .mssl-registration__success {
    margin: 0;
    padding: 12px 14px;
    border: 1px solid rgba(22, 101, 52, 0.2);
    border-radius: 10px;
    background: rgba(22, 101, 52, 0.08);
    color: var(--mssl-reg-success);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.45;
    text-align: center;
  }

  .mssl-registration__waiver {
    max-height: 280px;
    overflow: auto;
    margin-bottom: 18px;
    padding: 17px;
    border: 1px solid var(--mssl-reg-line);
    border-radius: 12px;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    box-shadow: inset 0 1px 4px rgba(35,31,32,.05);
    font-size: 14px;
    line-height: 1.55;
  }

  .mssl-registration__waiver p {
    margin-bottom: 12px;
  }

  .mssl-registration__signature {
    display: grid;
    gap: 10px;
  }

  .mssl-registration__signature canvas {
    width: 100%;
    height: 180px;
    border: 1px dashed rgba(39,94,150,.48);
    border-radius: 12px;
    background: linear-gradient(180deg, #fff 0%, #f9fbfd 100%);
    box-shadow: inset 0 1px 4px rgba(35,31,32,.05);
    touch-action: none;
  }

  .mssl-registration__clearSignature {
    justify-self: start;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(39,94,150,.24);
    border-radius: 10px;
    background: rgba(39,94,150,.08);
    color: var(--mssl-reg-blue);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
  }

  .mssl-registration__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
  }

  .mssl-registration__actions .button {
    min-height: 44px;
    padding: 0 18px;
    border-radius: 10px;
    font-weight: 800;
  }

  .mssl-registration__actions .button-primary {
    background: var(--mssl-reg-blue);
    border-color: var(--mssl-reg-blue);
  }

  .mssl-registration__submit {
    grid-column: 1 / -1;
    margin: 0;
    text-align: center;
  }

  .mssl-registration .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 10px;
    font-family: "Outfit", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .03em;
    line-height: 1.1;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease, transform .16s ease;
  }

  .mssl-registration .button:not(.button-primary) {
    border: 1px solid rgba(39,94,150,.24);
    background: rgba(39,94,150,.08);
    color: var(--mssl-reg-blue);
  }

  .mssl-registration .button:not(.button-primary):hover {
    border-color: rgba(39,94,150,.38);
    background: rgba(39,94,150,.13);
    color: var(--mssl-reg-blue-dark);
  }

  .mssl-registration .button-primary {
    border: 1px solid var(--mssl-reg-blue);
    background: var(--mssl-reg-blue);
    color: #fff;
    box-shadow: 0 8px 18px rgba(39,94,150,.22);
  }

  .mssl-registration .button-primary:hover {
    border-color: #231f20;
    background: #231f20;
    color: #fff;
    transform: translateY(-1px);
  }

  .mssl-registration .button:disabled {
    opacity: .58;
    cursor: not-allowed;
    transform: none;
  }

  .mssl-registration__submit .button {
    min-height: 48px;
    padding: 0 26px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 800;
  }

  @media (max-width: 720px) {
    .mssl-registration__form {
      grid-template-columns: 1fr;
    }

    .mssl-registration__card--split {
      grid-column: 1 / -1;
    }

    .mssl-registration__card {
      border-radius: 12px;
    }

    .mssl-registration__cardBody {
      padding: 16px;
    }

    .mssl-registration__account {
      grid-template-columns: minmax(68px, 86px) minmax(0, 1fr);
      column-gap: 10px;
    }

    .mssl-registration__choiceRow,
    .mssl-registration__actions {
      grid-template-columns: 1fr;
      flex-direction: column;
      align-items: stretch;
    }

    .mssl-registration__actions .button,
    .mssl-registration__submit .button {
      width: 100%;
    }
  }