@charset "UTF-8";/* :root {
  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 400;

  color-scheme: light dark;
  color: rgba(255, 255, 255, 0.87);
  background-color: #242424;

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  font-weight: 500;
  color: #646cff;
  text-decoration: inherit;
}
a:hover {
  color: #535bf2;
}

body {
  margin: 0;
  display: flex;
  place-items: center;
  min-width: 320px;
  min-height: 100vh;
}

h1 {
  font-size: 3.2em;
  line-height: 1.1;
}

button {
  border-radius: 8px;
  border: 1px solid transparent;
  padding: 0.6em 1.2em;
  font-size: 1em;
  font-weight: 500;
  font-family: inherit;
  background-color: #1a1a1a;
  cursor: pointer;
  transition: border-color 0.25s;
}
button:hover {
  border-color: #646cff;
}
button:focus,
button:focus-visible {
  outline: 4px auto -webkit-focus-ring-color;
}

@media (prefers-color-scheme: light) {
  :root {
    color: #213547;
    background-color: #ffffff;
  }
  a:hover {
    color: #747bff;
  }
  button {
    background-color: #f9f9f9;
  }
} */

html,
body,
#root {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  background-color: #f5f5f5;
  /* Fallback: hidden may break position: sticky in some browsers */
  overflow-x: hidden;
}

/* clip does NOT create scroll container - allows position: sticky to work */
@supports (overflow-x: clip) {
  html, body, #root {
    overflow-x: clip;
  }
}


/* Hide scrollbar for Chrome, Safari, Opera, and Edge (Chromium) */
html::-webkit-scrollbar,
body::-webkit-scrollbar,
#root::-webkit-scrollbar,
*::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Hide scrollbar for IE, Edge (legacy), and Firefox */
html,
body,
#root,
* {
  -ms-overflow-style: none !important;  /* IE and Edge (legacy) */
  scrollbar-width: none !important;     /* Firefox */
}
/* #root {
  max-width: 2400px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
} */

/* .logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.react:hover {
  filter: drop-shadow(0 0 2em #61dafbaa);
}

@keyframes logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: no-preference) {
  a:nth-of-type(2) .logo {
    animation: logo-spin infinite 20s linear;
  }
}

.card {
  padding: 2em;
}

.read-the-docs {
  color: #888;
} */

.spline-floating {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: clamp(180px, 22vw, 320px);
  height: clamp(180px, 22vw, 320px);
  pointer-events: none;
  z-index: 4;
}

@media (max-width: 768px) {
  .spline-floating {
    right: 12px;
    bottom: 12px;
    width: 160px;
    height: 160px;
  }
}

/* Hide scrollbar for Chrome, Safari, Opera, and Edge (Chromium) */
body::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge (legacy), and Firefox */
body {
  -ms-overflow-style: none;  /* IE and Edge (legacy) */
  scrollbar-width: none;     /* Firefox */
}

.react-tel-input{font-family:'Roboto',sans-serif;font-size:15px;position:relative;width:100%}.react-tel-input :disabled{cursor:not-allowed}.react-tel-input .flag{width:16px;height:11px;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAACmCAMAAAACnqETAAADAFBMVEUAAAD30gQCKn0GJJ4MP4kMlD43WGf9/f329vcBAQHhAADx8vHvAwL8AQL7UlL4RUUzqDP2MjLp6un2Jyj0Ghn2PTr9fHvi5OJYuln7Xl75+UPpNzXUAQH29jH6cXC+AAIAJwBNtE/23Ff5aGdDr0TJAQHsZV3qR0IAOQB3x3fdRD/Z2NvuWFLkcG7fVlH4kI4AAlXO0M8BATsdS6MCagIBfQEASgPoKSc4VKL442q4xeQAigD46eetAABYd9jvf3nZMiwAAoD30zz55X5ng9tPbKZnwGXz8x77+lY7OTjzzikABGsenh72pKNPldEAWgHgGBgAACH88/Gqt95JR0OWAwP3uLd/qdr53kMBBJJ3d3XMPTpWer8NnAwABKPH1O1VVFIuLSz13NtZnlf2kEh9keLn7vfZ4vNkZGHzvwJIXZRfZLuDwfv4y8tvk79LlUblzsxorGcCBusFKuYCCcdmfq5jqvlxt/tzktEABLb8/HL2tlTAw8SLlMFpj/ZlpNhBZ81BYbQcGxuToN9SYdjXY2Lz7lD0dCQ6S9Dm0EUCYPdDlvWWvd2AnviXqc11eMZTqPc3cPMCRev16ZrRUE0Hf/tNT7HIJyTptDVTffSsTkvhtgQ0T4jigoFUx/g+hsX9/QUHzQY1dbJ7sHV02Pduvd0leiK1XmaTrfpCQPgELrrdsrY1NamgyPrh03iPxosvX92ysbCgoZzk5kP1YD7t6AILnu+45LykNS40qvXDdHnR6tBennz6u3TSxU1Or9Swz6wqzCsPZKzglJbIqEY8hDhyAgFzbJxuOC+Li4d9sJLFsnhwbvH2d1A3kzAqPZQITsN76nq2dzaZdKJf4F6RJkb078YFiM+tnWZGh2F+dDibykYoMcsnekdI1UhCAwWb25qVkEq43km9yBrclQMGwfyZ3/zZ2QK9gJxsJWCBUk32QwqOSYKRxh6Xdm3B4oMW22EPZzawnR72kgZltCqPxrdH1dkBkqDdWwwMwMO9O2sqKXHvipPGJkzlRVLhJjVIs9KrAAAAB3RSTlMA/v3+/Pn9Fk05qAAAUU9JREFUeNp0nAlYVNcVxzHazoroGBkXhAgCCjMsroDoKIgKdFABBwQUnSAoCqLRFBfcCBIM4kbqShO1hlSrCJqQQmNssVFqjBarsdjFJWlMTOLXJDZt8/X7+j/n3pk3vNq/bb8+3nbP79137/+dd954qTVt8uTJL73OMhqNer03ady4cWOhWbNmjV+0FfKGjMb36Y9/1fXUst9cb2y8/lpb797z5k2dOjXVD9Ljn59fcHBwQEDAgGch3l9on6feeeedn0r9kvT222+/sErRgvcDArwV8f5tN/rcvPnMZ22pqVFRSVGjR38k9Rsp9fLql/MXLj20VGjt2rVeak2Og/auI/kHBQ3We/tCo0ZNhwYNGj58/NaWlpbOyMhIX1//2/jTrICvckhXruQsWbJw4cL3tzhPORynSk5lZWVtglL9IkmdDQ05NqvVGhLwbKSUL+Tvb9yH/2sj+eN0IZZ3fvq3Hnp71ZtCOyofdnTYSzq9xX7UtsF9+/Y1FpeZT54sc2aUlq6Jy89YM/qj2oZaoeOkMR8dV/Tee++NWb04rrA5MRYKDAyc/NKCpwDIyKhE9LEzZ/r4DLQAAE6EyEeM6AcNH7m1pTMnB+fHX7tG9Bs0Xt+GwM/frqm5tz950aKDk6rsiA0xbUrbRAii/BDeV9bGhQsPRlyOCAuZ9GykZwT++n2RHPnVYQU+oaFDPQD8jEQAPiDdaLPaHGVXbn/O7YHQuIH9B/gYgzts1iqrtSopKWlNRkzS6I8arFaOFvTfew8AfiYil/rN6sWTKwtbArOzExISUl7+vwCuQNt8Bg71AQCcTwNpWeFbW3IIQEmJr08XgIzX2xDcvZrs7Jru5EWXwwKSwh2RkQ77w7Q0bXp6YRoDaKO+kZl8MCwsYpJ3pEf8liAAoPhDhqUMQ/wAkF+oqKiosJYA7HxotdnTtVe6Pr/S0h+AI90QffU3T9obGuwdD5PqkmJiMtbM+ajWI/60TX0COhoarAAE1dfXV80FgMmLi1oSKP7/B6ASAGyBV4YM7D/Bx8/bF7g5fgmgEwCCSiJtJQRgxEi9zZqVdYUu9pW0tLCIgOvxdR0dpxx5aWl7EzV7CYDV+tXnCzMzkzMvE4AFlTuhZaSf/OQny1L32RC+JcHikzJ06NAJoe+YNKRbsbG3xPlWZTxssNmdOP/J27ffudLJ60V7DAaT1lxRVvfwYe3Jlrq4uJiKjAwAcIWP+BkAhV/i7HA0uAG8BAIUf8qfzvwvgJcQf+XMK4GWi8OGTpgQ6uftzwC0LIM2WgcASwaXOBwlA7v6/YgAhFRt2pRGeu0/UyImbal77eHDo2kVAJAeKwE0fl6P63/5nSlTAKBCiR8AovbZEL9lf8I5AMD5booAE7OzY8X5fhGJi0/nTzTcMh+80iIBaF0APqvIu3EjqfRGcV3S4aSKYk8AaW4ADU4gOFlfn8sAXnoJBDpTCMDL87zU2kwATl+x1Nw+P2HChKHBBMDHFT8DwGjX11FSYu/f/aMf9XtOjwAacf2hmxRg7ywXDrr30kb7NVhDquo/z0y+nJs7ZUoYA5DxM4BFmcnJyV93PzjbvQhK3urqAYF7xflWVT5ssDaU4Ox7T9+6Ei4BaN0AUkvXJEExMTGHD9cdFgA2yfgZQAP1f0dJw0lrfS4BmIb4z5yZBgL/H8DibbehGROenQ0AQRhvZPwQAGDQ8wlqsFkmdP9ofr/n/OgK2ml1xxQECAAy/tdee++91wCA1mfWJy/KXUTr536T+O67764X2r9//T+3JkPdDx50f7qItDXfff+zeAxY1lYV0VCmPV1Ts5fGAGUYDbHpo0qT6vKTignAtWvXiuf0StwGZZPQybMPAYC8/xF/bj0AUPwvvzytKCdl6dMAvJxRuXjxkCHnL86YMXs2A8B4m4yWQTrdIp0uByMajcATJrwzXwCIiIjAFSrbJwGI+FlH00YH8/rQy5enQPsYgBK/BLCI1c0Afonhn/XjH8MNLP9o1Y4Pfg795N9hYQ23bt1q4fb07z+A/ITR2J8AFJnqOP7iuj7Fc35TK+9/bkPaM+NGiSnsB6wRIwGA4n/5T5Pzc5aeeAqAP1VCM4niWRqVgr1p1sEYlskNJQC4BQZbLJi0MAgCgBUKqYo3VEVEhIWFTZqXtYmVxiIAtB4QeDUAvMuSFBgAJCkwAKHlLAKw4wMIFG5URVgdLdwedEq6BuCgj1qzpi4uiVScYa6I0fWKJQVC2aRDY0eNWrlyECwMMIDDc2vZ6UF0F7z8tB5w4kTvtZ+ygklGkk4lvZ6sne45SDg8aJIQ2z+4Mmg0qcfauXPnfvPNN9XV/1S0VSWyf1Ls4FZ5aIHu/blGKb2UOM0ckq4PmsZ2b8yYMb2l4FbhX8ePHwmhuSPXkhaQ5q0tXzBvntdUUq9eSyFu9njXxpA74Leg198yktRWVI4OkAkymw2Q3WO90+nnN3u2H0QkHI6JpHHj2GvTYdsupd68GfVZ4yTJqJeUaNKhQ+rzCUvOMXEr//4vD3333XdLe+rRJx4iqumDnT2O5zW1HII1hPLy8pJGjz9GWgk9D61Al4fWkWay9VRbUa1GEVCYDRoonu0dr++n0ZQ0dMCNdDRYHVrtuImjWHQ80lvfl4WfhJetw1CFm6h+rkazd28iJHvyIe/IHt7ZOBY7o4GPH4smPqf7nRwz/sH6bmmi2HtvYiBUYPxEcZakt701PdsPAIhb3DBbYmIIAOK+F9HXJ6z7t799AwDI48+cOQRi66m2ogoAYVwIQEkQb8DrJza1azRWq9NpjUjXtg+aNXHU9EEQHW/YsGFD3toHMFZbgzUsDNPkPgAgpScG1vA4TgB8PZATAAoc6IasWPHhhwCQkyNCdwMIJCVqDabA8+cAAJFLYVD92dvpjvQe7ZcA7p0/350dEzNmy+iRAHBPrO9+AwB41Of4h2HoFdZYhsfL7ej7QmbSBdED/GkDXv+ju9Pv4i9mM+g09Rs1duKoQSQR/4whb7msbFhufHy8M2xup6AZ3sHzWOChaveIWQCtn00A7s/84MDuD4bd+fBDcYEukrVna5fwMQPAsqnQZOqqLtBzezysvHd6z/YLANndUELMGAmgXqzPfeON3+IE8PHbuL2YegYCAO+/fz/io2VMM+5HpR/BGXIPGCzix3oAaBo13aApK9Mahg8fNAo9ANsPGi7iB4BLZRUPH9advJGb6zx+3Jk7FwFtCNekNzQUabW3cAv0Ek9uUA0U+PGsY4NmzrxQVBS3e82wGQDA7bvI8SsAsgNP7y26HV4GALyeJzGaY5J18fZ4GT+3DwBK8/K2ZF/s7v46ZYwEsMJHrJ/gApBJ8QPAs9gh2BYBnT077OwUnvcBwB0/nCEAQPFBdADefv5dPEu3p2u18e39Bg2aPou2h9wNmP3wi7bGL9qsuVOcizoBgM/X0BBtamggK2wGABn+WSLw8awm9P4Du3ecys+aMWPGt6J9medF/EsBIBbxJxSFm4vM5moJAOGL+AHAO90jfglgy5bshO7uFAIQM2fkyhUr6sX6fW+MJQDYX1wvWI/+uOIc79mziJec4ESxDPGy6AF9RfzYHgBw02s7yswNhf1GDJ8+lvcfPgKrxfoAa0S9uP9HTV95LHdur8TzuF7W5OSqDdEGAFiaiIjk9U8hAMdw+1Ts3r37VPOMGR/K9l3k+CUA9P9b4c6y8LKC6upqAiDj3wpxD1Dix/m9Uku3KAD6xMx5DgC6xfrLYwnAEuw/jOJnAMHjpnvECwA8aK5YseK3EA2aogf0pQNIAIOaXI8S0/sBAPaHaLUEIOJHPmjUsWACACN7/qLVmoz2Zjabv3x8X+oBdP/DWeih94d9sHv3BzO+fOOND6l9C93xL00BgOy97dHo/ZHm6EcAwM8OHlZ+YLpFtF9eQAGA9+81pg8DQCzdU3D9Ef/YN3AC8OP4Z5D1DBg7XYmfAKitqYl7AA8AvDxxVLtGW1VVVhYRZjC0jhg/Tuzv3j6gCuEjfghGYd/cXrFk5BNqai4K633k938h/Zp15C8Tx68E7X7Dtm2b8QZEAH743j8gYQQwC8TGlp08Z7ZWC+k/4eFf6pc//Sje3+TZ/pFeqXkQ7hoIhhoAnve8ogRgCQZBMQsgTgBgXykpAoDKmpoIuJP/wMvzwaOKHkisVfUnDYZZ2J/k3n4ST/94UiHt2/d+Lx7yttFAXnP+60W6+X9ggQFzGDdeOJT791fQNAgAv/qHFFMAAJou7AWQBCAkKXzknW71bD96APnWQ4c+hthRsv1Ty2WNA4InwYYpzhJSW1MT+lmkxx9awyfNhQVmvf9+c9M4kVt1by8tsmuLub3I/in6er7URGkh1SZ1znfk/xR9o2oP7F8Pax1vbO8RgJcwhYp8BvpMcD1t+0GffPJ7xUo+CA54Yc+DPXv2vGA0vkBavfqIW+xeH3kr8iJ9QxJegQNpu/TMzZupnzXOkQ7+OkumeCCOU+Si2Sr7kR6RkQZ/iA0y62PWVKlUiLy8fsz1MSd6s+YhLz1vu0t7ILS4T1Rqn2cU9fF6YQdpMZIAG6dNmzZ5bX+7PZKGsXi0CM9xwZ+0DmuVnejxsHMDJu3Zu24vkrT+QTtYq4/8nvWHPzyeCa2HUySRbzMKAO9CGhZ15Pku67uGlaS7frzoeFat26uY2CpzijiIrbKfLdH2buy7eKLkR8oAaXWhQNLH8+qEKirKy0tLS6O8bXVZQpvg8dPmbV/O+jH0IvRClLY06hkPAcBGqLa19ckBzC0HVg+0R9rQFpqFtWER1oBPhr3+eutPocevPzIaBwTseTORAu/rQ7sd2AgA4g69T1PlfmGVsX9fn8ESALk4ER5Gsb/Mny2tbzGkPQwASH1s2iTDBwC2yhYeVdgq+yXODAwpCCzAozT7Dml12fqR8VGcOMtk9A0pkUvsI7YvR+DQrl2vQLtWpdbFPAVAq8lgMrcygKEEoKQsJKTMYQgLDQn4ZN3r60T43ngSrH5g1rBcWaINAoCMX1plXq8GoBUAXNYX4RcfPqzVXa8tqk3bpATAVtnCVpytsp8tsCBifcJVil8BoFhfu7OE5RCyGn0HWxweQLYvf/HF2tp1T568IgD0Gf2MJilKBSCrPf5Cc3h76e4zuwmAv8ZqQ5cLMwwNA4DWn+IfwoeqX3/8kQvAQC2rGQCU+NkqywuiAqAVACa6rO/hYsR/uBi3wKZd7wGA1gPAcEvfhAQAmEEA4DwLEgo4/tmzwyYdYqurWF+9zWKxhCKlTjnV2WEBxkhHX5/G8jSZEZoKALWJWbuyYgWBVRgA6vqk9hgDNh54YtI2t2jbn5wBgAl2m1XTYAmxhFoNU5DG/uRnHuG/d/yjEa0X7kID+99tgu6OxTytxK8A0KoAaCGexz+rWHPpUtKaG4e1hwnAhhNZlLtMhwyG+HhDGVvl0PXZ2fv7w3oMe8vPijuf4of2AQCyutDmzWdI1zcv0Psr8SOFF2As0Th8Qr84CiEzcjSKni09b4l5C+al4r9uAcCBA1nthuYKc3spA4i0hWgNdFazgbK8n3iEjzct380S1rd/f+mkAECJH87O21/2v76eALQM4MiRX0+MKqXsFXSYAei8/d3WXLHaoQNTUga4AYSGiesPTSEASvwEwCrin4D4GYAv4m9MS5M5yalGX1uixccntCDwKqf5n5FSboGNBw4caG03m1tbz5zZs3v1bAAAKvtJDAuzAeD1c0r4DEBY4f4DKH4C8AclfgYQxFl0etRWAAj+RwjA6DUyfuoC3xt02F6JnwDQ8UNpeQAB+DTY6op/HxJLU+au3jj5JYRPwvR5ZoFN3v12oVxjkE+oXbG+4o71WH5dJa9VALD7wBPMArvP7AEAfaTVgm3NZkzcszHoBCvhM4BvhTcfMOCB8OZH/sDxp0hrCwA8PvKjNqkaAPaL80sAyvU3fF+sU1tptspDaRkA3gKAEIoforwaAPhZ3f2de4RWeUvAARqDKH65ZDKE7/nxriexm17ZtO0JxvhXX1n1Q5UAYCMQTCsvn7ybEuYL9JE2q9jfZJoSBgADEP5xt757MJM0xMcHUUOfzr9Pywlua+vtThhJAOvdPYDc/LjRayC+CxiDTm2l2SpbeJmPHywzyhLDXH1ICI96wEAcAlIr4ABKSThuXt4c75ByyJ2Zj9qDWbD2SSJmAdaqBSp5CdPoB5frx9LDdEVDG6C5cKnB/xz1kdB3rAcP2Bb7+X0q9GtOXirWU7HGEgBSwI/CoehosrIT2f7pFKmtNFvlYF4W/jvAI6kMoX2y1kBIZKBHu1PDwfNI7A1ZbP+UIgPMAn08hFnAIOROal3P6pnlzSQlK8pHf4F2s+AwjSRNvDsCadl76bQif9tbqDBdNvzPfxcy8+nCw1OULDDrOukEi7PXnngo+IDLY8UZZMmGOmsMn09yPTI8VwjhWEUkXIY4mYVu2/7qq9tJXuqsLoxJj+XMZqEWUmdnskabf8olWOI9Rl9Ik07vqeh1id/EpqZRUGKOhksqxveuZGm0Idx3g//+BPrd734n793wXnuFEoUOXc+ClJcrC4wiI8rv0On4GNUbbh8TBRtwDOPVWerxv2P9SuiPukKcBwd0xRPusuLSH+/xUmd1r9dm5XsuZzZ35kBLxCt+ANBoihA5CY6YAODEmnS8KRpIr7cBgJp2uyDkahcmi+EAUE7SpvPQFRrw9yfcvk5nPHUyApDokQWPBQCOXN7DafPo+ABH1RN8fL0t6OrVq1X3eC7C8dVZ6vHu2P/4xz//WQDAQ44rnmhXFlrYYxeAW+mJ6bcSEyUAEFCyqJdPfkX6HLp8+fJXBEBTyAR2uAD0tWjSfbh9BGAUxX/1zi8HVXcpAHZq03m9BNBptXY4ET8DUOKXANJk/AxAFETYbO/ayJ3aACAwcH3gep/Qru4PUZ8w/nW8X9gWOMSdZR7bRG81jkOU1XjeDUArFOey4i++WFW1vr4NAMTLaFjLvekuAJvylYKIXIcvFcQItzLB9o5G44CzylcA+Pe1+GjS+fojwGDO4hbcOfuXX35bnZ0deIgB7Nyp1QqrygB+1Wb9lbOBAUQTAOV1XuwhdRZXI7Q3UVplfSKS45aEc0MH9p/yTveKkQCw7WrIXneWmYDMrD3++Mnx47x8Iqt8GiTs4+bJ8y6V3Xj4sOLkjV27qjA9AYCBvGJsQkLgXraKBAAEOsCdZPfLdbjjRwQAUOJvxy7t/BK+NKuPhqVYTX6PEHJ101+qq8MWLcrUqdf/ne5Pa+OvMLPRPB3dBw+ychaDSkers7gaFiAliv31sSHr14euv0o8n322XoeAHXhwOyuydsMYwJDax0+ePD5OywCA8NM4fAIwdWfdtIqKvKyMXbuKDPWFRS8wAG3r3lvtF0RBAveANuqv7K2Dc+3K9Z/g7gGtlKRja9sjPjSQF6/eqc7+9ttztKz3Z6uarl22BcqL+jvdo1URvyqzGbSUpOTX6XlkW0mvpaqzuBLA6dOxOD4DKMA7koRzaMyUf3+xczUCvlVgic+m+CWAIUNqjz95vEkBwJdfAniVhj6+/xuRjGyTAO42XRjVxJMfACjxE4CuveRlC2SO7d13NJD59yJFSQD0QRj+tPHu7flhpqv6y+pv/9lF7wn0QexZ4g1bBIBZBCAnIsJaEm+QAJT4f/Naqrmndd2wCFMPhuHTp3OWQDk6vS1hfcL+6v6I/iU8vgPAkAs1+5vPIn62zt6+56AsdNChjx49OqcvwsEQPx2OjwcAIv5d+YW5hfkSgNZ814wNGADHP0HEo58Q8PXe2Fjx/JkCxd7T8uXn+CUA3P4AILcPFu8NuqrDziF+lND4hfCjigAQsywKozQN0Esc8eJ89LTHLk8+7ZmV+LnBnJX2KNAA8KvVQ//9xWTYkDNnJq9VW2m5XF8vl2lSx/X3AMDhU35kee7yXS94mfh8St78RNZDOetAEwBAmaRjoS6t4a7M0TKFcWxNtfE+cvvgsWKCjs3U8jwFAGxd0w150DIAkHO0QSjaSPM3Pa6BI+RnVtojAPAErBRo6AeHtN1YDP8uRra1aiutXgYALTZ1H287pn+SxAAA0pFB0aQT7wuzKbOQwV93kfC/Qt13j/TI0k5kg2Yqox1YY0VBwlKdWXgx6VvLzKlRrPEjRU53Q7QQdpenE/bW7G7JBpZOpUmfLVi9arXQWkhtpdXLZP8WzFsQFx3Hh2vm/CjrBZaX9UbvmzenotZWWmpZ3AOJUgvCtkq/2u2Vy0lmbiOfZhxLqSWuyC/FpS5qbCyiW/6LUm/om2rv6mrvR9VGyCRkNErs6uOprS2bcpaZ91Bbd0CTmsTiPd/i8gtuzxGVPpoIebTY61qJ+aT9pJOytEnQ6NfiSBlxcbWsMTRG7LBtdFvJ8nxI9FAyKEhgkJRa4jqHpigjQxMZqamry/fV1Hk3eWRx198zmjTpmEZovSbe7tRGq4+ntraGnlY9nJfT47Wu5YAGVIKSZIEF7y8KOrg9R5C++r2iI6/W9myvF2p3/YNwyqQYcl/Fc14TkcNAk+r60AkPhBzg0wkA4GNi2fyDCMAg5VURKkfz4uwOzWJN0GBNuR0Qrnk3jTrrqlh68O1wvDlyNCBp6R+k0Tqq7ACgOp7K2koA6b7xSgFGeuTgvkElWBYAEDgidxVY8P5c0DGMrbLTgx908tVTPdo73uumw+4baW94WByTlp+fFuMCkJGhBqD1ACCeFP2pTg/WVzkgTpiXUV6GtCCeD4Li82N29vYGoDs1/Lrvy379ngcADaWtg0JwMAe8ufp46gIM+brdYnEKL4/lSF5fItqjFE6ms6/g/UVBB18Qb1xgeno4x7qqf/XUKdr81i2ZIfJaU1LR0YEsbUxMWmnFUQEgP5/sYFxceXlWn1XIGR6w0JzDWosGZ2SIBgeFwJvDeBBvtxWVz5Ior2Xle486i4KIO1fP3aEXkiv0QQ47pa9CQoTTnP304227d08ejwMsszRaylwAZIGDvwCw/RQ8ObRRaBUXcIiCDpwPAN6NvQoN5vgHngOA5XT7NDVJa+31WUXSjRsxa27EXEuLawGAo3HU/+OysnBjlpdmPeNnExkYV16+HO3NEKMQJjgrGizjl1a0MTLI4xL2vek9KrBg+IiuhBRUFhMAfrojiae74Kcf715m8j0+ngDgj/vBR9QOAyArUmj2njc5cJmkOLCKa5u5PTO4YMM7cR0REPELAMtxxA0bpDX3SsXYFwNdu5bWmZN0bc7RjNraOMSPHpBRCgCrKWcYKq//njNrp4kGmyCQCQlGg5X40WDZA3z6u3vAnUEjRtw5d+5LAJi/Qm9xcOstFht9JxHp9/TjDeteKJyd7AFhuVPKhFX39vcXXd4hssjbuQO4IGxkAD6iPZy1Rg9Yj/g5/IGPAGD58kJ42Q0bwnE8AUDG39mZl5eToyMAiL62Fok2AkD34O7QM26jlIcG14oui6sYEjymrpxeyuUJlaZuqViWnz5Y0x8AQpt7J6V6Hxs+4k4N2chD386f/6EeRseB9lso89oBY6I+3lhVAQYDSHfud5qEkUEWGftj574ii2xWUqJyPTqfKOjg/WlQ5P7v4wJwSguhoJEV7hW1huOHKO1xDQD45aJWWyoAUAPOhBEAgwtAbZ2YhC2haDA/bbkfNvKmxmRobJF5mgEDNL/Q2EPKU72nD7rPPhq5rwf9CIDdageAUK2hod4GAKrj/U8BRiQ/ju8/R/7UJ4Ssbl9HutbpL63uUws2RH/k5bKe1vrKq8td1nsflDsXAES5OXQY9da639SS6uQswAC0ByyTlR6QAQkbEgIBQNbicggY8qCpdRpb3M6dNAguS4rTWC4ZjwVCXIABCitgdZ2RGNBDMAs4bSUAoDre/xRgsCFYvx5hkbkVVjfIv6/L6j61YIMLOs7ysuvttdSRV+vcnqEecycAiFpbFtUbiEpbzpiy6NKsDlhL/pS1ZQuq6TZwkjCYJOtuSVNJpZ8nIQeaf/NmPlKyz9R+b4T++cj46JF+9iM9JK2un5+0uurjkX2T5Qsso5Df/7O6smCj5/a93oI+5eUjKu0JVpLMJK/r18PDZRaWq4i3k0ykcHbLKmcqaoVlCvcQtGjEjyZ6emF1Fre3CpDa6vKZhbHn8wdLueytnqU8n7CTFSllugeMik0WaJd6CrUZDTfmwep/cY3S5M/hmqjP73V9Mj0uKjnA7ZQtFebiRWiVt8x/yrHW6GE1SYf8Hraa2psUa2m0QWRlQ0QWd8FiUrkrL5XK+ytm13iiUog3mzZtQbANsrpL7CfpySCz+G8BXEChYRVAxj1vSsmCDVUBxTfFTq3zpDO+Li5/Q9OFlrg6tdX2MovZCn6MtXM7PS8LAPQ+HQA48IcPeardqFesJtf6HvL2bby97tat9unCCQIAz/ORkWKeBwB3PgafKWxOFVYXCYvjwuqe4NAlnpcIgIhcFkQAAAfOfwwNIwAALR4IkKEpMJp6ZrWj1QUUgx2Yde32G/hIB+VVx6LUVlsCcF2Dyt4MQBzvFQgAKP62pvA2CUBaTZmF/RjLEV+dn7nuVvuo4fQRFQBYoHRH31DKAgdX5EMSb0ZGXIy0uiU+JcLqEoBprvgZgBK/BKDEHxYBAIMEAG16NQDoJYAdO7QCQAKnL043N5+mbpB4qNEZ77CXlFRk5FMJfFOd/OyOxJ/deZ1A99+8Weue5gjALphFLL+yezcB2AhZmy5Y2Wnh9feSCGE1ET8DAM2D3WeHDKFuMGi80R/hl+CjqvgSBsBlc5V0vMpCqigRF4viN7AVXV252B3+S8jaKtdTZoH5q7IIaUUjJnEBhYHWxysA3ty4482Nb2r5+KyMuvw64fQqnBknT2aU7aQe0PX8MqoXaKUsaCvivWvQmiQA7qHQ5t7bkSt5RctWYzcD2MEAwsNDJICvFi7sewf6knRnIltPn8vdxGNYvGkcAPj42OPt9hJfTqpyAws1GRnaImRBXQAQf4mBG7i2snwnaxlp51R1FjnEYRfqgBo69nHO0YD1ngAKNxbiP7S9BFAXV1EhnN7D8KLw5riiirq4lXUHK47VIf6mC63tTU3trU3T78IJilJSpQcAwK5XeLlQAXCg6oMbVYife8DCep8RSqkpACD+e0hL70UPGD5S70/pLXQ6pyhY4BzfYi20uNDgBoD4Bxi4gQyQZnVZPK3OMquXOecIdgQA0vMGuPwbD+yg9RIA4o8T20+tAFvxlV59Te6y0Vh5wWQytLYaTOgBAFCp3KNiEPzxrldUADD8VV06/wUWfw4AZDUVqzoSy2GXHwyZiTGgHwGhLHGoj7Mk0jmUAVS4D54BxcVcr90E5fUfkJTGb36ox4gSDwg9hkthP4RQCDtu3Ic6dYEDF1CYPAHweowBwgqPbVoJyXJXfFCxrCgjDv8Jr4urO51bk1GBLDOUQ+IssxesKKlSqveeH7+iBnAAqo/YTTogsq49rOfB7m23brUOp2UGQNH4DJ1gEVnledP47pKvfLdEqd/9occo8TMAJX4CoFXilwBg+lQA5HoFAIcvviiZWsHXH4q5nVDzk9HqLLNXUaFLJlORqahuz4uQOCDPAkblUYvkx1bTw3oGt3Xi4ivLsoDBnVWeygNc3mYSsoQA4PnyFwDIMCglD8EjXc3/kAQAPbPE4Wx9PW6BF6RDkW1ci2+K+JsngQE9AB2QOwEudGNdRoU6y+zl/ohMmjWyf6uiyfduWEVSnJ0wZLw4UvkMTaebCCuqLOtVFQxKGasQdwSYZdcZPWweSykFFuKwlZxoOBdQXIiGmvUkVxJ5g5TaSivnHs3SqeQ1UZUl7Q1p9Bp3kQWvFicXNvvQfGX7cR8fmqs6oPozOp1KAqgClSyw1AKSnqVA/PbTXj3E7RWnn/81jrcb4loHme7+n/Pz5krWuu3GM5+hVnmOfAICAFVWtzdVE9g05VApHvNTPawnW8fLiYmPeXvofmCNztv2lRxRuG/p1AUXOl6rrDd6WFGyyqsXQ4oXnKe3sRIT2f5YAsY2PV4nNJPUS2nv/a9wQJ3yewPiW2OcP3wDN8LQvIHP3zO+7/kXJ8IvrYGuJBUDgEhqyruaAJSXa0I0eaSjRwGA1otw2DrqOs8HBt6hzb+tSbi4RAdn17jE/UI7UwJw+Po6xLOFjmsroj//fEMmr+eCCovl6lUfeqHu47d2scsG0WA5eSqMj1AovM/QiAB8JXZnnRvBul6u9k4/v9Ccmbzwn8ZIgROwwDPET6sxdeaEa5xOTfiSnHA+//OeWetce0cDVAzl5BwGgNb29lb570L73fZ+AFCqsWg4fgCIYuspLidbVxzwNgggzZOQ0o2AyNpG2JWHKQZgJ6sdycvR3CGdDbYyE6kFABD/+uyEgoFcUBHQEAHVV1XxZyNhcwUAy/r1FP+UiIBZo0zmY+2etcQc//3uzE5T54P1evSokvj4SB/w7I/jAUB4Z3N6ZF8f3/TmJRsYwMILraQLUOvwz8ocHR2ODlSo5V65sg8ANKx0B7IsJGGtLaraXXF+Nir0/r77fPb58wkXM1HAAACUpbZjvQJAfJY00EnLRt8gdPXPIyIuiwoRLqi4mlBQkFI9gQFQUWpDhNNZbwWAXADg+AMD9w8dOmVKaMAsg2FQ+3BYFs/2TL+/EIN4Z8qjgXqjf4kdpoP7kwCgMWkdMGNDI03hOD+11+xhrWWt8uHiwyfbGk+6AdjtjkhhPV3Fx2F0/tnyszixP9cCy8/UshP2y8/Q7Brg9sHeImvLX42JlLADy+E4HrxxZlhY8gSuEGGrjOrnagAg4wMA9RH4lCu+w5lLADpQ+mlxxm8LvFUytKTEcnCWofV5fOVzzAmVlDk7yAneP4/4M79GcSoBcJb4l8SHIH4+Hj8oNoeGLtv8kNojASjWGlnwS5eK16BMM6eidMlhFwBtpK/Bw3qGqqyn2J+SkASAPtM6fz7l62QG4O8RvwQQL95qOGnZDeCyLGaGVeYesL8ayxKANl6Lt125+/DV2CVTZZGzcrHZPDmvbPLm8O/RA4a39+uux+WQF2T6/ZZMxJ/yDbcHPcBGPYDjFwBM2lPL8jafyTCF4/zUXrOHlY7iStXDEDlUAPCNdzgdeHqz8z9Hwzx8SQoAR4/S6/yYo1FsPbUKADipewnZeMvxZcrS7q2LuNY3TMYPAQAUSfHbeDma/1xmtdIYYMYYQE5yYEFKyjdoLwMIC4sHAPzHSQAqKovi8L5w2uT8yrz8uPLiWStN7Su60COnkADg8fkWU2dmZkr/ZwWAoCCMAUEU/7M4np9BE57TrM3avLm8sHnhBkM0ffbX4S4mdoSNXiPiv3b7ypIlt2/rvNjaYnwXFQb99QRAO5QB4Fvio6PZeor4OAury7mYXfMtWeFvD/X6OpNqfbtkXpYLIkTBhX1w30gDA6D9Mfp2d/cTn6kZg7gQoLpaFlQsKH/J9Sj6p1/8Yktq76LFIDAtP39yXn5dXv4zs5DFqFB06Us8jYZn7v/GVRCBW4qrC4aKMQA9wJyzJFqbn2+IXrgkmgHkDqRV8nwE4DDU53DO7dt0C6gLCqZi+tdatHlyGhjN1lPL4vVbAwPvu2aVOyn7dd4h92ReVhREqAsuxk6XqyFplT0LMILXyklQUpiaVJlfWRkXt7g8P6M8I2Na1KyVpTt2vPjiRgjO/MAq3RKopsDd3lNFbuVDWTj/hmYTj3ctzQYCEIFRVzkfirUheRdcAwB1lpXsnyHAFOVyj2w9hdPk9UsPjVM+Oxv/9cdzx49VliF1wcVY1S84eBg9JavMLlyqeOrhw6mpl4qjooqfiSruM+sErLmHYP7++sijvduVYgfa7gX1+XV6Y48TzoF6WOFPDilfxZHUWWB1VlY+Fe12qTe0wCOIQKkE+SaAQcp6E1JvlZRSYaH+AyCPn1sTnxMqmq2SOsurXl5L6vUWnYFb4KXWJ3v39viFBXXWVFpT/EFY0wOiSjg//03Wmd5ZdRcSL9SJdyN4MRK4cuX69bHvtjWyLn4claHNqFCssfN/ACSSlF+MGKC8+fSFjHPbWOJ4Bw/+1VsldXvVy2sXQ+ug2Fgy108DwIHXPr4gfmHhs4fQDegL0g2dPhI20/2ISwA4B52fv5EeQncAwGk0/HReHj/u5qUGrny+oCBWNPhg48GuKK3GcMkKcR2DddI8IfQYIffvA8hfjEDBBklG4A8AHDj0DnTwr656mAApdZZXvcxWe+bM27e3bQujn/J6CoDH/FFkQs1dBnCiklL4izERbebSUmEMTE3HzOIzOQaw42+dnX/bCBGAFjS/heNXADQ27u+6eLHrIABkGOouKVmdsgyhiooMoU/58/ga1vnzNV/j9beUqB94v02JnwDopFxPzOqCCvUyAZi8rQa/d5f9fwAkcg/APXteApgGFWq0hZM9ANx9fkWTJ4CizOQiAWDBYnR8cf1BYHNq4PMAEAgACfsPgkBXVMWlS+gBso6lapJGqKVFI6T+BQpTz6ywuSzeKVVG6tCxtrZsdQPgeLu65C9W8LLyCxEAgFlm2+2IiHsAMOWpAKgHXKAe8AQE3j5BxMrp/NO4tJQBtFOKpp2sJAPYsTwuOTnuRQbwfcWNG5eEMLdc0kkABxMu7t+f0nWzK75nlrdMxpe8SAGgxA8fYVJlhf+nFpkVvUSn6RQAOCtd39WVi3gJQKS4f0R9bxAATAaAewUFADDlqQD+W9y1hkVRRmGyy+6ygrYleMVCM4sQoRvQKiFSBlG56CZiYYigEIgFlcJWhIJ0YUuUCLMbT1mhS4ClaRJPEQRElhbhpRD1qSyhInvq6f6e832zMzta/arebm4zOzvnnW9n3j3fOe9H8f/gev6HH57vpPZyMAbK0pESpAfz/YKA5YuWvb9skdnMBGCq6PO2lpbMz6l19pWhUZdg8h1ljvLHSOCiZUxASxyw/eM9F7Cbn1LHNGWugYHyv3pJgIcDhSRAla5B/zQCZNvdnj2y7U73/lAiYFVJ3/33980jJXkqAsDA84e+aaorq5MEYCaLlBjiVwgw73z//eadZgAEIAV3O6YB9qN4CASQ1t/KMkP82BEE4Mu/5+ieoyDA6pnVzd3G6Ni3r0P8aVqwNA94nJDcetfnWyRuB7Z80rqDvv8MPA+36y1M9W13escIEACVNW9eX9+8vyIghr0Fnq/r/IEdFnq/xP1fwbHjprFqZyYCvHDaYzRXGBkHJAoCArby5qtJa4KAGctAwIzqTR9/vP3j7Xu20whQ69gwAs7UgbPIfGyRRUYxs1LMCzy6tnWTGj8R8CkDnUfyDyc5WOiyxCtmQmTOGxcXd20cm7mdTIALI4DwvHBYGOopjceO9czaggDcA0TBA+4BIGCSsp1mr8YIAgKrqqs/BrbvOWr1lMa5egJ0WWQQAIhqXgAEqE9BQu+3OuilvL7W+FZKOAmHvYuBkwl4rV81WCB4CmNtgncag+XfKyr0bWyiq7kK2MDQdb2dPALUtzPWywznWolWoFcD/fv1Ul6pE1DKjVmkiloGPgMvPTh/qpGOWjsGoPeZUlF9+ypv//pVTspyLe5S3n/paR5YynvfweDt+qzzEAn5CWhkdySGR2NKMD4+1oH/c5WAsv9lO9qSqJZ5k5LbNgukKuerrxUmKrSXzyTQ2moSuJEgiiouIKBfAPBTpWO0IzJS9rAsWNAWPLR0ZQw9VyIisH1UQcnXnJVdSYjg/U/Twcdvl5/fewzejv0ZSlZ2SDmhsLs7t5w+I2yIozwjwwGxjFcZkflh+iz1L7VBtW+jzc3pzM8CwoyGUM7hBcjz5YIKqTSBaWrWWbTxcVZ6IHhgYNMAZ6Vv7ADEk4J9jgUBE1TpiConQzls5WJji2IHStN+8vErCEzzpSqlEVtnVG0dylnZEioQmMf7y7jnzXMTEDjBF/aHAG/n/YHD54us8xDE7WjurLVXuPDDlAjIiUzPyTcY8ImRKSBAZH0PHJAFF4+/jfDwd2wl5c5jw8xB9cSAzVeeL0tleZ8gpYik6yRlQp0KMSkrXb3uq2EXvpv8LmWluWNFEIAqBDcBqnSMTiQCEH7R/D2lu1ItkJZdBWm+aWkj0qq2YjtnZbkKawbvf4TQ39/d3d/Pf/TZFVjg+xID22l/jv6aiyYOP4DECBNQX9HgKMx3VRAB0Q5k9nNiiYCUICaA4p84ejTCp/25zQ21zCCgvHxmJUZAoYEJkOcLLzQMDE5fsRcaLDQ+BA5to8IwImCA4qcn7cePX6cSAG8zI0nj8WJ6fJQqHeMdiZH5dPk3IXyjOf/rkC5fhF9QUFp69jkoNOSsLBdIzOD9ScGcf+gio/GiQ+dfjxcYMV2SAN6O/YGJzcaJQuoSARXfFDkiwztiYjPzw8opNZcSaTBGRpYnwhwT+59/WEijfux/heI4URk+8+aamZWzzTKNPUyebxKZwRURwskLbSqatCj+nTsPCQJ8/Dyn35kAY27nV7VaAiZdDAjT03gUfdLl79rVbcxw5M+mvjykMEePSyutikPpKkvXEtkxzwQA2wzANv6jT0RBYJcggLfT/ofroKK2NSOi4ZOHOEBAaE650VEUkwkC+LGNf5SkJRFwzWiaGm08QbW+xxxZe/dWOvdmhs901EzP1BAgpO9UR74U4sBZbSYm4KNtOz8iIAlLSlGVSgoB/vUDQWb+bSAIGMnnTlL0ivgcXP62Tbu6zZE54bDW+toPI6CrNC6utPQcGgEsXRE/CGDlxe1Tt8Ay8NAtz9KffWBmtpXCv/NO1RFip9G80+hfh+MTAfmFFbGO0AUdMZnhsbPLUzLSMQjQ05kY5J8YGUv7L2scfaB/XOMLtH+8MysWU9tAT0tfX7gkwGgdIaWvvlZZEPAhj4DPQIDOoYIJ2GdsQFkiDDLcBJyvFjzE5+Dmtys7qDwW1ZIgAFJza0HaCIRf+v3XisMD1+IKAoRIsaRmp2/nP/pEzPAkgM3TcAecOFwc35Gf73C5CuubY9rDQQCMkVPgCms04kVkfvhs3v/9/nHj+hE/E1CE+LmYt69vtyQAOWSY1UkCZPyybQ7KkupCP9yG+ImAG2vUyXYyiLyCCfBvaPDXEGA8Xy14iM9v67Tj4u++dPduJiCgYF7p2WdXVZ177tenfT9CODzw58Wx9OQMlq/9ppvsvufSn/EVmAECKEGnOkIMP7TN/9A1fHwiIL+jor4+ph7FuUxAeUo+EwBvcBDA+7//Pp8PEyDiZ4AAPl8iQErfE4cPc8GSBNr4hDK/Wrb9ieOp8YGAffvEF078NmDpeI1a4DC1vjYxJ5YQDuArMCuwC4MItjaY7Kq6lmtz5VOApScr2DE3QcvjP4APPZ9fYpyyljdetMkWFnJ2lghIsVgc+UYjnoL+QeGz9ftP5cd/bCxYIJhk1tn6F7XC+qzzeP32K94ABAEXAyCApOONkwGRtT1rSLxaPQzAP4qwdKk34wvOEn/xKnDUmzBGB9477w4gj7frfX01hg8MvMbfYRZLmHAX4/35DfyOydjbo5pZJn1zvSXUUmEBVb4L6D+f/yMKQKYRvPKSBgeTUKp7gdT0c3XSNSlaZqzjo4upse0DAVFcDHytgmt3rwDqLNQXbekwAaLAwky1x3w8ofRVua/P4iImwwcGNQ198OBBLy2mMlQSnQGLF/vOnD5scyCjTPEpVnZhFjRtdkrbHX8U4JVUUVFfUeF4z2wjWHN9NtZ5SNFop8PBZXzF6dmjID0/ePjh4vLyYsXn4davd0mI/uKh8CWm2Wwz5uN2ki8xS1tRsMDHQy2ytnfzTn3tMLLQhocNAcETpOPEwaHeBz0IQLM5Q5ixzX4iIzVjZUZ2yr0ls8gQvEw6RNCdZm8+vmLjbXZjsGfbnTGdunBEgYa31/6KehdKS9dMkVlfH79JfdousCSnK7ANPviRlgBIz4TmDx7+xlUyq6T+vpkzUeM0EwSkKSil2l2y2AQBNTWoxiSLTZa2ggA+HipRAf65DxABOBN3HpMImGS42cClc+w4sXmoNfVlDwI4cDm7Ezt7UmpMQkRIRMLqEkYZHCJYOmeGH99xfDcISDWkTvHwPU7npplhskADBDhcaE5fY7EycimrmqvxCU5yBoIAZ0YqbEKH5W678VgFcsz7R4/u3MsIy7ZZFaQCtZMFAYsWGY3bXmACRgoCjGaWtg8h06Ma3N3+4Dlau/xRAd6CAJmCIQJsqanW0zUE5GjihxvdsOyYkEC/iLensB98SZl0iNiLG+bx3cczZ4832g1TZPxyBKRsYTM04XiBr0CM0+VyrrmYSwKmjB+6o2CS77qFC5WSl2hnW1tloiUE99yQoIuoDW3WrP19eAYMGwY16uuN2IDsXbtkSQwREGrYtuydDiLgHZNa22tmKawYQsRUiIIFs2cWOMgA3Ky+tuy2W63eY4d4jgCKX5qxPZFhD5oVaX9xeiPiBwGKQ0T4pszdxzcdnz0+WG2rpPoD5fMofiYgz4HLDygjYKhrfqDvsGTFwQEEVGbh8o84e5h950RuQ5vVtx8MjEP8RIA4YEJX6S7hQEG+xKGGmnfeWW5sJgLU2l4LZX0VApo3SkcIszZ+aeCw+D5gJq8Qcesv3t6bdyN9oBCwocKloKmpyTW4KmHx4mGLnVOyED9QdmxvZlvbk20gYNPu3cfDmQAZPxOwfosYfTTbRZ4kXhdQ/z6AEUfCYLz3QGDwsGS+/A8IAootCfh2+gUdIqlMI2B0H+KfQfFTZ6c6AjgLS77Eoc3L33lnUUcz+RKrtb0Wer86AmKE9jfrsrj06j5NQcMvYzdu5OsvQStKuGd3z8g0Bc7CzY/RyASobYAQckPCTdK3mJukqP6A70G4Aymf52W1EZRvsTWXtHM20hUSndEZVrQt4vKPFFJ58jdNfXPm9I07wZnJfaZt8maxU6D5PCKgbhkufkcz+RKTtJUE8PvlPeD55/kxcPfa0++RM/EA2d9ByRnuY8cV4RU2NSo1dcpULQHlhoxYEf4ZggAZ/jyE31g1NV+N/9iQ3aZp5Fs8nCDOn9sBRDl0SBSyxl5jgy/RZnWnQfunwdWcgPRG3NEgKviZkNs8XErJyW8coJo4jh+pWZNH29pVw88jX2I00eBGENRMvsQsRQUB/H4qxmasB2BuFp0jg+dmrefCxk4iAjhLTO5x08JgTD9pWpibAHiRWSIRvyDgSRDA8SN8ip8IcMdfXX0MBJBvscZHGN5iiJ8IyL5wTDYISLUB6n28FtpftrkxC0d98JCy+9e5peR57FEk8SkI0ElN8iVGaVxNjdFcCF9isV0QwNvXqklvgAjIkUOAAQImGW82KlVaIOACOKmOBwMqATnKUwA8yBEgKWACshQdn3kcbYDsW6w5v7UYeQSaqU6lEUBunLUCbxOGfr90A5qtjiqAYuqsu0yVkqjj9YBeatLmGmRlC4NCF7m3hwbR/zmPtq8FtPZm0bpaXsg/88sWNcuJ/81QGFCW01DA8k+iCsD+HrtwOhonqIh9pZgCYpghfIXF1RcNegLu1rVeb0+p2pDkmTcmWenO4QI2BXJIXRYVdUWS5h1508aqWXZAX2sszNDUz1uvgvXzKZf40MwX6R0puCXvVeC009T0uSZGL5aimlrgsbq2NdPARqFSAgp4++juYqdmsawwesRrpbPNs1Y4NcpiycbuLqcLv7OzKqfe8d6XG0UWF4Djg77WGFIaULPU6kQJpm0efXTtqZf4GFD8vkx6RwquRdYsEeI9aRSyppw2JYwHATiQphZ4rK5tDVnV6kt8gbQZcVuxHQEmInBgMyAIuIZqd6Ujg00bPhPgb8/KaiqrbGrLbNkNApAvp/dI5OprjSGllx9oKiiQWV8QgMB/+OabH14ngIBTLfGB0IXXGQjQOVLk0WSvcJTg/b1HjRmT3NWVfDWDCcDxNLXAcqkrV0y3UGKUVv4KS06k4a5IvsFGg82W4pTxny4IQPzI+E1sngil5yZABvhCtr2msrKsrL2sJbNpSWwYCHjpvQx1u77WGAQ0lXVtLaiSWV8i4BCmYcYJBtby8ckugn1ozf5iBHD8TIDekSKPJns1S4SMRU3pxStXagkAnZpaYNGuHjElLcIqCVhY2DCnetjWrajuRUbI2L1ypc3s3Mzxn75ZElDnP3L4yJ3NUHoKAcoVDsKZVFa2tcMvP65lScvUOx5JwdpRe1ezozwmS30CRslaY5WArtTcLrmEBxMw7hmgkVYgen2tCDg1JCRVU5w9wPEzAXpHCnah1SwRMgQP3ITkZDseusBz8V6cNVVrgQUBFYGrdwRWSHO0woVz6ue8m3z2OaVLUZxs6541q9uwsuH4McJxk5l+506sI9P+kcNJKofILyjPWI7CXB0IaI/tmUEE7G8JuyPSkIFs0XEpTVuJAG2tsSAgI7iKs54gAN/9ZwjjBAHpQnnWObOF9BZKEvFLAvSOFAoBSOLheIIAFDFnX6olQK4mp86vm8v37i2HYwET0DBnznx8P7efc24ptmMEVNhsIe4sKxFw/sSLzIdkgYM+CxtKBLS0NM3vw11uMBNfgUhaNkuugLYaI0CNX0rpAy1dUWVx4v0g4NFHrxUj4DUQcKcgIDUqCgSYFQIGZPyt75r0jhRUIHF/ibpECBEA45mNl3KPPAgQq8npCDBmwARItKlRre2cBvpl0Ps4B2zrtmVPkPFJApBTbTbX1TWPBAH6goWhWI+wMhMFUC0tRwaXbAYBuP4Z6nS5rtaYf0scaKqqKsX7FQLoHnBtx2uCAGVPbvNKZwKMRhl+77smvSPFipmo9OD4BQFGIDk7N5mPgQssaoU1tcB6H18QUN9O8QNzh3LACcPUggQmgB4AdTv9rxl+1clLbnh3pq3bvHl+S8sgsGTzbBCwyuJu6zHX6muNJ9MSH+/jAPx+IgC3vh8OH0b8TADf1QFaLg1marcyAQNMQG8rCNA7UqygUieO/1U+Ht+YduzINQv4i1phtRYYBEzx8PFFbW77EqXN7N2rva/tDtEvqWH+uyU3QMDqrErG5vDNRMBe7ZoarfpaY7HEh/r+9fT4B15nEAGA6LYGmACcungMAia9IwXXInMWex4fz6wWTwgChhJyGd6EC7QqDTB5ojVNV5BAVN+od3AANJP0c8NUeTo7r3U8jqsuqaGrNZZaW33/ep37WR5B02amb03TO1LQXis2cIGEPF8mxw0vo4TSO6lRngycm8f6c3mL895Tz2D7IGRuUvQR8i6Tvr46qXoGgAINLomYCgz19qw/GeMMv2l8uPNxxQhZ3/ZmtCkwQ1pbLM+6cQvDKODuHLuccBrjlFL6KkDbR6f3Fc5YzwVaAi7X3WshTRmyE9NUbFxsSHwPwJewweXaHw2dW78SSBPS9Ko6T6l6BrLHqATOEXg6zDvbZseyvAEy6zu2MiElISTFnuh0kt1g1lSeKFXPx6Jvw4MpitYW5Rb9+bO5GytfIX3VeISPsFqwIXyJ9b7C/kgZKVnrzrIyFwhwNyPj7rTMlFecQrGvATrLmpYhY5SV5YLUTGNpSgURNVqpCgJycvCDTVr0gQCbPcAOF6ULpZMUChsnTAAdYoa/CATgt4Z6PhabgWtm+bUgQLPuDlas0J0/CEBgmtXx1HiEj7BnBsq80+slt0cwrW35yB14g7L/fU1N5SBgUd225prmZvzT8QIIWJyBq4/w9zaVHXiBCWgX8Z+tFEQs12QYckHADcgv5CN+SUDqJVi2WcQPAi5IwHjxi9pRVNQCFE2FoUIGtxKuIkxPeiUxalSq36jixYziFZ9tOwQoo+DDZyUBLpdRIQAXViN9RTx3bdnyKKUh7lrrE8J1pAUFUqh54bHEEBO6L92xXsaP3ekNdxIBzc11zXUdy5mANcZVxmJx+V9A3osIcLnjv8SeS1ng5WrbSOhS/ZIYdlsCHtDSIv/C8UUJiVEbEzc6isKZgLAVM+1m+xrCQWBNdN4jAci8+zqJEJTu3qp+PTRSuK4C+dHl/BoE0Fp2Bw4I6QsCEM2WlIwMUPDoQyCACyZm4IRYamsJoCzFS3dgvh1QZpxLvkCWt3lnc0dH3aLlNcsQcF7kquJVuPxNB16QBLTL+M+eYIew4CzwIqVSDwREqPETAUNxBTTl9xfMjSzescNZviM8fMCR4ggHAZhtUOJ/GQQsDh6VGuI7cxURsMZNgHL8IL5gD3f+8ENPA7JMd93Jnz8aNSaHxep44oLiB3IK4gcBomAibdy4UsSvJ+AOEKAvOJisLqbGAa/A+HfSt5/iv4wIcHH8IwKy3W12y/3l+TEBFL+6GpzNMwucixHEX38QMLBsERGAG4wHAaHOmc7a6Rw/E6B9vyRgeWddTc+yh4gAWcDR3y+lr/ARvj09/faHeLuQ3jNQyS1Xm5u28WfCbwI/t+oLDkiaNjMKmwUBaxo6cfk5fiKggeIfRj/OcEtpvhxZ4EWaR23hkJynn0b80qP0uTAmQOMHEO1E/JVU4VS0bFlReNjcL38W+Jjwc+/4jW/nTg/FuuF8fuvmHpSOQwC7zrBP8H03d7bcdwNPtbEZm0b6Ch9h3Ai2KFNxbqXGaX0vvXRFAB7L0REBYt21ukV0xfPqcfkXyfiR9Y12pQ3zTbCiBubQRcOx/+XXLJqjdWgAAc/h+iN+JmC2TY2fgBGgVHjtxlK54WGn8AkOsEepr1es4tEB5AEHo0Wef0ts7O0iQM5Sq6vjgQB1KpK2mw3ysy2M0JPa5k7K8roNKd4hmOZ0lnVqV6ML2+Vn99/ZXDdyotj/suWeDg1UEIG7AB4CjNlmXe1wvJPL3ABRkPFPPsG3riIo3xEQIGcZRZhEgPoUoP312y93t/HJ1eZOMifTFRwAJi2ODr7g8frdd9+/6jLs7y5AMHmC5B+yzO4SB5Jz0gwil0ACkHPCEv/kE6zvslOFsgCXVyAHitU5dFJabscO2iy211kmT4zXFUioApyxoiF4UrCKKVfrs7TwRvFwJt7Rdvqxj4cc26Skvrm0gl0hNrAWlu+9SpGm+uONB7T11nkEFvj4B2jV7T958uPT5k4+7zvluumPZxZQzdSefEVncRHlKRXvhLXMI8WPKHeeFfWpU66+2I2bxuuztDeopjkPA2+dIWt9xSIwsWFsniYW1SA5PFYWSLg/T18wofcN5l+D5JPlqidtkGTq3OXx+ZM7MLkB++7QDp7BMZ3sU5zqB6td5TUIeH29RyelT9QkjfEuCPDw+gIBWEYZi2lLPL5dn6X9vkK7uvqun0St78bg2KL89vZYIgB5e9EoCCFABCRkB4waFSgelWVy9ThVCut9gykfkJ7TiQVPmnqK1tyfZJrfE9ilfj4I2LFxdce+jn3+b/ASG3x+2Zj/svtJn+JRtByesj8IwK+kyFSLgoU+fl1pJcDoRrqTNvanpKutuUBxvXVXdwgYUAjQL2xMxcvrqhcutNqruc3tmFzSIraoKbCqpWg2ETBTNEqyEPLB9Ugd5et2f6tkSyMH4AQc0eK5H1NREWHj43OOL316J9DUfpAIWNJXUqDWOk/uwFjZV7gv1PLGp5IAX7vdzzfAHjJB+BRnj4Kxsbrw8hkPbXvo0ewQBe9CKnaljR5dMoj4B68dfcTgqbUt9fVL2g3Z5yhfKzYsMDaT+dghiyQgrQWPgVBrbkvuu9W9+bLWt6ioottNADu9BUIOEwF2q93X94QEapI4feLOOhs5/u6KCmuMQkBDw/T0+9e0d7b3HLw/2tQQtHB/ybw0WTsMAlZvWr3vDf+gjn1MAElfu1+C1c8vdQJtlxdMXXj5jIefKXxw/c8+Er1QSl1bYex73eC4/bcNjpMEpNTUpIiChvr65x21BssxBXRArK6N+M+/iKRv647OzoUNDXMKl7TX7tmDEeBYwKvLhYe3NLWAAG7MdHG36BgmIISywr7utrloJ8evpt0pfuSpkaN2kfSFUnQ1dC5Ys6aop70FvxVMFqyEg4qVNFkLfB4TsG/fGxQ/pu9J+dl9rX7D7NZRtF1XOwwCHq149MEv8UoABPAIaBwcd+2rg9cyAXyNm2XBQkPnlztiUqBZBIbwCGCLjzp/MxPgKK+GCij0r9/elrO9N56qLlnptBw4MBg+m5e8cFH8IECt5j7BGH7iininev1PT9osa4PxiypGSGsQ0NlQ1g4CsEY6pDKPgMZ5aUoW+rw3Vg+sw7y1nL4XBASEWBP8Un1puz5r7XXWaw8+mNJtVbDQZ8LWNEUJv/pqY3+k+v0X94DumApHtLpiob5NjdvcPr7utsJaavOSBIQTAZktLWeFzz6dZmpcFH8ZF0EtjaCeYVmQgIWTk4o1M4+VWVPNuuODgPbOpibcAfct20cEzJ+zv0TMoigEVK/m+CUByDonJEwYAWfJS2i7LmsNAh5c/60GV/gEY4EkjVsc33SgvbDEHdTXqlvxFFgQPUSF3pzse9z+GVWEgp9AgIj/0ieBcNPp90xfsMDF/cJXEgEbIsoA8l0mxA3qzdN4Ieh3VOmNLG9WT1N7T0/PvmUvEwFL+maUqtIZBLy9eqMIXxKAeO2pVmvCKN6ul9pev6z/9lktAd471BwtcF6e6vIEHkBAyu54TfzxenMyOFMzygWGTOXHP0HU+t56j3ITdF0IoJbX8/N88MiWE0sEb/1C0LfiPJwNrsCypvY3yHHC1FMwSiOVQQAeg7J8AzD9g7TGCPiOcYWCabqCB9XxVqAt3mPR1l9MOkD+aZ2Jz9CW+tL205OAQV43mBPQemmql776haClFI6Pjxbo1e1vMs31qDn4J2ntpZeKVgzkB6y+7tetEr2M7b0vM2B6JrerWdbLTxzBB+qzynqCshT4BfAMvX7JjPjElKypUxMdiZI3xV3CIrPEdDlOkyDmXj1yhMsfFOxou/XYx0mQ3sBUQH98fbxeeql4jq1h/vwGm1153bpDwaZO16ae3pdp4QG4aSvb3W1uFzWW9KHAAQUNgFrQYFINHAmmLMMW+sv4ovimN5htFVjj62HCzcDp8UYkiOm2K+6Cs3k1OpRVKlnhvPe43oHTvlSQ8X7UykPyNWFpkpDexe4CjgqrrbvCUIG/u7u7K1z6eEWBREKC6sBgt7UvXDjfliBf66XpyzcXw4UX5dlyu2JudrgR1lq37R+k6WwOXRY0cIpN9SF+NWuLdCDBrDD8xqZYUHpbwfe8dEJkfEa6IyMyIzIofDM1SIAAIRttstY3773pq5TjkTna+4unf6M5/lLZZrfaXcBRERGD6CNKbLaIwLLGTindu7oUKcxS0Wq1qw4MCWBgznxriHgNy1as2vQmgMLNuI4hgoDp0y9Us8Bk7tXYuB/3wMHGfhCgncpae5pYKFlK3XlHs7YYHzM+Zn5sPY3LWeZCEFCyEi1jW7bwyh5vtX6ptAF+DFSblMXYbObuzs5uKwhYtQrF2qNJqpOP8WlEsOpzvEFI7417Kzcvwn0QBEBDlJQsdux9zzXuSFl3EMULFMxQpDCEiJ/Nb1jACOswxYEhwTZ/DjHAr/F+Q4qM/+mON0EA1ieFR+aFQkoyAbj8TXPQlHek8dAHTMBTMn5MZgqhk91gtIv9s7Y8Rlj/li8oP8dvndkaE2M1SpdReIzqsr6FICCCYMzo6Ww6UiEIOHzg8OETh6+l2uM8nqVIxwDiLHJSFknv4tq9mzfvq2letjnMaQx1BZY4sVNZo6sisZDPZ96M0aPj4s5mKQxlZLdhPCOppUhFMICCgCXWEHptaG7GIBDxPx3XEX36zewRugBnL9vi6PL34RnY19j45utrP3n4ecKbEpdCGAHGhiVGaoDfjnsALr/lQf8P+L6UXm+hiSCcvkShrna4cKkwWcFPIXNPj9koCDgwsbFxeP+1JJ3xGvEXrzlYnIEs2ZqkY85KVHdnEQF1ze+AgIxIgyHCFpy7uqy5OAMEsI0vjZcROH8mAPEGQCj5ZZ/rlooh1iW33bbEGoXXMRUx3Rkcf08cLWV98kLJB+jyX4fLX0fT16d5ZpVp/UASxsaL68XqcTwCHnzrg5eZQb/qG1J4+Ct4K10bv4YAY4WrtrY+NHSFGAEnTvQfuZZylnjN8R8EA5QjjHZL6X3LQMDs4sgUw7JAIqAx0uEPAvj8S5EWl1KYpKEd9Xw0Ia9KRTDwwAMLU6PO9jZ0d3P4lOmJewME6KTkVa6SPmigvsbDb74mCFDjJwIGXU3AEQX70Umi+qQGpba/fLNqsksE97KUdsO0IUa47GCuqbbWbAmlgFHwcWI4jk6lt71uvwdRshOfpfyU6Ozra9rMXWaNByqaWppccUGQ0uL8x20dgaSxJIDiDaH4tVIxxLrwgQfmpIZ466WpXkp+4VooLj8qWCQBavyvjtvwjOfrL/yy/ahVW3yDfAKqM/j+z4Crr6VQ5yvMBAQCZloMGgFQVrgEXYX9OBoRoD8fECB/SvUAggBzs6UszlVcaGYCeK0KavbD/kzAqaUixsB1ty1J9e5Vbsp7qvYgw3GStCQp3NdY8vzrDBCgPvUIG3y6BLYKeAepbFrS/f27XlZshm9gRF/h6SsMAuRTgN7DBOArII7feKqCjHihH+QwYAL487qRpmMC9FL4r6Virgmo7WVAYP7Ue0ppif+1/4sTH7izrm5jsA0C+v2nELhEpJrhr1teTilEUCCOcvRortxpxYqkJOXopyrI0LflWdxrTwicJIUf2GCaq5WGSTC4nzZtndvyIgzgo2G7B2SNw1VXjQw9R/N+/epzQZM1OWZgnhszGJfq8MckTbGtbdIfXv82TD0xAzs00jDJiaxncIIsY1s3Nyy/PMgRCTsouR0ODVF+qpPt2P66ukOWBPX9l9cp6CkoaEk7z2io+YaADlfCVaNHqEBKqErGHa4QkD3l92xeZZWqAX+fku31b8M0vy8QpbCKFGYCVq97e906tvYhAiLb2spRmy+2gwBEfoni4njJ2MGYi5ZftDNhgnw/CLhIunuPXJ6WVjMZN9FOrRSeN8LdIgkwAUVFOQtynAvuKSrCC4Ph1z9+tRm6ugw2/MFg8Pq3QVnVsq+q3VlSImAdCEhel2tMTU5uRYNCZnkbehPk9pBsuwLy6LzQ1BlxzfKROy3yfweDAMR/jSwrWT7ZuDLBMCBvgj/9tHU8CKDoq6q8CRczAU6MAAyBBQvwgi/879lRUfRvw39BgCuwqa9MWeh4jkkSkJycm1yLv0BAZmI59WZI6asvUKC8PFWLi6zGyCtAgDR3H3PObQ+keUfFzAqJql5XnZzMbnCt80Yg/LRzq6puSsPEEAgQGOjJFH8wEH4dExx8MS7/f0JA55KyOftlv8WGsj3JYi2L5GRj7eNvm0FAW2Ybxf+LlL46qUq+vX2B15xPFilw9Zl43uV1irm9IMAeMmuW3Sj5hRIUBFS99VZV2lg3AZkopJQMSJ/jm25KMPxHBPS0NO0vk+eHE5wWLK29UpPffhwjQC999W1uuIeU1cD1REwlnT8ZBMjhf+W5D4AAc8isAnM1H5L79ogA79KqHxdV/aQSgPjBQLgkgG8D+Ps/ImAJrv+c990LKU9bLU82udZci2puvfRtL9Sux19/namzERUFO/3FdGBklljiYqRKAHyWv8Is4k8//cQNGCDAG6iqajmGphVJQHgPCBhQRkAqf/v/s3vAEjV+QQDHT0DG7vFWvdTEkFduGDxiBiOoXWLxGqVgQV3i4qZzHzCVggBzzziNFJ43huMvrfqpCk07IICR2TMwHwNAfQoA/9VToM+15HzNQspz8fgHkiUNraeQvu48MGDqp6fgYnfFQrS6xMWFY667rdTbaK45wBBGF5fNGKN1uU0GAYz5bh1wCS484T/TAUdNk7ULKSuFvK0SJ0lfHS677MzyFZrV1NQlLi6Aj9dYb3+T55IXM9CxogAcV/3vSvC/Bj1utPD6n/EnnaQbrf6BCX0AAAAASUVORK5CYII=)}.react-tel-input .ad{background-position:-16px 0}.react-tel-input .ae{background-position:-32px 0}.react-tel-input .af{background-position:-48px 0}.react-tel-input .ag{background-position:-64px 0}.react-tel-input .ai{background-position:-80px 0}.react-tel-input .al{background-position:-96px 0}.react-tel-input .am{background-position:-112px 0}.react-tel-input .ao{background-position:-128px 0}.react-tel-input .ar{background-position:-144px 0}.react-tel-input .as{background-position:-160px 0}.react-tel-input .at{background-position:-176px 0}.react-tel-input .au{background-position:-192px 0}.react-tel-input .aw{background-position:-208px 0}.react-tel-input .az{background-position:-224px 0}.react-tel-input .ba{background-position:-240px 0}.react-tel-input .bb{background-position:0 -11px}.react-tel-input .bd{background-position:-16px -11px}.react-tel-input .be{background-position:-32px -11px}.react-tel-input .bf{background-position:-48px -11px}.react-tel-input .bg{background-position:-64px -11px}.react-tel-input .bh{background-position:-80px -11px}.react-tel-input .bi{background-position:-96px -11px}.react-tel-input .bj{background-position:-112px -11px}.react-tel-input .bm{background-position:-128px -11px}.react-tel-input .bn{background-position:-144px -11px}.react-tel-input .bo{background-position:-160px -11px}.react-tel-input .br{background-position:-176px -11px}.react-tel-input .bs{background-position:-192px -11px}.react-tel-input .bt{background-position:-208px -11px}.react-tel-input .bw{background-position:-224px -11px}.react-tel-input .by{background-position:-240px -11px}.react-tel-input .bz{background-position:0 -22px}.react-tel-input .ca{background-position:-16px -22px}.react-tel-input .cd{background-position:-32px -22px}.react-tel-input .cf{background-position:-48px -22px}.react-tel-input .cg{background-position:-64px -22px}.react-tel-input .ch{background-position:-80px -22px}.react-tel-input .ci{background-position:-96px -22px}.react-tel-input .ck{background-position:-112px -22px}.react-tel-input .cl{background-position:-128px -22px}.react-tel-input .cm{background-position:-144px -22px}.react-tel-input .cn{background-position:-160px -22px}.react-tel-input .co{background-position:-176px -22px}.react-tel-input .cr{background-position:-192px -22px}.react-tel-input .cu{background-position:-208px -22px}.react-tel-input .cv{background-position:-224px -22px}.react-tel-input .cw{background-position:-240px -22px}.react-tel-input .cy{background-position:0 -33px}.react-tel-input .cz{background-position:-16px -33px}.react-tel-input .de{background-position:-32px -33px}.react-tel-input .dj{background-position:-48px -33px}.react-tel-input .dk{background-position:-64px -33px}.react-tel-input .dm{background-position:-80px -33px}.react-tel-input .do{background-position:-96px -33px}.react-tel-input .dz{background-position:-112px -33px}.react-tel-input .ec{background-position:-128px -33px}.react-tel-input .ee{background-position:-144px -33px}.react-tel-input .eg{background-position:-160px -33px}.react-tel-input .er{background-position:-176px -33px}.react-tel-input .es{background-position:-192px -33px}.react-tel-input .et{background-position:-208px -33px}.react-tel-input .fi{background-position:-224px -33px}.react-tel-input .fj{background-position:-240px -33px}.react-tel-input .fk{background-position:0 -44px}.react-tel-input .fm{background-position:-16px -44px}.react-tel-input .fo{background-position:-32px -44px}.react-tel-input .fr,.react-tel-input .bl,.react-tel-input .mf{background-position:-48px -44px}.react-tel-input .ga{background-position:-64px -44px}.react-tel-input .gb{background-position:-80px -44px}.react-tel-input .gd{background-position:-96px -44px}.react-tel-input .ge{background-position:-112px -44px}.react-tel-input .gf{background-position:-128px -44px}.react-tel-input .gh{background-position:-144px -44px}.react-tel-input .gi{background-position:-160px -44px}.react-tel-input .gl{background-position:-176px -44px}.react-tel-input .gm{background-position:-192px -44px}.react-tel-input .gn{background-position:-208px -44px}.react-tel-input .gp{background-position:-224px -44px}.react-tel-input .gq{background-position:-240px -44px}.react-tel-input .gr{background-position:0 -55px}.react-tel-input .gt{background-position:-16px -55px}.react-tel-input .gu{background-position:-32px -55px}.react-tel-input .gw{background-position:-48px -55px}.react-tel-input .gy{background-position:-64px -55px}.react-tel-input .hk{background-position:-80px -55px}.react-tel-input .hn{background-position:-96px -55px}.react-tel-input .hr{background-position:-112px -55px}.react-tel-input .ht{background-position:-128px -55px}.react-tel-input .hu{background-position:-144px -55px}.react-tel-input .id{background-position:-160px -55px}.react-tel-input .ie{background-position:-176px -55px}.react-tel-input .il{background-position:-192px -55px}.react-tel-input .in{background-position:-208px -55px}.react-tel-input .io{background-position:-224px -55px}.react-tel-input .iq{background-position:-240px -55px}.react-tel-input .ir{background-position:0 -66px}.react-tel-input .is{background-position:-16px -66px}.react-tel-input .it{background-position:-32px -66px}.react-tel-input .je{background-position:-144px -154px}.react-tel-input .jm{background-position:-48px -66px}.react-tel-input .jo{background-position:-64px -66px}.react-tel-input .jp{background-position:-80px -66px}.react-tel-input .ke{background-position:-96px -66px}.react-tel-input .kg{background-position:-112px -66px}.react-tel-input .kh{background-position:-128px -66px}.react-tel-input .ki{background-position:-144px -66px}.react-tel-input .xk{background-position:-128px -154px}.react-tel-input .km{background-position:-160px -66px}.react-tel-input .kn{background-position:-176px -66px}.react-tel-input .kp{background-position:-192px -66px}.react-tel-input .kr{background-position:-208px -66px}.react-tel-input .kw{background-position:-224px -66px}.react-tel-input .ky{background-position:-240px -66px}.react-tel-input .kz{background-position:0 -77px}.react-tel-input .la{background-position:-16px -77px}.react-tel-input .lb{background-position:-32px -77px}.react-tel-input .lc{background-position:-48px -77px}.react-tel-input .li{background-position:-64px -77px}.react-tel-input .lk{background-position:-80px -77px}.react-tel-input .lr{background-position:-96px -77px}.react-tel-input .ls{background-position:-112px -77px}.react-tel-input .lt{background-position:-128px -77px}.react-tel-input .lu{background-position:-144px -77px}.react-tel-input .lv{background-position:-160px -77px}.react-tel-input .ly{background-position:-176px -77px}.react-tel-input .ma{background-position:-192px -77px}.react-tel-input .mc{background-position:-208px -77px}.react-tel-input .md{background-position:-224px -77px}.react-tel-input .me{background-position:-112px -154px;height:12px}.react-tel-input .mg{background-position:0 -88px}.react-tel-input .mh{background-position:-16px -88px}.react-tel-input .mk{background-position:-32px -88px}.react-tel-input .ml{background-position:-48px -88px}.react-tel-input .mm{background-position:-64px -88px}.react-tel-input .mn{background-position:-80px -88px}.react-tel-input .mo{background-position:-96px -88px}.react-tel-input .mp{background-position:-112px -88px}.react-tel-input .mq{background-position:-128px -88px}.react-tel-input .mr{background-position:-144px -88px}.react-tel-input .ms{background-position:-160px -88px}.react-tel-input .mt{background-position:-176px -88px}.react-tel-input .mu{background-position:-192px -88px}.react-tel-input .mv{background-position:-208px -88px}.react-tel-input .mw{background-position:-224px -88px}.react-tel-input .mx{background-position:-240px -88px}.react-tel-input .my{background-position:0 -99px}.react-tel-input .mz{background-position:-16px -99px}.react-tel-input .na{background-position:-32px -99px}.react-tel-input .nc{background-position:-48px -99px}.react-tel-input .ne{background-position:-64px -99px}.react-tel-input .nf{background-position:-80px -99px}.react-tel-input .ng{background-position:-96px -99px}.react-tel-input .ni{background-position:-112px -99px}.react-tel-input .nl,.react-tel-input .bq{background-position:-128px -99px}.react-tel-input .no{background-position:-144px -99px}.react-tel-input .np{background-position:-160px -99px}.react-tel-input .nr{background-position:-176px -99px}.react-tel-input .nu{background-position:-192px -99px}.react-tel-input .nz{background-position:-208px -99px}.react-tel-input .om{background-position:-224px -99px}.react-tel-input .pa{background-position:-240px -99px}.react-tel-input .pe{background-position:0 -110px}.react-tel-input .pf{background-position:-16px -110px}.react-tel-input .pg{background-position:-32px -110px}.react-tel-input .ph{background-position:-48px -110px}.react-tel-input .pk{background-position:-64px -110px}.react-tel-input .pl{background-position:-80px -110px}.react-tel-input .pm{background-position:-96px -110px}.react-tel-input .pr{background-position:-112px -110px}.react-tel-input .ps{background-position:-128px -110px}.react-tel-input .pt{background-position:-144px -110px}.react-tel-input .pw{background-position:-160px -110px}.react-tel-input .py{background-position:-176px -110px}.react-tel-input .qa{background-position:-192px -110px}.react-tel-input .re{background-position:-208px -110px}.react-tel-input .ro{background-position:-224px -110px}.react-tel-input .rs{background-position:-240px -110px}.react-tel-input .ru{background-position:0 -121px}.react-tel-input .rw{background-position:-16px -121px}.react-tel-input .sa{background-position:-32px -121px}.react-tel-input .sb{background-position:-48px -121px}.react-tel-input .sc{background-position:-64px -121px}.react-tel-input .sd{background-position:-80px -121px}.react-tel-input .se{background-position:-96px -121px}.react-tel-input .sg{background-position:-112px -121px}.react-tel-input .sh{background-position:-128px -121px}.react-tel-input .si{background-position:-144px -121px}.react-tel-input .sk{background-position:-160px -121px}.react-tel-input .sl{background-position:-176px -121px}.react-tel-input .sm{background-position:-192px -121px}.react-tel-input .sn{background-position:-208px -121px}.react-tel-input .so{background-position:-224px -121px}.react-tel-input .sr{background-position:-240px -121px}.react-tel-input .ss{background-position:0 -132px}.react-tel-input .st{background-position:-16px -132px}.react-tel-input .sv{background-position:-32px -132px}.react-tel-input .sx{background-position:-48px -132px}.react-tel-input .sy{background-position:-64px -132px}.react-tel-input .sz{background-position:-80px -132px}.react-tel-input .tc{background-position:-96px -132px}.react-tel-input .td{background-position:-112px -132px}.react-tel-input .tg{background-position:-128px -132px}.react-tel-input .th{background-position:-144px -132px}.react-tel-input .tj{background-position:-160px -132px}.react-tel-input .tk{background-position:-176px -132px}.react-tel-input .tl{background-position:-192px -132px}.react-tel-input .tm{background-position:-208px -132px}.react-tel-input .tn{background-position:-224px -132px}.react-tel-input .to{background-position:-240px -132px}.react-tel-input .tr{background-position:0 -143px}.react-tel-input .tt{background-position:-16px -143px}.react-tel-input .tv{background-position:-32px -143px}.react-tel-input .tw{background-position:-48px -143px}.react-tel-input .tz{background-position:-64px -143px}.react-tel-input .ua{background-position:-80px -143px}.react-tel-input .ug{background-position:-96px -143px}.react-tel-input .us{background-position:-112px -143px}.react-tel-input .uy{background-position:-128px -143px}.react-tel-input .uz{background-position:-144px -143px}.react-tel-input .va{background-position:-160px -143px}.react-tel-input .vc{background-position:-176px -143px}.react-tel-input .ve{background-position:-192px -143px}.react-tel-input .vg{background-position:-208px -143px}.react-tel-input .vi{background-position:-224px -143px}.react-tel-input .vn{background-position:-240px -143px}.react-tel-input .vu{background-position:0 -154px}.react-tel-input .wf{background-position:-16px -154px}.react-tel-input .ws{background-position:-32px -154px}.react-tel-input .ye{background-position:-48px -154px}.react-tel-input .za{background-position:-64px -154px}.react-tel-input .zm{background-position:-80px -154px}.react-tel-input .zw{background-position:-96px -154px}.react-tel-input *{box-sizing:border-box;-moz-box-sizing:border-box}.react-tel-input .hide{display:none}.react-tel-input .v-hide{visibility:hidden}.react-tel-input .form-control{position:relative;font-size:14px;letter-spacing:.01rem;margin-top:0 !important;margin-bottom:0 !important;padding-left:48px;margin-left:0;background:#FFFFFF;border:1px solid #CACACA;border-radius:5px;line-height:25px;height:35px;width:300px;outline:none}.react-tel-input .form-control.invalid-number{border:1px solid #d79f9f;background-color:#FAF0F0;border-left-color:#cacaca}.react-tel-input .form-control.invalid-number:focus{border:1px solid #d79f9f;border-left-color:#cacaca;background-color:#FAF0F0}.react-tel-input .flag-dropdown{position:absolute;top:0;bottom:0;padding:0;background-color:#f5f5f5;border:1px solid #cacaca;border-radius:3px 0 0 3px}.react-tel-input .flag-dropdown:hover,.react-tel-input .flag-dropdown:focus{cursor:pointer}.react-tel-input .flag-dropdown.invalid-number{border-color:#d79f9f}.react-tel-input .flag-dropdown.open{z-index:2;background:#fff;border-radius:3px 0 0 0}.react-tel-input .flag-dropdown.open .selected-flag{background:#fff;border-radius:3px 0 0 0}.react-tel-input input[disabled]+.flag-dropdown:hover{cursor:default}.react-tel-input input[disabled]+.flag-dropdown:hover .selected-flag{background-color:transparent}.react-tel-input .selected-flag{outline:none;position:relative;width:38px;height:100%;padding:0 0 0 8px;border-radius:3px 0 0 3px}.react-tel-input .selected-flag:hover,.react-tel-input .selected-flag:focus{background-color:#fff}.react-tel-input .selected-flag .flag{position:absolute;top:50%;margin-top:-5px}.react-tel-input .selected-flag .arrow{position:relative;top:50%;margin-top:-2px;left:20px;width:0;height:0;border-left:3px solid transparent;border-right:3px solid transparent;border-top:4px solid #555}.react-tel-input .selected-flag .arrow.up{border-top:none;border-bottom:4px solid #555}.react-tel-input .country-list{outline:none;z-index:1;list-style:none;position:absolute;padding:0;margin:10px 0 10px -1px;box-shadow:1px 2px 10px rgba(0,0,0,0.35);background-color:white;width:300px;max-height:200px;overflow-y:scroll;border-radius:0 0 3px 3px}.react-tel-input .country-list .flag{display:inline-block}.react-tel-input .country-list .divider{padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid #ccc}.react-tel-input .country-list .country{padding:7px 9px}.react-tel-input .country-list .country .dial-code{color:#6b6b6b}.react-tel-input .country-list .country:hover{background-color:#f1f1f1}.react-tel-input .country-list .country.highlight{background-color:#f1f1f1}.react-tel-input .country-list .flag{margin-right:7px;margin-top:2px}.react-tel-input .country-list .country-name{margin-right:6px}.react-tel-input .country-list .search{position:sticky;top:0;background-color:#fff;padding:10px 0 6px 10px}.react-tel-input .country-list .search-emoji{font-size:15px}.react-tel-input .country-list .search-box{border:1px solid #cacaca;border-radius:3px;font-size:15px;line-height:15px;margin-left:6px;padding:3px 8px 5px;outline:none}.react-tel-input .country-list .no-entries-message{padding:7px 10px 11px;opacity:.7}.react-tel-input .invalid-number-message{position:absolute;z-index:1;font-size:13px;left:46px;top:-8px;background:#fff;padding:0 2px;color:#de0000}.react-tel-input .special-label{display:none;position:absolute;z-index:1;font-size:13px;left:46px;top:-8px;background:#fff;padding:0 2px;white-space:nowrap}.form-dropdown {
  position: relative;
  width: 100%;
}

.form-dropdown__trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  background: #ffffff;
  font-size: 14px;
  line-height: 120%;
  letter-spacing: 0;
  font-family: "Inter-500";
  font-weight: 500;
  color: #111827;
  cursor: pointer;
  text-align: left;
  box-sizing: border-box;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.form-dropdown__trigger span {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
}
.form-dropdown__trigger:hover:not(:disabled) {
  border-color: rgba(32, 30, 82, 0.35);
}
.form-dropdown__trigger:focus-visible {
  outline: none;
  border-color: #201E52;
  box-shadow: 0 0 0 2px rgba(32, 30, 82, 0.12);
}
.form-dropdown__trigger:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.form-dropdown__trigger.form-dropdown__trigger--placeholder {
  font-family: "Inter-500";
  font-weight: 500;
  color: #9ca3af;
}
.form-dropdown__trigger.form-dropdown__trigger--open {
  border-color: #201E52;
  color: #111827;
}
.form-dropdown__trigger.form-dropdown__trigger--error {
  border-color: #dc2626;
}
.form-dropdown__trigger.form-dropdown__trigger--error:focus-visible {
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.15);
}

.form-dropdown__chevron {
  flex-shrink: 0;
  color: #201E52;
  transition: transform 0.2s;
}
.form-dropdown__trigger--open .form-dropdown__chevron {
  transform: rotate(180deg);
}

.form-dropdown__list-wrap {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 40;
  background: #ffffff;
  border: 1px solid rgba(32, 30, 82, 0.12);
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(32, 30, 82, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
  overflow: hidden;
}
.form-dropdown__list-wrap.form-dropdown__list-wrap--portal {
  position: fixed;
  right: auto;
  top: auto;
  z-index: 1000;
  min-width: 260px;
}

.form-dropdown__search {
  padding: 8px 10px;
  border-bottom: 1px solid rgba(32, 30, 82, 0.08);
  background: #ffffff;
}

.form-dropdown__search-input {
  width: 100%;
  box-sizing: border-box;
  height: 32px;
  padding: 0 10px;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 13px;
  line-height: 120%;
  color: #111827;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.form-dropdown__search-input::placeholder {
  color: #9ca3af;
}
.form-dropdown__search-input:focus {
  border-color: #201E52;
  box-shadow: 0 0 0 2px rgba(32, 30, 82, 0.12);
}

.form-dropdown__list {
  margin: 0;
  padding: 6px 0;
  list-style: none;
  max-height: 240px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(32, 30, 82, 0.35) rgba(32, 30, 82, 0.06);
}

.form-dropdown__option {
  font-size: 14px;
  font-family: "Inter-500";
  line-height: 120%;
  letter-spacing: 0px;
  font-weight: 500;
  margin: 0;
  padding: 10px 14px;
  font-size: 14px;
  color: #111827;
  cursor: pointer;
  transition: background 0.1s, color 0.1s;
}
.form-dropdown__option:hover {
  background: rgba(32, 30, 82, 0.08);
  color: #201E52;
}
.form-dropdown__option[aria-selected=true] {
  background: rgba(32, 30, 82, 0.1);
  color: #201E52;
  font-weight: 500;
}
.form-dropdown__option.form-dropdown__option--empty {
  padding: 18px 14px;
  text-align: center;
  color: #9ca3af;
  font-size: 13px;
  cursor: default;
  user-select: none;
}
.form-dropdown__option.form-dropdown__option--empty:hover {
  background: transparent;
  color: #9ca3af;
}.profile-date-picker {
  position: relative;
  width: 100%;
}

.profile-date-picker__trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  background: #fff;
  font-size: 14px;
  font-family: inherit;
  color: #111827;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s;
}
.profile-date-picker__trigger:hover:not(:disabled) {
  border-color: rgba(32, 30, 82, 0.45);
}
.profile-date-picker__trigger:focus-visible {
  outline: none;
  border-color: #201E52;
  box-shadow: 0 0 0 2px rgba(32, 30, 82, 0.15);
}
.profile-date-picker__trigger:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.profile-date-picker--error .profile-date-picker__trigger {
  border-color: #dc2626;
}

.profile-date-picker__trigger-placeholder {
  color: #4B5563;
  font-size: 14px;
  font-family: "Inter-600";
  line-height: 120%;
  letter-spacing: 0px;
  font-weight: 600;
}

.profile-date-picker__trigger-text {
  color: #000000;
  font-size: 14px;
  font-family: "Inter-500";
  line-height: 120%;
  letter-spacing: 0px;
}

.profile-date-picker__trigger-chevron {
  flex-shrink: 0;
  color: #201E52;
  display: flex;
  align-items: center;
}

.profile-date-picker__popover {
  position: absolute;
  z-index: 50;
  left: 0;
  top: calc(100% + 4px);
  min-width: 280px;
  padding: 12px 12px 14px;
  background: #ffffff;
  border: 1px solid rgba(32, 30, 82, 0.12);
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(32, 30, 82, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06);
}
.profile-date-picker__popover.profile-date-picker__popover--portal {
  position: fixed;
  z-index: 1000;
}

.profile-date-picker__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.profile-date-picker__month-year {
  position: relative;
  flex: 1;
  min-width: 0;
}

.profile-date-picker__month-year-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px 4px 4px;
  margin: -4px;
  border: none;
  background: transparent;
  font-size: 15px;
  font-weight: 600;
  color: #201E52;
  cursor: pointer;
  border-radius: 6px;
}
.profile-date-picker__month-year-btn:hover {
  background: rgba(32, 30, 82, 0.06);
}
.profile-date-picker__month-year-btn svg {
  flex-shrink: 0;
  color: #201E52;
}

.profile-date-picker__year-scroll {
  max-height: 240px;
  margin-top: 4px;
  padding-right: 4px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(32, 30, 82, 0.35) rgba(32, 30, 82, 0.08);
}
.profile-date-picker__year-scroll::-webkit-scrollbar {
  width: 8px;
}
.profile-date-picker__year-scroll::-webkit-scrollbar-track {
  background: rgba(32, 30, 82, 0.06);
  border-radius: 999px;
}
.profile-date-picker__year-scroll::-webkit-scrollbar-thumb {
  background: rgba(32, 30, 82, 0.35);
  border-radius: 999px;
}

.profile-date-picker__year-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px 10px;
  padding: 4px 0 2px;
}

.profile-date-picker__year-cell {
  margin: 0;
  padding: 10px 6px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  color: #111827;
  cursor: pointer;
  text-align: center;
}
.profile-date-picker__year-cell:hover:not(.is-disabled) {
  border-color: rgba(32, 30, 82, 0.25);
  color: #201E52;
  background: rgba(32, 30, 82, 0.04);
}
.profile-date-picker__year-cell.is-selected {
  background: rgba(32, 30, 82, 0.12);
  border-color: #201E52;
  color: #201E52;
  font-weight: 600;
}
.profile-date-picker__year-cell.is-disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.profile-date-picker__nav {
  display: flex;
  gap: 4px;
}
.profile-date-picker__nav button {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(32, 30, 82, 0.2);
  border-radius: 6px;
  background: #fff;
  color: #201E52;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}
.profile-date-picker__nav button:hover {
  background: rgba(32, 30, 82, 0.08);
}

.profile-date-picker__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 6px;
}
.profile-date-picker__weekdays span {
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  color: #6b7280;
  padding: 4px 0;
  font-family: "Inter-500";
  line-height: 120%;
  letter-spacing: 0px;
}

.profile-date-picker__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}

.profile-date-picker__cell {
  aspect-ratio: 1;
  max-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  color: #111827;
  cursor: pointer;
}
.profile-date-picker__cell:hover:not(.profile-date-picker__cell--empty) {
  border-color: rgba(32, 30, 82, 0.35);
  color: #201E52;
}
.profile-date-picker__cell--empty {
  pointer-events: none;
  cursor: default;
}
.profile-date-picker__cell.is-selected {
  border-color: #201E52;
  color: #201E52;
  font-weight: 600;
  background: rgba(32, 30, 82, 0.06);
}
.profile-date-picker__cell.is-disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}.profile-setup-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 30px;
  width: 100%;
}
.profile-setup-header .logo-container {
  width: 70px;
  height: 74px;
  margin-bottom: 8px;
}
.profile-setup-header .logo-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.profile-setup-header .app-name {
  font-family: "Inter-700";
  font-size: 24px;
  color: #ffffff;
  margin: 0;
}

.profile-setup-container {
  background: #ffffff;
  border-radius: 12px;
  padding: 30px;
  width: 100%;
  max-width: 844px;
  max-height: 80vh;
  overflow-y: auto;
  box-sizing: border-box;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  /* Match create-league phone + shared form-control-wrap from common.scss */
}
.profile-setup-container .form-control-wrap.create-league-phone-field {
  width: 100%;
  max-width: 100%;
  display: block;
}
.profile-setup-container .form-control-wrap.create-league-phone-field > .form-group {
  width: 100%;
  margin-bottom: 0;
}
.profile-setup-container .form-control-wrap.create-league-phone-field .phone {
  width: 100%;
}
.profile-setup-container .form-control-wrap.create-league-phone-field .form-control.phone-input-field,
.profile-setup-container .form-control-wrap.create-league-phone-field .react-tel-input input.form-control {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.profile-setup-container .form-dropdown {
  width: 100%;
}

.stepper-container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 40px;
  width: 100%;
  flex-wrap: wrap;
  gap: 12px;
}
.stepper-container .step-item {
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: opacity 0.2s;
}
.stepper-container .step-item.active {
  opacity: 1;
}
.stepper-container .step-item.active .step-circle {
  background: #201E52;
  color: #ffffff;
}
.stepper-container .step-item.active .step-label {
  font-family: "Inter-600";
  color: #201E52;
}
.stepper-container .step-item.inactive {
  opacity: 0.5;
}
.stepper-container .step-item.inactive .step-circle {
  background: transparent;
  border: 1.5px solid #DBDBDB;
  color: #71717A;
}
.stepper-container .step-item.inactive .step-label {
  font-family: "Inter-400";
  color: #71717A;
}
.stepper-container .step-item.completed {
  opacity: 1;
}
.stepper-container .step-item.completed .step-circle {
  background: #201E52;
  color: #ffffff;
}
.stepper-container .step-item .step-circle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  font-family: "Inter-700";
  font-size: 14px;
  transition: all 0.2s;
}
.stepper-container .step-item .step-label {
  font-family: "Inter-400";
  font-size: 14px;
  transition: color 0.2s;
}
.stepper-container .step-divider {
  height: 1px;
  background: #F0F0F0;
  width: 30px;
}

.profile-pic-section {
  display: flex;
  justify-content: center;
  margin-bottom: 32px;
}
.profile-pic-section .avatar-container {
  position: relative;
  width: 100px;
  height: 100px;
}
.profile-pic-section .avatar-container .avatar-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #F3F3F3;
}
.profile-pic-section .avatar-container .camera-btn {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 32px;
  height: 32px;
  background: #201E52;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  border: 2px solid #ffffff;
  cursor: pointer;
  transition: transform 0.2s;
}
.profile-pic-section .avatar-container .camera-btn:hover {
  transform: scale(1.1);
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 24px;
  box-sizing: border-box;
}
.form-grid.single-column {
  grid-template-columns: 1fr;
}

.required-star {
  color: #D71D0C;
  margin-left: 2px;
}

.form-group {
  box-sizing: border-box;
}
.form-group .form-label {
  display: block;
  font-family: "Inter-500";
  font-size: 14px;
  color: #18181B;
  margin-bottom: 8px;
}
.form-group .form-input {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 16px;
  border: 1px solid #DBDBDB;
  border-radius: 8px;
  font-family: "Inter-400";
  font-size: 15px;
  transition: all 0.2s;
  background: #ffffff;
}
.form-group .form-input:focus {
  border-color: #201E52;
  box-shadow: 0 0 0 2px rgba(32, 30, 82, 0.1);
  outline: none;
}
.form-group .form-input.error {
  border-color: #D71D0C;
}
.form-group .form-input::placeholder {
  font-family: "Inter-400";
  color: #71717A;
}
.form-group .error-message {
  color: #D71D0C;
  font-family: "Inter-400";
  font-size: 11px;
  margin-top: 4px;
  display: block;
}
.form-group .phone-input-container .phone-input-field {
  height: 46px;
}

.gender-group {
  display: flex;
  gap: 12px;
  margin-top: 4px;
  width: 50%;
  min-width: 300px;
}
.gender-group .gender-btn {
  flex: 1;
  padding: 10px;
  border: 1px solid #DBDBDB;
  border-radius: 8px;
  background: #ffffff;
  cursor: pointer;
  transition: all 0.2s;
  font-family: "Inter-500";
  text-transform: capitalize;
}
.gender-group .gender-btn.selected {
  background: #201E52;
  color: #ffffff;
  border-color: #201E52;
}
.gender-group .gender-btn:hover:not(.selected) {
  background: #F6F6F6;
  border-color: #71717A;
}

.role-toggles {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 32px 0;
}
.role-toggles .role-toggle-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.role-toggles .role-toggle-item .role-info p:first-child {
  margin: 0;
  font-family: "Inter-700";
  font-size: 16px;
  color: #18181B;
}
.role-toggles .role-toggle-item .role-info p:last-child {
  margin: 0;
  font-family: "Inter-400";
  font-size: 13px;
  color: #71717A;
}
.role-toggles .role-toggle-item .switch {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
}
.role-toggles .role-toggle-item .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.role-toggles .role-toggle-item .switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #F0F0F0;
  transition: 0.4s;
  border-radius: 34px;
}
.role-toggles .role-toggle-item .switch .slider:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 3px;
  bottom: 3px;
  background-color: #ffffff;
  transition: 0.4s;
  border-radius: 50%;
}
.role-toggles .role-toggle-item .switch input:checked + .slider {
  background-color: #1AA915;
}
.role-toggles .role-toggle-item .switch input:checked + .slider:before {
  transform: translateX(20px);
}

.btn-primary {
  width: 100%;
  min-height: 40px;
  padding: 10px 14px;
  background: #201E52;
  border-radius: 6px;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 16px;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
}
.btn-primary:hover {
  filter: brightness(0.9);
}
.btn-primary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.btn-secondary {
  padding: 14px 24px;
  border: 1px solid #DBDBDB;
  background: #ffffff;
  color: #18181B;
  border-radius: 8px;
  font-family: "Inter-600";
  cursor: pointer;
  transition: all 0.2s;
}
.btn-secondary:hover {
  background: #F6F6F6;
}
.btn-secondary.unfilled {
  background: transparent;
  border: 1px solid #DBDBDB;
  color: #4C4C4D;
}
.btn-secondary.unfilled:hover {
  background: #F3F3F3;
}

@media (max-width: 640px) {
  .form-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}.team-select-dialog .app-dialog-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  font-family: "Inter-400", "Inter", sans-serif;
}

.team-select-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 320px;
  overflow-y: auto;
}

.team-select-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-family: "Inter-400", "Inter", sans-serif;
  text-align: left;
  transition: border-color 0.2s, background 0.2s;
}
.team-select-row:hover {
  border-color: #d1d5db;
  background: #f9fafb;
}

.team-select-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.team-select-name {
  flex: 1;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #111827;
}

.team-select-empty {
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  color: #6b7280;
  padding: 24px;
  text-align: center;
}.ticker-automation-modal-overlay {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  animation: ticker-overlay-fade 0.16s ease forwards;
}

.ticker-automation-modal {
  display: flex;
  flex-direction: column;
  width: 92vw;
  max-width: 852px;
  max-height: 86vh;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  animation: ticker-modal-zoom 0.18s ease forwards;
  font-family: "Inter-400", "Inter", sans-serif;
}

.ticker-automation-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 24px 16px;
  border-bottom: 1px solid #eee;
}

.ticker-automation-title {
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
  padding: 0;
}

.ticker-automation-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid #e9e9e9;
  border-radius: 8px;
  background: #fff;
  color: #6b7280;
  font-size: 16px;
  cursor: pointer;
  font-family: "Inter-400", "Inter", sans-serif;
}
.ticker-automation-close:hover {
  background: #f5f5f5;
}

.ticker-automation-modal-body {
  flex: 1;
  overflow: auto;
  padding: 20px 24px;
}

.ticker-loading {
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  color: #6b7280;
  text-align: center;
  padding: 24px 0;
}

.ticker-automation-list-header {
  display: grid;
  grid-template-columns: 1fr 180px 80px;
  align-items: center;
  padding: 0 0 10px;
  border-bottom: 1px solid #e5e7eb;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ticker-automation-list-header span:last-child {
  text-align: center;
}

.ticker-automation-list {
  display: flex;
  flex-direction: column;
}

.ticker-row {
  display: grid;
  grid-template-columns: 1fr 180px 80px;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(76, 76, 77, 0.0705882353);
}
.ticker-row:last-child {
  border-bottom: none;
}

.ticker-row-label {
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #000000;
}

.ticker-interval-controls {
  display: flex;
  align-items: center;
  gap: 6px;
}

.ticker-interval-input {
  width: 52px;
  padding: 5px 8px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 13px;
  color: #111827;
  background: #fff;
  text-align: center;
}
.ticker-interval-input:focus {
  outline: none;
  border-color: #201E52;
}
.ticker-interval-input::-webkit-inner-spin-button, .ticker-interval-input::-webkit-outer-spin-button {
  opacity: 1;
}

.ticker-interval-select {
  padding: 5px 8px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 13px;
  color: #111827;
  background: #fff;
  cursor: pointer;
}
.ticker-interval-select:focus {
  outline: none;
  border-color: #201E52;
}

.ticker-event-driven {
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 12px;
  color: #9ca3af;
  font-style: italic;
}

.ticker-toggle-switch {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.ticker-toggle-switch input {
  display: none;
}

.ticker-slider {
  display: block;
  width: 40px;
  height: 20px;
  border-radius: 999px;
  background: #cccccc;
  transition: background 0.2s ease;
  position: relative;
}
.ticker-slider::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s ease;
}
.ticker-toggle-switch input:checked + .ticker-slider {
  background: #201E52;
}
.ticker-toggle-switch input:checked + .ticker-slider::after {
  transform: translateX(20px);
}

.ticker-automation-modal-footer {
  display: flex;
  justify-content: flex-end;
  padding: 16px 24px 20px;
  border-top: 1px solid #eee;
  gap: 12px;
}

.ticker-automation-save {
  padding: 12px 24px;
  background: #201E52;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 14px;
  cursor: pointer;
}
.ticker-automation-save:hover {
  filter: brightness(0.96);
}

@keyframes ticker-overlay-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes ticker-modal-zoom {
  from {
    transform: scale(0.96);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
/* Material-style analog clock — white panel, $color-blue-43 accents */
.material-time-picker-root {
  position: relative;
  width: 100%;
  font-family: "Inter-400", "Inter", sans-serif;
}
.material-time-picker-root--open {
  z-index: 1250;
}

/* Trigger — light field to match forms */
.material-time-picker-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 42px;
  padding: 0 14px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  background: #ffffff;
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.material-time-picker-input:hover:not(.disabled) {
  border-color: #201E52;
}
.material-time-picker-input.open {
  border-color: #201E52;
  outline: none;
  box-shadow: 0 0 0 2px rgba(32, 30, 82, 0.2);
}
.material-time-picker-input.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.material-time-picker-input-text {
  font-size: 14px;
  color: #374151;
  font-family: "Inter-400", "Inter", sans-serif;
}
.material-time-picker-input-text .placeholder {
  color: #9ca3af;
}

.material-time-picker-input-icon {
  color: #201E52;
  display: flex;
  align-items: center;
}

/* Popover — white surface */
.material-time-picker-popover {
  position: fixed;
  max-width: calc(100vw - 24px);
  z-index: 1400;
}
.material-time-picker-popover--top .material-time-picker-popover-inner {
  transform-origin: bottom left;
}
.material-time-picker-popover--bottom .material-time-picker-popover-inner {
  transform-origin: top left;
}

.material-time-picker-popover-inner {
  background: #FFFFFF;
  border-radius: 12px;
  padding: 18px 16px 14px;
  box-shadow: 0 12px 40px rgba(32, 30, 82, 0.12);
  border: 1px solid rgba(32, 30, 82, 0.18);
  font-family: "Inter-400", "Inter", sans-serif;
  color: #201E52;
  animation: material-time-picker-popover-in 0.14s ease-out;
}

/* Header: digital time + AM/PM + chevrons */
.material-time-picker-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.material-time-picker-hero-main {
  flex: 1;
  min-width: 0;
}

.material-time-picker-label {
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 600;
  font-family: "Inter-600", "Inter", sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6b7280;
}

.material-time-picker-time-row {
  display: flex;
  align-items: center;
  gap: 14px;
}

.material-time-picker-digital {
  display: flex;
  align-items: baseline;
  font-variant-numeric: tabular-nums;
  font-size: 36px;
  font-weight: 600;
  font-family: "Inter-600", "Inter", sans-serif;
  line-height: 1;
  color: #201E52;
}

.material-time-picker-digital-part {
  opacity: 0.38;
  transition: opacity 0.15s, color 0.15s;
}
.material-time-picker-digital-part--active {
  opacity: 1;
  color: #201E52;
}

.material-time-picker-digital-colon {
  margin: 0 2px;
  opacity: 0.55;
}

.material-time-picker-meridiem-stack {
  display: flex;
  gap: 4px;
  align-self: stretch;
  justify-content: center;
}

.material-time-picker-meridiem-pill {
  margin: 0;
  padding: 6px 12px;
  border: none;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  font-family: "Inter-500", "Inter", sans-serif;
  color: #6b7280;
  cursor: pointer;
  border-radius: 8px;
  text-align: left;
  transition: color 0.15s, background 0.15s;
}
.material-time-picker-meridiem-pill:hover {
  color: #201E52;
  background: rgba(32, 30, 82, 0.1);
}
.material-time-picker-meridiem-pill.active {
  background: #201E52;
  color: #FFFFFF;
  font-weight: 700;
  font-family: "Inter-700", "Inter", sans-serif;
}

.material-time-picker-mode-switch {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
  padding-top: 22px;
}

.material-time-picker-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid rgba(32, 30, 82, 0.18);
  border-radius: 8px;
  background: #FFFFFF;
  color: #201E52;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.material-time-picker-arrow:hover {
  background: rgba(32, 30, 82, 0.1);
  border-color: rgba(32, 30, 82, 0.28);
}

/* Clock */
.material-time-picker-clock-wrap {
  position: relative;
  margin-bottom: 16px;
}

.material-time-picker-clock {
  width: 100%;
  max-width: 220px;
  margin: 0 auto;
}
.material-time-picker-clock .clock-svg {
  width: 100%;
  height: auto;
  display: block;
}
.material-time-picker-clock .material-time-picker-clock-ring {
  stroke: rgba(32, 30, 82, 0.18);
}
.material-time-picker-clock .material-time-picker-hand {
  stroke: #201E52;
  stroke-width: 2;
}
.material-time-picker-clock .material-time-picker-hand-hub {
  fill: #201E52;
}
.material-time-picker-clock .clock-number-text {
  fill: #201E52;
  font-family: "Inter-500", "Inter", sans-serif;
  pointer-events: none;
  opacity: 0.88;
}
.material-time-picker-clock .clock-number-text.is-selected {
  fill: #FFFFFF;
  opacity: 1;
}
.material-time-picker-clock .clock-number:hover .clock-number-bg {
  fill: rgba(32, 30, 82, 0.1);
}
.material-time-picker-clock .clock-number.selected .clock-number-bg {
  fill: #201E52;
}

/* Actions */
.material-time-picker-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  padding-top: 4px;
}

.material-time-picker-btn {
  background: none;
  border: none;
  font-size: 12px;
  font-weight: 700;
  font-family: "Inter-700", "Inter", sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #201E52;
  cursor: pointer;
  padding: 10px 14px;
  border-radius: 8px;
  transition: background 0.15s;
}
.material-time-picker-btn:hover {
  background: rgba(32, 30, 82, 0.1);
}

@keyframes material-time-picker-popover-in {
  from {
    opacity: 0;
    transform: translateY(4px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}/* Same element: Dialog.Content has both app-dialog-content and schedule-match-dialog */
.app-dialog-overlay.schedule-match-dialog-overlay {
  z-index: 10040 !important;
}

.app-dialog-content.schedule-match-dialog {
  position: relative;
  /* Above tournament / match-detail stacking contexts (see matchesDetails.scss ~10050) */
  z-index: 10050 !important;
}
.app-dialog-content.schedule-match-dialog::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/bg_cricenter_logo-C3Rtspl-.svg") no-repeat center center;
  background-size: 50% auto;
  opacity: 0.04;
  pointer-events: none;
  z-index: 0;
}
.app-dialog-content.schedule-match-dialog .app-dialog-body {
  font-family: "Inter-400", "Inter", sans-serif;
  position: relative;
  z-index: 1;
}

/* Edit match: portal to body (avoids Radix dismissing on the same click that opened) */
.edit-match-schedule-layer {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  box-sizing: border-box;
}

.edit-match-schedule-backdrop {
  position: absolute;
  inset: 0;
  border: none;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
  z-index: 0;
}

.edit-match-schedule-panel.schedule-match-dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 900px;
  max-height: 86vh;
  overflow: auto;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  outline: none;
}
.edit-match-schedule-panel.schedule-match-dialog::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/bg_cricenter_logo-C3Rtspl-.svg") no-repeat center center;
  background-size: 50% auto;
  opacity: 0.04;
  pointer-events: none;
  z-index: 0;
  border-radius: 12px;
}
.edit-match-schedule-panel.schedule-match-dialog > .schedule-match-modal {
  position: relative;
  z-index: 1;
}

.schedule-match-modal {
  padding: 34px 60px;
  display: flex;
  flex-direction: column;
  gap: 36px;
  font-family: "Inter-400", "Inter", sans-serif;
}
.schedule-match-modal .form-dropdown {
  width: 100%;
}
.schedule-match-modal .profile-date-picker {
  width: 100%;
}

.schedule-match-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.schedule-match-back {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}
.schedule-match-back img {
  width: 24px;
  height: 24px;
}

.schedule-match-title {
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
  padding: 0;
}

.schedule-match-selectors {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}

.schedule-match-context-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 12px 14px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

.schedule-match-context-text {
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #111827;
}

/* Same team pick + list dialog as ScheduleMatchPage */
.schedule-match-team-pick-row {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  width: 100%;
  max-width: 640px;
  margin: 0 auto;
}

.schedule-match-team-pick-card {
  flex: 1 1 160px;
  max-width: 280px;
  min-height: 200px;
  padding: 28px 20px 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
  border: none;
  border-radius: 16px;
  background: #201E52;
  color: #fff;
  cursor: pointer;
  box-sizing: border-box;
  transition: filter 0.2s, box-shadow 0.2s;
  font-family: "Inter-500", "Inter", sans-serif;
}
.schedule-match-team-pick-card:hover:not(:disabled) {
  filter: brightness(1.06);
  box-shadow: 0 8px 24px rgba(32, 30, 82, 0.35);
}
.schedule-match-team-pick-card:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.schedule-match-team-pick-card:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}
.schedule-match-team-pick-card.is-filled .schedule-match-team-pick-avatar {
  background: rgba(255, 255, 255, 0.22);
}

.schedule-match-team-pick-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  border: 2px dashed rgba(255, 255, 255, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: auto;
}
.schedule-match-team-pick-avatar img {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.schedule-match-team-pick-card.is-filled .schedule-match-team-pick-avatar {
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.25);
}

.schedule-match-team-pick-name {
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  text-align: center;
  line-height: 1.25;
  text-transform: lowercase;
  width: 100%;
  word-break: break-word;
}

.schedule-match-vs--between {
  flex: 0 0 auto;
  align-self: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  font-size: 12px;
  font-weight: 700;
  text-transform: lowercase;
  letter-spacing: 0.02em;
}

.schedule-match-team-pick-dialog .schedule-match-pick-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-height: min(60vh, 400px);
  overflow-y: auto;
}
.schedule-match-team-pick-dialog .schedule-match-pick-empty {
  margin: 0;
  padding: 16px 4px;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  color: #6b7280;
  text-align: center;
}
.schedule-match-team-pick-dialog .schedule-match-pick-row {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 12px;
  border: none;
  border-bottom: 1px solid #f3f4f6;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 15px;
  color: #111827;
  transition: background 0.15s;
}
.schedule-match-team-pick-dialog .schedule-match-pick-row:last-child {
  border-bottom: none;
}
.schedule-match-team-pick-dialog .schedule-match-pick-row:hover {
  background: #f9fafb;
}
.schedule-match-team-pick-dialog .schedule-match-pick-icon {
  width: 40px;
  height: 40px;
  object-fit: contain;
  flex-shrink: 0;
}
.schedule-match-team-pick-dialog .schedule-match-pick-name {
  text-transform: none;
  color: inherit;
  font: inherit;
  text-align: left;
}

.schedule-match-team-dropdowns {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (min-width: 600px) {
  .schedule-match-team-dropdowns {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.schedule-match-team-dropdowns .schedule-match-field {
  flex: 1;
  min-width: 200px;
}

.schedule-match-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-width: 160px;
}
.schedule-match-field label {
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #111827;
}
.schedule-match-field label .req {
  color: #e11d48;
}
.schedule-match-field select,
.schedule-match-field input {
  padding: 10px 14px;
  height: 42px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  background: #fff;
  box-sizing: border-box;
}
.schedule-match-field input[type=date],
.schedule-match-field input[type=time] {
  min-height: 42px;
}
.schedule-match-field select {
  cursor: pointer;
}

.schedule-match-tabs {
  display: flex;
  gap: 16px;
}

.schedule-match-tab {
  padding: 10px 20px;
  border: 1px solid #d9dbe0;
  border-radius: 4px;
  background: #fff;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #6b7280;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.schedule-match-tab:last-child {
  border-right: 1px solid #d9dbe0;
}
.schedule-match-tab:hover {
  background: #f9fafb;
}
.schedule-match-tab.active {
  background: #201E52;
  border-color: #201E52;
  color: #fff;
}

.schedule-match-single {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.schedule-match-teams {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap;
}

.schedule-match-team-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 32px 40px;
  border: 2px dashed #d9dbe0;
  border-radius: 12px;
  background: #fafafa;
  cursor: pointer;
  width: 100%;
  max-width: 556px;
  transition: border-color 0.2s, background 0.2s;
  font-family: "Inter-400", "Inter", sans-serif;
}
.schedule-match-team-card:hover {
  border-color: #201E52;
  background: #f0f4ff;
}

.schedule-match-team-icon {
  width: 48px;
  height: 48px;
}

.schedule-match-team-label {
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #111827;
}

.schedule-match-vs {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #201E52;
  color: #fff;
  font-family: "Inter-700", "Inter", sans-serif;
  font-size: 14px;
}

.schedule-match-vs.schedule-match-vs--between {
  width: 44px;
  height: 44px;
  min-width: 44px;
  font-size: 12px;
  font-weight: 700;
  text-transform: lowercase;
  letter-spacing: 0.02em;
}

.schedule-match-details {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.schedule-match-details-row {
  display: flex;
  gap: 30px;
  flex-wrap: wrap;
}
.schedule-match-details-row .schedule-match-field {
  flex: 1;
  min-width: 180px;
}

.schedule-match-ticker {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  color: #111827;
}

.schedule-match-setup-link {
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #201E52;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
}
.schedule-match-setup-link:hover {
  color: rgb(17.4285714286, 16.3392857143, 44.6607142857);
}

.schedule-match-actions {
  display: flex;
  justify-content: flex-end;
}

.schedule-match-btn {
  padding: 14px 28px;
  background: #201E52;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
}
.schedule-match-btn:hover {
  filter: brightness(0.96);
}

.schedule-match-bulk {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}

.schedule-match-bulk-card {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 400px;
  padding: 20px 24px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #f3f4f6;
  cursor: pointer;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  color: #111827;
  text-align: left;
  transition: background 0.2s;
}
.schedule-match-bulk-card:hover {
  background: #e5e7eb;
}

.schedule-match-bulk-icon {
  font-size: 24px;
  color: #201E52;
}

.schedule-match-auto {
  padding: 24px;
}

.schedule-match-placeholder {
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  color: #6b7280;
  padding: 0;
}

.schedule-match-teams--pick {
  justify-content: center;
  align-items: stretch;
}

.schedule-match-team-card--pick {
  max-width: 320px;
  flex: 1 1 200px;
  min-height: 200px;
  justify-content: center;
}

.schedule-match-team-thumb {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.schedule-match-team-add {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #201E52;
  color: #fff;
  font-size: 18px;
  line-height: 26px;
  text-align: center;
  font-family: "Inter-600", "Inter", sans-serif;
  font-weight: 600;
  pointer-events: none;
}

/* Details step: same card footprint as team pick cards */
.schedule-match-teams--preview {
  justify-content: center;
  align-items: stretch;
}

.schedule-match-team-preview {
  flex: 1 1 160px;
  max-width: 280px;
  min-height: 200px;
  padding: 28px 20px 22px;
  background: #201E52;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 20px;
  box-sizing: border-box;
}

.schedule-match-team-preview-logo {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  border: 2px solid rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: auto;
}
.schedule-match-team-preview-logo img {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.schedule-match-team-preview-name {
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  text-align: center;
  line-height: 1.25;
  width: 100%;
  word-break: break-word;
}

.schedule-match-details--panel {
  border: 1px dashed #d1d5db;
  border-radius: 12px;
  padding: 24px 20px;
  background: #fafafa;
}
.schedule-match-details--panel .schedule-match-readonly {
  background: #f3f4f6;
  color: #111827;
  border: 1px solid #e5e7eb;
  opacity: 1;
}

.schedule-match-btn--next:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.schedule-match-readonly {
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.5);
  cursor: default;
  pointer-events: none;
}/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */

/* FONT_START */
@font-face {
  font-family: 'swiper-icons';
  src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');
  font-weight: 400;
  font-style: normal;
}
/* FONT_END */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}
:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
  touch-action: pan-y;
}
.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: '';
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */
.swiper-virtual .swiper-slide {
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}
.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
}
.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
  height: 1px;
  width: var(--swiper-virtual-size);
}
.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
  width: 1px;
  height: var(--swiper-virtual-size);
}
:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-top-offset: 50%;
  --swiper-navigation-sides-offset: 10px;
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: var(--swiper-navigation-top-offset, 50%);
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev.swiper-button-hidden,
.swiper-button-next.swiper-button-hidden {
  opacity: 0;
  cursor: auto;
  pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-prev,
.swiper-navigation-disabled .swiper-button-next {
  display: none !important;
}
.swiper-button-prev svg,
.swiper-button-next svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: center;
}
.swiper-rtl .swiper-button-prev svg,
.swiper-rtl .swiper-button-next svg {
  transform: rotate(180deg);
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: var(--swiper-navigation-sides-offset, 10px);
  right: auto;
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-lock {
  display: none;
}
/* Navigation font start */
.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  font-variant: initial;
  line-height: 1;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  content: 'prev';
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  content: 'next';
}
/* Navigation font end */
:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  --swiper-pagination-left: auto;
  --swiper-pagination-right: 8px;
  --swiper-pagination-bottom: 8px;
  --swiper-pagination-top: auto;
  --swiper-pagination-fraction-color: inherit;
  --swiper-pagination-progressbar-bg-color: rgba(0,0,0,0.25);
  --swiper-pagination-progressbar-size: 4px;
  --swiper-pagination-bullet-size: 8px;
  --swiper-pagination-bullet-width: 8px;
  --swiper-pagination-bullet-height: 8px;
  --swiper-pagination-bullet-border-radius: 50%;
  --swiper-pagination-bullet-inactive-color: #000;
  --swiper-pagination-bullet-inactive-opacity: 0.2;
  --swiper-pagination-bullet-opacity: 1;
  --swiper-pagination-bullet-horizontal-gap: 4px;
  --swiper-pagination-bullet-vertical-gap: 6px;
  */
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
  display: none !important;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: var(--swiper-pagination-bottom, 8px);
  top: var(--swiper-pagination-top, auto);
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
  display: inline-block;
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
          appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet:only-child {
  display: none !important;
}
.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
  right: var(--swiper-pagination-right, 8px);
  left: var(--swiper-pagination-left, auto);
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
  display: block;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform,
        200ms top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
        200ms left;
}
.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
    200ms right;
}
/* Fraction */
.swiper-pagination-fraction {
  color: var(--swiper-pagination-fraction-color, inherit);
}
/* Progress */
.swiper-pagination-progressbar {
  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: var(--swiper-pagination-progressbar-size, 4px);
  left: 0;
  top: 0;
}
.swiper-vertical > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
  width: var(--swiper-pagination-progressbar-size, 4px);
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-lock {
  display: none;
}
:root {
  /*
  --swiper-scrollbar-border-radius: 10px;
  --swiper-scrollbar-top: auto;
  --swiper-scrollbar-bottom: 4px;
  --swiper-scrollbar-left: auto;
  --swiper-scrollbar-right: 4px;
  --swiper-scrollbar-sides-offset: 1%;
  --swiper-scrollbar-bg-color: rgba(0, 0, 0, 0.1);
  --swiper-scrollbar-drag-bg-color: rgba(0, 0, 0, 0.5);
  --swiper-scrollbar-size: 4px;
  */
}
.swiper-scrollbar {
  border-radius: var(--swiper-scrollbar-border-radius, 10px);
  position: relative;
  touch-action: none;
  background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));
}
.swiper-scrollbar-disabled > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-disabled {
  display: none !important;
}
.swiper-horizontal > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
  position: absolute;
  left: var(--swiper-scrollbar-sides-offset, 1%);
  bottom: var(--swiper-scrollbar-bottom, 4px);
  top: var(--swiper-scrollbar-top, auto);
  z-index: 50;
  height: var(--swiper-scrollbar-size, 4px);
  width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
}
.swiper-vertical > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-vertical {
  position: absolute;
  left: var(--swiper-scrollbar-left, auto);
  right: var(--swiper-scrollbar-right, 4px);
  top: var(--swiper-scrollbar-sides-offset, 1%);
  z-index: 50;
  width: var(--swiper-scrollbar-size, 4px);
  height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));
  border-radius: var(--swiper-scrollbar-border-radius, 10px);
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
.swiper-scrollbar-lock {
  display: none;
}
/* Zoom container styles start */
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
/* Zoom container styles end */
.swiper-slide-zoomed {
  cursor: move;
  touch-action: none;
}
/* a11y */
.swiper .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-free-mode > .swiper-wrapper {
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-grid > .swiper-wrapper {
  flex-wrap: wrap;
}
.swiper-grid-column > .swiper-wrapper {
  flex-wrap: wrap;
  flex-direction: column;
}
.swiper-fade.swiper-free-mode .swiper-slide {
  transition-timing-function: ease-out;
}
.swiper-fade .swiper-slide {
  pointer-events: none;
  transition-property: opacity;
}
.swiper-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-fade .swiper-slide-active {
  pointer-events: auto;
}
.swiper-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper.swiper-cube {
  overflow: visible;
}
.swiper-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-cube.swiper-rtl .swiper-slide {
  transform-origin: 100% 0;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev {
  pointer-events: auto;
  visibility: visible;
}
.swiper-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  z-index: 0;
}
.swiper-cube .swiper-cube-shadow:before {
  content: '';
  background: #000;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  filter: blur(50px);
}
.swiper-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
/* Cube slide shadows start */
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* Cube slide shadows end */
.swiper.swiper-flip {
  overflow: visible;
}
.swiper-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  z-index: 1;
}
.swiper-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
/* Flip slide shadows start */
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* Flip slide shadows end */
.swiper-creative .swiper-slide {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  overflow: hidden;
  transition-property: transform, opacity, height;
}
.swiper.swiper-cards {
  overflow: visible;
}
.swiper-cards .swiper-slide {
  transform-origin: center bottom;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  overflow: hidden;
}
.tournament-players-tab {
  padding: 1rem 0;
}

.tournament-players-tab__loading,
.tournament-players-tab__error {
  padding: 2rem;
  text-align: center;
}

.tournament-players-tab__error {
  color: #c62828;
}.ts-tab {
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ts-tab__loading {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 32px 0;
  font-family: "Inter-500";
  font-size: 14px;
  color: #5c5c6f;
}
.ts-tab__spinner {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(44, 41, 112, 0.2);
  border-top-color: #2c2970;
  border-radius: 50%;
  animation: ts-spin 0.7s linear infinite;
}
@keyframes ts-spin {
  to {
    transform: rotate(360deg);
  }
}
.ts-tab__error {
  font-family: "Inter-500";
  font-size: 14px;
  color: #b91c1c;
}
.ts-tab__pills {
  overflow-x: auto;
  display: flex;
  gap: 8px;
}
.ts-tab__pill {
  font-family: "Inter-500";
  font-size: 12px;
  padding: 7px 14px;
  border-radius: 20px;
  border: 1px solid rgba(44, 41, 112, 0.2);
  background: #fff;
  color: #4c4c4d;
  cursor: pointer;
  white-space: nowrap;
  line-height: 1;
  transition: background 0.15s, color 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.ts-tab__pill:hover {
  border-color: rgba(44, 41, 112, 0.4);
  color: #2c2970;
}
.ts-tab__pill--active {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 2px 8px rgba(44, 41, 112, 0.25);
}
.ts-tab__pill--active:hover {
  color: #fff;
  border-color: transparent;
}
.ts-tab__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 900px) {
  .ts-tab__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 540px) {
  .ts-tab__grid {
    grid-template-columns: 1fr;
  }
}

.ts-card {
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(20, 20, 43, 0.08);
  border: 1px solid rgba(44, 41, 112, 0.08);
  display: flex;
  flex-direction: column;
}
.ts-card__header {
  background: linear-gradient(135deg, #2c2970 0%, #201e52 100%);
  padding: 12px 16px;
}
.ts-card__header span {
  font-family: "Inter-700";
  font-size: 13px;
  letter-spacing: 0.06em;
  color: #fff;
  text-transform: uppercase;
}
.ts-card__body {
  flex: 1;
  padding: 4px 0;
}
.ts-card__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(44, 41, 112, 0.06);
  transition: background 0.12s;
}
.ts-card__row:last-child {
  border-bottom: none;
}
.ts-card__row:hover {
  background: #fafbff;
}
.ts-card__avatar-wrap {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: #f0eff8;
  border: 1.5px solid rgba(44, 41, 112, 0.12);
}
.ts-card__avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ts-card__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ts-card__name {
  font-family: "Inter-600";
  font-size: 13px;
  color: #1a1a2e;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ts-card__team {
  font-family: "Inter-500";
  font-size: 11px;
  color: #6b7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ts-card__secondary {
  font-family: "Inter-400";
  font-size: 10px;
  color: #9ca3af;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ts-card__value {
  flex-shrink: 0;
  font-family: "Inter-700";
  font-size: 20px;
  color: #201e52;
  min-width: 40px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.ts-card__view-all {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  padding: 10px 14px;
  border: none;
  border-top: 1px solid rgba(44, 41, 112, 0.08);
  background: transparent;
  font-family: "Inter-500";
  font-size: 12px;
  color: #2c2970;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.ts-card__view-all:hover {
  background: #f0eff8;
  color: #201e52;
}
.ts-card__arrow {
  font-size: 13px;
}

.ts-table-wrap {
  background: #fff;
  border-radius: 12px;
  border: 1px solid rgba(44, 41, 112, 0.08);
  box-shadow: 0 2px 12px rgba(20, 20, 43, 0.07);
  overflow: hidden;
}
.ts-table-wrap__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid rgba(44, 41, 112, 0.07);
}
@media (max-width: 768px) {
  .ts-table-wrap__bar {
    padding: 0px;
  }
}
.ts-table-wrap__bar-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ts-table-wrap__back {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(44, 41, 112, 0.18);
  background: transparent;
  color: #2c2970;
  cursor: pointer;
  transition: background 0.12s;
  flex-shrink: 0;
}
.ts-table-wrap__back:hover {
  background: #f0eff8;
}
.ts-table-wrap__title {
  font-family: "Inter-700";
  font-size: 18px;
  color: #1a1a2e;
  margin: 0;
}
.ts-table-wrap__share {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  border-radius: 8px;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  border: none;
  font-family: "Inter-500";
  font-size: 13px;
  color: #fff;
  cursor: pointer;
  transition: opacity 0.15s;
}
.ts-table-wrap__share:hover {
  opacity: 0.88;
}
.ts-table-wrap__scroll {
  width: 100%;
  overflow-x: auto;
}
.ts-table-wrap__empty {
  padding: 24px;
  text-align: center;
  font-family: "Inter-400";
  font-size: 14px;
  color: #9ca3af;
}
.ts-table-wrap__footer {
  display: flex;
  justify-content: center;
  padding: 14px 16px;
  border-top: 1px solid rgba(44, 41, 112, 0.07);
}
.ts-table-wrap__show-more {
  font-family: "Inter-500";
  font-size: 13px;
  color: #2c2970;
  background: transparent;
  border: 1px solid rgba(44, 41, 112, 0.22);
  border-radius: 20px;
  padding: 8px 28px;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s;
}
.ts-table-wrap__show-more:hover {
  background: #f0eff8;
  border-color: rgba(44, 41, 112, 0.4);
}

.ts-table {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
  font-family: "Inter-400";
  font-size: 13px;
}
.ts-table thead tr {
  background: #f8f9fc;
  border-bottom: 1px solid rgba(44, 41, 112, 0.08);
}
.ts-table th {
  padding: 10px 14px;
  font-family: "Inter-500";
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #6b7280;
  white-space: nowrap;
  text-align: right;
}
.ts-table th:first-child {
  text-align: left;
}
.ts-table__hero-th {
  color: #2c2970 !important;
  font-family: "Inter-700" !important;
}
.ts-table tbody tr {
  border-bottom: 1px solid rgba(44, 41, 112, 0.05);
  transition: background 0.12s;
}
.ts-table tbody tr:last-child {
  border-bottom: none;
}
.ts-table tbody tr:hover {
  background: #fafbff;
}
.ts-table td {
  padding: 10px 14px;
  white-space: nowrap;
  text-align: right;
  color: #374151;
  font-variant-numeric: tabular-nums;
}
.ts-table td:first-child {
  text-align: left;
}
.ts-table__hero-td {
  font-family: "Inter-700" !important;
  color: #1a1a2e !important;
  font-size: 14px !important;
}
.ts-table__player-th {
  min-width: 180px;
}
.ts-table__player-th--sortable {
  cursor: pointer;
  user-select: none;
}
.ts-table__player-th--sortable:hover {
  color: #2c2970;
}
.ts-table__sort-icon {
  margin-left: 3px;
  font-size: 10px;
  color: #9ca3af;
  font-family: "Inter-400";
  transition: color 0.15s;
}
.ts-table__sort-icon--active {
  color: #2c2970;
  font-family: "Inter-700";
}
.ts-table__player-td {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 180px;
}
.ts-table__avatar {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid rgba(44, 41, 112, 0.1);
  background: #f0eff8;
}
.ts-table__player-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ts-table__name {
  font-family: "Inter-600";
  font-size: 13px;
  color: #2c2970;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 140px;
  cursor: pointer;
}
.ts-table__name:hover {
  text-decoration: underline;
}
.ts-table__team {
  font-family: "Inter-400";
  font-size: 11px;
  color: #9ca3af;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100px;
}.about-tab {
  padding: 16px 0 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  font-family: "Inter-400";
  color: #1a1a2e;
  /* Hero: banner with gradient scrim, overlaid title/dates, plus stat strip below */
  /* League About hero shows just Tournaments */
  /* League hero: same banner+scrim treatment, with a logo card alongside the title */
}
.about-tab .about-loading {
  padding: 40px;
  text-align: center;
  color: #7a7a7a;
  font-family: "Inter-500";
  font-size: 14px;
}
.about-tab .about-card {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  padding: 18px 20px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.about-tab .about-card--header {
  background: linear-gradient(135deg, #f7faff 0%, #ffffff 100%);
}
.about-tab .about-card--full {
  grid-column: 1/-1;
}
.about-tab .about-card__title {
  font-family: "Inter-600";
  font-size: 15px;
  color: #1a1a2e;
  margin: 0 0 12px;
  letter-spacing: 0.2px;
}
.about-tab .about-card__body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.about-tab .about-header-main {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.about-tab .about-title {
  font-family: "Inter-700";
  font-size: 22px;
  line-height: 1.25;
  margin: 0;
  color: #111827;
  word-break: break-word;
}
.about-tab .about-header-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.about-tab .about-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3949ab;
  font-family: "Inter-500";
  font-size: 12px;
  line-height: 1.6;
}
.about-tab .about-chip--accent {
  background: #fff7ed;
  color: #c2410c;
}
.about-tab .about-chip--muted {
  background: #f1f5f9;
  color: #475569;
}
.about-tab .about-chip--link {
  cursor: pointer;
  text-decoration: underline;
}
.about-tab .about-chip--link:hover {
  opacity: 0.85;
}
.about-tab .about-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}
.about-tab .about-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-family: "Inter-500";
  font-size: 13px;
  padding: 8px 0;
  border-bottom: 1px dashed rgba(0, 0, 0, 0.08);
}
.about-tab .about-row:last-child {
  border-bottom: none;
}
.about-tab .about-row__label {
  color: #6b7280;
  font-family: "Inter-500";
  flex-shrink: 0;
}
.about-tab .about-row__value {
  color: #111827;
  text-align: right;
  font-family: "Inter-600";
  word-break: break-word;
}
.about-tab .about-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-family: "Inter-600";
  font-size: 11px;
  letter-spacing: 0.3px;
}
.about-tab .about-pill--on {
  background: #dcfce7;
  color: #15803d;
}
.about-tab .about-pill--off {
  background: #fee2e2;
  color: #b91c1c;
}
.about-tab .about-description {
  margin: 0;
  color: #374151;
  font-family: "Inter-400";
  font-size: 14px;
  line-height: 1.6;
  white-space: pre-wrap;
  text-align: left;
}
.about-tab .about-card--full {
  text-align: left;
}
.about-tab .about-banner {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border-radius: 12px;
  margin-bottom: 14px;
}
.about-tab .about-card--hero {
  padding: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 12px 32px -16px rgba(32, 30, 82, 0.18);
}
.about-tab .about-hero-banner {
  position: relative;
  width: 100%;
  height: 260px;
  background: linear-gradient(135deg, #2c2970 0%, #201e52 100%);
  overflow: hidden;
}
.about-tab .about-hero-banner__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.about-tab .about-hero-banner__placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(44, 41, 112, 0.92) 0%, rgba(32, 30, 82, 0.92) 100%), url("/assets/bg_cricenter_logo-C3Rtspl-.svg") center/35% no-repeat;
  background-blend-mode: multiply;
}
.about-tab .about-hero-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 13, 56, 0) 0%, rgba(15, 13, 56, 0.15) 45%, rgba(15, 13, 56, 0.78) 88%, rgba(15, 13, 56, 0.92) 100%);
  pointer-events: none;
}
.about-tab .about-hero-overlay {
  position: absolute;
  inset: auto 0 0 0;
  padding: 22px 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  color: #fff;
  z-index: 1;
}
.about-tab .about-hero-meta-top {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.about-tab .about-hero-tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font-family: "Inter-600";
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  line-height: 1.4;
}
.about-tab .about-hero-tag--ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.42);
  font-family: "Inter-500";
  text-transform: none;
  letter-spacing: 0.2px;
  font-size: 12px;
}
.about-tab .about-hero-title {
  margin: 0;
  font-family: "Inter-700";
  font-size: 32px;
  line-height: 1.15;
  letter-spacing: -0.4px;
  color: #fff;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
  word-break: break-word;
}
.about-tab .about-hero-dates {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.92);
  font-family: "Inter-500";
  font-size: 13px;
  letter-spacing: 0.2px;
}
.about-tab .about-hero-dates svg {
  opacity: 0.85;
}
.about-tab .about-hero-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: linear-gradient(180deg, #ffffff 0%, #f7f8fc 100%);
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}
.about-tab.league-about-tab .about-hero-stats {
  grid-template-columns: 1fr;
}
.about-tab.league-about-tab .about-hero-stat {
  border-right: none;
}
.about-tab .about-hero-stat {
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  border-right: 1px solid rgba(0, 0, 0, 0.06);
}
.about-tab .about-hero-stat:last-child {
  border-right: none;
}
.about-tab .about-hero-stat__label {
  font-family: "Inter-500";
  font-size: 11px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #8a8b9a;
}
.about-tab .about-hero-stat__value {
  font-family: "Inter-700";
  font-size: 16px;
  color: #1a1a2e;
  line-height: 1.3;
}
@media (max-width: 720px) {
  .about-tab .about-hero-banner {
    height: 220px;
  }
  .about-tab .about-hero-title {
    font-size: 24px;
  }
  .about-tab .about-hero-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .about-tab .about-hero-stat:nth-child(2) {
    border-right: none;
  }
  .about-tab .about-hero-stat:nth-child(-n+2) {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  }
}
.about-tab .about-hero-overlay--league {
  flex-direction: row;
  align-items: flex-end;
  gap: 18px;
}
.about-tab .about-hero-overlay--league .about-hero-text {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.about-tab .about-hero-logo {
  width: 84px;
  height: 84px;
  border-radius: 16px;
  background: #fff;
  border: 3px solid rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
  overflow: hidden;
  flex-shrink: 0;
}
.about-tab .about-hero-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 720px) {
  .about-tab .about-hero-overlay--league {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .about-tab .about-hero-logo {
    width: 64px;
    height: 64px;
    border-radius: 12px;
  }
}
.about-tab .about-hero-logo {
  width: 88px;
  height: 88px;
  border-radius: 14px;
  background: #fff;
  border: 3px solid #fff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  flex-shrink: 0;
}
.about-tab .about-hero-logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.about-tab .about-link-btn {
  background: none;
  border: 1px solid #3949ab;
  color: #3949ab;
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  align-self: flex-start;
  margin-top: 4px;
}
.about-tab .about-link-btn:hover {
  background: #3949ab;
  color: #fff;
}
.about-tab .about-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.about-tab .about-stat {
  background: #f8fafc;
  border-radius: 10px;
  padding: 12px;
  text-align: center;
}
.about-tab .about-stat__value {
  font-size: 22px;
  font-weight: 700;
  color: #1e293b;
}
.about-tab .about-stat__label {
  font-size: 12px;
  color: #64748b;
  margin-top: 2px;
}

.tournament-about-tab,
.league-about-tab {
  padding-top: 12px;
}.tournament-details-preview {
  width: 100%;
}
.tournament-details-preview .preview-wrap {
  text-align: left;
}
.tournament-details-preview .tdp-about {
  text-align: left;
}
.tournament-details-preview .tdp-about *,
.tournament-details-preview .tdp-about p,
.tournament-details-preview .tdp-about span,
.tournament-details-preview .tdp-about label,
.tournament-details-preview .tdp-about h2,
.tournament-details-preview .tdp-about h3 {
  text-align: left;
}
.tournament-details-preview .tdp-about .about-row__value {
  text-align: right;
}
.tournament-details-preview .tdp-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 20px;
}
.tournament-details-preview .tdp-actions .btn {
  width: auto;
  min-width: 0;
  min-height: 0;
  height: 40px;
  padding: 0 22px;
  border-radius: 6px;
  font-family: "Inter-600";
  font-size: 13px;
  cursor: pointer;
  border: 1px solid var(--Primary-1, #201e52);
  letter-spacing: 0.4px;
  text-transform: uppercase;
  flex: 0 0 auto;
  align-self: center;
}
.tournament-details-preview .tdp-actions .btn.btn-primary {
  background: #201e52;
  color: #fff;
}
.tournament-details-preview .tdp-actions .btn.btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.tournament-details-preview .tdp-actions .btn.btn-light {
  background: #fff;
  color: #201e52;
}.tournament-ticker-section {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fafafa;
}
.tournament-ticker-section .tournament-ticker-section-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 12px;
  color: #111827;
}
.tournament-ticker-section .ticker-automation-list {
  max-height: 360px;
  overflow-y: auto;
}.local-divisions-step {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 8px;
  font-family: "Inter-400";
  color: #18181B;
}
.local-divisions-step .create-league-step-title {
  font-family: "Inter-700";
  font-size: 22px;
  margin: 0;
  color: #201E52;
}
.local-divisions-step .ldt-division {
  border: 1px solid rgba(76, 76, 77, 0.18);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(20, 20, 43, 0.04);
  overflow: hidden;
}
.local-divisions-step .ldt-division .ldt-division-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
}
.local-divisions-step .ldt-division .ldt-division-header .ldt-division-name {
  flex: 1;
  font-family: "Inter-600";
  font-size: 16px;
  color: #201E52;
  padding: 4px 6px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
}
.local-divisions-step .ldt-division .ldt-division-header .ldt-division-name:focus {
  background: #ffffff;
  border-color: #2C2970;
  outline: none;
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.12);
}
.local-divisions-step .ldt-division .ldt-division-header .ldt-division-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.local-divisions-step .ldt-division .ldt-division-header .ldt-division-tools .ldt-remove-division {
  width: 30px;
  height: 30px;
  padding: 0;
  background: #FEF2F2;
  border: 1px solid #FCA5A5;
  color: #B91C1C;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.local-divisions-step .ldt-division .ldt-division-header .ldt-division-tools .ldt-remove-division:hover {
  background: #FEE2E2;
}
.local-divisions-step .ldt-division .ldt-division-header .ldt-division-tools .ldt-chevron {
  color: #201E52;
  display: inline-flex;
}
.local-divisions-step .ldt-division.ldt-division--open .ldt-division-header {
  background: #F0EFF8;
  border-bottom: 1px solid rgba(76, 76, 77, 0.18);
}
.local-divisions-step .ldt-division .ldt-division-body {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.local-divisions-step .ldt-division .ldt-groups {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 14px;
  border: 1px solid #2C2970;
  border-radius: 999px;
  background: #ffffff;
  color: #201E52;
  font-family: "Inter-500";
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip .ldt-group-name {
  border: none;
  background: transparent;
  font-size: 13px;
  font-family: "Inter-500";
  color: inherit;
  width: 84px;
  outline: none;
  cursor: pointer;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip .ldt-group-x {
  background: transparent;
  border: none;
  color: inherit;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
  opacity: 0.85;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip .ldt-group-x:hover {
  opacity: 1;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip.is-active {
  background: #201E52;
  color: #ffffff;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip.is-active .ldt-group-name {
  cursor: text;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip:not(.is-active):hover {
  background: #E8E8FD;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-chip.is-lone .ldt-group-x {
  display: none;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-add {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid #2C2970;
  color: #201E52;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.local-divisions-step .ldt-division .ldt-groups .ldt-group-add:hover {
  background: #F0EFF8;
}
.local-divisions-step .ldt-division .ldt-table-card {
  border: 1px solid rgba(76, 76, 77, 0.18);
  border-radius: 10px;
  overflow: hidden;
  background: #ffffff;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-table-card-header {
  padding: 12px 16px;
  background: #F6F6F6;
  font-family: "Inter-600";
  font-size: 14px;
  color: #18181B;
  border-bottom: 1px solid rgba(76, 76, 77, 0.18);
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-table-wrap {
  overflow-x: auto;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter-400";
  font-size: 13px;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table thead th {
  font-family: "Inter-600";
  font-size: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #4C4C4D;
  text-align: left;
  padding: 12px 14px;
  background: #ffffff;
  border-bottom: 1px solid rgba(76, 76, 77, 0.18);
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table tbody td {
  padding: 10px 14px;
  border-bottom: 1px solid #F3F4F6;
  vertical-align: middle;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table tbody tr:last-child td {
  border-bottom: none;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table tbody tr:hover {
  background: #F4F4FF;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-col-actions {
  width: 56px;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-col-num {
  width: 40px;
  color: #71717A;
  font-family: "Inter-500";
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-col-logo {
  width: 76px;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-teams-empty-row td {
  text-align: center;
  color: #71717A;
  font-style: italic;
  padding: 20px;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table input {
  width: 100%;
  padding: 6px 10px;
  font-family: "Inter-400";
  font-size: 13px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #18181B;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table input::placeholder {
  color: #71717A;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table input:focus {
  background: #ffffff;
  border-color: #2C2970;
  outline: none;
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.12);
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-team-remove {
  background: #ffffff;
  border: 1px solid #FCA5A5;
  color: #B91C1C;
  border-radius: 6px;
  width: 32px;
  height: 32px;
  font-size: 14px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-team-remove:hover {
  background: #FEF2F2;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell {
  position: relative;
  width: 40px;
  height: 40px;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-thumb,
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-empty {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  cursor: pointer;
  padding: 0;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-thumb {
  border: 1px solid rgba(76, 76, 77, 0.18);
  background: #ffffff;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-empty {
  border: 1px dashed #2C2970;
  background: #EEEEFF;
  color: #201E52;
  font-size: 20px;
  font-family: "Inter-500";
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-empty:hover {
  background: #F4F4FF;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-clear {
  position: absolute;
  top: -6px;
  right: -6px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 1px solid #FCA5A5;
  background: #ffffff;
  color: #B91C1C;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-teams-table .ldt-logo-cell .ldt-logo-clear:hover {
  background: #FEF2F2;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-add-row {
  width: 100%;
  padding: 12px 16px;
  background: #ffffff;
  border: none;
  border-top: 1px solid rgba(76, 76, 77, 0.18);
  color: #2C2970;
  font-family: "Inter-600";
  font-size: 13px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-start;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-add-row svg {
  color: #2C2970;
}
.local-divisions-step .ldt-division .ldt-table-card .ldt-add-row:hover {
  background: #F4F4FF;
}
.local-divisions-step .ldt-add-division {
  align-self: flex-start;
  padding: 10px 18px;
  border: 1px dashed #2C2970;
  border-radius: 10px;
  background: transparent;
  color: #201E52;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
}
.local-divisions-step .ldt-add-division:hover {
  background: #F0EFF8;
}
.local-divisions-step .create-league-step-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}
.local-divisions-step .create-league-step-actions .create-league-btn-outline,
.local-divisions-step .create-league-step-actions .create-league-btn-primary {
  font-family: "Inter-500";
}
.local-divisions-step .ldt-confirm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}
.local-divisions-step .ldt-confirm-overlay .ldt-confirm-modal {
  background: #ffffff;
  border-radius: 12px;
  padding: 24px;
  width: min(400px, 90vw);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
  font-family: "Inter-400";
}
.local-divisions-step .ldt-confirm-overlay .ldt-confirm-modal p {
  margin: 0 0 18px;
  font-size: 14px;
  color: #18181B;
  line-height: 1.5;
}
.local-divisions-step .ldt-confirm-overlay .ldt-confirm-modal p strong {
  font-family: "Inter-600";
}
.local-divisions-step .ldt-confirm-overlay .ldt-confirm-modal .ldt-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}.tournament-preview-step {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 0 8px;
  font-family: "Inter-400";
  color: #18181B;
  /* HERO */
  /* STAT ROW */
  /* GRID */
  /* FLAGS */
  /* DIVISIONS */
  /* TICKER */
  /* DESCRIPTION */
}
.tournament-preview-step .create-league-step-title {
  font-family: "Inter-700";
  font-size: 22px;
  margin: 0 0 4px;
  color: #201E52;
}
.tournament-preview-step .tp-hero {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  height: 220px;
  background: linear-gradient(135deg, #201E52 0%, #2C2970 60%, #5753C0 100%);
  box-shadow: 0 8px 24px rgba(20, 20, 43, 0.12);
}
.tournament-preview-step .tp-hero .tp-hero-banner {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.6;
}
.tournament-preview-step .tp-hero .tp-hero-banner--empty {
  background: transparent;
}
.tournament-preview-step .tp-hero .tp-hero-scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 14, 60, 0.15) 0%, rgba(15, 14, 60, 0.78) 100%);
  z-index: 1;
}
.tournament-preview-step .tp-hero .tp-hero-text {
  position: relative;
  z-index: 2;
  height: 100%;
  padding: 28px 32px;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 8px;
}
.tournament-preview-step .tp-hero .tp-hero-text .tp-hero-badge {
  align-self: flex-start;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  backdrop-filter: blur(4px);
  font-family: "Inter-600";
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.tournament-preview-step .tp-hero .tp-hero-text h3 {
  margin: 0;
  font-family: "Inter-700";
  font-size: 30px;
  line-height: 1.15;
  letter-spacing: -0.4px;
}
.tournament-preview-step .tp-hero .tp-hero-text .tp-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  font-family: "Inter-500";
  font-size: 13px;
  opacity: 0.95;
}
.tournament-preview-step .tp-stat-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
}
.tournament-preview-step .tp-stat-card {
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-shadow: 0 1px 2px rgba(20, 20, 43, 0.04);
}
.tournament-preview-step .tp-stat-card .tp-stat-value {
  font-family: "Inter-700";
  font-size: 24px;
  color: #201E52;
  line-height: 1;
}
.tournament-preview-step .tp-stat-card .tp-stat-label {
  font-family: "Inter-500";
  font-size: 12px;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  color: #71717A;
}
.tournament-preview-step .tp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}
.tournament-preview-step .tp-card {
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 12px;
  padding: 18px 20px;
  box-shadow: 0 1px 2px rgba(20, 20, 43, 0.04);
}
.tournament-preview-step .tp-card--full {
  grid-column: 1/-1;
}
.tournament-preview-step .tp-card .tp-card-title {
  margin: 0 0 14px;
  font-family: "Inter-600";
  font-size: 13px;
  color: #201E52;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding-bottom: 10px;
  border-bottom: 1px solid #EEF2F7;
}
.tournament-preview-step .tp-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  padding: 7px 0;
  font-size: 13px;
}
.tournament-preview-step .tp-row .tp-row-label {
  color: #71717A;
  font-family: "Inter-400";
}
.tournament-preview-step .tp-row .tp-row-value {
  color: #18181B;
  font-family: "Inter-600";
  text-align: right;
  word-break: break-word;
}
.tournament-preview-step .tp-flag-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.tournament-preview-step .tp-flag-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #F6F6F6;
  color: #71717A;
  font-family: "Inter-500";
  font-size: 12px;
}
.tournament-preview-step .tp-flag-pill .tp-flag-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #DBDBDB;
}
.tournament-preview-step .tp-flag-pill.is-on {
  background: #DCFCE7;
  color: #14532D;
}
.tournament-preview-step .tp-flag-pill.is-on .tp-flag-dot {
  background: #1AA915;
}
.tournament-preview-step .tp-empty {
  margin: 0;
  color: #71717A;
  font-family: "Inter-400";
  font-size: 13px;
  padding: 16px;
  background: #FAFAFE;
  border-radius: 8px;
  text-align: center;
}
.tournament-preview-step .tp-division-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.tournament-preview-step .tp-division-item {
  background: #FAFAFE;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 12px;
  padding: 14px 16px;
}
.tournament-preview-step .tp-division-item .tp-division-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.14);
}
.tournament-preview-step .tp-division-item .tp-division-head .tp-division-name {
  font-family: "Inter-700";
  font-size: 15px;
  color: #201E52;
}
.tournament-preview-step .tp-division-item .tp-division-head .tp-division-meta {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.tournament-preview-step .tp-division-item .tp-group-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tournament-preview-step .tp-division-item .tp-group-block .tp-group-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6px;
}
.tournament-preview-step .tp-division-item .tp-group-block .tp-group-row .tp-group-name {
  font-family: "Inter-600";
  font-size: 13px;
  color: #18181B;
}
.tournament-preview-step .tp-division-item .tp-group-block .tp-group-row .tp-group-team-count {
  font-family: "Inter-500";
  font-size: 11px;
  color: #71717A;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.tournament-preview-step .tp-division-item .tp-team-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tournament-preview-step .tp-division-item .tp-team-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px 4px 4px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 999px;
  font-family: "Inter-500";
  font-size: 12px;
}
.tournament-preview-step .tp-division-item .tp-team-chip .tp-team-logo {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  object-fit: cover;
  flex-shrink: 0;
}
.tournament-preview-step .tp-division-item .tp-team-chip .tp-team-logo--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 11px;
}
.tournament-preview-step .tp-division-item .tp-team-chip .tp-team-name {
  color: #18181B;
}
.tournament-preview-step .tp-division-item .tp-team-chip .tp-team-code {
  font-family: "Inter-700";
  font-size: 10px;
  color: #201E52;
  background: #EEEEFF;
  padding: 2px 6px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}
.tournament-preview-step .tp-ticker-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
}
.tournament-preview-step .tp-ticker-list .tp-ticker-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: #EEEEFF;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  font-size: 13px;
}
.tournament-preview-step .tp-ticker-list .tp-ticker-item .tp-ticker-name {
  font-family: "Inter-600";
  color: #201E52;
}
.tournament-preview-step .tp-ticker-list .tp-ticker-item .tp-ticker-interval {
  color: #71717A;
  font-family: "Inter-500";
  font-size: 11px;
  background: #ffffff;
  padding: 3px 8px;
  border-radius: 999px;
}
.tournament-preview-step .tp-description {
  margin: 0;
  color: #18181B;
  font-family: "Inter-400";
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-wrap;
}
.tournament-preview-step .create-league-step-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 4px;
}
.tournament-preview-step .create-league-step-actions button {
  font-family: "Inter-500";
}/* Create League uses create-tournament-wrapper, background-image-wrapper,
   background-image, create-tourmament-wrap, ct-header from createTournament.scss
   for identical layout. Stepper and content styles below. */
.create-tournament-wrapper.create-league-page {
  top: 54px;
}

.create-tournament-wrapper.create-tournament-page--no-banner {
  top: 140px;
  padding-bottom: 160px;
}
.create-tournament-wrapper.create-tournament-page--no-banner .create-tourmament-wrap {
  top: 0;
  margin-top: 0;
  padding-bottom: 32px;
}

.create-league-stepper-wrap {
  display: flex;
  justify-content: center;
  margin: 16px 0 12px;
  padding: 0 10px;
  position: relative;
  z-index: 1;
}

.create-league-stepper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 10px 32px;
  height: 65px;
  width: 100%;
  max-width: 701px;
  background: #fff;
  border-radius: 54px;
  filter: drop-shadow(0px 0px 3.25px rgba(0, 0, 0, 0.12));
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}

.heading-league {
  font-size: 22px;
  font-family: "Inter-700";
  font-weight: 700;
  color: #000;
  line-height: 100%;
  margin: 0;
}

.create-league-step-connector {
  flex: 1 1 auto;
  min-width: 60px;
  max-width: 252px;
  height: 1px;
  background: rgba(76, 76, 77, 0.25);
  margin: 0 12px;
}
.create-league-step-connector.dark {
  background: rgba(76, 76, 77, 0.5);
}

.create-league-step {
  display: flex;
  align-items: center;
  gap: 12px;
  list-style: none;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Roboto-500";
  font-size: 20px;
  flex-shrink: 0;
}
.create-league-step .create-league-step-dot {
  width: 41px;
  height: 41px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1.15px solid rgba(76, 76, 77, 0.6);
  background: transparent;
  color: rgba(76, 76, 77, 0.6);
  flex-shrink: 0;
}
.create-league-step .create-league-step-dot .create-league-step-dot-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 21px;
  height: 21px;
}
.create-league-step .create-league-step-dot.reached {
  width: 54px;
  height: 54px;
  border: none;
  background: rgba(131, 125, 255, 0.13);
  padding: 0;
}
.create-league-step .create-league-step-dot.reached .create-league-step-dot-inner {
  width: 41px;
  height: 41px;
  border-radius: 50%;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 99.94%);
  color: #fff;
}
.create-league-step.active, .create-league-step.completed {
  color: #201E52;
}

.create-league-content {
  position: relative;
  z-index: 1;
  padding: 0 10px;
}

.create-league-step-form {
  width: 100%;
  max-width: 1081px;
  margin: 0 auto;
  padding: 0px 10px 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.create-league-step-title {
  font-size: 24px;
  font-family: "Inter-500";
  font-weight: 600;
  line-height: 120%;
  letter-spacing: 0px;
  margin: 4px 0 0;
  color: #000000;
}

.create-league-step-label {
  font-size: 18px;
  font-family: "Inter-500";
  color: #000;
  margin: 0;
}

.create-league-field-error {
  color: #d8252d;
  font-size: 13px;
  margin-top: 2px;
}

.create-league-char-counter {
  color: #6b7280;
  font-size: 12px;
  align-self: flex-end;
}

.create-league-field-hint {
  color: #6b7280;
  font-size: 12px;
}

.create-league-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.create-league-field label {
  font-size: 18px;
  font-family: "Inter-500";
  color: #000;
}
.create-league-field label .req {
  color: #d8252d;
}
.create-league-field label > .req:first-child {
  margin-right: 4px;
  margin-left: 0;
}
.create-league-field label > .req:last-child:not(:first-child) {
  margin-left: 2px;
}
.create-league-field input,
.create-league-field select,
.create-league-field textarea {
  width: 100%;
  border: 1px solid #d9d9d9;
  font-size: 14px;
  padding: 0 14px;
  height: 42px;
  border-radius: 8px;
  background: #ffffff;
  box-sizing: border-box;
}
.create-league-field select {
  cursor: pointer;
}

.create-league-toggle {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.create-league-toggle .create-league-toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.create-league-toggle .create-league-toggle-desc {
  font-size: 12px;
  color: #8e8e8e;
  line-height: 120%;
  letter-spacing: 0px;
  font-family: "Inter-400";
  margin: 0;
}

.create-league-switch {
  width: 48px;
  height: 24px;
  background: #ccc;
  border: none;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
  padding: 0;
}
.create-league-switch.on {
  background: #201e52;
}
.create-league-switch .create-league-switch-slider {
  position: absolute;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  top: 2px;
  left: 2px;
  transition: transform 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.create-league-switch.on .create-league-switch-slider {
  transform: translateX(22px);
}

.create-league-step-actions {
  display: flex;
  justify-content: flex-end;
  gap: 14px;
  margin-top: 20px;
}

.create-league-btn-primary {
  padding: 14.5px 43.5px;
  background: #201e52;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 18px;
  font-weight: 500;
  font-family: "Inter-500";
  line-height: 120%;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0px;
}

.create-league-btn-outline {
  padding: 12px 41px;
  background: #fff;
  color: #201e52;
  border: 1px solid #201e52;
  border-radius: 4px;
  font-size: 18px;
  line-height: 120%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  font-weight: 600;
  cursor: pointer;
}

.league-details-address-row {
  display: flex;
  flex-direction: row;
  width: 100%;
  gap: 16px;
}
.league-details-address-row .create-league-field {
  width: 100%;
  max-width: 351px;
}

/* League Details - two column */
.league-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
@media (max-width: 768px) {
  .league-details-grid {
    grid-template-columns: 1fr;
  }
}

.league-details-col {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* League Logo - input + upload button as single unified field */
.league-logo-input-wrap {
  display: flex;
  align-items: stretch;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}
.league-logo-input-wrap .league-logo-text {
  flex: 1;
  min-width: 0;
  padding: 0 14px;
  height: 42px;
  border: none;
  background: transparent;
  font-size: 14px;
  color: #6b7280;
}
.league-logo-input-wrap .league-logo-text::placeholder {
  color: #9ca3af;
}
.league-logo-input-wrap .league-logo-file {
  display: none;
}
.league-logo-input-wrap .league-logo-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  background: #e5e7eb;
  color: #6b7280;
  border: none;
  border-left: 1px solid #d9d9d9;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
}
.league-logo-input-wrap .league-logo-upload-btn svg {
  flex-shrink: 0;
}
.league-logo-input-wrap .league-logo-upload-btn:hover {
  background: #d1d5db;
}

/* Match Tournament Details step: phone uses .form-control-wrap / .phone-input-field from common.scss */
.league-details-step .create-league-phone-field.form-control-wrap .form-group {
  margin-bottom: 0;
}

/* Inline previews for logo + banner uploaded in League Details step */
.league-upload-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.league-logo-preview {
  width: 64px;
  height: 64px;
  border-radius: 12px;
  object-fit: cover;
  background: #f3f4f6;
  border: 1px solid #d9d9d9;
  flex-shrink: 0;
}
.league-logo-preview--empty {
  background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
  display: inline-block;
}

.league-banner-preview {
  margin-top: 10px;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid #d9d9d9;
  background: #f3f4f6;
}
.league-banner-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Grounds step */
.grounds-upload-zone {
  border: 2px dashed #7571cb;
  border-radius: 8px;
  padding: 32px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s;
}
.grounds-upload-zone.dragging {
  border-color: #201e52;
}

.grounds-upload-icon {
  font-size: 32px;
  display: block;
  margin-bottom: 8px;
}

.grounds-upload-text {
  font-size: 14px;
  margin: 0 0 4px;
}

.grounds-upload-hint {
  font-size: 12px;
  color: #6b7280;
  margin: 0;
}

.grounds-template-link {
  font-size: 14px;
  color: #201e52;
  margin: 12px 0;
  display: inline-block;
}

.grounds-add-manually-btn {
  padding: 12px 20px;
  background: #201e52;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  align-self: flex-start;
}

/* Divisions */
.divisions-config {
  display: flex;
  gap: 16px;
  align-items: flex-end;
  flex-wrap: wrap;
}

/* Tournament details - inherit from createTournament */
.tournament-details-step .common-stepper-details-wrap {
  padding: 0;
}.add-players-v2 {
  font-family: "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #1f2937;
  background: #ffffff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  border: 1px solid #e5e7eb;
}
.add-players-v2 *,
.add-players-v2 *::before,
.add-players-v2 *::after {
  box-sizing: border-box;
  font-family: inherit;
}
.add-players-v2__header {
  background: linear-gradient(135deg, #201e52 0%, #1a1845 100%);
  padding: 18px 28px;
  display: flex;
  align-items: center;
}
.add-players-v2__title {
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.3px;
}
.add-players-v2__body {
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.add-players-v2__filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.add-players-v2__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.add-players-v2__label {
  font-family: "Inter-200", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #4b5563;
}
.add-players-v2__label .req {
  color: #dc2626;
  margin-left: 2px;
}
.add-players-v2__tabs {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  border-bottom: 2px solid #e5e7eb;
  padding: 0 4px;
}
.add-players-v2__tab {
  background: transparent;
  border: none;
  color: #6b7280;
  font-family: "Inter-200", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  font-weight: 500;
  padding: 10px 18px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color 0.15s ease, border-color 0.15s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.add-players-v2__tab .tab-icon {
  font-size: 16px;
  line-height: 1;
}
.add-players-v2__tab:hover {
  color: #201e52;
}
.add-players-v2__tab.is-active {
  color: #201e52;
  border-bottom-color: #201e52;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-weight: 600;
}
.add-players-v2__panel {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.add-players-v2__panel-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.add-players-v2__panel-title {
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: #1f2937;
}
.add-players-v2__panel-sub {
  font-size: 13px;
  color: #6b7280;
}
.add-players-v2__panel-sub .req {
  color: #dc2626;
}
.add-players-v2__panel-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 14px;
  padding-top: 8px;
  border-top: 1px solid #f1f2f7;
}
.add-players-v2__hint-inline {
  font-size: 12px;
  color: #6b7280;
  font-style: italic;
}
.add-players-v2__save {
  background: #201e52;
  color: #ffffff;
  border: none;
  padding: 11px 24px;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.05s ease;
  letter-spacing: 0.2px;
}
.add-players-v2__save:hover:not(:disabled) {
  background: #2c2a6e;
}
.add-players-v2__save:active:not(:disabled) {
  transform: translateY(1px);
}
.add-players-v2__save:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.add-players-v2__table-scroll {
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  overflow: auto;
  max-height: 480px;
  background: #ffffff;
  -webkit-overflow-scrolling: touch;
}
.add-players-v2__table-scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
.add-players-v2__table-scroll::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 8px;
  border: 2px solid #ffffff;
}
.add-players-v2__table-scroll::-webkit-scrollbar-track {
  background: #fafbff;
}
.add-players-v2__table {
  width: 100%;
  min-width: 1280px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.add-players-v2__table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: linear-gradient(180deg, #fafbff 0%, #eef0fa 100%);
  color: #4b5563;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  padding: 12px 12px;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  white-space: nowrap;
}
.add-players-v2__table thead th .req {
  color: #dc2626;
}
.add-players-v2__table tbody tr {
  transition: background 0.1s ease;
}
.add-players-v2__table tbody tr:hover {
  background: #fafbff;
}
.add-players-v2__table tbody td {
  padding: 10px 12px;
  border-bottom: 1px solid #f1f2f7;
  vertical-align: top;
  position: relative;
}
.add-players-v2__table tbody tr:last-child td {
  border-bottom: none;
}
.add-players-v2__table .col-action {
  width: 48px;
  text-align: center;
}
.add-players-v2__table .col-num {
  width: 44px;
  text-align: center;
  color: #6b7280;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  padding-top: 18px !important;
}
.add-players-v2__table .col-first {
  width: 12%;
}
.add-players-v2__table .col-last {
  width: 10%;
}
.add-players-v2__table .col-role {
  width: 10%;
}
.add-players-v2__table .col-playing {
  width: 11%;
}
.add-players-v2__table .col-dob {
  width: 11%;
  min-width: 150px;
}
.add-players-v2__table .col-mobile {
  width: 17%;
  min-width: 220px;
}
.add-players-v2__table .col-email {
  width: auto;
  min-width: 200px;
}
.add-players-v2__table input,
.add-players-v2__table select {
  width: 100%;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  padding: 9px 12px;
  font-family: inherit;
  font-size: 13px;
  color: #1f2937;
  background: #ffffff;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.add-players-v2__table input::placeholder,
.add-players-v2__table select::placeholder {
  color: #9ca3af;
  font-size: 12.5px;
}
.add-players-v2__table input:hover:not(:disabled),
.add-players-v2__table select:hover:not(:disabled) {
  border-color: #c7c9d4;
}
.add-players-v2__table input:focus,
.add-players-v2__table select:focus {
  border-color: #201e52;
  box-shadow: 0 0 0 3px rgba(32, 30, 82, 0.12);
}
.add-players-v2__table input.has-error,
.add-players-v2__table select.has-error {
  border-color: #dc2626;
  background: #fff7f7;
}
.add-players-v2__table input.has-error:focus,
.add-players-v2__table select.has-error:focus {
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}
.add-players-v2__table select {
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 30px;
}
.add-players-v2__table .cell-err {
  display: block;
  color: #dc2626;
  font-size: 11px;
  margin-top: 4px;
  line-height: 1.2;
}
.add-players-v2__table .phone-group {
  display: flex;
  gap: 6px;
  align-items: stretch;
}
.add-players-v2__table .phone-group .phone-cc {
  flex: 0 0 88px;
  padding-right: 22px;
  background-position: right 6px center;
  font-size: 12px;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #4b5563;
}
.add-players-v2__table .phone-group .phone-num {
  flex: 1;
  min-width: 0;
}
.add-players-v2__table input[type=date] {
  font-family: inherit;
  color: #1f2937;
}
.add-players-v2__table input[type=date]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 0.15s ease;
}
.add-players-v2__table input[type=date]:hover::-webkit-calendar-picker-indicator {
  opacity: 0.9;
}
.add-players-v2 .cell-del-btn {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid #fecaca;
  background: #fee2e2;
  color: #dc2626;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, transform 0.05s ease;
}
.add-players-v2 .cell-del-btn:hover:not(:disabled) {
  background: #fecaca;
}
.add-players-v2 .cell-del-btn:active:not(:disabled) {
  transform: scale(0.92);
}
.add-players-v2 .cell-del-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.add-players-v2__add-row {
  align-self: flex-start;
  background: #f7f6ff;
  border: 1px dashed #c4c5d8;
  color: #201e52;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 9px 16px;
  border-radius: 8px;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.add-players-v2__add-row:hover {
  background: #ecebff;
  border-color: #201e52;
}
.add-players-v2__search {
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.add-players-v2__search input {
  flex: 1;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 11px 14px;
  font-family: inherit;
  font-size: 13.5px;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.add-players-v2__search input:focus {
  border-color: #201e52;
  box-shadow: 0 0 0 3px rgba(32, 30, 82, 0.12);
}
.add-players-v2__search-btn {
  background: #201e52;
  color: #ffffff;
  border: none;
  padding: 0 22px;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.add-players-v2__search-btn:hover:not(:disabled) {
  background: #2c2a6e;
}
.add-players-v2__search-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.add-players-v2__hint {
  font-size: 13px;
  color: #6b7280;
  padding: 12px 4px;
}
.add-players-v2__hint.is-error {
  color: #dc2626;
}
.add-players-v2__results-meta {
  font-size: 12.5px;
  color: #6b7280;
  margin-top: 2px;
}
.add-players-v2__results-meta .results-query {
  color: #1f2937;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-weight: 600;
}
.add-players-v2__results-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
  max-height: 420px;
  overflow-y: auto;
  padding: 4px;
  margin: -4px;
}
.add-players-v2__results-grid::-webkit-scrollbar {
  width: 10px;
}
.add-players-v2__results-grid::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 8px;
  border: 2px solid #ffffff;
}
.add-players-v2__results-grid::-webkit-scrollbar-track {
  background: transparent;
}
.add-players-v2__result-card {
  position: relative;
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #ffffff;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.05s ease;
  min-width: 0;
}
.add-players-v2__result-card:hover {
  border-color: #c4c5d8;
  background: #fafbff;
  box-shadow: 0 4px 14px rgba(32, 30, 82, 0.06);
}
.add-players-v2__result-card.is-selected {
  border-color: #201e52;
  background: #f3f2ff;
  box-shadow: 0 0 0 3px rgba(32, 30, 82, 0.08);
}
.add-players-v2__result-card.is-selected .result-avatar {
  box-shadow: 0 0 0 2px #f3f2ff, 0 0 0 4px #201e52;
}
.add-players-v2__result-card .result-checkbox {
  width: 18px;
  height: 18px;
  accent-color: #201e52;
  cursor: pointer;
  flex-shrink: 0;
}
.add-players-v2__result-card .result-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #201e52 0%, #1a1845 100%);
  color: #ffffff;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: box-shadow 0.15s ease;
}
.add-players-v2__result-card .result-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
}
.add-players-v2__result-card .result-name {
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #1f2937;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.add-players-v2__result-card .result-meta {
  font-size: 11.5px;
  color: #6b7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: "Inter-300", monospace;
  letter-spacing: 0.2px;
}
.add-players-v2__result-card .result-role-chip {
  flex-shrink: 0;
  padding: 3px 9px;
  border-radius: 999px;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  background: #eef0fa;
  color: #4b5563;
  border: 1px solid transparent;
  white-space: nowrap;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.add-players-v2__result-card .result-role-chip.role-captain {
  background: #fff4e0;
  color: #b45309;
  border-color: #fde6bd;
}
.add-players-v2__result-card .result-role-chip.role-vice-captain {
  background: #e8f0ff;
  color: #1d4ed8;
  border-color: #cbdcff;
}
.add-players-v2__result-card .result-role-chip.role-wicket-keeper {
  background: #e6f7ee;
  color: #047857;
  border-color: #c1ebd3;
}
.add-players-v2__result-card .result-role-chip.role-all-rounder {
  background: #f3edff;
  color: #6d28d9;
  border-color: #ddd0fb;
}
.add-players-v2__result-card .result-role-chip.role-on-roster {
  background: #e6f7ee;
  color: #047857;
  border-color: #c1ebd3;
}
.add-players-v2__result-card.is-on-roster {
  opacity: 0.55;
  cursor: not-allowed;
  background: #fafbff;
}
.add-players-v2__result-card.is-on-roster:hover {
  border-color: #e5e7eb;
  background: #fafbff;
  box-shadow: none;
}
.add-players-v2__result-card.is-on-roster .result-checkbox {
  cursor: not-allowed;
}
.add-players-v2__roster {
  background: #fafbff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.add-players-v2__roster-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.add-players-v2__roster-title {
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #1f2937;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.add-players-v2__roster-title .roster-count {
  background: #201e52;
  color: #ffffff;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
  min-width: 22px;
  text-align: center;
  letter-spacing: 0.3px;
}
.add-players-v2__roster-team {
  font-size: 12px;
  color: #6b7280;
  font-style: italic;
}
.add-players-v2__roster-empty {
  background: #ffffff;
  border: 1px dashed #e5e7eb;
  border-radius: 10px;
  padding: 18px;
  text-align: center;
  color: #6b7280;
  font-size: 13px;
}
.add-players-v2__roster-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
}
.add-players-v2__roster-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 10px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 10px 12px;
  transition: opacity 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  min-width: 0;
}
.add-players-v2__roster-card:hover {
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}
.add-players-v2__roster-card.is-removing {
  opacity: 0.5;
  pointer-events: none;
}
.add-players-v2__roster-card .roster-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: linear-gradient(135deg, #4f4d8a 0%, #1a1845 100%);
  color: #ffffff;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.4px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.add-players-v2__roster-card .roster-body {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  overflow: hidden;
}
.add-players-v2__roster-card .roster-name {
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #1f2937;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.add-players-v2__roster-card .roster-meta {
  font-size: 11px;
  color: #6b7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: monospace;
}
.add-players-v2__roster-card .roster-chip {
  flex-shrink: 0;
  width: 26px;
  height: 22px;
  border-radius: 6px;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.4px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.add-players-v2__roster-card .roster-chip.chip-captain {
  background: #fff4e0;
  color: #b45309;
}
.add-players-v2__roster-card .roster-chip.chip-vc {
  background: #e8f0ff;
  color: #1d4ed8;
}
.add-players-v2__roster-card .roster-remove-btn {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid #fecaca;
  background: #fee2e2;
  color: #dc2626;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background 0.15s ease, transform 0.05s ease;
}
.add-players-v2__roster-card .roster-remove-btn:hover:not(:disabled) {
  background: #fecaca;
}
.add-players-v2__roster-card .roster-remove-btn:active:not(:disabled) {
  transform: scale(0.92);
}
.add-players-v2__roster-card .roster-remove-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
@media (max-width: 540px) {
  .add-players-v2__results-grid {
    grid-template-columns: 1fr;
  }
  .add-players-v2__result-card {
    grid-template-columns: auto auto 1fr;
  }
  .add-players-v2__result-card .result-role-chip {
    grid-column: 1/-1;
    justify-self: start;
    margin-top: 4px;
  }
}
.add-players-v2__confirmed {
  border-top: 1px dashed #e5e7eb;
  padding-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.add-players-v2__confirmed-title {
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #4b5563;
}
.add-players-v2__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.add-players-v2__chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #ecebff;
  border: 1px solid #d6d4f5;
  border-radius: 999px;
  padding: 4px 4px 4px 4px;
  font-size: 12.5px;
  color: #1f2937;
  transition: background 0.15s ease;
}
.add-players-v2__chip:hover {
  background: #e0ddff;
}
.add-players-v2__chip .chip-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #201e52;
  color: #ffffff;
  font-family: "Inter-700", "Inter-300", "Inter-200", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 11px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}
.add-players-v2__chip .chip-name {
  padding: 0 4px;
  font-weight: 500;
}
.add-players-v2__chip button {
  background: transparent;
  border: none;
  color: #6b7280;
  font-size: 15px;
  cursor: pointer;
  padding: 0 8px 0 4px;
  line-height: 1;
}
.add-players-v2__chip button:hover {
  color: #dc2626;
}
@media (max-width: 768px) {
  .add-players-v2__body {
    padding: 18px;
    gap: 18px;
  }
  .add-players-v2__filters {
    grid-template-columns: 1fr;
  }
  .add-players-v2__tabs {
    gap: 0;
  }
  .add-players-v2__tab {
    flex: 1;
    justify-content: center;
    font-size: 13px;
    padding: 10px 8px;
  }
}/* Uses create-tournament-wrapper, background-image-wrapper, create-tourmament-wrap from createTournament.scss */
.schedule-match-wrap .form-dropdown {
  width: 100%;
}
.schedule-match-wrap .profile-date-picker {
  width: 100%;
}
.schedule-match-wrap .ct-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 10px 24px;
  position: relative;
  z-index: 1;
}
.schedule-match-wrap .ct-header img {
  cursor: pointer;
  width: 24px;
  height: 24px;
}
.schedule-match-wrap .ct-header .heading {
  font-family: "Inter-700", "Inter", sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
}
.schedule-match-wrap .schedule-match-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 20px 10px;
  font-family: "Inter-400", "Inter", sans-serif;
  position: relative;
  z-index: 1;
}

/* Tabs */
.schedule-match-tabs {
  display: flex;
  gap: 16px;
}

.schedule-match-tab {
  border-radius: 4px;
  padding: 10px 20px;
  border: 1px solid #2c2970;
  background: #fff;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 16px;
  color: #2c2970;
  cursor: pointer;
  height: 44px;
  min-width: 140px;
  transition: background 0.2s, color 0.2s;
}
.schedule-match-tab:hover {
  background: #f9fafb;
}
.schedule-match-tab.active {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 99.94%);
  border-color: #2c2970;
  color: #fff;
}

/* Single Match */
.schedule-match-single {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.schedule-match-team-row {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}

.schedule-match-team-col {
  flex: 1 1 320px;
  display: flex;
  flex-direction: column;
  gap: 9px;
  min-width: 260px;
}

.schedule-match-team-label {
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 16px;
  color: #111827;
}

.schedule-match-team-select {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 12px;
  background: #fff;
  padding: 10px 12px;
  min-height: 72px;
  box-sizing: border-box;
  /* Override FormDropdown trigger styling so it blends with the card */
}
.schedule-match-team-select .schedule-match-team-dropdown {
  flex: 1;
  min-width: 0;
}
.schedule-match-team-select .form-dropdown__trigger {
  border: none;
  background: transparent;
  box-shadow: none;
  padding-left: 0;
  padding-right: 0;
  min-height: 44px;
  font-family: "Inter-600", "Inter", sans-serif;
  font-weight: 600;
  font-size: 16px;
  color: #4c4c4d;
}
.schedule-match-team-select .form-dropdown__trigger:hover:not(:disabled) {
  border-color: transparent;
}
.schedule-match-team-select.is-filled {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 99.94%);
  border-color: #2c2970;
}
.schedule-match-team-select.is-filled .form-dropdown__trigger,
.schedule-match-team-select.is-filled .form-dropdown__trigger--placeholder {
  color: #fff;
}
.schedule-match-team-select.is-filled .form-dropdown__chevron {
  color: #fff;
}

.schedule-match-team-select-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
}
.schedule-match-team-select-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.schedule-match-vs-pill {
  width: 56px;
  height: 51px;
  border-radius: 29px;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 99.94%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 18px;
  font-weight: 500;
  flex-shrink: 0;
  margin-bottom: 0;
  align-self: flex-end;
}

/* Details container */
.schedule-match-details-panel {
  border: 2px dashed #e5e7eb;
  border-radius: 12px;
  background: rgba(247, 246, 255, 0.4);
  padding: 24px 28px 16px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: opacity 0.15s ease;
}
.schedule-match-details-panel.is-disabled {
  opacity: 0.5;
  pointer-events: none;
  user-select: none;
  filter: saturate(0.6);
}

.schedule-match-details-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px 30px;
}
@media (max-width: 900px) {
  .schedule-match-details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .schedule-match-details-grid {
    grid-template-columns: 1fr;
  }
}

.schedule-match-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.schedule-match-field label {
  font-family: "Inter-600", "Inter", sans-serif;
  font-weight: 600;
  font-size: 16px;
  color: #111827;
  min-height: 19px;
}
.schedule-match-field label .req {
  color: #d8252d;
}
.schedule-match-field input {
  padding: 10px 16px;
  height: 44px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 4px;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  background: #fff;
  box-sizing: border-box;
}

.schedule-match-ticker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 8px;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 16px;
  color: #111827;
  max-width: 240px;
}

.schedule-match-setup-link {
  font-family: "Inter-700", "Inter", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #5753C0;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}
.schedule-match-setup-link:hover {
  color: rgb(66.7719148936, 62.7855319149, 171.4144680851);
}
.schedule-match-setup-link:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Actions */
.schedule-match-actions {
  display: flex;
  justify-content: flex-end;
}

.schedule-match-btn {
  padding: 0 24px;
  height: 51px;
  min-width: 194px;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 99.94%);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 18px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
}
.schedule-match-btn:hover {
  filter: brightness(1.05);
}
.schedule-match-btn--next:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.schedule-match-placeholder {
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 14px;
  color: #6b7280;
  padding: 0;
}

/* Bulk Schedule */
.schedule-match-bulk {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.schedule-bulk-table-wrap {
  background: #fff;
  border: 1px solid rgba(198, 197, 212, 0.4);
  border-radius: 13px;
  box-shadow: 0px 20px 25px -5px rgba(0, 6, 102, 0.05), 0px 8px 10px -6px rgba(0, 6, 102, 0.05);
  overflow: hidden;
}

.schedule-bulk-table-header {
  background: #f3f3f3;
  border-bottom: 1px solid rgba(198, 197, 212, 0.4);
  padding: 16px 24px;
  font-family: "Inter-700", "Manrope", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #000;
}

.schedule-bulk-table-scroll {
  overflow-x: auto;
}

.schedule-bulk-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 1200px;
}
.schedule-bulk-table thead th {
  background: #fff;
  border-bottom: 1px solid rgba(161, 161, 161, 0.25);
  border-right: 1px solid rgba(161, 161, 161, 0.25);
  padding: 14px 16px;
  font-family: "Inter-700", "Inter", sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: #454652;
  text-align: left;
  white-space: nowrap;
}
.schedule-bulk-table thead th:last-child {
  border-right: none;
}
.schedule-bulk-table tbody td {
  border-bottom: 1px solid rgba(161, 161, 161, 0.25);
  border-right: 1px solid rgba(161, 161, 161, 0.25);
  padding: 6px 8px;
  vertical-align: middle;
  background: #fff;
}
.schedule-bulk-table tbody td:last-child {
  border-right: none;
}
.schedule-bulk-table tbody td input {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  height: 36px;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 12px;
  color: #4c4c4d;
  background: #fff;
}
.schedule-bulk-table tbody td .form-dropdown {
  min-width: 140px;
}
.schedule-bulk-table tbody td .form-dropdown button {
  height: 36px;
  font-size: 12px;
}
.schedule-bulk-table tbody td .profile-date-picker input {
  height: 36px;
  font-size: 12px;
}
.schedule-bulk-table .schedule-bulk-col--action {
  width: 49px;
  text-align: center;
  padding: 0;
}
.schedule-bulk-table .schedule-bulk-col--num {
  width: 38px;
  text-align: center;
  font-family: "Inter-700", "Inter", sans-serif;
  font-weight: 700;
  font-size: 12px;
  color: #454652;
  letter-spacing: 1.2px;
}
.schedule-bulk-table .schedule-bulk-col--date {
  min-width: 160px;
}
.schedule-bulk-table .schedule-bulk-col--time {
  min-width: 150px;
}

.schedule-bulk-row-delete {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: transparent;
  color: #d8252d;
  cursor: pointer;
  font-size: 18px;
}
.schedule-bulk-row-delete:hover {
  background: rgba(216, 37, 45, 0.08);
  border-radius: 4px;
}

.schedule-bulk-table-footer {
  background: #fff;
  border-top: 1px solid rgba(198, 197, 212, 0.4);
  padding: 16px 24px;
}

.schedule-bulk-add-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #000666;
  padding: 0;
}
.schedule-bulk-add-row svg {
  width: 14px;
  height: 14px;
}
.schedule-bulk-add-row:hover {
  color: rgb(0, 4.5, 76.5);
  text-decoration: underline;
}
/* Portal root — no Radix; renders under document.body */
.update-tournament-modal-root {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  box-sizing: border-box;
}

.update-tournament-modal-overlay {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  cursor: pointer;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(2px);
  animation: update-tournament-overlay-in 160ms ease forwards;
}

@keyframes update-tournament-overlay-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes update-tournament-content-in {
  from {
    transform: scale(0.96);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
.update-tournament-modal-content {
  position: relative;
  z-index: 1;
  width: min(94vw, 880px);
  max-height: min(90vh, 920px);
  overflow-y: auto;
  overflow-x: hidden;
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.22);
  padding: 22px 28px 28px;
  outline: none;
  animation: update-tournament-content-in 180ms ease forwards;
}

.update-tournament-modal-missing-league {
  margin: 16px 0;
  font-size: 15px;
  color: #4c4c4d;
}

.update-tournament-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
  position: relative;
  padding-right: 44px;
}

.update-tournament-modal-title {
  margin: 0;
  font-size: 20px;
  font-family: "Inter-600";
  font-weight: 600;
  color: #111827;
  letter-spacing: -0.02em;
}

.update-tournament-modal-close {
  position: absolute;
  top: -6px;
  right: 0;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  color: #6b7280;
  cursor: pointer;
  border-radius: 10px;
}
.update-tournament-modal-close:hover {
  background: #f3f4f6;
  color: #111827;
}

/* —— Form (self-contained; do not rely on create-tournament wrapper scope) —— */
.update-tournament-modal-form label .req {
  color: #e11d48;
}
.update-tournament-modal-form .form-control-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 24px;
  align-items: start;
}
@media (max-width: 640px) {
  .update-tournament-modal-form .form-control-wrap {
    grid-template-columns: 1fr;
  }
}
.update-tournament-modal-form .form-group {
  width: 100%;
  margin-bottom: 16px;
}
.update-tournament-modal-form .form-group label {
  display: block;
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-bottom: 6px;
}
.update-tournament-modal-form .form-group .form-control,
.update-tournament-modal-form .form-group input.form-control {
  width: 100%;
  box-sizing: border-box;
  height: 42px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  outline: none;
  background: #fff;
  box-shadow: 0 1px 2px rgba(77, 64, 85, 0.08);
  font-family: "Inter-200";
  font-size: 14px;
}
.update-tournament-modal-form .form-group .form-control:focus,
.update-tournament-modal-form .form-group input.form-control:focus {
  border-color: #201e52;
}
.update-tournament-modal-form .form-group .form-control::placeholder,
.update-tournament-modal-form .form-group input.form-control::placeholder {
  color: rgba(76, 76, 77, 0.4509803922);
  font-family: "Inter-100";
}
.update-tournament-modal-form .form-group .phone {
  width: 100%;
}
.update-tournament-modal-form .form-group .phone .react-tel-input {
  width: 100%;
}
.update-tournament-modal-form .form-group .phone .phone-input-field {
  width: 100% !important;
  box-sizing: border-box;
  height: 42px !important;
  padding-left: 52px !important;
  border-radius: 8px !important;
}
.update-tournament-modal-form .form-group .phone .react-tel-input .flag-dropdown {
  border-radius: 8px 0 0 8px !important;
  border-color: rgba(76, 76, 77, 0.2509803922) !important;
}
.update-tournament-modal-form .update-tournament-dates-block {
  margin-bottom: 4px;
}
.update-tournament-modal-form .update-tournament-dates-label {
  display: block;
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-bottom: 8px;
}
.update-tournament-modal-form .update-tournament-dates-label .req {
  color: #e11d48;
}
.update-tournament-modal-form .date-range-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 640px) {
  .update-tournament-modal-form .date-range-pair {
    grid-template-columns: 1fr;
  }
}
.update-tournament-modal-form .date-field {
  min-width: 0;
}
.update-tournament-modal-form .date-field .profile-date-picker {
  width: 100%;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px 20px;
  margin: 8px 0 4px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .over-bolwer {
  flex: 1 1 200px;
  min-width: 160px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .over-bolwer label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  display: block;
  margin-bottom: 6px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .over-bolwer input {
  width: 100%;
  box-sizing: border-box;
  height: 42px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  outline: none;
  background: #fff;
  box-shadow: 0 1px 2px rgba(77, 64, 85, 0.08);
  font-family: "Inter-200";
  font-size: 14px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .over-bolwer input:focus {
  border-color: #201e52;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .points-data-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  flex: 2 1 280px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .points-data {
  flex: 1 1 100px;
  min-width: 92px;
  max-width: 140px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .points-data label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  display: block;
  margin-bottom: 6px;
  white-space: nowrap;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .points-data input {
  width: 100%;
  box-sizing: border-box;
  height: 42px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  outline: none;
  background: #fff;
  box-shadow: 0 1px 2px rgba(77, 64, 85, 0.08);
  font-family: "Inter-200";
  font-size: 14px;
}
.update-tournament-modal-form .update-tournament-score-rule.score-rule-wrap .points-data input:focus {
  border-color: #201e52;
}
.update-tournament-modal-form .match-type-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 28px;
  margin-top: 12px;
}
@media (max-width: 720px) {
  .update-tournament-modal-form .match-type-wrapper {
    grid-template-columns: 1fr;
  }
}
.update-tournament-modal-form .match-type-wrapper .match-type label,
.update-tournament-modal-form .match-type-wrapper .ball-type label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  display: block;
  margin-bottom: 10px;
}
.update-tournament-modal-form .match-type-wrapper .chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
}
.update-tournament-modal-form .match-type-wrapper .chip {
  border: 1px solid #201e52;
  background: #ffffff;
  color: #201E52;
  font-family: "Inter-200";
  padding: 8px 12px;
  min-height: 36px;
  border-radius: 6px;
  font-size: 11px;
  cursor: pointer;
  line-height: 1.2;
  text-align: center;
}
.update-tournament-modal-form .match-type-wrapper .chip.selected, .update-tournament-modal-form .match-type-wrapper .chip:hover {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}
.update-tournament-modal-form .other-limited-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  margin-top: 14px;
}
.update-tournament-modal-form .other-limited-wrap .over-wrap,
.update-tournament-modal-form .other-limited-wrap .wicket-wrap {
  display: flex;
  flex-direction: column;
  flex: 1 1 160px;
  min-width: 140px;
}
.update-tournament-modal-form .other-limited-wrap .over-wrap label,
.update-tournament-modal-form .other-limited-wrap .wicket-wrap label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-bottom: 6px;
}
.update-tournament-modal-form .other-limited-wrap .over-wrap input,
.update-tournament-modal-form .other-limited-wrap .wicket-wrap input {
  height: 42px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  outline: none;
  background: #fff;
  box-sizing: border-box;
  width: 100%;
  max-width: 220px;
}
.update-tournament-modal-form .tournament-category-wrapper {
  display: grid;
  grid-template-columns: 1fr minmax(200px, 260px);
  gap: 20px 28px;
  align-items: start;
  margin-top: 12px;
}
@media (max-width: 720px) {
  .update-tournament-modal-form .tournament-category-wrapper {
    grid-template-columns: 1fr;
  }
}
.update-tournament-modal-form .tournament-category-wrapper .category-wrap label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  display: block;
  margin-bottom: 10px;
}
.update-tournament-modal-form .tournament-category-wrapper .category-wrap .chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
}
.update-tournament-modal-form .tournament-category-wrapper .category-wrap .chip {
  border: 1px solid #201e52;
  background: #ffffff;
  color: #201E52;
  font-family: "Inter-200";
  padding: 8px 12px;
  min-height: 36px;
  border-radius: 6px;
  font-size: 11px;
  cursor: pointer;
}
.update-tournament-modal-form .tournament-category-wrapper .category-wrap .chip.selected, .update-tournament-modal-form .tournament-category-wrapper .category-wrap .chip:hover {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}
.update-tournament-modal-form .tournament-category-wrapper .update-tournament-match-days {
  margin-bottom: 0;
}
.update-tournament-modal-form .tournament-category-wrapper .update-tournament-match-days label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  display: block;
  margin-bottom: 6px;
}
.update-tournament-modal-form .tournament-category-wrapper .update-tournament-match-days select.form-control {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  background: #fff;
  font-family: "Inter-200";
  font-size: 14px;
  box-sizing: border-box;
}
.update-tournament-modal-form .update-tournament-toggles.toggles {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 14px 18px;
  justify-content: space-between;
  margin: 22px 0 18px;
  padding-top: 4px;
  border-top: 1px solid #f0f0f2;
}
@media (min-width: 960px) {
  .update-tournament-modal-form .update-tournament-toggles.toggles {
    flex-wrap: nowrap;
    gap: 12px;
  }
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  flex: 1 1 calc(50% - 12px);
  min-width: 0;
  max-width: 100%;
}
@media (min-width: 960px) {
  .update-tournament-modal-form .update-tournament-toggles.toggles .toggle {
    flex: 1 1 0;
    min-width: 0;
  }
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle input {
  display: none;
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle .slider {
  position: relative;
  flex-shrink: 0;
  width: 40px;
  height: 20px;
  border-radius: 999px;
  background: #ccc;
  transition: background 0.2s ease;
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle .slider::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s ease;
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle input:checked + .slider {
  background: #201E52;
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle input:checked + .slider::after {
  transform: translateX(20px);
}
.update-tournament-modal-form .update-tournament-toggles.toggles .toggle .label {
  font-family: "Inter-200";
  color: #111827;
  font-size: 12px;
  line-height: 1.35;
}
.update-tournament-modal-form .update-tournament-description.form-group-textarea {
  display: flex;
  flex-direction: column;
  margin-bottom: 12px;
}
.update-tournament-modal-form .update-tournament-description.form-group-textarea label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-bottom: 8px;
}
.update-tournament-modal-form .update-tournament-description.form-group-textarea .textarea {
  width: 100%;
  box-sizing: border-box;
  min-height: 100px;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  font-family: "Inter-200";
  font-size: 14px;
  resize: vertical;
}
.update-tournament-modal-form .update-tournament-description.form-group-textarea .textarea:focus {
  outline: none;
  border-color: #201e52;
}
.update-tournament-modal-form .update-tournament-description.form-group-textarea .textarea::placeholder {
  color: rgba(76, 76, 77, 0.4509803922);
  font-family: "Inter-100";
}
.update-tournament-modal-form .update-tournament-banner-row {
  margin-bottom: 8px;
}
.update-tournament-modal-form .update-tournament-banner-row label {
  font-family: "Inter-500";
  font-size: 13px;
  color: #6b7280;
}
.update-tournament-modal-form .update-tournament-banner-row input[type=file].form-control {
  height: auto;
  padding: 10px 12px;
  font-size: 13px;
}
.update-tournament-modal-form .actions {
  margin-top: 8px;
  display: flex;
  justify-content: stretch;
}
.update-tournament-modal-form .actions .btn {
  border: none;
  cursor: pointer;
  font-family: "Inter-600";
}
.update-tournament-modal-form .actions .btn-primary {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  border-radius: 8px;
  font-size: 16px;
  background: #201E52;
  color: #ffffff;
  border: 1px solid #201E52;
}
.update-tournament-modal-form .actions .btn-primary:hover:not(:disabled) {
  filter: brightness(0.96);
}
.update-tournament-modal-form .actions .btn-primary:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}
.request-page-wrap {
  font-family: "Inter", "Inter-500", sans-serif;
  background: #f5f5f5;
  min-height: 100vh;
  padding-bottom: 40px;
}

.request-wrapper {
  padding-top: 20px;
}

.request-heading {
  font-size: 24px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #000000;
  padding-block-end: 20px;
}

/* Claim tab - header with title + Select All */
.request-claim-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-end: 20px;
  padding-block-end: 4px;
}

.request-claim-title {
  font-size: 18px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #000000;
  margin: 0;
}

/* Main content card - white with rounded corners and shadow */
.request-content-card {
  background: #fff;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  border: 1px solid #e5e7eb;
  min-width: 0;
  overflow: hidden;
  font-family: "Inter", "Inter-500", sans-serif;
}

/* Tournaments page–style filter row (scoped so global home.scss nesting does not apply here) */
.request-content-card .tournaments-tab-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 0;
  margin-bottom: 16px;
  min-width: 0;
}
.request-content-card .tournaments-tab-wrapper .tournaments-tab-scroll {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  gap: 15px;
  align-items: center;
  min-width: 0;
}
.request-content-card .tournaments-tab-wrapper .tab {
  padding: 8px 16px;
  font-size: 16px;
  font-family: "Inter-500";
  cursor: pointer;
  background-color: #F6F6F6;
  border: none;
  border-radius: 20px;
  transition: 0.3s ease;
  color: #201e52;
}
.request-content-card .tournaments-tab-wrapper .tab.active {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #fff;
}
.request-content-card .tournaments-tab-wrapper .tab:hover {
  background-color: #ddd;
}
.request-content-card .tournaments-tab-wrapper .tab.active:hover {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #fff;
}
.request-content-card .tournaments-tab-wrapper .tab:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.45);
  outline-offset: 2px;
}
.request-content-card .tournaments-tab-wrapper .right-icons {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}
.request-content-card .tournaments-tab-wrapper .right-icons img {
  display: block;
}
.request-content-card .tournaments-tab-wrapper .right-icons .request-all-players-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: min(320px, 100%);
  height: 38px;
  padding: 0 12px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #fff;
}
.request-content-card .tournaments-tab-wrapper .right-icons .request-all-players-search img {
  width: 18px;
  height: 18px;
  opacity: 0.7;
  flex-shrink: 0;
}
.request-content-card .tournaments-tab-wrapper .right-icons .request-all-players-search input {
  width: 100%;
  border: 0;
  outline: none;
  background: transparent;
  font-size: 14px;
  font-family: "Inter-500";
  color: #111827;
}
.request-content-card .tournaments-tab-wrapper .right-icons .request-all-players-search input::placeholder {
  color: #9ca3af;
}
.request-content-card .tournaments-tab-wrapper .right-icons .request-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid #d9dde6;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.request-content-card .tournaments-tab-wrapper .right-icons .tournaments-view-toggle {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  border-radius: 10px;
  transition: background-color 0.18s ease, opacity 0.18s ease;
}
.request-content-card .tournaments-tab-wrapper .right-icons .tournaments-view-toggle img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  opacity: 0.65;
}
.request-content-card .tournaments-tab-wrapper .right-icons .tournaments-view-toggle.active {
  background: #e8ebf2;
}
.request-content-card .tournaments-tab-wrapper .right-icons .tournaments-view-toggle.active img {
  opacity: 1;
}
.request-content-card .tournaments-tab-wrapper .right-icons .tournaments-view-toggle:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.45);
  outline-offset: 1px;
}

.request-top-controls {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding-block-end: 20px;
  gap: 16px;
}

.request-select-all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-family: "Inter", "Inter-500", sans-serif;
  color: #6b7280;
  cursor: pointer;
}
.request-select-all input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #3b3b8f;
  border-radius: 2px;
}

/* All Players section title (list/card control is in tournaments-tab-wrapper row) */
.request-all-players-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  margin-block-end: 4px;
}

.request-all-players-title {
  font-size: 24px;
  font-weight: 600;
  font-family: "Inter-500";
  color: #000000;
  margin: 0;
}

.request-loading {
  padding: 40px 0;
  text-align: center;
  color: #7a7a7a;
  font-family: "Inter-500";
}

.request-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 40px 20px;
  text-align: center;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 12px;
  color: #991b1b;
}
.request-error p {
  font-size: 14px;
  font-family: "Inter-500";
}

.request-btn-retry {
  padding: 10px 24px;
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #fff;
  background: #201e52;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.request-btn-retry:hover {
  filter: brightness(0.95);
}

.request-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
  padding-block-end: 24px;
}

.request-cards-grid.request-cards-umpire,
.request-cards-grid.request-cards-scorer,
.request-cards-grid.request-cards-allplayers {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-width: 0;
}

.request-cards-grid.request-cards-player,
.request-cards-grid.request-cards-claim {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-width: 0;
}

@media (max-width: 1200px) {
  .request-cards-grid.request-cards-umpire,
  .request-cards-grid.request-cards-scorer,
  .request-cards-grid.request-cards-allplayers {
    grid-template-columns: repeat(2, 1fr);
  }
  .request-cards-grid.request-cards-player,
  .request-cards-grid.request-cards-claim {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .request-cards-grid.request-cards-umpire,
  .request-cards-grid.request-cards-scorer,
  .request-cards-grid.request-cards-allplayers,
  .request-cards-grid.request-cards-player,
  .request-cards-grid.request-cards-claim {
    grid-template-columns: 1fr;
  }
}
.request-cards-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-block-end: 24px;
}
.request-cards-list .request-card {
  flex-direction: row;
  max-width: 100%;
}
.request-cards-list .staff-request-card {
  max-width: 100%;
}

/* All Players list view - table layout */
.all-players-list-table-wrap {
  overflow-x: auto;
  padding-block-end: 24px;
}

.all-players-list-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter-500", "Inter", sans-serif;
}
.all-players-list-table thead th {
  padding: 12px 16px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #9CA3AF;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
}
.all-players-list-table tbody td {
  padding: 16px;
  font-size: 14px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
}
.all-players-list-table tbody tr:hover {
  background: #f9fafb;
}

.all-players-list-player-cell {
  display: flex;
  align-items: center;
  gap: 12px;
}

.all-players-list-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #e8e9f0;
}
.all-players-list-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.all-players-list-avatar-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 14px;
  font-weight: 600;
  color: #2D2A5E;
}

.all-players-list-name {
  font-size: 14px;
  font-weight: 600;
  color: #1a1a2e;
}

.all-players-list-team-id {
  font-size: 14px;
  color: #9CA3AF;
  font-style: italic;
}

.all-players-list-value {
  font-size: 13px;
  color: #4b5563;
  text-transform: uppercase;
}

.all-players-list-actions {
  display: flex;
  gap: 8px;
}

.all-players-list-btn-primary {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  font-family: "Inter-500";
  color: #fff;
  background: #2D2A5E;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.all-players-list-btn-primary:hover {
  filter: brightness(0.95);
}

.all-players-list-btn-outline {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  font-family: "Inter-500";
  color: #2D2A5E;
  background: #fff;
  border: 1px solid #2D2A5E;
  border-radius: 8px;
  cursor: pointer;
}
.all-players-list-btn-outline:hover {
  background: #f5f5ff;
}

/* Player Requests list view - table with checkbox, View Profile link */
.player-requests-list-wrap {
  overflow-x: auto;
  padding-block-end: 24px;
}

.player-requests-list-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter", "Inter-500", sans-serif;
}
.player-requests-list-table thead th {
  padding: 12px 16px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #9ca3af;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
}
.player-requests-list-table .player-requests-list-th-checkbox {
  width: 48px;
}
.player-requests-list-table tbody td {
  padding: 16px;
  font-size: 14px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
}
.player-requests-list-table tbody tr:hover {
  background: #f9fafb;
}
.player-requests-list-table .player-requests-list-row-selected {
  background: #f0f4ff;
}

.player-requests-list-td-checkbox {
  width: 48px;
  vertical-align: middle;
}
.player-requests-list-td-checkbox input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #3b3b8f;
}

.player-requests-list-player-cell {
  display: flex;
  align-items: center;
  gap: 12px;
}

.player-requests-list-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #e8e9f0;
}
.player-requests-list-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.player-requests-list-avatar-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 14px;
  font-weight: 600;
  color: #3b3b8f;
}

.player-requests-list-name {
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #1a1a2e;
}

.player-requests-list-team-id {
  font-size: 14px;
  color: #9ca3af;
  font-style: italic;
}

.player-requests-list-value {
  font-size: 13px;
  color: #4b5563;
  text-transform: uppercase;
}

.player-requests-list-view-profile {
  font-size: 14px;
  font-family: "Inter", "Inter-500", sans-serif;
  color: #2563eb;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  text-decoration: none;
}
.player-requests-list-view-profile:hover {
  text-decoration: underline;
}

/* Staff (Umpire & Scorer) list view - table layout */
.staff-requests-list-wrap {
  overflow-x: auto;
  padding-block-end: 24px;
}

.staff-requests-list-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter", "Inter-500", sans-serif;
}
.staff-requests-list-table thead th {
  padding: 12px 16px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #9ca3af;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
}
.staff-requests-list-table .staff-requests-list-th-checkbox {
  width: 48px;
}
.staff-requests-list-table tbody td {
  padding: 16px;
  font-size: 14px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
}
.staff-requests-list-table tbody tr:hover {
  background: #f9fafb;
}
.staff-requests-list-table .staff-requests-list-row-selected {
  background: #f0f4ff;
}

.staff-requests-list-td-checkbox {
  width: 48px;
  vertical-align: middle;
}
.staff-requests-list-td-checkbox input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #3b3b8f;
}

.staff-requests-list-staff-cell {
  display: flex;
  align-items: center;
  gap: 12px;
}

.staff-requests-list-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #e8e9f0;
}
.staff-requests-list-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.staff-requests-list-avatar-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 14px;
  font-weight: 600;
  color: #3b3b8f;
}

.staff-requests-list-name {
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #1a1a2e;
}

.staff-requests-list-team-id {
  font-size: 14px;
  color: #9ca3af;
  font-style: italic;
}

.staff-requests-list-price {
  font-size: 14px;
  font-family: "Inter", "Inter-500", sans-serif;
  color: #374151;
}

.staff-requests-list-view-profile {
  font-size: 14px;
  font-family: "Inter", "Inter-500", sans-serif;
  color: #2563eb;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  text-decoration: none;
}
.staff-requests-list-view-profile:hover {
  text-decoration: underline;
}

/* Player tab card - matches design: header row + 3-col details */
.request-card.player-tab-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 16px 20px;
  border-radius: 14px;
  font-family: "Inter", "Inter-500", sans-serif;
}
.request-card.player-tab-card .request-card-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  padding-block-end: 16px;
  border-bottom: 1px solid #e5e7eb;
}
.request-card.player-tab-card .request-card-header-left {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.request-card.player-tab-card .request-card-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.request-card.player-tab-card .request-card-checkbox-wrap {
  position: relative;
  top: 0;
  right: 0;
  flex-shrink: 0;
}
.request-card.player-tab-card .request-card-name {
  font-size: 1.1rem;
  font-weight: 700;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #333;
}
.request-card.player-tab-card .request-card-team-id {
  font-size: 14px;
  color: #333;
}
.request-card.player-tab-card .request-card-team-id .request-card-team-id-label {
  font-weight: 700;
}
.request-card.player-tab-card .request-card-team-id .request-card-team-id-value {
  font-style: italic;
  color: #888;
}
.request-card.player-tab-card .request-card-details {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 20px;
  padding-block-start: 16px;
}
.request-card.player-tab-card .request-card-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.request-card.player-tab-card .request-card-col.request-card-col-sep {
  padding-inline-start: 20px;
  border-inline-start: 1px solid #e5e7eb;
}
.request-card.player-tab-card .request-card-label {
  font-size: 13px;
  font-weight: 700;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #333;
}
.request-card.player-tab-card .request-card-value {
  font-size: 13px;
  font-style: italic;
  font-family: "Inter", "Inter-400", sans-serif;
  color: #888;
}

/* Fallback for non-player cards (if any reuse request-card) */
.request-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px 20px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: border-color 0.2s, box-shadow 0.2s;
}
.request-card.selected {
  border-color: #3b3b8f;
  box-shadow: 0 0 0 2px rgba(59, 59, 143, 0.2);
}

.request-card-checkbox-wrap input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #3b3b8f;
}

.request-card-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.request-card-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.request-card-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.request-card-name {
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #111827;
}

.request-card-team-id {
  font-size: 13px;
  color: #6b7280;
}

.request-card-details {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.request-card-col {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.request-card-label {
  font-size: 11px;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.request-card-value {
  font-size: 13px;
  font-family: "Inter-500";
  color: #374151;
}

/* Staff request card (Umpire + Scorer) - flex layout: avatar | name+price | checkbox */
/* Umpire & Scorer request cards - horizontal layout, avatar + name/price, checkbox right */
.staff-request-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 22px;
  padding: 16px 20px;
  font-family: "Inter", "Inter-500", sans-serif;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.staff-request-card.selected {
  border-color: #3b3b8f;
  box-shadow: 0 0 0 2px rgba(59, 59, 143, 0.2);
}

.staff-request-card-left {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 0;
}

.staff-request-card-avatar {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
}
.staff-request-card-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.staff-request-card-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.staff-request-card-name {
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #374151;
}

.staff-request-card-price {
  font-size: 14px;
  font-family: "Inter", "Inter-400", sans-serif;
  color: #9ca3af;
}

.staff-request-card-checkbox-wrap {
  flex-shrink: 0;
}
.staff-request-card-checkbox-wrap input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #3b3b8f;
  border-radius: 2px;
}

/* All Players card - white card, thin light gray border, ~16px radius, ~20px padding */
.all-players-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 16px;
  padding: 20px;
  font-family: Inter, "Inter-500", sans-serif;
  min-width: 0;
}

.all-players-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.all-players-card-avatar {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  overflow: hidden;
}
.all-players-card-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.all-players-card-title-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
  min-width: 0;
}

.all-players-card-name {
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #111827;
  line-height: 1.3;
}

.all-players-card-team-id {
  font-size: 14px;
  color: #4C4C4D;
  font-style: italic;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.all-players-card-team-id-label {
  color: #9CA3AF;
}

.all-players-card-team-id-value {
  color: #424242;
  font-style: italic;
}

.all-players-card-attributes {
  display: flex;
  align-items: center;
  gap: 0;
}

.all-players-card-col {
  min-width: 0;
  display: flex;
  flex-direction: row;
  gap: 4px;
}
.all-players-card-col.all-players-card-col-sep {
  border-inline-start: 1px solid #e5e7eb;
}
.all-players-card-col:first-child {
  padding-inline-start: 0;
}

.all-players-card-label {
  font-size: 12px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #374151;
  min-width: 0;
  overflow-wrap: break-word;
}

.all-players-card-value {
  font-size: 12px;
  font-family: "Inter-600";
  font-style: italic;
  color: rgba(76, 76, 77, 0.6);
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

.all-players-card-actions {
  display: flex;
  gap: 12px;
}

/* Add Role - solid navy (#201E52), white text */
.all-players-card-btn-primary {
  flex: 1;
  padding: 10px 10px;
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #fff;
  background: #201e52;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}
.all-players-card-btn-primary:hover {
  filter: brightness(0.95);
}

/* Merge Player - outlined navy */
.all-players-card-btn-outline {
  flex: 1;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #201e52;
  background: #fff;
  border: 1px solid #201e52;
  border-radius: 8px;
  cursor: pointer;
}
.all-players-card-btn-outline:hover {
  background: #f0eff8;
}

/* Claim Profile card - checkbox top-left + two profiles with vertical divider */
.claim-profile-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px 20px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: border-color 0.2s, box-shadow 0.2s;
  font-family: "Inter", "Inter-500", sans-serif;
}
.claim-profile-card.selected {
  border-color: #3b3b8f;
  box-shadow: 0 0 0 2px rgba(59, 59, 143, 0.2);
}

.claim-profile-card-checkbox {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 1;
}
.claim-profile-card-checkbox input {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: #3b3b8f;
  border-radius: 2px;
}

.claim-profile-card-profiles {
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  gap: 0;
  padding-block-start: 24px;
}

.claim-profile-card-profile {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  padding-inline: 12px;
}
.claim-profile-card-profile:first-child {
  border-inline-end: 1px solid #e5e7eb;
}

.claim-profile-card-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}
.claim-profile-card-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.claim-profile-card-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.claim-profile-card-name {
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  color: #000000;
  text-align: center;
}

.claim-profile-card-link {
  font-size: 13px;
  font-family: "Inter", "Inter-500", sans-serif;
  color: #2563eb;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.claim-profile-card-link:hover {
  text-decoration: underline;
}

.request-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  padding-block-start: 16px;
  border-top: 1px solid #e5e7eb;
}

.request-btn-accept,
.request-btn-reject {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter", "Inter-600", sans-serif;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}
.request-btn-accept:disabled,
.request-btn-reject:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.request-btn-accept {
  background: #1b8a1b;
  color: #fff;
  font-family: "Inter", "Inter-600", sans-serif;
}
.request-btn-accept:hover:not(:disabled) {
  background: #157015;
}

.request-btn-reject {
  background: #d32f2f;
  color: #fff;
  font-family: "Inter", "Inter-600", sans-serif;
}
.request-btn-reject:hover:not(:disabled) {
  background: #b82828;
}.create-ground-modal-overlay {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  animation: create-ground-overlay-fade 0.16s ease forwards;
}

.create-ground-modal {
  display: flex;
  flex-direction: column;
  width: 92vw;
  max-width: 1075px;
  max-height: 75vh;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  animation: create-ground-modal-zoom 0.18s ease forwards;
  font-family: "Inter-400", "Inter", sans-serif;
}

.create-ground-modal-header {
  display: flex;
  border-radius: 8px;
  flex-direction: column;
  justify-items: start;
  align-items: center;
  gap: 8px;
  padding: 57px 37px 4px;
  border-bottom: 1px solid #eee;
  flex-shrink: 0;
  background: #ffffff;
}

.create-ground-modal-header-row {
  display: flex;
  align-items: center;
  background: #ffffff;
  justify-content: space-between;
  gap: 12px;
}

.create-ground-modal-title {
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 24px;
  font-weight: 500;
  text-align: center;
  color: #000000;
  margin: 0;
}

.create-ground-modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid #e9e9e9;
  border-radius: 8px;
  background: #fff;
  color: #6b7280;
  font-size: 16px;
  cursor: pointer;
  flex-shrink: 0;
}
.create-ground-modal-close:hover {
  background: #f5f5f5;
}

.create-ground-modal-body {
  flex: 1;
  overflow: auto;
  padding: 24px 37px 57px;
}

@keyframes create-ground-overlay-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes create-ground-modal-zoom {
  from {
    transform: scale(0.96);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}.documents-wrapper .documents-shell {
  background: #ffffff;
  border: 1px solid #ececf3;
  border-radius: 14px;
  padding: 18px 18px 28px;
  min-height: 72vh;
}
.documents-wrapper .documents-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
}
.documents-wrapper .documents-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.documents-wrapper .documents-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.documents-wrapper .documents-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.documents-wrapper .documents-btn--primary {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
}
.documents-wrapper .documents-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-start;
}
.documents-wrapper .documents-loading {
  min-height: 52vh;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-500";
  font-size: 16px;
  color: #4b5563;
}
.documents-wrapper .document-card {
  appearance: none;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: center;
  width: 94px;
  min-height: 106px;
  border: 1px solid #e2e2e8;
  background: #ffffff;
  padding: 12px 8px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  border-radius: 8px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.documents-wrapper .document-card:hover {
  border-color: #bcbdd4;
  transform: translateY(-1px);
}
.documents-wrapper .document-card:focus-visible {
  outline: 2px solid #2c2970;
  outline-offset: 2px;
}
.documents-wrapper .document-card.is-selected {
  border-color: #2c2970;
  box-shadow: 0 0 0 2px rgba(44, 41, 112, 0.12);
}
.documents-wrapper .document-card-icon {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #dc2626;
}
.documents-wrapper .document-card-icon span {
  font-family: "Inter-600";
  font-size: 10px;
  line-height: 1;
  color: #dc2626;
}
.documents-wrapper .document-card-name {
  font-family: "Inter-400";
  font-size: 12px;
  line-height: 1.3;
  text-align: center;
  color: #111827;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.documents-wrapper .no-data-found {
  min-height: 52vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}
.documents-wrapper .documents-empty-image {
  width: 374px;
  max-width: 36vw;
  height: auto;
  margin-bottom: 8px;
  opacity: 0.9;
}
.documents-wrapper .documents-empty-title {
  margin: 0;
  font-family: "Inter-600";
  font-size: 32px;
  line-height: 1.15;
  color: #201e52;
}
.documents-wrapper .documents-empty-text {
  margin: 0;
  max-width: 460px;
  font-family: "Inter-500";
  font-size: 20px;
  line-height: 1.45;
  color: rgba(76, 76, 77, 0.6);
}
.documents-wrapper .documents-empty-upload-btn {
  margin-top: 12px;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 8px;
  font-size: 13px;
}

@media (max-width: 768px) {
  .documents-wrapper .documents-shell {
    padding: 16px 14px 22px;
    min-height: auto;
  }
  .documents-wrapper .documents-header {
    flex-direction: column;
    align-items: stretch;
  }
  .documents-wrapper .documents-actions {
    width: 100%;
    flex-wrap: wrap;
  }
  .documents-wrapper .documents-btn {
    flex: 1 1 160px;
  }
  .documents-wrapper .documents-empty-title {
    font-size: 28px;
  }
  .documents-wrapper .documents-empty-text {
    font-size: 14px;
    max-width: 330px;
  }
}.checkout-modal {
  max-width: 566px !important;
  width: min(566px, 100vw - 24px);
}
.checkout-modal .checkout-modal-content {
  margin: 0 auto;
  background: #ffffff;
  border-radius: 12px;
  padding: 0;
  color: #0f172a;
  border: none;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
}
.checkout-modal .checkout-header {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 48px 22px 20px;
}
.checkout-modal .checkout-header .checkout-title {
  font-family: "Inter-700";
  font-size: 24px;
  color: #000000;
  margin: 0;
  line-height: 100%;
  text-align: center;
  max-width: 430px;
}
.checkout-modal .checkout-header .checkout-close {
  position: absolute;
  top: 12px;
  right: 14px;
  background: transparent;
  border: none;
  color: #475569;
  font-size: 20px;
  cursor: pointer;
  padding: 0;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.3s ease;
}
.checkout-modal .checkout-header .checkout-close:hover {
  background: rgba(15, 23, 42, 0.08);
}
.checkout-modal .checkout-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  gap: 40px;
}
.checkout-modal .checkout-body .checkout-plan-summary {
  text-align: center;
}
.checkout-modal .checkout-body .checkout-plan-summary p {
  font-family: "Inter-600";
  font-size: 16px;
  color: #000000;
  margin: 0;
  line-height: 1.4;
}
.checkout-modal .checkout-body .checkout-note {
  text-align: center;
}
.checkout-modal .checkout-body .checkout-note p {
  font-family: "Inter-400";
  font-size: 16px;
  color: #000000;
  margin: 0;
  line-height: 100%;
}
.checkout-modal .checkout-body .checkout-consent {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  cursor: pointer;
  user-select: none;
}
.checkout-modal .checkout-body .checkout-consent input[type=checkbox] {
  width: 20px;
  height: 20px;
  accent-color: #201E52;
  cursor: pointer;
}
.checkout-modal .checkout-body .checkout-consent span {
  font-family: "Inter-400";
  font-size: 16px;
  line-height: 1.35;
  color: #000000;
}
.checkout-modal .checkout-footer {
  padding: 0 16px 14px;
}
.checkout-modal .checkout-footer button {
  width: 100%;
  padding: 16px 18px;
  border-radius: 12px;
  font-family: "Inter-600";
  font-size: 20px;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  font-weight: 600;
}
.checkout-modal .checkout-footer button:disabled {
  cursor: not-allowed;
}
.checkout-modal .checkout-footer .checkout-proceed-button {
  background: rgba(76, 76, 77, 0.2509803922);
  color: #FFFFFF;
  border-radius: 12px;
}
.checkout-modal .checkout-footer .checkout-proceed-button.is-enabled {
  background: #201E52;
  border-color: #201E52;
}
.checkout-modal .checkout-footer .checkout-proceed-button:hover:not(:disabled) {
  opacity: 0.95;
}.pricing-plans-page {
  width: 100%;
  box-sizing: border-box;
  background-image: url("data:image/svg+xml,%3csvg%20width='1203'%20height='995'%20viewBox='0%200%201203%20995'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='1203'%20height='995'%20fill='%23161934'/%3e%3cmask%20id='mask0_10273_279'%20style='mask-type:alpha'%20maskUnits='userSpaceOnUse'%20x='0'%20y='0'%20width='1203'%20height='995'%3e%3crect%20width='1203'%20height='995'%20fill='%23161934'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_10273_279)'%3e%3cg%20filter='url(%23filter0_f_10273_279)'%3e%3cellipse%20cx='589.316'%20cy='577.5'%20rx='370.316'%20ry='378.5'%20fill='%23612CA1'/%3e%3c/g%3e%3cg%20filter='url(%23filter1_f_10273_279)'%3e%3cellipse%20cx='189.5'%20cy='917.5'%20rx='214.5'%20ry='219.5'%20fill='%23747CC6'%20fill-opacity='0.5'/%3e%3c/g%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_f_10273_279'%20x='-326.586'%20y='-346.586'%20width='1831.8'%20height='1848.17'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='272.793'%20result='effect1_foregroundBlur_10273_279'/%3e%3c/filter%3e%3cfilter%20id='filter1_f_10273_279'%20x='-425'%20y='298'%20width='1229'%20height='1239'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='200'%20result='effect1_foregroundBlur_10273_279'/%3e%3c/filter%3e%3c/defs%3e%3c/svg%3e");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  position: relative;
  overflow-x: hidden;
}
.pricing-plans-page .pricing-plans-container {
  width: 100%;
  box-sizing: border-box;
  max-width: 1512px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  padding: 81px 62px 81px;
}
@media (max-width: 992px) {
  .pricing-plans-page .pricing-plans-container {
    padding: 40px 40px 0 40px;
  }
}
@media (max-width: 768px) {
  .pricing-plans-page .pricing-plans-container {
    padding: 40px 20px 0 20px;
  }
}
.pricing-plans-page .pricing-header {
  text-align: center;
  margin-bottom: 52px;
}
.pricing-plans-page .pricing-header .pricing-title {
  font-size: 40px;
  line-height: 120%;
  font-family: "Inter-600";
  color: #ffffff;
  margin: 0 0 14px 0;
  letter-spacing: 1px;
}
@media (max-width: 768px) {
  .pricing-plans-page .pricing-header .pricing-title {
    font-size: 36px;
  }
}
.pricing-plans-page .pricing-header .pricing-subtitle {
  margin: 0 auto;
  text-align: center;
  max-width: 803px;
  font-family: "Inter-500";
  font-size: 20px;
  color: rgba(255, 255, 255, 0.97);
  line-height: 130%;
  letter-spacing: 0px;
}
@media (max-width: 768px) {
  .pricing-plans-page .pricing-header .pricing-subtitle {
    font-size: 16px;
  }
}
.pricing-plans-page .plan-toggle-wrapper {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
}
.pricing-plans-page .plan-toggle-wrapper .plan-toggle {
  display: flex;
  background: #ffffff;
  border-radius: 92px;
  padding: 2px;
  gap: 10px;
  backdrop-filter: blur(2.9px);
}
.pricing-plans-page .plan-toggle-wrapper .plan-toggle .toggle-option {
  padding: 13px 0px;
  width: 120px;
  border: none;
  background: transparent;
  color: #000000;
  font-family: "Inter-500";
  line-height: 100%;
  font-size: 16px;
  cursor: pointer;
  border-radius: 73px;
  transition: all 0.3s ease;
  position: relative;
  z-index: 1;
}
.pricing-plans-page .plan-toggle-wrapper .plan-toggle .toggle-option.active {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  padding: 13px 0px;
  width: 120px;
  font-family: "Inter-600";
}
@media (max-width: 768px) {
  .pricing-plans-page .plan-toggle-wrapper .plan-toggle .toggle-option {
    padding: 10px 30px;
    font-size: 14px;
  }
}
.pricing-plans-page .pricing-cards-wrapper {
  max-width: 1512px;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
  align-items: stretch;
  gap: 20px;
  margin-bottom: 60px;
}
@media (max-width: 768px) {
  .pricing-plans-page .pricing-cards-wrapper {
    gap: 24px;
  }
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card {
  border: 1px solid rgba(112, 41, 245, 0.5);
  max-width: 310px;
  min-width: 260px;
  background: linear-gradient(45deg, #201E52 40%, #20005B 100%);
  border-radius: 20px;
  padding: 20px;
  position: relative;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
  overflow: hidden;
}
@media (max-width: 1084px) {
  .pricing-plans-page .pricing-cards-wrapper .pricing-card {
    flex-basis: 300px;
    max-width: 360px;
  }
}
@media (max-width: 768px) {
  .pricing-plans-page .pricing-cards-wrapper .pricing-card {
    flex-basis: 100%;
    max-width: 360px;
  }
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card.popular {
  background: linear-gradient(45deg, #201E52 40%, #742AFE 100%);
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card.popular::before {
  opacity: 1;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .popular-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  background: #09DEFF;
  color: #000000;
  font-family: "Inter-700";
  font-size: 14px;
  padding: 7.5px 18px;
  border-radius: 44px;
  text-transform: uppercase;
  letter-spacing: 0px;
  z-index: 2;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-name {
  font-family: "Inter-700";
  font-size: 24px;
  color: #ffffff;
  line-height: 100%;
  margin: 0 0 13px 0;
  letter-spacing: 0.5px;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-price {
  font-family: "Inter-500";
  font-size: 38px;
  color: #ffffff;
  line-height: 1.2;
  margin: 0 0 8px 0;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-duration {
  font-family: "Inter-500";
  line-height: 120%;
  font-size: 16px;
  color: #DBDBDB;
  margin-bottom: 12px;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-divider {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #C215F1 0%, #6EA0FF 100%);
  margin-bottom: 30px;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-features {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 0 0 32px 0;
  flex-grow: 1;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-features .feature-item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  align-items: start;
  gap: 16px;
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
  line-height: 20px;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-features .feature-item:last-child {
  margin-bottom: 0;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-features .feature-item .check-icon {
  width: 13px;
  height: 13px;
  min-width: 13px;
  margin-top: 2px;
  filter: brightness(0) saturate(100%) invert(65%) sepia(95%) saturate(7499%) hue-rotate(170deg) brightness(100%) contrast(101%);
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .plan-features .feature-item span {
  flex: 1;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .subscribe-button {
  width: 100%;
  padding: 16px 32px;
  background: #ffffff;
  border: none;
  border-radius: 44px;
  color: #201E52;
  font-family: "Inter-600";
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: auto;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .subscribe-button:hover {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  transform: translateY(-2px);
  box-shadow: 8px 8px 8px 8px #201E52;
  color: #ffffff;
}
.pricing-plans-page .pricing-cards-wrapper .pricing-card .pricing-card-content .subscribe-button:active {
  transform: translateY(0);
}
.pricing-plans-page .pricing-disclaimer {
  text-align: center;
  padding: 0px 20px;
  max-width: 900px;
  margin: 0 auto;
}
.pricing-plans-page .pricing-disclaimer p {
  font-family: "Inter-400";
  font-size: 16px;
  color: #ffffff;
  line-height: 1.6;
  margin: 0;
}
.pricing-plans-page .pricing-disclaimer p .terms-link {
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 16px;
  text-decoration: underline;
  transition: color 0.3s ease-in;
}
.pricing-plans-page .pricing-disclaimer p .terms-link:hover {
  opacity: 0.85;
}
@media (max-width: 768px) {
  .pricing-plans-page .pricing-disclaimer p {
    font-size: 12px;
  }
}

.payment-status-modal {
  width: min(566px, 100vw - 24px);
}
.payment-status-modal .payment-status-content {
  background: #ffffff;
  border-radius: 12px;
  padding: 55px 22px 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  min-height: 371px;
  box-sizing: border-box;
}
.payment-status-modal .payment-status-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-family: "Inter-700";
  margin-bottom: 20px;
  color: #ffffff;
}
.payment-status-modal .payment-status-icon.is-success {
  background: #1AA915;
}
.payment-status-modal .payment-status-icon.is-failed, .payment-status-modal .payment-status-icon.is-cancelled {
  background: #D8252D;
}
.payment-status-modal .payment-status-icon.is-pending {
  background: #f59e0b;
}
.payment-status-modal .payment-status-icon.is-verifying {
  background: #2563eb;
  animation: payment-pulse 1.2s ease-in-out infinite;
}
.payment-status-modal .payment-status-icon.has-image {
  width: auto;
  height: auto;
  border-radius: 0;
  background: transparent;
}
.payment-status-modal .payment-status-icon-image {
  width: 93px;
  height: 90px;
  object-fit: contain;
  display: block;
}
.payment-status-modal .payment-success-content {
  background: #ffffff;
  border-radius: 12px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  overflow: hidden;
  padding: 42px 22px 22px;
}
.payment-status-modal .payment-success-top {
  background: transparent;
  text-align: center;
}
.payment-status-modal .payment-success-icon-image {
  width: 115px;
  height: 115px;
  object-fit: contain;
  margin: 0 auto 10px;
  display: block;
}
.payment-status-modal .payment-success-title {
  margin: 0 0 3px;
  font-family: "Inter-700";
  font-size: 24px;
  color: #000000;
  line-height: 100%;
}
.payment-status-modal .payment-success-subtitle {
  margin: 0;
  font-family: "Inter-400";
  font-size: 16px;
  line-height: 100%;
  color: #000000;
}
.payment-status-modal .payment-success-membership {
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 120px;
  border-bottom: 0.6px dashed #d3d3d3;
  padding-bottom: 14px;
}
.payment-status-modal .payment-success-membership h4 {
  margin: 0 0 2px;
  font-family: "Inter-700";
  font-size: 18px;
  color: #18181B;
}
.payment-status-modal .payment-success-membership p {
  margin: 0;
  font-family: "Inter-400";
  font-size: 12px;
  color: #18181B;
}
.payment-status-modal .download-invoice-link {
  border: none;
  background: transparent;
  color: #018168;
  font-family: "Inter-700";
  font-size: 14px;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  margin-top: 2px;
}
.payment-status-modal .payment-success-details {
  max-width: 533px;
  width: 95%;
  background: #F6F6F6;
  border-radius: 12px;
  margin: 14px 0px 18px;
  display: flex;
  flex-direction: column;
  padding: 24px 20px 28px;
  gap: 10px;
}
.payment-status-modal .details-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}
.payment-status-modal .details-row span {
  font-family: "Inter-400";
  font-size: 16px;
  color: #000000;
}
.payment-status-modal .details-row strong {
  font-family: "Inter-500";
  font-size: 16px;
  color: #18181B;
  text-align: right;
}
.payment-status-modal .details-row .is-muted {
  font-family: "Inter-400";
  font-style: italic;
  font-size: 16px;
  color: #71717A;
  line-height: 20px;
}
.payment-status-modal .payment-success-note {
  margin: 4px 16px 20px;
  border-radius: 12px;
  background: #F4F4FF;
  padding: 16px 16px;
  text-align: center;
  font-family: "Inter-400";
  color: #71717A;
  font-size: 16px;
  line-height: 100%;
}
.payment-status-modal .payment-success-note em {
  font-family: "Inter-600";
  font-size: 16px;
  font-style: italic;
  color: #71717A;
}
.payment-status-modal .payment-progress-spinner {
  width: 24px;
  height: 24px;
  border: 3px solid rgba(255, 255, 255, 0.45);
  border-top-color: #ffffff;
  border-radius: 50%;
  display: block;
  animation: payment-spin 0.9s linear infinite;
}
.payment-status-modal .payment-status-title {
  margin: 0 0 3px;
  color: #000000;
  font-family: "Inter-700";
  font-size: 24px;
  line-height: 100%;
}
.payment-status-modal .payment-status-description {
  margin: 0 0 20px;
  color: #000000;
  font-family: "Inter-400";
  font-size: 16px;
  line-height: 1.5;
}
.payment-status-modal .payment-status-action {
  width: 100%;
  margin-top: auto;
  border: none;
  border-radius: 12px;
  padding: 18px 0px;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 16px;
  line-height: 20px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.payment-status-modal .payment-status-action:hover:enabled {
  opacity: 0.95;
  transform: translateY(-1px);
}
.payment-status-modal .payment-status-action:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}
.payment-status-modal.is-failed-modal .payment-status-content {
  padding: 36px 18px 14px;
  justify-content: flex-start;
}
.payment-status-modal.is-failed-modal .payment-status-icon {
  width: 58px;
  height: 58px;
  margin-bottom: 20px;
  background: #D8252D;
  font-size: 34px;
  line-height: 1;
}
.payment-status-modal.is-failed-modal .payment-status-title {
  margin: 0 0 8px;
  color: #18181B;
  font-family: "Inter-700";
  font-size: 36px;
  line-height: 1;
  letter-spacing: 0;
}
.payment-status-modal.is-failed-modal .payment-status-description {
  margin: 0 0 24px;
  color: #18181B;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 1.2;
  max-width: 500px;
}
.payment-status-modal.is-failed-modal .payment-status-action {
  margin-top: auto;
  min-height: 56px;
  border-radius: 12px;
  padding: 18px 0px;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 26px;
  line-height: 1;
  letter-spacing: 0;
}
.payment-status-modal.is-failed-modal .payment-status-action:hover:enabled {
  transform: none;
  opacity: 0.98;
}
.payment-status-modal.is-pending-modal .payment-status-content {
  padding: 32px 18px 14px;
  justify-content: flex-start;
}
.payment-status-modal.is-pending-modal .payment-status-icon {
  width: 64px;
  height: 64px;
  margin-bottom: 18px;
  background: #f59e0b;
}
.payment-status-modal.is-pending-modal .payment-status-title {
  margin: 0 0 8px;
  color: #18181B;
  font-family: "Inter-700";
  font-size: 40px;
  line-height: 1;
  letter-spacing: 0;
}
.payment-status-modal.is-pending-modal .payment-status-description {
  margin: 0 0 16px;
  color: #000000;
  font-family: "Inter-500";
  font-size: 32px;
  line-height: 1.12;
  max-width: 530px;
}
.payment-status-modal.is-pending-modal .payment-status-action {
  margin-top: auto;
  min-height: 56px;
  border-radius: 10px;
  padding: 14px 18px;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0;
  box-shadow: none;
}
.payment-status-modal.is-pending-modal .payment-status-action:hover:enabled {
  transform: none;
  opacity: 0.98;
}
.payment-status-modal.is-success-modal .payment-status-action {
  width: calc(100% - 32px);
  border-radius: 12px;
  padding: 16px 18px;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 20px;
  line-height: 100%;
  letter-spacing: 0;
  box-shadow: none;
}
.payment-status-modal.is-success-modal .payment-status-action:hover:enabled {
  transform: none;
  opacity: 0.98;
}

@keyframes payment-pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.08);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes payment-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}.homepage-wrapper {
  background-color: #f2f2f3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  gap: 60px;
}
@media (max-width: 768px) {
  .homepage-wrapper {
    gap: 20px;
  }
}

.homepage-no-gap-group {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0;
}.cc-primary-button {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: white;
  padding: 9px 20px;
  border: none;
  border-radius: 24px;
  font-size: 14px;
  font-family: "Inter-500";
  font-weight: 400;
  line-height: 100%;
  color: #ffffff;
  text-align: center;
  cursor: pointer;
  transition: background 1s ease;
}
.cc-primary-button:hover {
  background: linear-gradient(90deg, #2C2970 0%, #201E52 100%);
}.heroHome-hero {
  margin-top: 80px;
  position: relative;
  width: 100%;
  height: 580px;
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(180deg, #d6d6d8 0%, #111533 100%);
}

.heroHome-hero-background {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  z-index: 0;
  object-fit: cover;
}
@supports not (object-fit: cover) {
  .heroHome-hero-background {
    width: 100%;
    height: 100%;
  }
}

.heroHome-hero-videos {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.heroHome-hero-videos-track {
  display: flex;
  min-height: 100%;
  transition: transform 0.5s ease;
}

.heroHome-hero-video {
  flex: 0 0 100%;
  min-width: 100%;
  min-height: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.heroHome-hero-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #090C26 100%);
  z-index: 1;
}

.heroHome-hero-content {
  position: relative;
  bottom: -152px;
  z-index: 2;
  width: 100%;
  max-width: 1512px;
  padding: 45px 62px 0;
}

.heroHome-mobile-topbar {
  display: none;
}

.heroHome-hero-text {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  color: white;
}

.heroHome-hero-title {
  font-size: 46px;
  font-weight: 700;
  line-height: 120%;
  font-family: "Inter-700";
  max-width: 600px;
}

.heroHome-hero-description-container {
  margin-bottom: 35px;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.heroHome-hero-description {
  font-size: 14px;
  font-family: "Inter-400";
  font-weight: 400;
  line-height: 150%;
  color: #ffffff;
  text-align: justify;
}

.heroHome-hero-buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.heroHome-hero-buttons .cc-primary-button {
  position: relative;
  background-color: #171A35;
  color: white;
  padding: 12px 34px;
  border: 0.89px solid white;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 400;
  font-family: "Inter-400";
  line-height: 100%;
  cursor: pointer;
  transition: border-color 0.3s ease;
  isolation: isolate;
  max-width: 146px;
}
.heroHome-hero-buttons .cc-primary-button::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(90deg, #4d4e53 0%, #7c3aed 100%);
  border-radius: 24px;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.heroHome-hero-buttons .cc-primary-button::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #171A35;
  border-radius: 24px;
  z-index: -1;
}
.heroHome-hero-buttons .cc-primary-button:hover {
  box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
  border-color: transparent;
}
.heroHome-hero-buttons .cc-primary-button:hover::before {
  opacity: 1;
}

.heroHome-hero-buttons .btn-secondary {
  position: relative;
  background-color: #171A35;
  color: white;
  padding: 15px 46px;
  border: 1px solid white;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 400;
  font-family: "Inter-500";
  line-height: 100%;
  cursor: pointer;
  transition: border-color 0.3s ease;
  isolation: isolate;
}
.heroHome-hero-buttons .btn-secondary::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(90deg, #4d4e53 0%, #742AFE 100%);
  border-radius: 24px;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.heroHome-hero-buttons .btn-secondary::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #171A35;
  border-radius: 24px;
  z-index: -1;
}
.heroHome-hero-buttons .btn-secondary:hover {
  background: shadow(inset 0 0 10px 0 rgba(0, 0, 0, 0.5));
  border-color: transparent;
}
.heroHome-hero-buttons .btn-secondary:hover::before {
  opacity: 1;
}

@media (max-width: 768px) {
  .heroHome-hero {
    height: 660px;
    min-height: 660px;
    align-items: stretch;
    background: linear-gradient(180deg, #d7d7d9 0%, #0d1130 100%);
  }
  .heroHome-hero-background {
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
  }
  .heroHome-hero-video {
    width: 100%;
    height: 100%;
    min-width: 100%;
    min-height: 100%;
  }
  .heroHome-hero-overlay {
    background: linear-gradient(180deg, transparent 0%, rgba(18, 17, 74, 0.6) 50%, rgba(13, 18, 52, 0.9) 100%);
  }
  .heroHome-hero-content {
    min-height: 660px;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end; /* Hero text at bottom; topbar removed (TopHeader handles nav) */
  }
  /* Hero mobile topbar hidden - global TopHeader already provides this on mobile */
  .heroHome-mobile-topbar {
    display: none;
  }
  .heroHome-mobile-icon-btn,
  .heroHome-mobile-avatar-btn {
    background: transparent;
    border: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  .heroHome-hamburger {
    display: inline-flex;
    flex-direction: column;
    gap: 3px;
  }
  .heroHome-hamburger span {
    display: block;
    width: 13px;
    height: 1.5px;
    background: #ffffff;
    border-radius: 2px;
  }
  .heroHome-mobile-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .heroHome-mobile-logo {
    width: 20px;
    height: 20px;
    object-fit: contain;
  }
  .heroHome-mobile-brand-text {
    font-size: 24px;
    font-family: "Inter-700";
    line-height: 1;
    color: #ffffff;
  }
  .heroHome-mobile-actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }
  .heroHome-mobile-notification {
    width: 18px;
    height: 18px;
    object-fit: contain;
  }
  .heroHome-mobile-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
  }
  .heroHome-hero-text {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 10px;
    padding: 24px 18px 130px;
  }
  .heroHome-hero-title {
    max-width: 100%;
    margin: 0;
    font-size: 32px;
    line-height: 118%;
  }
  .heroHome-hero-description-container {
    max-width: 100%;
    gap: 14px;
  }
  .heroHome-hero-description {
    font-size: 13px;
    line-height: 145%;
    text-align: left;
    margin: 0;
  }
  .heroHome-hero-buttons {
    width: 100%;
    flex-direction: column;
    gap: 12px;
  }
  .heroHome-hero-buttons .cc-primary-button,
  .heroHome-hero-buttons .btn-secondary {
    width: 100%;
    min-height: 52px;
  }
  .heroHome-hero-buttons .btn-secondary {
    background-color: rgba(23, 26, 53, 0.7);
  }
}.logo-marquee {
  width: 100%;
  overflow: hidden;
  background-color: #ffffff;
  padding: 0;
  position: relative;
}
.logo-marquee::before, .logo-marquee::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 80px;
  z-index: 2;
  pointer-events: none;
}
.logo-marquee::before {
  left: 0;
  background: linear-gradient(to right, #ffffff 0%, transparent 100%);
}
.logo-marquee::after {
  right: 0;
  background: linear-gradient(to left, #ffffff 0%, transparent 100%);
}

.logo-marquee-track {
  display: flex;
  overflow: hidden;
  width: max-content;
  will-change: transform;
  animation: logoMarqueeScroll 18s linear infinite;
}

.logo-marquee-inner {
  display: flex;
  flex-shrink: 0;
  width: max-content;
}

.logo-marquee-item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 20px;
}

.logo-marquee-img {
  height: 100px;
  width: auto;
  max-width: 420px;
  object-fit: contain;
  opacity: 1;
  transition: opacity 0.2s ease;
}
.logo-marquee-item:hover .logo-marquee-img {
  opacity: 0.9;
}

.logo-marquee-fallback {
  font-family: "Inter-600";
  font-size: 14px;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

@keyframes logoMarqueeScroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
@media (max-width: 768px) {
  .logo-marquee {
    padding: 80px 0;
  }
  .logo-marquee-item {
    padding: 0 48px;
    height: 192px;
  }
  .logo-marquee-img {
    height: 120px;
    max-width: 300px;
  }
}.why-choose-us {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  padding: 80px 0;
  width: 100%;
}

.why-choose-us-container {
  max-width: 1512px;
  margin: 0 auto;
  padding: 0 62px;
}

.why-choose-us-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 60px;
  row-gap: 16px;
}

.why-choose-us-content-left {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.why-choose-us-copy {
  grid-area: copy;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
}

.why-choose-us-tag {
  grid-area: tag;
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 4px;
  background-color: white;
  border: 0.89px solid #EAECF0;
  padding: 10px;
  border-radius: 80px;
  width: fit-content;
  font-size: 12px;
  font-weight: 500;
  font-family: "Inter-500";
  color: #031B1D;
  letter-spacing: 0.5px;
}
.why-choose-us-tag .tag-icon-image {
  width: 14px;
  height: 14px;
  object-fit: contain;
  display: block;
}

.why-choose-us-title {
  font-size: 40px;
  font-weight: 600;
  line-height: 120%;
  font-family: "Inter-400";
  color: #ffffff;
  margin: 0;
}
.why-choose-us-title .title-second {
  font-size: 40px;
  font-weight: 700;
  line-height: 120%;
  font-family: "Inter-700";
  color: #ffffff;
  margin: 0;
}

.why-choose-us-tagline {
  font-size: 16px;
  font-style: italic;
  line-height: 159%;
  font-weight: 700;
  font-family: "Inter-500";
  color: #ffffff;
  margin: 0;
}

.why-choose-us-description {
  font-size: 16px;
  line-height: 160%;
  font-family: "Inter-400";
  font-weight: 400;
  color: #ffffff;
  margin: 0;
}

.why-choose-us-button {
  background-color: #742AFE;
  color: #ffffff;
  padding: 15px 50px;
  border: none;
  border-radius: 24px;
  font-size: 14px;
  font-family: "Inter-500";
  font-weight: 400;
  line-height: 100%;
  text-align: center;
  cursor: pointer;
  transition: background 1s ease;
  margin-top: 10px;
}
.why-choose-us-button:hover {
  background: linear-gradient(90deg, #000 0%, #7c3aed 100%);
}

.why-choose-us-visuals {
  grid-area: visuals;
  max-width: 480px;
  width: 100%;
}

.why-choose-us-right-image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

.visual-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 16px;
  height: 500px;
}

.visual-item {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
}
.visual-item.visual-item-large {
  grid-column: 2;
  grid-row: 1/3;
}
.visual-item.visual-item-small {
  grid-column: 1;
  grid-row: 1;
}
.visual-item.visual-item-medium {
  grid-column: 1;
  grid-row: 2;
}

.visual-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.feature-tag {
  position: absolute;
  background-color: rgba(124, 58, 237, 0.9);
  color: #ffffff;
  padding: 12px 20px;
  border-radius: 24px;
  font-size: 14px;
  font-family: "Inter-500";
  font-weight: 500;
  z-index: 2;
}
.feature-tag.feature-tag-top {
  top: 20px;
  right: 20px;
}
.feature-tag.feature-tag-bottom {
  bottom: 20px;
  right: 20px;
}

@media (max-width: 1024px) {
  .why-choose-us-content {
    grid-template-columns: 1fr;
    grid-template-areas: "tag" "visuals" "copy";
    justify-items: center;
    gap: 40px;
  }
  .why-choose-us-copy {
    max-width: 100%;
    align-items: center;
    text-align: center;
  }
  .why-choose-us-visuals {
    max-width: 100%;
  }
  .why-choose-us-tag {
    justify-self: center;
  }
  .visual-grid {
    height: 400px;
  }
}
@media (max-width: 768px) {
  .why-choose-us {
    padding: 60px 0;
    background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  }
  .why-choose-us-container {
    padding: 0 12px;
  }
  .why-choose-us-content {
    flex-direction: column;
    gap: 18px;
  }
  .why-choose-us-title {
    font-size: 48px;
    line-height: 120%;
    text-align: center;
  }
  .why-choose-us-tagline {
    font-size: 12px;
    line-height: 160%;
    font-weight: 700;
    text-align: center;
  }
  .why-choose-us-description {
    font-size: 12px;
    line-height: 160%;
    text-align: center;
    font-weight: 600;
  }
  .why-choose-us-copy {
    gap: 10px;
  }
  .why-choose-us-button {
    width: 172px;
    min-height: 46px;
    border-radius: 28px;
    margin-top: 12px;
  }
  .why-choose-us-visuals {
    max-width: 370px;
  }
  .visual-grid {
    grid-template-columns: 0.94fr 1.06fr;
    gap: 10px;
    height: 285px;
  }
  .visual-item {
    border-radius: 14px;
  }
  .feature-tag {
    font-size: 11px;
    padding: 8px 12px;
    border-radius: 12px;
    max-width: 160px;
    line-height: 1.35;
  }
  .feature-tag.feature-tag-top {
    top: 0;
    left: 0;
    transform: translate(-8px, -8px);
  }
  .feature-tag.feature-tag-bottom {
    bottom: 0;
    left: 10px;
    transform: translateY(8px);
  }
}
@media (max-width: 480px) {
  .why-choose-us-title {
    font-size: 44px;
  }
  .why-choose-us-visuals {
    max-width: 284px;
  }
  .visual-grid {
    height: 255px;
  }
  .feature-tag {
    max-width: 148px;
  }
}.feature-card {
  position: relative;
  border-radius: 50px;
  min-height: 450px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #ffffff;
  isolation: isolate;
}

.feature-card-background {
  border-radius: 50px;
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

.feature-card-overlay {
  border-radius: 50px;
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(20, 25, 71) 0%, rgba(20, 25, 71, 0) 65%);
  z-index: 1;
}

.feature-card-overlay-elements {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.ai-detection-overlay {
  position: absolute;
  top: 32px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.04) 100%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 100px;
  padding: 20px 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.detection-labels {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.detection-labels span {
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  font-family: "Inter-500";
  white-space: nowrap;
}

.detection-divider {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.2) 100%);
}

.detection-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 50px;
}

.detection-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.feature-card-overlay-elements .live-indicator {
  position: absolute;
  top: 40px;
  right: 40px;
  background: rgb(251, 44, 54);
  border-radius: 999px;
  padding: 10px 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 4px 12px rgba(216, 37, 45, 0.4);
}
.feature-card-overlay-elements .live-indicator span {
  color: #fff;
  font-size: 21px;
  font-family: "Inter-500";
  font-weight: 400;
  line-height: 30.7px;
  letter-spacing: 0px;
}

.pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  animation: pulse 2s infinite;
}

.score-tracker {
  position: absolute;
  bottom: 27px;
  right: 23px;
  background: linear-gradient(90deg, rgba(234, 234, 234, 0.15) 0%, rgba(234, 234, 234, 0.25) 65%);
  border-radius: 100px;
  padding: 14px 33px;
  backdrop-filter: blur(4px);
}

.score-tracker-label {
  color: #fff;
  font-size: 14px;
  font-family: "Inter-500";
  font-weight: 400;
  line-height: 16.83px;
  letter-spacing: -0.13px;
  margin-bottom: 9.5px;
}

.score-tracker-balls {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.score-ball {
  width: 27px;
  height: 27px;
  border-radius: 6.78px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11.29px;
  font-family: "Inter-500";
  font-weight: 400;
  letter-spacing: -0.21px;
  line-height: 16.28px;
}

.feature-card-content {
  position: absolute;
  z-index: 3;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  gap: 24px;
  max-width: 500px;
  left: 60px;
  bottom: 110px;
}

.feature-card:hover .feature-card-content {
  opacity: 1;
}

.feature-card-title {
  font-size: 33.1px;
  font-weight: 500;
  font-family: "Inter-500";
  color: #ffffff;
  line-height: 40.36px;
  margin: 0;
}

.feature-card-description {
  font-size: 16px;
  font-weight: 400;
  font-family: "Inter-400";
  color: #C7C7C7;
  margin: 0;
  line-height: 150%;
}

.feature-card-button {
  position: relative;
  background-color: #171A35;
  color: white;
  padding: 12px 34px;
  border: 0.89px solid white;
  border-radius: 24px;
  font-size: 14px;
  font-weight: 400;
  font-family: "Inter-400";
  line-height: 100%;
  cursor: pointer;
  transition: border-color 0.3s ease;
  isolation: isolate;
  max-width: 146px;
  margin-top: 36px;
}
.feature-card-button::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(90deg, #4d4e53 0%, #7c3aed 100%);
  border-radius: 24px;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.feature-card-button::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #171A35;
  border-radius: 24px;
  z-index: -1;
}
.feature-card-button:hover {
  box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
  border-color: transparent;
}
.feature-card-button:hover::before {
  opacity: 1;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.5;
    transform: scale(0.8);
  }
}
.pulse-dot {
  animation: pulse 2s infinite;
}

@media (max-width: 768px) {
  .feature-card {
    min-height: 256px;
    border-radius: 16px;
    padding: 20px 16px;
    background: linear-gradient(180deg, rgb(20, 25, 71) 0%, rgba(20, 25, 71, 0) 65%);
  }
  .feature-card-overlay {
    background: linear-gradient(0deg, rgb(20, 25, 71) 0%, rgba(20, 25, 71, 0) 65%);
  }
  .feature-card-overlay-elements {
    display: none;
  }
  .feature-card-content {
    position: relative;
    left: auto;
    bottom: auto;
    max-width: 100%;
    width: 100%;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding-top: 10px;
  }
  .feature-card-title {
    font-family: "Inter-500";
    color: #ffffff;
    font-size: 24px;
    line-height: 100%;
    font-style: bold;
    font-weight: 700;
  }
  .feature-card-description {
    font-size: 13px;
    line-height: 150%;
    max-width: 280px;
  }
  .feature-card-button {
    min-width: 118px;
    min-height: 40px;
    border-radius: 999px;
    padding: 8px 26px;
    font-size: 13px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
  }
}
@media (max-width: 480px) {
  .feature-card {
    min-height: 248px;
    padding: 16px 14px;
  }
  .feature-card-title {
    font-family: "Inter-500";
    color: #ffffff;
    font-size: 20px;
    line-height: 100%;
    font-style: bold;
    font-weight: 700;
  }
  .feature-card-description {
    font-size: 12px;
    max-width: 270px;
  }
  .feature-card-button {
    min-width: 112px;
    font-size: 12px;
  }
}.key-features {
  background: #f2f2f3;
  width: 100%;
}

.key-features-container {
  max-width: 1512px;
  margin: 0 auto;
  padding: 0 62px;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.feature-cards-grid {
  display: flex;
  flex-direction: column;
  gap: 80px;
}
.feature-cards-grid .feature-card.feature-card-sticky {
  position: sticky;
  border-radius: 50px;
  z-index: 1;
  transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
}
.feature-cards-grid .feature-card.feature-card-sticky[data-sticky-index="0"] {
  top: 200px;
  z-index: 1;
}
.feature-cards-grid .feature-card.feature-card-sticky[data-sticky-index="1"] {
  top: 200px;
  z-index: 2;
}
.feature-cards-grid .feature-card.feature-card-sticky[data-sticky-index="2"] {
  top: 200px;
  z-index: 3;
}
.feature-cards-grid .feature-card.feature-card-sticky[data-sticky-index="3"] {
  top: 200px;
  z-index: 4;
}

.key-features-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

.key-features-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background-color: #F9FAFB;
  border: 0.89px solid rgb(234, 236, 240);
  padding: 10px;
  border-radius: 88px;
  width: fit-content;
  font-size: 12px;
  font-weight: 500;
  font-family: "Inter-500";
  color: #031B1D;
  letter-spacing: 0px;
  line-height: 100%;
}
.key-features-badge .badge-icon {
  width: 12px;
  height: 12px;
  object-fit: contain;
  display: block;
}

.key-features-title {
  font-size: 40px;
  font-weight: 600;
  line-height: 120%;
  font-family: "Inter-400";
  color: #000000;
  margin: 0;
  max-width: 900px;
}

.key-features-description {
  font-size: 14px;
  line-height: 150%;
  font-family: "Inter-500";
  font-weight: 400;
  color: #707070;
  margin: 0;
  max-width: 700px;
}

.key-features-visual {
  width: 100%;
}

.key-features-image-wrapper {
  position: relative;
  min-height: 480px;
  border-radius: 16px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  isolation: isolate;
}

.key-features-image-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgb(20, 25, 71) 0%, rgba(20, 25, 71, 0) 50%);
}

.key-features-phone {
  position: absolute;
  bottom: 0;
  right: 90px;
  z-index: 3;
  width: 280px;
  height: auto;
  pointer-events: none;
}
.key-features-phone .phone-image {
  width: 100%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.3));
}

.key-features-text-overlay {
  position: absolute;
  left: 40px;
  bottom: 40px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 520px;
  align-items: flex-start;
  color: #ffffff;
}

.overlay-title {
  font-size: 32px;
  font-weight: 700;
  font-family: "Inter-700";
  color: #ffffff;
  margin: 0;
  line-height: 120%;
}

.overlay-description {
  font-size: 16px;
  font-weight: 400;
  font-family: "Inter-500";
  color: #ffffff;
  margin: 0;
  line-height: 160%;
  opacity: 0.9;
}

.overlay-button {
  background-color: rgba(15, 20, 57, 0.65);
  color: #ffffff;
  border: 1px solid #ffffff;
  border-radius: 24px;
  padding: 12px 32px;
  font-size: 14px;
  font-family: "Inter-500";
  font-weight: 400;
  cursor: pointer;
  width: fit-content;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}
.overlay-button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(124, 58, 237, 0.8) 0%, rgba(110, 160, 255, 0.8) 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: -1;
}
.overlay-button:hover {
  border-color: transparent;
}
.overlay-button:hover::before {
  opacity: 1;
}
.overlay-button:active {
  transform: translateY(1px);
}

@media (max-width: 1024px) {
  .key-features-phone {
    width: 220px;
    right: 40px;
  }
  .key-features-text-overlay {
    left: 20px;
    bottom: 20px;
    max-width: 400px;
  }
}
@media (max-width: 768px) {
  .key-features {
    background: #f2f2f3;
  }
  .key-features-container {
    padding: 0 12px;
    gap: 42px;
  }
  .feature-cards-grid {
    gap: 14px;
  }
  .key-features-header {
    gap: 14px;
  }
  .key-features-title {
    font-size: 24px;
    line-height: 120%;
    text-align: center;
    max-width: 100%;
    font-weight: 400;
    font-family: "Inter-500";
  }
  .key-features-description {
    font-size: 12px;
    line-height: 150%;
    max-width: 96%;
  }
  .key-features-image-wrapper {
    min-height: 358px;
    border-radius: 18px;
  }
  .key-features-phone {
    width: 126px;
    right: 50%;
    transform: translateX(50%);
    bottom: 64px;
  }
  .key-features-text-overlay {
    left: 0;
    right: 0;
    bottom: 12px;
    max-width: 100%;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding: 0 14px;
  }
  .overlay-title {
    font-size: 20px;
    line-height: 125%;
  }
  .overlay-description {
    font-size: 14px;
    line-height: 145%;
    max-width: 280px;
  }
  .overlay-button {
    padding: 10px 36px;
    font-size: 14px;
    line-height: 1;
    border-radius: 999px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
  }
}
@media (max-width: 480px) {
  .feature-cards-grid {
    gap: 12px;
  }
  .key-features-badge {
    padding: 8px 12px;
    font-size: 11px;
  }
  .key-features-title {
    font-size: 24px;
    line-height: 120%;
    text-align: center;
    max-width: 100%;
    font-weight: 400;
    font-family: "Inter-500";
  }
  .key-features-image-wrapper {
    min-height: 344px;
  }
  .key-features-phone {
    width: 120px;
    bottom: 68px;
  }
  .overlay-title {
    font-size: 18px;
  }
  .overlay-description {
    font-size: 13px;
  }
  .overlay-button {
    min-width: 112px;
    font-size: 13px;
  }
}.analytics-hub {
  width: 100%;
  background-color: #f2f2f3;
}

.analytics-hub-container {
  max-width: 1512px;
  margin: 0 auto;
  padding: 0 62px;
}

.analytics-hub-card {
  position: relative;
  background: #1a1e4f url("/assets/analytics_blue_bg-CNBETrLZ.png") center/cover no-repeat;
  border-radius: 24px;
  padding: 60px 80px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.analytics-hub-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
}

.analytics-hub-title {
  font-size: 30px;
  font-weight: 400;
  line-height: 120%;
  font-family: "Inter-500";
  margin: 0;
  max-width: 900px;
  color: #FFFFFF;
}

.analytics-hub-description {
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 400;
  color: #C2C2C2;
  margin: 0;
  line-height: 24px;
  letter-spacing: 0.31px;
  max-width: 600px;
}

.analytics-hub-stats {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 80px;
  margin-top: 20px;
  flex-wrap: wrap;
}

.analytics-hub-stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11px;
}

.stat-value {
  font-size: 40px;
  font-weight: 400;
  line-height: 42.03px;
  font-family: "Inter-500";
  margin: 0;
  letter-spacing: 0.31px;
  color: #7DD3FC;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}
.stat-value.stat-value-light-blue {
  background-image: linear-gradient(90deg, #00D3F2 0%, #51A2FF 100%);
}
.stat-value.stat-value-light-purple {
  background-image: linear-gradient(90deg, #C27AFF 0%, #FB64B6 100%);
}

.stat-label {
  font-size: 16px;
  font-weight: 400;
  line-height: 21.1px;
  font-family: "Inter-500";
  color: #E3E3E3;
  letter-spacing: -0.27px;
  margin: 0;
  font-style: normal;
}

@media (max-width: 1024px) {
  .analytics-hub-card {
    padding: 50px 60px;
  }
  .analytics-hub-title {
    font-size: 32px;
  }
  .analytics-hub-stats {
    gap: 60px;
  }
  .stat-value {
    font-size: 48px;
  }
}
@media (max-width: 768px) {
  .analytics-hub-container {
    padding: 0 12px;
  }
  .analytics-hub-card {
    padding: 42px 22px 34px;
    border-radius: 18px;
    background: #1a1e4f url("/assets/analytics_blue_bg-CNBETrLZ.png") center/cover no-repeat;
  }
  .analytics-hub-content {
    gap: 12px;
  }
  .analytics-hub-title {
    font-weight: 400;
    font-size: 24px;
    line-height: 100%;
    max-width: 96%;
  }
  .analytics-hub-description {
    font-size: 12px;
    line-height: 150%;
    max-width: 92%;
    color: rgba(255, 255, 255, 0.78);
  }
  .analytics-hub-stats {
    flex-direction: column;
    gap: 18px;
    margin-top: 4px;
  }
  .stat-value {
    font-size: 48px;
    line-height: 1.05;
  }
  .stat-label {
    font-size: 11px;
    font-weight: 400;
  }
  .analytics-hub-stat-item {
    gap: 2px;
  }
}
@media (max-width: 480px) {
  .analytics-hub-card {
    padding: 38px 16px 28px;
  }
  .analytics-hub-title {
    font-family: "Inter-500";
    font-size: 24px;
    line-height: 100%;
    font-weight: 400;
  }
  .stat-value {
    font-size: 46px;
  }
}.production-house-container {
  padding: 0px;
  font-family: "Inter-400";
  max-width: 1476px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  justify-content: center;
}

.production-house-card {
  position: relative;
  display: flex;
  background: #f8f4ff;
  border-radius: 20px;
  padding: 47.65px 31.5px;
  overflow: hidden;
  width: 90%;
}

.p-h-left-section {
  max-width: 60%;
}

.production-house-heading {
  font-size: 40px;
  color: #1d1d1d;
  margin: 0 0 31px 0;
}

.production-house-copy {
  margin: 20px 0;
  font-size: 24px;
  line-height: 32px !important;
  color: #454545;
}

.production-house-copy-bold {
  line-height: 40px;
  font-family: "Inter-700";
  font-weight: 700;
}

.production-house-copy-second-bold {
  margin-top: 10px;
  line-height: 45px;
  font-family: "Inter-700";
  font-weight: 700;
}

.production-house-banner {
  position: absolute;
  top: -14%;
  right: 72%;
  width: 50px;
  height: 136%;
  transform: rotate(22deg);
  transform-origin: center;
  overflow: hidden;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
}

.banner-content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
  overflow: hidden;
  padding: 0;
}

.banner-marquee {
  display: flex;
  align-items: center;
  width: max-content;
  white-space: nowrap;
  animation: ph-banner-scroll 40s linear infinite;
  will-change: transform;
}

.banner-track {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.banner-text {
  font-size: 18px;
  font-weight: 700;
  font-family: "Inter-700";
  color: #ffffff;
  text-transform: none;
  line-height: 100%;
}

.banner-icon {
  width: 19px;
  height: 19px;
  display: block;
  flex-shrink: 0;
  opacity: 0.95;
}

@keyframes ph-banner-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
.production-house-image-wrapper {
  position: absolute;
  width: 100%;
  max-height: 721px;
  border-radius: 0 24px 24px 0;
  overflow: hidden;
}

.production-house-image-container {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: flex-end;
}

.right {
  position: absolute;
  top: 0;
  right: 0;
}

.production-house-overlay {
  border: 1px solid red;
  position: absolute;
  z-index: 3;
  padding: 10px 30px;
  border-radius: 14px;
  box-shadow: none;
  backdrop-filter: blur(3px);
}
.production-house-overlay p {
  font-size: 14px;
  line-height: 1.45;
  font-family: "Inter-500";
  font-weight: 700;
  color: #ffffff;
  margin: 0;
}
.production-house-overlay.production-house-overlay-top {
  top: 92px;
  right: 16px;
  max-width: 212px;
  background: rgba(144, 182, 231, 0.46);
  border: 1px solid rgba(255, 255, 255, 0.22);
}
.production-house-overlay.production-house-overlay-bottom {
  bottom: 130px;
  left: 110px;
  max-width: 212px;
  background: rgba(144, 182, 231, 0.46);
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.production-house-heading-mob,
.p-h-banner-mob {
  display: none;
}

@media (max-width: 1024px) {
  .production-house-container {
    padding: 0 16px;
    width: 92%;
  }
  .banner-content {
    display: flex;
    align-items: center;
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    width: 100%;
    padding: 8px 0;
    overflow: hidden;
  }
  .banner-text {
    font-size: 18px;
    font-family: "Inter-700";
    font-weight: 700;
    line-height: 1;
  }
  .production-house-card {
    flex-direction: column-reverse;
    padding: 32px 0;
    width: 100%;
    border-radius: 24px;
  }
  .production-house-heading-mob {
    display: block;
    text-align: center;
    margin: 0 0 16px 0;
  }
  .p-h-left-section {
    max-width: 100%;
    width: 100%;
    margin-bottom: 24px;
  }
  .production-house-heading {
    font-size: 28px;
    margin-bottom: 24px;
    line-height: 1.2;
  }
  .production-house-copy {
    font-size: 14px;
    line-height: 24px !important;
    margin: 0 0 24px 0;
  }
  .production-house-copy br {
    display: none;
  }
  .right {
    position: relative;
    width: 100%;
    height: 640px;
    margin-top: 16px;
    border-radius: 20px;
    overflow: hidden;
    margin-bottom: 0;
  }
  .production-house-heading {
    display: none;
  }
  .p-h-banner-mob {
    display: none;
  }
  .production-house-stadium-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
  }
  .production-house-banner {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    width: 100%;
    height: auto;
    transform: none;
    background: linear-gradient(180deg, #7a3cff 0%, #5b2de8 100%);
    z-index: 4;
  }
  .production-house-overlay {
    display: block;
    z-index: 3;
  }
  .production-house-overlay p {
    font-size: 20px;
    line-height: 1.35;
  }
  .production-house-overlay.production-house-overlay-top {
    top: 78px;
    right: 20px;
    max-width: 270px;
    border-radius: 12px;
    padding: 16px 20px;
  }
  .production-house-overlay.production-house-overlay-bottom {
    bottom: 84px;
    left: 20px;
    max-width: 520px;
    border-radius: 16px;
    padding: 20px 24px;
  }
  .p-h-left-section .primary-button {
    width: 100%;
    justify-content: center;
    margin-top: 8px;
  }
}
@media (max-width: 480px) {
  .production-house-card {
    padding: 24px 12px;
  }
  .production-house-heading {
    font-size: 24px;
    margin-bottom: 20px;
  }
  .production-house-copy {
    margin-top: 42px;
    font-size: 13px;
    line-height: 22px !important;
  }
  .p-h-left-section {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .right {
    height: 420px;
  }
  .banner-text {
    font-size: 14px;
  }
  .banner-icon {
    width: 14px;
    height: 14px;
  }
  .production-house-overlay p {
    font-size: 12px;
    line-height: 1.35;
  }
  .production-house-overlay.production-house-overlay-top {
    top: 60px;
    right: 12px;
    max-width: 170px;
    padding: 8px 10px;
    border-radius: 10px;
  }
  .production-house-overlay.production-house-overlay-bottom {
    left: 12px;
    bottom: 58px;
    max-width: 250px;
    padding: 10px 12px;
    border-radius: 12px;
  }
}.testimonials-section {
  width: 100%;
}

.testimonials-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 48px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.testimonials-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.testimonials-header-left {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 16px;
}

.testimonials-tag {
  max-width: 125px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 10px;
  border: 0.89px solid #EAECF0;
  border-radius: 88px;
  background: #F9FAFB;
}

.tag-icon {
  width: 12px;
  height: 12px;
}

.tag-text {
  color: #031B1D;
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 12px;
  line-height: 100%;
}

.testimonials-title {
  text-align: center;
  margin: 0;
  color: #1D1D1D;
  font-family: "Inter-500";
  font-weight: 600;
  font-style: semibold;
  font-size: 40px;
  font-weight: 500;
  line-height: 50px;
  max-width: 600px;
}

.testimonials-header-right {
  max-width: 670px;
  justify-self: end;
}

.testimonials-description {
  margin: 0;
  color: #454545;
  font-family: "Inter-400";
  font-size: 16px;
  font-weight: 400;
  line-height: 160%;
  text-align: center;
}

.testimonials-carousel-wrapper {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: "swiper" "controls";
  row-gap: 28px;
  margin-left: -48px;
  margin-right: -48px;
}

.testimonials-swiper {
  grid-area: swiper;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 0 0 8px;
}
.testimonials-swiper .swiper-wrapper {
  align-items: flex-start;
}
.testimonials-swiper .swiper-slide {
  display: flex;
  flex-direction: column;
  gap: 40px;
  opacity: 0.6;
  transform: scale(0.965);
  transition: transform 0.35s ease, opacity 0.35s ease;
}
.testimonials-swiper .swiper-slide-active {
  opacity: 1;
  transform: scale(1);
}

.testimonial-card {
  position: relative;
  min-height: 130px;
  padding: 24px;
  border-radius: 37px;
  background: #fefeff;
  border: 0.81px solid #161934;
  box-shadow: none;
  max-width: 500px;
}

.testimonial-text {
  margin: 0;
  font-weight: 400;
  font-style: normal;
  color: #5F5F5F;
  font-family: "Inter-400";
  font-size: 16px;
  line-height: 23px;
}

.testimonial-speech-bubble {
  position: absolute;
  left: 42px;
  bottom: -14px;
  width: 25px;
  height: 25px;
  background: #fefeff;
  border-left: 0.81px solid #161934;
  border-bottom: 0.81px solid #161934;
  transform: rotate(-45deg);
}

.testimonial-quote-icon {
  position: absolute;
  right: 20px;
  bottom: 10px;
  color: #d7d6ea;
  font-size: 46px;
  line-height: 1;
}

.swiper-slide-active .testimonial-card {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  border-color: 1.63px solid #ffffff;
  color: #ffffff;
}

.swiper-slide-active .testimonial-text {
  color: rgba(255, 255, 255, 0.92);
}

.swiper-slide-active .testimonial-speech-bubble {
  background: #201E56;
}

.swiper-slide-active .testimonial-quote-icon {
  color: #ffffff;
  opacity: 0.2;
}

.testimonial-author {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-left: 0;
}

.author-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
}

.author-name {
  color: #000;
  font-family: "Inter-500";
  font-size: 16px;
  line-height: 100%;
  margin-bottom: 6px;
}

.author-title {
  color: #515151;
  font-family: "Inter-400";
  font-size: 14px;
  line-height: 100%;
}

.swiper-slide:not(.swiper-slide-active) .testimonial-author {
  opacity: 0.82;
}

.testimonials-nav-btn {
  width: 30px !important;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  max-width: 30px;
  max-height: 30px;
  flex: 0 0 30px;
  flex-shrink: 0;
  border-radius: 50%;
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 10px;
  line-height: 1;
  transition: opacity 0.2s ease, transform 0.2s ease;
  background: #161934;
  color: #ffffff;
}

.testimonials-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.testimonials-controls {
  grid-area: controls;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 34px;
  width: 100%;
  max-width: 460px;
  margin: 0 auto;
}

.testimonials-nav-prev {
  order: 1;
}

.testimonials-nav-next {
  order: 3;
}

.testimonials-pagination {
  order: 2;
}

.testimonials-nav-btn:disabled {
  background: #c8c6d1;
  color: #efeff6;
  opacity: 1;
  pointer-events: none;
}

.testimonial-bullet {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #848282;
  opacity: 1;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}

.testimonial-bullet-active {
  background: #201E52;
  transform: scale(1.02);
}

@media (max-width: 1024px) {
  .testimonials-container {
    padding: 0 28px;
    gap: 60px;
  }
  .testimonials-title {
    font-size: 34px;
  }
  .testimonials-carousel-wrapper {
    margin-left: -28px;
    margin-right: -28px;
  }
  .testimonials-header {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .testimonials-header-right {
    justify-self: start;
    margin-top: 0;
  }
}
@media (max-width: 767px) {
  .testimonials-container {
    gap: 40px;
  }
  .testimonials-header {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .testimonials-section {
    padding: 48px 0;
  }
  .testimonials-container {
    padding: 0 16px;
  }
  .testimonials-title {
    font-size: 28px;
    max-width: none;
  }
  .testimonials-carousel-wrapper {
    row-gap: 22px;
    margin-left: -16px;
    margin-right: -16px;
  }
  .testimonial-card {
    min-height: 150px;
  }
  .testimonials-controls {
    gap: 24px;
  }
}/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */

/* FONT_START */
@font-face {
  font-family: 'swiper-icons';
  src: url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');
  font-weight: 400;
  font-style: normal;
}
/* FONT_END */
:root {
  --swiper-theme-color: #007aff;
  /*
  --swiper-preloader-color: var(--swiper-theme-color);
  --swiper-wrapper-transition-timing-function: initial;
  */
}
:host {
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  z-index: 1;
}
.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
  display: block;
}
.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  box-sizing: content-box;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
  transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
  touch-action: pan-y;
}
.swiper-vertical {
  touch-action: pan-x;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  transition-property: transform;
  display: block;
}
.swiper-slide-invisible-blank {
  visibility: hidden;
}
/* Auto Height */
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
  height: auto;
}
.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
/* 3D Effects */
.swiper-3d.swiper-css-mode .swiper-wrapper {
  perspective: 1200px;
}
.swiper-3d .swiper-wrapper {
  transform-style: preserve-3d;
}
.swiper-3d {
  perspective: 1200px;
}
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
  transform-style: preserve-3d;
}
/* CSS Mode */
.swiper-css-mode > .swiper-wrapper {
  overflow: auto;
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
  display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
  scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
  scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
  scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
  content: '';
  flex-shrink: 0;
  order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
  scroll-snap-align: center center;
  scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
  margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
  height: 100%;
  min-height: 1px;
  width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
  margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
  width: 100%;
  min-width: 1px;
  height: var(--swiper-centered-offset-after);
}
/* Slide styles start */
/* 3D Shadows */
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
  background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  transform-origin: 50%;
  box-sizing: border-box;
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top-color: transparent;
}
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader {
  animation: swiper-preloader-spin 1s infinite linear;
}
.swiper-lazy-preloader-white {
  --swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
  --swiper-preloader-color: #000;
}
@keyframes swiper-preloader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Slide styles end */
:root {
  --swiper-navigation-size: 44px;
  /*
  --swiper-navigation-top-offset: 50%;
  --swiper-navigation-sides-offset: 10px;
  --swiper-navigation-color: var(--swiper-theme-color);
  */
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: var(--swiper-navigation-top-offset, 50%);
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  height: var(--swiper-navigation-size);
  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
  z-index: 10;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev.swiper-button-hidden,
.swiper-button-next.swiper-button-hidden {
  opacity: 0;
  cursor: auto;
  pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-prev,
.swiper-navigation-disabled .swiper-button-next {
  display: none !important;
}
.swiper-button-prev svg,
.swiper-button-next svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: center;
}
.swiper-rtl .swiper-button-prev svg,
.swiper-rtl .swiper-button-next svg {
  transform: rotate(180deg);
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: var(--swiper-navigation-sides-offset, 10px);
  right: auto;
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-lock {
  display: none;
}
/* Navigation font start */
.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: var(--swiper-navigation-size);
  text-transform: none !important;
  letter-spacing: 0;
  font-variant: initial;
  line-height: 1;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  content: 'prev';
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: var(--swiper-navigation-sides-offset, 10px);
  left: auto;
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  content: 'next';
}
/* Navigation font end */
:root {
  /*
  --swiper-pagination-color: var(--swiper-theme-color);
  --swiper-pagination-left: auto;
  --swiper-pagination-right: 8px;
  --swiper-pagination-bottom: 8px;
  --swiper-pagination-top: auto;
  --swiper-pagination-fraction-color: inherit;
  --swiper-pagination-progressbar-bg-color: rgba(0,0,0,0.25);
  --swiper-pagination-progressbar-size: 4px;
  --swiper-pagination-bullet-size: 8px;
  --swiper-pagination-bullet-width: 8px;
  --swiper-pagination-bullet-height: 8px;
  --swiper-pagination-bullet-border-radius: 50%;
  --swiper-pagination-bullet-inactive-color: #000;
  --swiper-pagination-bullet-inactive-opacity: 0.2;
  --swiper-pagination-bullet-opacity: 1;
  --swiper-pagination-bullet-horizontal-gap: 4px;
  --swiper-pagination-bullet-vertical-gap: 6px;
  */
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  transition: 300ms opacity;
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
  display: none !important;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  bottom: var(--swiper-pagination-bottom, 8px);
  top: var(--swiper-pagination-top, auto);
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
  display: inline-block;
  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
  background: var(--swiper-pagination-bullet-inactive-color, #000);
  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  box-shadow: none;
  -webkit-appearance: none;
          appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet:only-child {
  display: none !important;
}
.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
}
.swiper-vertical > .swiper-pagination-bullets,
.swiper-pagination-vertical.swiper-pagination-bullets {
  right: var(--swiper-pagination-right, 8px);
  left: var(--swiper-pagination-left, auto);
  top: 50%;
  transform: translate3d(0px, -50%, 0);
}
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
  display: block;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
}
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  transition: 200ms transform,
        200ms top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
        200ms left;
}
.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  transition: 200ms transform,
    200ms right;
}
/* Fraction */
.swiper-pagination-fraction {
  color: var(--swiper-pagination-fraction-color, inherit);
}
/* Progress */
.swiper-pagination-progressbar {
  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: var(--swiper-pagination-color, var(--swiper-theme-color));
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transform-origin: left top;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: var(--swiper-pagination-progressbar-size, 4px);
  left: 0;
  top: 0;
}
.swiper-vertical > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {
  width: var(--swiper-pagination-progressbar-size, 4px);
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-lock {
  display: none;
}
.build-team-section {
  max-width: 1600px;
  position: relative;
  width: 100%;
  padding: 56px 16px 66px;
  background-color: #060918;
  background-image: url("/assets/build-team-section-bg-CEFzPyFC.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.build-team-container {
  max-width: 860px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.build-team-logo {
  width: 202px;
  height: 169px;
  border-radius: 18px;
  display: grid;
  place-items: center;
}
.build-team-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.build-team-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  width: 100%;
  max-width: 760px;
}

.build-team-heading {
  margin: 0;
  width: min(690px, 100%);
  max-width: 690px;
  padding: 23px 18px;
  text-align: center;
  border-radius: 14px;
  background: #2B2930;
  box-shadow: 0 4px 0 rgba(255, 255, 255, 0.12);
  color: #f3f3f6;
  font-size: 25px;
  font-weight: 500;
  line-height: 100%;
  font-family: "Inter-500";
}

.build-team-description {
  margin: 0;
  max-width: 700px;
  text-align: center;
  color: rgba(255, 255, 255, 0.74);
  font-size: 16px;
  line-height: 1.45;
  font-family: "Inter-500";
}

.app-stores {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 2px;
}

.app-store-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.app-store-badge-img {
  height: 77.78px;
  width: auto;
  object-fit: contain;
}

@media (max-width: 768px) {
  .build-team-section {
    max-width: 100%;
    padding: 34px 10px 40px;
  }
  .build-team-logo {
    width: 102px;
    height: 102px;
    border-radius: 14px;
    padding: 10px;
  }
  .build-team-heading {
    font-size: 14px;
    line-height: 1.25;
    padding: 10px 12px;
    border-radius: 11px;
    width: min(560px, 100%);
    max-width: 560px;
  }
  .build-team-description {
    font-size: 10px;
    line-height: 1.35;
    max-width: 295px;
  }
  .app-stores {
    gap: 8px;
    flex-wrap: nowrap;
  }
  .app-store-badge-img {
    height: 36px;
  }
}
@media (max-width: 430px) {
  .build-team-container {
    gap: 12px;
  }
  .build-team-logo {
    width: 92px;
    height: 92px;
    border-radius: 12px;
    padding: 8px;
  }
  .build-team-heading {
    font-size: 12px;
    padding: 9px 10px;
    border-radius: 10px;
    max-width: 314px;
    width: 100%;
  }
  .app-store-badge-img {
    height: 32px;
  }
}.faq-section {
  padding: 0;
  background: #f2f2f3;
  margin-bottom: 80px;
}

.faq-container {
  max-width: 1512px;
  margin: 0 auto;
  padding: 0 62px;
}

.faq-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40px;
  margin-bottom: 34px;
}

.faq-header-left {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.faq-tag {
  max-width: 100px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px;
  background: #f9fafb;
  border: 1px solid #eaecf0;
  border-radius: 88px;
  margin-bottom: 0;
}
.faq-tag .tag-icon {
  width: 12px;
  height: 12px;
  object-fit: contain;
  display: block;
}
.faq-tag .tag-text {
  font-size: 12px;
  font-weight: 500;
  color: #031B1D;
  line-height: 100%;
  font-family: "Inter-500";
}

.faq-title {
  font-size: 40px;
  font-weight: 600;
  color: #25272d;
  margin: 0;
  line-height: 100%;
  font-family: "Inter-500";
}

.faq-header-right {
  display: flex;
  align-items: center;
}

.view-all-btn {
  min-width: 100px;
  height: 40px;
  border-radius: 999px;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px 6px 26px;
  gap: 12px;
}

.view-all-label {
  font-size: 16px;
  line-height: 120%;
  letter-spacing: -1px;
  font-family: "Inter-400";
}

.view-all-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #f4f4f5;
  color: #141833;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.faq-items {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.faq-item {
  border: 0.3px solid #7A7A7A;
  border-radius: 38px;
  overflow: hidden;
  background: #FFFFFF;
  transition: all 0.25s ease;
}
.faq-item.expanded {
  border-color: transparent;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
}
.faq-item.expanded .faq-question {
  background: transparent;
}
.faq-item.expanded .faq-icon {
  background: #ffffff;
  color: #161934;
}
.faq-item.expanded .faq-icon svg {
  transform: rotate(180deg);
}

.faq-question {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 26px 48px;
  border: none;
  background: #ffffff;
  cursor: pointer;
  text-align: left;
}

.faq-number {
  font-size: 20px;
  font-weight: 500;
  color: #181a20;
  min-width: 30px;
  text-align: center;
  line-height: 1;
  font-family: "Inter-500";
}

.faq-text {
  flex: 1;
  font-size: 20px;
  font-weight: 500;
  color: #000000;
  line-height: 100%;
  font-family: "Inter-600";
  padding-right: 10px;
}

.faq-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #ffffff;
  color: #201E52;
  flex-shrink: 0;
}
.faq-icon svg {
  width: 20px;
  height: 20px;
  transition: transform 0.2s ease;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease;
}
.faq-item.expanded .faq-answer {
  max-height: 420px;
}
.faq-answer p {
  margin: 0 48px 36px 48px;
  border-top: none;
  font-size: 17px;
  line-height: 30px;
  color: #454545;
  font-family: "Inter-400";
}

.faq-item.expanded .faq-number,
.faq-item.expanded .faq-text {
  color: #ffffff;
}
.faq-item.expanded .faq-answer p {
  border-top: none;
  color: rgba(255, 255, 255, 0.92);
}

@media (max-width: 1024px) {
  .faq-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 22px;
  }
  .faq-title {
    font-size: 44px;
  }
  .faq-text {
    font-size: 30px;
  }
  .faq-number {
    font-size: 26px;
  }
}
@media (max-width: 768px) {
  .faq-section {
    padding: 42px 0 52px;
  }
  .faq-container {
    padding: 0 12px;
  }
  .faq-header {
    margin-bottom: 22px;
    position: relative;
    padding-right: 70px;
    gap: 14px;
  }
  .faq-tag {
    margin-bottom: 0;
  }
  .faq-title {
    font-size: 24px;
    line-height: 122%;
    max-width: 230px;
  }
  .faq-header-right {
    position: absolute;
    right: 0;
    top: 40px;
  }
  .view-all-btn {
    min-width: 56px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #ececef;
    color: #111827;
    padding: 0;
    justify-content: center;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
  }
  .view-all-icon {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: transparent;
    color: #141833;
  }
  .view-all-label {
    display: none;
  }
  .view-all-icon svg {
    width: 22px;
    height: 22px;
  }
  .faq-items {
    gap: 10px;
  }
  .faq-question {
    padding: 16px 16px;
    gap: 12px;
  }
  .faq-number {
    font-size: 24px;
  }
  .faq-text {
    font-size: 18px;
    line-height: 125%;
    font-weight: 600;
  }
  .faq-icon {
    width: 36px;
    height: 36px;
  }
  .faq-answer p {
    margin: 0 16px 16px;
    font-size: 12px;
    line-height: 150%;
  }
}
@media (max-width: 420px) {
  .faq-item {
    border-radius: 22px;
  }
  .faq-number {
    font-size: 24px;
    min-width: 28px;
  }
  .faq-icon {
    width: 34px;
    height: 34px;
  }
  .faq-answer p {
    font-size: 11px;
  }
}.logged-home-live-strip {
  background: #f5f5f5;
  padding: 12px 0;
  overflow: hidden;
}

.logged-home-live-strip-inner {
  display: flex;
  gap: 48px;
  animation: logged-home-live-scroll 20s linear infinite;
  white-space: nowrap;
}

.logged-home-live-strip-item {
  font-size: 14px;
  font-weight: 600;
  color: #333;
  flex-shrink: 0;
}

@keyframes logged-home-live-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}.logged-home-welcome {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.logged-home-welcome-title {
  font-size: 32px;
  line-height: 120%;
  font-family: "Inter-500";
  font-weight: 500;
  color: #151515;
  margin: 0;
}

.logged-home-welcome-subtitle {
  font-size: 20px;
  color: rgba(76, 76, 77, 0.6);
  margin: 0;
  line-height: 120%;
  font-family: "Inter-500";
  font-weight: 500;
}

.logged-home-welcome-link {
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-decoration: underline;
  font-weight: 600;
  color: #151515;
}
.logged-home-welcome-link:hover {
  color: #0d6efd;
}.logged-home-match-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  z-index: 1;
  isolation: isolate;
}
.logged-home-match-cards .logged-home-match-row-title {
  font-size: 18px;
  font-weight: 700;
  color: #111;
  margin: 0 0 16px;
}

.logged-home-match-carousel-wrapper {
  position: relative;
  overflow: hidden;
}

.logged-home-match-carousel-prev,
.logged-home-match-carousel-next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #ffffff;
  border: none;
  box-shadow: 1px 0 8px rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

.logged-home-match-carousel-prev {
  left: -12px;
}

.logged-home-match-carousel-next {
  right: -12px;
  left: auto;
}

.logged-home-match-carousel {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
}
.logged-home-match-carousel::-webkit-scrollbar {
  height: 6px;
}
.logged-home-match-carousel::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 3px;
}

.logged-home-match-carousel-track {
  display: flex;
  align-items: stretch;
  gap: 12px;
  width: max-content;
}

.logged-home-match-carousel-item {
  flex-shrink: 0;
  scroll-snap-align: start;
  width: 434px;
  max-width: 434px;
  display: flex;
}

.logged-home-match-card {
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.1411764706);
  border-radius: 12px;
  padding: 14px;
  position: relative;
  width: 100%;
  display: flex;
  gap: 12px;
  flex-direction: column;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.logged-home-match-card--live .logged-home-match-card-badge.live {
  font-size: 12px;
  font-weight: 800;
  line-height: 125%;
  font-family: "Inter-800";
  color: #D8252D;
}
.logged-home-match-card--upcoming .logged-home-match-card-badge.upcoming {
  font-size: 12px;
  font-weight: 800;
  line-height: 125%;
  font-family: "Inter-800";
  color: #E15600;
}

.logged-home-match-card-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  justify-content: flex-start;
}

.logged-home-match-card-divider {
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #ffffff 0%, rgba(87, 83, 192, 0.7490196078) 50%, #ffffff 100%);
}

.logged-home-match-card-badge {
  display: inline-block;
  flex-shrink: 0;
}

.logged-home-match-card-tournament {
  font-size: 13px;
  font-weight: 500;
  font-family: "Inter-500";
  color: rgba(76, 76, 77, 0.8);
  margin: 0;
  line-height: 123%;
  letter-spacing: -0.4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
}

.logged-home-match-card-teams {
  display: flex;
  flex-direction: column;
  gap: 13px;
  flex-shrink: 0;
}

.logged-home-match-card-team {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.logged-home-match-card-team .logged-home-match-card-team-info {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.logged-home-match-card-team .logged-home-match-card-team-logo {
  border: 0.4px solid #201E52;
  padding: 4.67px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.logged-home-match-card-team .team-name {
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-600";
  letter-spacing: -0.4px;
  line-height: 122%;
  color: rgba(0, 0, 0, 0.7882352941);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.logged-home-match-card-team .team-score {
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-600";
  letter-spacing: 0px;
  line-height: 122%;
  color: rgba(0, 0, 0, 0.7882352941);
  flex-shrink: 0;
}
.logged-home-match-card-team .team-time {
  font-size: 13px;
  font-weight: 600;
  font-family: "Inter-600";
  letter-spacing: 0px;
  line-height: 122%;
  color: #000000;
  flex-shrink: 0;
}

.logged-home-match-card-meta {
  font-size: 13px;
  color: rgba(0, 0, 0, 0.631372549);
  margin: 0;
  display: flex;
  font-family: "Inter-500";
  letter-spacing: 0px;
  line-height: 123%;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
}
.logged-home-match-card-meta .meta-label {
  color: Black;
  font-family: "Inter-600";
  letter-spacing: -0.4px;
  line-height: 123%;
  font-size: 13px;
  flex-shrink: 0;
}
.logged-home-match-card-meta.logged-home-match-card-venue {
  font-size: 13px;
  color: #2C2970;
  font-family: "Inter-500";
  letter-spacing: 0px;
  line-height: 123%;
  display: flex;
  align-items: center;
  gap: 6px;
}
.logged-home-match-card-meta .logged-home-match-card-venue-icon {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}.logged-home-create-league-banner {
  background: #FCFCFC;
}

.logged-home-create-league-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  margin: 0 auto;
  min-height: 0;
}
@media (max-width: 768px) {
  .logged-home-create-league-inner {
    flex-direction: column;
    gap: 32px;
  }
}

.logged-home-create-league-content {
  flex: 1;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  justify-content: start;
  gap: 16px;
  padding: 16px 36px 91px 27px;
}

.logged-home-create-league-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 17.5px 25px;
  background: rgba(87, 83, 192, 0.0392156863);
  color: #2C2970;
  font-size: 20px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  font-weight: 500;
  border-radius: 999px;
  width: fit-content;
}
.logged-home-create-league-badge .badge-icon {
  width: 32px;
  height: 32px;
  color: #2C2970;
}

.logged-home-create-league-content-title-desc {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.logged-home-create-league-title {
  font-size: 32px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #000000;
  margin: 0;
  line-height: 120%;
}

.logged-home-create-league-desc {
  font-size: 24px;
  font-weight: 400;
  font-family: "Inter-500";
  color: rgba(76, 76, 77, 0.6);
  margin: 0;
  line-height: 40px;
}

.logged-home-create-league-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px 10px 20px;
  font-size: 20px;
  font-weight: 600;
  font-family: "Inter-500";
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #fff;
  border: none;
  border-radius: 7px;
  cursor: pointer;
  width: fit-content;
}
.logged-home-create-league-btn:hover {
  opacity: 0.95;
}
.logged-home-create-league-btn .btn-chevron {
  width: 24px;
  height: 24px;
  color: #fff;
}

.logged-home-create-league-image {
  flex: 1;
  min-width: 280px;
  min-height: 280px;
  max-width: 683px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.logged-home-create-league-image-img {
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
  object-position: center;
}.logged-home-platform-benefits {
  padding: 77px 0;
  background-color: #201e52;
  background-image: var(--platform-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-blend-mode: multiply;
}

.logged-home-platform-benefits-inner {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: center;
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.logged-home-platform-benefits-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

.logged-home-platform-benefits-badge {
  display: inline-block;
  padding: 19px 38px;
  color: #ffffff;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  font-size: 24px;
  font-family: "Inter-600";
  font-weight: 600;
  border-radius: 51px;
  line-height: 120%;
  letter-spacing: 0px;
}

.logged-home-platform-benefits-title {
  font-size: 40px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 120%;
  letter-spacing: 0px;
  color: #fff;
  margin: 0;
}

.logged-home-platform-benefits-subtitle {
  font-size: 24px;
  color: #FFFFFF;
  font-family: "Inter-500";
  font-weight: 500;
  line-height: 120%;
  letter-spacing: 0px;
  margin: 0;
}

.logged-home-platform-benefits-grid {
  display: grid;
  margin-top: 24px;
  grid-template-columns: repeat(4, 1fr);
  gap: 36px;
}
@media (max-width: 992px) {
  .logged-home-platform-benefits-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 576px) {
  .logged-home-platform-benefits-grid {
    grid-template-columns: 1fr;
  }
}

.logged-home-platform-benefit-card {
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  padding: 34px 15px 52px;
  text-align: center;
}

.logged-home-platform-benefit-icon {
  color: #FFFFFF;
  background: #201E52;
  margin-bottom: 16px;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  margin: 0 auto;
}

.logged-home-platform-benefit-content {
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: center;
  justify-content: center;
}

.logged-home-platform-benefit-title {
  font-size: 18px;
  font-weight: 700;
  font-family: "Inter-700";
  line-height: 120%;
  letter-spacing: 0px;
  color: #201e52;
  margin: 0;
}

.logged-home-platform-benefit-desc {
  font-size: 14px;
  color: #201E52;
  margin: 0;
  line-height: 120%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  font-weight: 500;
}.logged-home-support {
  padding: 81.5px 0;
  background: #F7F7FF;
}

.logged-home-support-inner {
  max-width: 844px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 35px;
  align-items: center;
  justify-content: center;
}

.logged-home-support-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
}

.logged-home-support-icon-wrap {
  width: 98px;
  height: 98px;
  margin: 0 auto;
  border-radius: 50%;
  background: #EEEDFF;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 25px;
}

.logged-home-support-icon {
  color: #201E52;
  font-size: 64px;
}

.logged-home-support-title {
  font-size: 32px;
  font-weight: 600;
  font-family: "Inter-600";
  line-height: 120%;
  letter-spacing: 0px;
  color: #151515;
  margin: 0;
}

.logged-home-support-desc {
  font-size: 20px;
  color: #4C4C4D;
  line-height: 40px;
  font-family: "Inter-500";
  font-weight: 500;
  letter-spacing: 0px;
  margin: 0;
}

.logged-home-support-btns {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

.logged-home-support-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 13px 10px 20px;
  font-size: 20px;
  font-weight: 500;
  font-family: "Inter-500";
  line-height: 100%;
  letter-spacing: 0px;
  border-radius: 7px;
  cursor: pointer;
  border: none;
}
.logged-home-support-btn--primary {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: rgba(255, 255, 255, 0.8980392157);
}
.logged-home-support-btn--primary:hover {
  opacity: 0.95;
}
.logged-home-support-btn--secondary {
  background: #FFFFFF;
  color: #201E52;
  border: 1px solid rgba(87, 83, 192, 0.1803921569);
}
.logged-home-support-btn--secondary:hover {
  background: #201e52;
  color: #fff;
}

.logged-home-support-dialog {
  max-width: 460px;
  padding: 0 !important;
  position: relative;
  overflow: hidden;
}
.logged-home-support-dialog .app-dialog-header {
  padding: 16px 48px 16px 16px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.2509803922);
}
.logged-home-support-dialog .app-dialog-title {
  font-size: 18px;
  line-height: 120%;
  color: #000000;
  font-family: "Inter-600";
  margin: 0;
}
.logged-home-support-dialog .app-dialog-body {
  padding: 0;
}

.logged-home-support-dialog-body {
  position: static;
}

.logged-home-support-dialog-close {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 60px;
  height: 60px;
  border: none;
  background: transparent;
  color: #5F6368;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 1;
}

.logged-home-support-contact-list {
  display: flex;
  flex-direction: column;
  padding: 16px;
  gap: 29px;
}

.logged-home-support-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 38px;
  color: #000000;
  font-size: 16px;
  line-height: 120%;
  font-family: "Inter-400";
}
.logged-home-support-contact-item svg {
  flex: 0 0 auto;
  margin-top: 1px;
  color: #000000;
}
.logged-home-support-contact-item span {
  display: block;
  max-width: 320px;
}

.logged-home-support-contact-item--location span {
  max-width: 300px;
}.logged-home-my-leagues {
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
  max-width: 1512px;
}

.logged-home-my-leagues-title {
  font-size: 32px;
  font-weight: 500;
  font-family: "Inter-500";
  line-height: 122%;
  letter-spacing: 0px;
  color: #151515;
  margin: 0;
}

.logged-home-my-leagues-wrapper {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: stretch;
  min-width: 0;
}

.logged-home-my-leagues-carousel {
  flex: 1;
  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 16px;
  padding-bottom: 12px;
  scroll-snap-type: x mandatory;
  min-width: 0;
  -webkit-overflow-scrolling: touch;
}
.logged-home-my-leagues-carousel::-webkit-scrollbar {
  height: 6px !important;
  width: 6px !important;
  display: block !important;
}
.logged-home-my-leagues-carousel::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 3px;
}
.logged-home-my-leagues-carousel::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 3px;
}

.logged-home-my-leagues-carousel-item {
  flex-shrink: 0;
  flex-grow: 0;
  scroll-snap-align: start;
  width: 534px;
  min-width: 534px;
}
.logged-home-my-leagues-carousel-item .myleagues-league-card-image-wrap {
  width: 200px;
}

.logged-home-my-leagues-create {
  flex-shrink: 0;
  max-width: 290px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 290px;
  max-height: 290px;
}
.logged-home-my-leagues-create--static {
  max-width: 290px;
}

.logged-home-create-league-card {
  border: 1px dashed #c7c7c7;
  border-radius: 28px;
  padding: 29px;
  display: flex;
  gap: 16px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: #fafafa;
}

.logged-home-create-league-card-icon {
  padding: 17px;
  border-radius: 12px;
  color: #201E52;
  background: rgba(87, 83, 192, 0.0509803922);
  display: flex;
  align-items: center;
  justify-content: center;
}

.logged-home-create-league-card-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
}

.logged-home-create-league-card-title {
  font-size: 20px;
  font-weight: 600;
  font-family: "Inter-600";
  line-height: 120%;
  letter-spacing: 0px;
  color: #3B3B3B;
  margin: 0;
}

.logged-home-create-league-card-subtitle {
  font-size: 15px;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  line-height: 120%;
  letter-spacing: 0px;
  margin: 0;
}

.logged-home-create-league-card-btn {
  padding: 9px 10px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: rgba(255, 255, 255, 0.8980392157);
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.logged-home-create-league-card-btn:hover {
  opacity: 0.95;
}.logged-home-team-card {
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  border-radius: 28px;
  padding: 24px 20px;
  cursor: pointer;
  transition: box-shadow 0.2s;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.logged-home-team-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.logged-home-team-card-divider {
  width: 100%;
  height: 1px;
  background: rgba(76, 76, 77, 0.2509803922);
  margin: 12px 0;
}

.logged-home-team-card-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.logged-home-team-card-logo {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1px solid #201E52;
  object-fit: cover;
}

.logged-home-team-card-logo-placeholder {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #dc2626;
  flex-shrink: 0;
}

.logged-home-team-card-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.logged-home-team-card-name {
  font-size: 20px;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  color: rgba(0, 0, 0, 0.8980392157);
}

.logged-home-team-card-role {
  font-size: 16px;
  line-height: 120%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  color: #201E52;
}

.logged-home-team-card-stats {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}

.logged-home-team-card-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.logged-home-team-card-stat .stat-label {
  font-size: 14px;
  color: #6b7280;
}
.logged-home-team-card-stat .stat-value {
  font-size: 14px;
  font-weight: 600;
  color: #111;
}
.logged-home-team-card-stat .stat-value--green {
  color: #16a34a;
}

.logged-home-team-card-form .form-label {
  font-size: 14px;
  color: #6b7280;
  display: block;
  margin-bottom: 8px;
}

.logged-home-team-card-form .form-squares {
  display: flex;
  gap: 6px;
}

.logged-home-team-card-form .form-square {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  border-radius: 4px;
}
.logged-home-team-card-form .form-square--w {
  background: #dcfce7;
  color: #16a34a;
}
.logged-home-team-card-form .form-square--l {
  background: #fee2e2;
  color: #dc2626;
}.logged-home-my-teams {
  max-width: 1512px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}

.logged-home-my-teams-title {
  font-size: 32px;
  font-weight: 500;
  font-family: "Inter-500";
  line-height: 122%;
  letter-spacing: 0px;
  color: #151515;
  margin: 0;
}

.logged-home-my-teams-wrapper {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: stretch;
  min-width: 0;
}

.logged-home-my-teams-carousel {
  flex: 1;
  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 16px;
  padding-bottom: 12px;
  scroll-snap-type: x mandatory;
  min-width: 0;
  min-height: 290px;
  -webkit-overflow-scrolling: touch;
}
.logged-home-my-teams-carousel::-webkit-scrollbar {
  height: 6px !important;
  width: 6px !important;
  display: block !important;
}
.logged-home-my-teams-carousel::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 3px;
}
.logged-home-my-teams-carousel::-webkit-scrollbar-thumb {
  background: #d1d5db;
  border-radius: 3px;
}

.logged-home-my-teams-carousel-item {
  flex-shrink: 0;
  flex-grow: 0;
  scroll-snap-align: start;
  width: 320px;
  min-width: 320px;
  height: 290px;
  min-height: 290px;
  display: flex;
}

.logged-home-my-teams-create {
  flex-shrink: 0;
  width: 290px;
  min-width: 290px;
  height: 290px;
  max-height: 290px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.logged-home-my-teams-create--static {
  width: 290px;
}

.logged-home-create-team-card {
  width: 100%;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  border: 2px dashed #d1d5db;
  border-radius: 28px;
  padding: 29px;
  display: flex;
  gap: 16px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: #fafafa;
  box-sizing: border-box;
}

.logged-home-create-team-card-icon {
  padding: 17px;
  border-radius: 12px;
  color: #201e52;
  background: rgba(87, 83, 192, 0.0509803922);
  display: flex;
  align-items: center;
  justify-content: center;
}

.logged-home-create-team-card-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
}

.logged-home-create-team-card-title {
  font-size: 20px;
  font-weight: 600;
  font-family: "Inter-600";
  line-height: 120%;
  letter-spacing: 0px;
  color: #3b3b3b;
  margin: 0;
}

.logged-home-create-team-card-subtitle {
  font-size: 15px;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  line-height: 120%;
  letter-spacing: 0px;
  margin: 0;
}

.logged-home-create-team-card-btn {
  padding: 9px 10px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: rgba(255, 255, 255, 0.8980392157);
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
.logged-home-create-team-card-btn:hover {
  opacity: 0.95;
}.logged-home-page {
  min-height: 100vh;
  background: #f5f5f5;
}

.logged-home-content {
  display: flex;
  flex-direction: column;
  gap: 38px;
  max-width: 1512px;
  margin: 0 auto;
  padding: 90px 24px 48px;
}
@media (max-width: 768px) {
  .logged-home-content {
    padding: 0 16px 32px;
  }
}.about-page {
  width: 100%;
  min-height: calc(100vh - 140px);
  background-image: url("/assets/about_bg-DZKquC98.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #f4f4f6;
  padding: 0px 0 120px;
  box-sizing: border-box;
  margin: 0 auto;
}

.about-page-content {
  width: 100%;
  max-width: 1600px;
  min-height: calc(100vh - 340px);
  margin: auto;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 74px;
}

.about-hero-section {
  width: 100%;
  text-align: center;
  padding-top: 8px;
}

.about-badge {
  display: inline-block;
  padding: 8.5px 25px;
  border-radius: 18px;
  background: #000000;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 16px;
  line-height: 100%;
  margin-bottom: 18px;
}

.about-title {
  text-align: center;
  margin: 0;
  color: #1f2430;
  font-family: "Inter-700";
  font-size: 66.32px;
  line-height: 72px;
  letter-spacing: -2.49px;
}
.about-title em {
  font-style: normal;
  background: linear-gradient(90deg, #5753C0 0%, #FF5F5F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.about-description {
  margin: 18px auto 60px;
  max-width: 980px;
  color: #000000;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 100%;
  text-align: center;
}

.about-collage {
  width: 100%;
  max-width: 610px;
  margin: 0 auto;
}
.about-collage img {
  width: 100%;
  height: auto;
  display: block;
}

.about-values-section {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
}

.about-values-title {
  margin: 0;
  text-align: center;
  color: #1f2430;
  font-family: "Inter-700";
  font-size: 64px;
  line-height: 72px;
  letter-spacing: -2.49px;
}
.about-values-title em {
  font-style: normal;
  background: linear-gradient(90deg, #5753C0 0%, #FF5F5F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.about-values-description {
  margin: 18px auto 34px;
  max-width: 940px;
  color: #000000;
  text-align: center;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 150%;
  letter-spacing: -2%;
}

.about-values-timeline {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 77px;
}

.timeline-rail {
  margin-top: 8px;
  position: relative;
  width: 26px;
  min-height: 266px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.timeline-rail::before {
  content: "";
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
  background: #201E52;
}

.timeline-dot {
  position: relative;
  z-index: 1;
  width: 20px;
  height: 20px;
  transform: rotate(45deg);
  border-radius: 2px;
  background: #201E52;
}

.timeline-content {
  width: 100%;
  max-width: 700px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.timeline-item h3 {
  margin: 0 0 10px;
  color: #222222;
  font-family: "Inter-700";
  font-size: 24px;
  line-height: 120%;
}
.timeline-item p {
  margin: 0;
  color: #222222;
  font-family: "Inter-500";
  font-size: 20px;
  line-height: 140%;
}

.about-vision-section {
  width: calc(100% + 62px);
  margin: 0 0 0 -62px;
}

.vision-split-panel {
  width: 100%;
  min-height: 420px;
  overflow: hidden;
  position: relative;
}

.vision-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  max-width: 50%;
  height: 100%;
  padding: 116px 36px 145px 106px;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.831372549);
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 1;
}
.vision-content h2 {
  margin: 0 0 10px;
  color: #222222;
  font-style: bold;
  font-family: "Inter-700";
  font-size: 40px;
  line-height: 50px;
  letter-spacing: -2.49px;
}
.vision-content p {
  margin: 0;
  color: #242936;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 100%;
  color: #222222;
}

.vision-badge {
  display: inline-block;
  width: fit-content;
  align-self: flex-start;
  margin-bottom: 14px;
  padding: 7px 25px;
  border-radius: 18px;
  background: #000000;
  color: #ffffff;
  font-style: semibold;
  font-family: "Inter-600";
  font-size: 18px;
  line-height: 100%;
}

.vision-image-wrap {
  height: 100%;
  min-height: 420px;
  position: relative;
}
.vision-image-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.innovation-block {
  width: 100%;
  padding: 38px 0 0;
}

.innovation-heading-box {
  width: min(944px, 100%);
  margin: 0 auto;
  text-align: center;
  padding: 8px 16px 9px;
}
.innovation-heading-box h3 {
  margin: 0 0 12px;
  color: #1f2430;
  font-family: "Inter-700";
  font-size: 64px;
  line-height: 72px;
  letter-spacing: -2.49px;
}
.innovation-heading-box em {
  font-style: normal;
  background: linear-gradient(90deg, #5753C0 0%, #FF5F5F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.innovation-heading-box p {
  margin: 0;
  color: #000000;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 122%;
  text-align: center;
}

.innovation-player-wrap {
  width: 100%;
  text-align: center;
  margin-top: 8px;
}
.innovation-player-wrap img {
  width: 432px;
  height: 577px;
  display: inline-block;
  object-fit: contain;
}

.about-get-in-game-section {
  width: 100%;
  max-width: 940px;
  margin: 0 auto;
  text-align: center;
}

.get-in-game-title {
  margin: 0;
  color: #000000;
  font-family: "Inter-700";
  font-size: 64px;
  line-height: 72px;
  letter-spacing: -2.49px;
}
.get-in-game-title em {
  font-style: normal;
  background: linear-gradient(90deg, #5753C0 0%, #FF5F5F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.get-in-game-description {
  margin: 14px auto 36px;
  max-width: 760px;
  color: #000000;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 100%;
  text-align: center;
}

.get-in-game-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px;
  margin-bottom: 44px;
}

.get-in-game-highlight-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.get-in-game-highlight-item img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  margin-bottom: 8px;
}
.get-in-game-highlight-item h3 {
  margin: 0 0 4px;
  color: #222222;
  font-family: "Inter-700";
  font-size: 21.57px;
  line-height: 20.7px;
}
.get-in-game-highlight-item p {
  margin: 0;
  color: #222222;
  font-family: "Inter-500";
  font-size: 16px;
  line-height: 18px;
  max-width: 234px;
}

.get-in-game-closing-title {
  margin: 80px 0 14px;
  color: #222222;
  font-family: "Inter-700";
  font-size: 64px;
  line-height: 72px;
  letter-spacing: -1.8px;
}
.get-in-game-closing-title em {
  font-style: normal;
  background: linear-gradient(90deg, #5753C0 0%, #FF5F5F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.get-in-game-closing-description {
  margin: 0 auto;
  max-width: 900px;
  color: #1f2430;
  font-family: "Inter-500";
  font-size: 18px;
  line-height: 1.28;
}

.about-community-cta-section {
  width: 100%;
  padding-bottom: 8px;
  display: flex;
  justify-content: center;
}

.community-cta-card {
  display: flex;
  gap: 24px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: min(1260px, 100%);
  margin: 0 auto;
  padding: 84px 44px 84px;
  box-sizing: border-box;
  border-radius: 20px;
  text-align: center;
  background: linear-gradient(135deg, #5753c0 0%, #ff5f5f 100%);
}
.community-cta-card h2 {
  margin: 0;
  color: #ffffff;
  font-family: "Inter-300";
  font-weight: 300;
  font-size: 59px;
  line-height: 60.8px;
  letter-spacing: -0.64px;
}
.community-cta-card p {
  margin: 0 auto;
  max-width: 720px;
  color: #ffffff;
  font-family: "Inter-400";
  font-size: 20px;
  line-height: 27px;
  letter-spacing: -0.2px;
}
.community-cta-card button {
  border: 0;
  border-radius: 14px;
  background: #000000;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 16px;
  line-height: 100%;
  letter-spacing: -0.17px;
  padding: 12px 18px;
  cursor: pointer;
}

@media (max-width: 992px) {
  .about-title {
    font-size: 52px;
  }
  .about-values-title {
    font-size: 48px;
  }
  .timeline-item h3 {
    font-size: 34px;
  }
  .timeline-item p {
    font-size: 28px;
  }
  .vision-content h2 {
    font-size: 40px;
  }
  .innovation-heading-box h3 {
    font-size: 44px;
  }
  .get-in-game-title,
  .get-in-game-closing-title {
    font-size: 46px;
  }
  .get-in-game-highlight-item h3 {
    font-size: 26px;
  }
  .get-in-game-highlight-item p {
    font-size: 15px;
  }
  .community-cta-card h2 {
    font-size: 48px;
  }
  .community-cta-card p {
    font-size: 22px;
    max-width: 660px;
  }
}
@media (max-width: 768px) {
  .about-page {
    padding-top: 96px;
  }
  .about-title {
    font-size: 38px;
  }
  .about-description {
    margin-top: 14px;
    margin-bottom: 24px;
    font-size: 14px;
  }
  .about-page-content {
    gap: 52px;
  }
  .about-collage {
    max-width: 100%;
  }
  .about-values-title {
    font-size: 34px;
  }
  .about-values-description {
    margin-top: 12px;
    margin-bottom: 22px;
    font-size: 14px;
  }
  .about-values-timeline {
    gap: 16px;
  }
  .timeline-rail {
    min-height: 244px;
  }
  .timeline-item h3 {
    font-size: 24px;
  }
  .timeline-item p {
    font-size: 17px;
    line-height: 1.5;
  }
  .vision-split-panel {
    min-height: 320px;
  }
  .vision-content {
    width: 50%;
    padding: 24px 20px;
  }
  .vision-content h2 {
    font-size: 34px;
  }
  .vision-image-wrap {
    min-height: 320px;
  }
  .about-get-in-game-section {
    max-width: 100%;
  }
  .get-in-game-title,
  .get-in-game-closing-title {
    font-size: 36px;
    letter-spacing: -1px;
  }
  .get-in-game-description,
  .get-in-game-closing-description {
    font-size: 15px;
  }
  .get-in-game-highlights {
    gap: 20px;
    margin-bottom: 32px;
  }
  .get-in-game-highlight-item h3 {
    font-size: 21px;
  }
  .get-in-game-highlight-item p {
    font-size: 14px;
    max-width: 190px;
  }
  .community-cta-card {
    border-radius: 16px;
    padding: 36px 18px 28px;
  }
  .community-cta-card h2 {
    font-size: 34px;
  }
  .community-cta-card p {
    font-size: 16px;
    margin-bottom: 18px;
    max-width: 560px;
  }
  .community-cta-card button {
    font-size: 14px;
    padding: 9px 16px;
  }
}
@media (max-width: 640px) {
  .vision-split-panel {
    min-height: 240px;
  }
  .vision-content {
    width: 50%;
    padding: 16px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(255, 255, 255, 0.75) 64%, rgba(255, 255, 255, 0.15) 100%);
  }
  .vision-content h2 {
    font-size: 28px;
    margin-bottom: 8px;
  }
  .vision-content p {
    font-size: 13px;
    line-height: 1.3;
  }
  .vision-image-wrap {
    min-height: 240px;
  }
  .innovation-block {
    padding-top: 28px;
  }
  .innovation-heading-box {
    border-width: 3px;
    padding: 8px 10px;
  }
  .innovation-heading-box h3 {
    font-size: 32px;
  }
  .get-in-game-title,
  .get-in-game-closing-title {
    font-size: 30px;
    line-height: 1.15;
  }
  .get-in-game-description,
  .get-in-game-closing-description {
    font-size: 14px;
    line-height: 1.35;
  }
  .get-in-game-highlights {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .get-in-game-highlight-item p {
    max-width: 100%;
  }
  .community-cta-card {
    border-radius: 12px;
    padding: 26px 14px 22px;
  }
  .community-cta-card h2 {
    font-size: 28px;
    line-height: 1.15;
  }
  .community-cta-card p {
    font-size: 14px;
    line-height: 1.35;
    margin-bottom: 14px;
  }
}.ai-highlights-page {
  min-height: calc(100vh - 180px);
  padding: 32px 0 100px;
  background-image: url("/assets/about_bg-DZKquC98.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #f4f4f6;
  border-bottom: 1px solid #e6e6ef;
}

.ai-highlights-hero {
  max-width: 942px;
  margin: 120px auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 34px;
}

.ai-highlights-hero-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.ai-highlights-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 10px 10px;
  border-radius: 88px;
  background: #000000;
  color: #ffffff;
  font-size: 12px;
  line-height: 100%;
  letter-spacing: 0%;
  font-family: "Inter-500";
}

.ai-highlights-title {
  margin: 0;
  color: #222222;
  font-size: 66.32px;
  line-height: 72px;
  text-align: center;
  letter-spacing: -2.49px;
  font-family: "Inter-700";
}
.ai-highlights-title .light {
  font-family: "Inter-400";
  font-weight: 400;
  font-size: 66.32px;
  line-height: 72px;
  letter-spacing: -2.49px;
  color: #222222;
}

.upload-dropzone {
  width: 397px;
  min-width: 397px;
  max-width: 397px;
  margin: 0 auto;
  height: 150px;
  min-height: 150px;
  max-height: 150px;
  border-radius: 18px;
  border: 1.6px dashed #a995ff;
  background: #FFFFFF;
  box-sizing: border-box;
  flex: 0 0 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 17px;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}
.upload-dropzone svg {
  color: #713DFF;
  font-size: 16px;
}
.upload-dropzone p {
  margin: 0;
  font-size: 16px;
  color: #404142;
  font-family: "Inter-500";
  line-height: 100%;
}
.upload-dropzone input {
  display: none;
}
.upload-dropzone.dragging {
  border-color: #6f55f8;
  background: #f3f1ff;
  transform: translateY(-1px);
}

.upload-dropzone-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.upload-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.upload-support-text,
.upload-size-text {
  margin: 0;
  color: #3E3E3F;
  font-size: 14px;
  font-family: "Inter-600";
  line-height: 100%;
}

.upload-support-text-highlight {
  color: #5753C0;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: 100%;
}

.upload-size-text {
  margin-top: 2px;
}

.upload-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #201E52;
  border-radius: 24px;
  color: #ffffff;
  font-family: "Inter-400";
  font-size: 14px;
  line-height: 100%;
  padding: 11px 18px;
  cursor: pointer;
}
.upload-btn:hover {
  background: #2a2767;
  border-color: #2a2767;
}

.upload-error {
  color: #D8252D;
  font-size: 16px;
  font-family: "Inter-500";
  line-height: 100%;
  text-align: center;
}

.ai-reasons-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 40px;
  max-width: 1240px;
  margin: 60px auto;
  position: relative;
}

.ai-reasons-socials {
  position: absolute;
  left: 50px;
  top: 62px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ai-reasons-socials span {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 3px;
  font-size: 9px;
}

.ai-reasons-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.ai-reasons-cards {
  margin: 0px auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.ai-reason-card {
  display: flex;
  flex-direction: column;
  align-items: left;
  justify-content: center;
  gap: 28px;
  min-height: 246px;
  padding: 32px 36px;
  color: #FFFFFF;
  background: linear-gradient(45deg, #7571CB 0%, #201E52 100%);
  border-radius: 33px;
  clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 40px, 100% 100%, 0 100%);
}
.ai-reason-card h3 {
  margin: 0;
  font-family: "Inter-700";
  font-size: 24px;
  line-height: 120%;
  letter-spacing: 0%;
}
.ai-reason-card p {
  margin: 0;
  font-family: "Inter-500";
  font-size: 20px;
  line-height: 140%;
  color: rgb(255, 255, 255);
}

.ai-reason-icon {
  width: 52px;
  height: 52px;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #5753C0;
  color: #FFFFFF;
  font-size: 24px;
}

.ai-section-divider {
  width: 86%;
  height: 1px;
  margin: 46px auto 0;
  background: linear-gradient(90deg, #ffffff 0%, #000000 50%, #ffffff 100%);
}

.ai-process-section {
  max-width: 1240px;
  margin: 0px auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}

.ai-process-title {
  margin: 0;
  color: #222222;
  font-family: "Inter-700";
  font-size: 40px;
  line-height: 120%;
  text-align: center;
}
.ai-process-title .gradient-text {
  line-height: 23.91px;
  letter-spacing: -0.42px;
  background: linear-gradient(90deg, #7571CB 0%, #FF5F5F 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.ai-process-panel {
  width: 100%;
  min-height: 292px;
  border-radius: 20px;
  background: radial-gradient(25% 50% at 60% 50%, #4b47a8 0%, #302d7a 38%, #201e52 72%, #1b1947 100%);
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
  gap: 30px;
  padding: 20px 40px;
  box-sizing: border-box;
}

.ai-process-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ai-process-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #FFFFFF;
  font-family: "Inter-400";
  font-size: 20px;
  line-height: 140%;
  letter-spacing: 0%;
}
.ai-process-list li svg {
  flex-shrink: 0;
  font-size: 28px;
  color: #FFFFFF;
}

.ai-process-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 210px;
}
.ai-process-visual img {
  transform: translateY(30px);
  width: min(100%, 520px);
  height: auto;
  object-fit: contain;
  display: block;
}

@media (max-width: 640px) {
  .ai-highlights-page {
    min-height: auto;
    padding: 24px 12px 36px;
  }
  .ai-highlights-title {
    margin: 16px 0 22px;
    font-size: clamp(26px, 8.2vw, 34px);
  }
  .upload-dropzone {
    width: 100%;
    min-width: 0;
    max-width: 397px;
  }
  .ai-reasons-section {
    padding: 28px 12px 20px;
  }
  .ai-reasons-socials {
    display: none;
  }
  .ai-reasons-title {
    font-size: 30px;
    line-height: 36px;
    letter-spacing: -0.3px;
  }
  .ai-reasons-cards {
    grid-template-columns: 1fr;
  }
  .ai-reason-card {
    min-height: auto;
    padding: 18px 16px;
  }
  .ai-reason-card h3 {
    margin: 16px 0 8px;
    font-size: 24px;
    line-height: 28px;
  }
  .ai-reason-card p {
    font-size: 16px;
    line-height: 23px;
  }
  .ai-process-title {
    font-size: 34px;
    line-height: 40px;
    letter-spacing: -0.6px;
  }
  .ai-process-panel {
    grid-template-columns: 1fr;
    padding: 20px 16px;
    gap: 20px;
  }
  .ai-process-list {
    gap: 12px;
  }
  .ai-process-list li {
    font-size: 16px;
    line-height: 22px;
  }
  .ai-process-list li svg {
    font-size: 16px;
  }
  .ai-process-visual {
    min-height: 150px;
  }
  .ai-process-visual img {
    width: min(100%, 320px);
  }
}.scoring-page {
  min-height: calc(100vh - 180px);
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

.scoring-hero {
  position: relative;
  background-image: url("/assets/HeroSection-B00rJ87G.png");
  background-size: cover;
  background-position: right bottom;
  background-repeat: no-repeat;
  background-color: #e8ecf1;
  padding: 85px 0 96px;
}
.scoring-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(180, 200, 220, 0.15) 1px, transparent 1px), linear-gradient(90deg, rgba(180, 200, 220, 0.15) 1px, transparent 1px);
  background-size: 24px 24px;
  pointer-events: none;
}

.scoring-hero-content {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 62px;
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 24px;
}

.scoring-hero-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  max-width: 580px;
}

.scoring-hero-title {
  margin: 0;
  font-size: 60px;
  line-height: 100%;
  font-family: "Inter-700";
  font-weight: 700;
  color: #0F172A;
  text-align: center;
  letter-spacing: -0.02em;
}

.scoring-hero-accent {
  color: #713DFF;
}

.scoring-hero-description {
  text-align: center;
  margin: 0;
  font-size: 20px;
  line-height: 100%;
  font-family: "Inter-400";
  color: #475569;
}

.scoring-pro-features {
  background: #ffffff;
  padding: 0px;
}

.scoring-pro-features-inner {
  margin: 0 auto;
  padding: 0 62px;
}

.scoring-pro-features-header {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 62px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

.scoring-pro-features-badge {
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  font-family: "Inter-700";
  color: #742AFE;
  text-transform: uppercase;
  letter-spacing: 1.2px;
}

.scoring-pro-features-title {
  max-width: 340px;
  margin: 0;
  font-size: 32px;
  line-height: 48px;
  font-family: "Inter-700";
  font-weight: 700;
  color: #0F172A;
  letter-spacing: 0%;
  text-align: center;
}

.scoring-pro-features-description {
  max-width: 535px;
  margin: 0;
  font-size: 16px;
  line-height: 100%;
  font-family: "Inter-400";
  color: #64748B;
}

.scoring-pro-features-grid {
  max-width: 1440px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 48px;
  justify-content: center;
}

.scoring-feature-card {
  flex: 1 1;
  min-width: 280px;
  max-width: 384px;
  background: #ffffff;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  padding: 33px 33px 59px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.scoring-feature-card-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.scoring-feature-card-icon {
  width: 26px;
  height: 27px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #713DFF;
  font-size: 24px;
}

.scoring-feature-card-title {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  font-family: "Inter-700";
  color: #0F172A;
  line-height: 28px;
}

.scoring-feature-card-description {
  margin: 0;
  font-size: 16px;
  line-height: 26px;
  font-family: "Inter-500";
  color: #475569;
  max-width: 280px;
}

.scoring-cta {
  padding: 0 62px 100px;
}

.scoring-cta-inner {
  max-width: 1600px;
  margin: 0 auto;
  background-color: #102216;
  border-radius: 24px;
  padding: 80px 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 32px;
  text-align: center;
}

.scoring-cta-title {
  margin: 0;
  font-size: 48px;
  line-height: 48px;
  font-family: "Inter-700";
  font-weight: 700;
  color: #ffffff;
  letter-spacing: -0.02em;
  max-width: 700px;
}

.scoring-cta-description {
  margin: 0;
  font-size: 18px;
  line-height: 28px;
  font-family: "Inter-400";
  color: #ffffff;
}

.scoring-cta-button {
  margin-top: 16px;
  padding: 17px 32px;
  background-color: #742AFE;
  color: #ffffff;
  font-size: 16px;
  max-width: 784px;
  width: 100%;
  line-height: 24px;
  font-weight: 600;
  font-family: "Inter-600";
  text-transform: uppercase;
  letter-spacing: 0px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.scoring-cta-button:hover {
  background-color: #5f2ee0;
}

@media (max-width: 1024px) {
  .scoring-cta {
    padding: 0 40px 80px;
  }
  .scoring-cta-inner {
    padding: 48px 32px;
    gap: 16px;
  }
  .scoring-cta-title {
    font-size: 32px;
  }
  .scoring-hero-content {
    padding: 0 40px;
  }
  .scoring-hero-title {
    font-size: 40px;
  }
  .scoring-pro-features-inner {
    padding: 0 40px;
  }
  .scoring-pro-features-header {
    padding: 0;
  }
  .scoring-pro-features-title {
    font-size: 34px;
  }
  .scoring-feature-card {
    flex: 1 1 calc(50% - 12px);
    min-width: 260px;
  }
}
@media (max-width: 768px) {
  .scoring-pro-features-grid {
    flex-direction: column;
    align-items: stretch;
    margin-top: 36px;
  }
  .scoring-feature-card {
    flex: 1 1 100%;
    min-width: 0;
    max-width: none;
  }
  .scoring-pro-features-inner {
    padding: 0 20px;
  }
  .scoring-hero {
    min-height: 440px;
    padding: 60px 0 80px;
    background-position: 75% bottom;
  }
  .scoring-hero-content {
    padding: 0 20px;
    min-height: 280px;
  }
  .scoring-hero-title {
    font-size: 32px;
    margin-bottom: 16px;
  }
  .scoring-hero-description {
    font-size: 15px;
  }
  .scoring-pro-features {
    padding: 60px 0 80px;
  }
  .scoring-pro-features-header {
    padding: 0 20px;
    gap: 12px;
  }
  .scoring-pro-features-title {
    font-size: 28px;
  }
  .scoring-pro-features-description {
    font-size: 15px;
  }
  .scoring-cta {
    padding: 0 20px 60px;
  }
  .scoring-cta-inner {
    padding: 40px 24px;
    gap: 12px;
  }
  .scoring-cta-title {
    font-size: 26px;
  }
  .scoring-cta-description {
    font-size: 15px;
  }
  .scoring-cta-button {
    padding: 14px 24px;
    font-size: 12px;
  }
}
@media (max-width: 480px) {
  .scoring-hero-title {
    font-size: 26px;
  }
  .scoring-pro-features-title {
    font-size: 24px;
  }
  .scoring-cta-title {
    font-size: 22px;
  }
}.streamer-dashboard {
  background: #fafafa;
  min-height: 100vh;
  padding: 80px 24px 24px 48px;
}

.sd-filter-bar {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.15);
  padding: 22px 34px;
  margin-bottom: 24px;
}

.sd-filter-bar__options {
  display: flex;
  align-items: center;
  gap: 16px;
}
.sd-filter-bar__options > .sd-dropdown {
  flex: 1;
  min-width: 0;
}

.sd-dropdown {
  position: relative;
}

.sd-dropdown__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 11px;
  padding: 10px 12px;
  width: 100%;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  transition: border-color 0.2s;
}
.sd-dropdown__trigger svg {
  flex-shrink: 0;
  font-size: 20px;
  color: #4C4C4D;
}
.sd-dropdown__trigger:hover:not(.sd-dropdown__trigger--disabled) {
  border-color: #201E52;
}
.sd-dropdown__trigger--disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.sd-dropdown__placeholder {
  color: rgba(76, 76, 77, 0.6);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sd-dropdown__value {
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sd-dropdown__menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 1000;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.2);
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  width: 100%;
  min-width: 220px;
  overflow: hidden;
}

.sd-dropdown__search-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.12);
}

.sd-dropdown__search-icon {
  font-size: 18px;
  color: #71717A;
  flex-shrink: 0;
}

.sd-dropdown__search-input {
  flex: 1;
  border: none;
  outline: none;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  background: transparent;
}
.sd-dropdown__search-input::placeholder {
  color: rgba(76, 76, 77, 0.5);
}

.sd-dropdown__list {
  max-height: 220px;
  overflow-y: auto;
}

.sd-dropdown__hint {
  padding: 12px 14px;
  font-family: "Inter-400";
  font-size: 13px;
  color: #71717A;
  text-align: center;
}

.sd-dropdown__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 14px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  text-align: left;
  transition: background 0.15s;
}
.sd-dropdown__item:hover {
  background: #F0F0FF;
}

.sd-dropdown__item--match {
  align-items: flex-start;
  gap: 8px;
}

.sd-dropdown__match-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.sd-dropdown__match-teams {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sd-dropdown__match-date {
  font-family: "Inter-400";
  font-size: 12px;
  color: #71717A;
}

.sd-dropdown__item-badge {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 4px;
  background: #F0F0F0;
  color: #71717A;
  white-space: nowrap;
  flex-shrink: 0;
}

.sd-direct-input {
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 11px;
  padding: 5px 5px 5px 12px;
  flex: 1;
  min-width: 300px;
  max-width: 493px;
  height: 46px;
}

.sd-direct-input__field {
  flex: 1;
  border: none;
  outline: none;
  font-family: "Inter-400";
  font-size: 16px;
  font-style: italic;
  color: rgba(76, 76, 77, 0.6);
  background: transparent;
  min-width: 0;
}
.sd-direct-input__field::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.sd-direct-input__field:not(:placeholder-shown) {
  font-style: normal;
  color: #000000;
}

.sd-direct-input__btn {
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 0 16px;
  height: 36px;
  font-family: "Inter-500";
  font-size: 16px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
  text-transform: capitalize;
}
.sd-direct-input__btn:hover {
  background: #2C2970;
}

.sd-content {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.sd-panel {
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 0 15.7px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}
.sd-panel--left {
  flex: 1;
  min-width: 0;
}
.sd-panel--right {
  width: 38%;
  flex-shrink: 0;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: sticky;
  top: 90px;
  align-self: flex-start;
}

.sd-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  background: linear-gradient(179.99deg, #2c2970 0%, #201e52 99.94%);
  height: 74px;
}

.sd-section-header__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #ffffff;
  text-transform: capitalize;
}

.sd-theme-selector {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 0 10px;
  height: 33px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  cursor: pointer;
}
.sd-theme-selector svg {
  font-size: 18px;
}

.sd-dropdown--theme .sd-dropdown__menu {
  left: auto;
  right: 0;
  width: auto;
  min-width: 200px;
}

.sd-ticker-preview {
  background: #1a1a1a;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  padding: 0 14px;
}

.sd-ticker-preview__placeholder {
  font-family: "Inter-400";
  font-size: 12px;
  color: rgba(255, 255, 255, 0.4);
  font-style: italic;
}

.sd-overlays-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  background: linear-gradient(179.99deg, #2c2970 0%, #201e52 99.94%);
}

.sd-overlays-header__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #ffffff;
  text-transform: capitalize;
}

.sd-overlays-body {
  padding: 14px 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.sd-overlay-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sd-overlay-group__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #000000;
  text-transform: capitalize;
  margin: 0;
}

.sd-overlay-group__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 8px;
}

.sd-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 12px;
  border: 1px solid #201E52;
  border-radius: 4px;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 16px;
  color: #201E52;
  text-transform: uppercase;
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
.sd-chip:hover {
  background: #201E52;
  color: #ffffff;
}

.sd-divider {
  width: 100%;
  height: 1px;
  background: rgba(76, 76, 77, 0.15);
  margin: 4px 0;
}

.sd-panel__title {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  text-transform: capitalize;
  margin: 0;
}

.sd-preview-area {
  background: #000000;
  border-radius: 10px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.sd-preview-area:not(:has(.sd-preview-area__iframe-wrapper)) {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 16/9;
}

.sd-preview-area__iframe-wrapper {
  width: 100%;
  aspect-ratio: 16/9;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.sd-preview-area__iframe-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
}

.sd-preview-area__label {
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
  text-transform: capitalize;
}

.sd-preview-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.sd-preview-actions__btns {
  display: flex;
  gap: 12px;
}

.sd-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 14px;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  transition: opacity 0.2s;
}
.sd-btn:hover {
  opacity: 0.85;
}
.sd-btn--preview {
  background: #a4a3a9;
}
.sd-btn--live {
  background: #a4a3a9;
}
.sd-btn--clear {
  background: #c0392b;
}
.sd-btn--clear:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.sd-btn--copy {
  background: #2980b9;
}
.sd-btn--copy:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.sd-btn--active {
  background: #201E52;
}

.sd-preview-actions__theme {
  font-size: 14px;
  color: #000000;
  margin: 0;
}
.sd-preview-actions__theme strong {
  font-family: "Inter-600";
  color: #383838;
}
.sd-preview-actions__theme span {
  color: #767474;
}

.sd-youtube-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sd-youtube-row__input {
  flex: 1;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 4px;
  padding: 10px 12px;
  font-family: "Inter-500";
  font-size: 16px;
  color: rgba(76, 76, 77, 0.6);
  outline: none;
  min-width: 0;
  background: #ffffff;
}
.sd-youtube-row__input::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.sd-youtube-row__input:focus {
  border-color: #201E52;
}

.sd-youtube-row__btn {
  background: linear-gradient(179.96deg, #2c2970 0%, #201e52 99.94%);
  color: #ffffff;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  height: 39px;
  font-family: "Inter-500";
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.sd-youtube-row__btn:hover {
  opacity: 0.85;
}

.sd-chip--disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

.sd-dialog-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1100;
}

.sd-dialog {
  background: #ffffff;
  border-radius: 12px;
  padding: 24px;
  min-width: 340px;
  max-width: 480px;
  width: 90%;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.sd-dialog__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #000000;
  margin: 0;
}

.sd-dialog__tabs {
  display: flex;
  border-bottom: 1px solid rgba(76, 76, 77, 0.15);
}

.sd-dialog__tab {
  flex: 1;
  padding: 8px 12px;
  border: none;
  background: transparent;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  color: #71717A;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}
.sd-dialog__tab--active {
  color: #201E52;
  border-bottom-color: #201E52;
}

.sd-dialog__list {
  overflow-y: auto;
  flex: 1;
  max-height: 320px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sd-dialog__empty {
  text-align: center;
  color: rgba(76, 76, 77, 0.5);
  font-family: "Inter-400";
  font-size: 14px;
  padding: 16px 0;
}

.sd-dialog__list-item {
  display: block;
  width: 100%;
  padding: 10px 12px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  text-align: left;
  border-radius: 6px;
  transition: background 0.15s;
}
.sd-dialog__list-item:hover {
  background: #F0F0FF;
}

.sd-dialog__list-item-sub {
  font-size: 12px;
  color: #71717A;
  margin-top: 2px;
}

.sd-dialog__inning-options {
  display: flex;
  gap: 12px;
}

.sd-dialog__inning-card {
  flex: 1;
  border: 2px solid rgba(76, 76, 77, 0.2);
  border-radius: 10px;
  padding: 16px;
  cursor: pointer;
  background: transparent;
  text-align: center;
  transition: border-color 0.2s;
}
.sd-dialog__inning-card:hover:not(.sd-dialog__inning-card--current) {
  border-color: #201E52;
}
.sd-dialog__inning-card--current {
  border-color: #201E52;
  background: #201E52;
  color: #ffffff;
}

.sd-dialog__inning-label {
  display: block;
  font-family: "Inter-600";
  font-size: 14px;
}

.sd-dialog__inning-team {
  display: block;
  font-family: "Inter-400";
  font-size: 12px;
  margin-top: 4px;
  opacity: 0.8;
}

.sd-dialog__textarea {
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  padding: 10px 12px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  outline: none;
  resize: vertical;
  min-height: 80px;
  background: #ffffff;
}
.sd-dialog__textarea:focus {
  border-color: #201E52;
}
.sd-dialog__textarea::placeholder {
  color: rgba(76, 76, 77, 0.5);
}

.sd-dialog__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.sd-dialog__btn-cancel {
  border: 1px solid rgba(76, 76, 77, 0.25);
  background: transparent;
  border-radius: 6px;
  padding: 8px 16px;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  color: #000000;
  transition: background 0.15s;
}
.sd-dialog__btn-cancel:hover {
  background: #F0F0F0;
}

.sd-dialog--wide {
  max-width: 560px;
}

.sd-dialog__pt-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 6px;
}
.sd-dialog__pt-row:hover {
  background: #F0F0FF;
}

.sd-dialog__pt-rank {
  font-family: "Inter-600";
  font-size: 14px;
  color: #71717A;
  width: 20px;
  flex-shrink: 0;
}

.sd-dialog__pt-team {
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
}

.sd-dialog__btn-confirm {
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: background 0.2s;
}
.sd-dialog__btn-confirm:hover {
  background: #2C2970;
}

@media (max-width: 992px) {
  .sd-content {
    flex-direction: column;
  }
  .sd-panel--right {
    width: 100%;
  }
  .sd-filter-bar__options {
    flex-wrap: wrap;
  }
  .sd-filter-bar__options > .sd-dropdown {
    flex-basis: 100%;
  }
  .sd-panel--right {
    position: static;
  }
  .sd-direct-input {
    max-width: 100%;
    width: 100%;
  }
}
.streamer-dashboard--unauthorized {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 24px;
  background: radial-gradient(circle at 20% 0%, rgba(87, 83, 192, 0.08), transparent 55%), radial-gradient(circle at 80% 100%, rgba(32, 30, 82, 0.08), transparent 55%), #fafafa;
}

.sd-unauthorized {
  width: 100%;
  max-width: 520px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.12);
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(32, 30, 82, 0.08);
  padding: 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.sd-unauthorized__logo {
  width: 120px;
  height: auto;
  object-fit: contain;
  margin-bottom: 24px;
}

.sd-unauthorized__divider {
  width: 56px;
  height: 3px;
  background: #201E52;
  border-radius: 2px;
  margin-bottom: 24px;
}

.sd-unauthorized__title {
  font-family: "Inter-700";
  font-size: 28px;
  color: #201E52;
  margin: 0 0 12px;
  letter-spacing: 0.2px;
}

.sd-unauthorized__message {
  font-family: "Inter-500";
  font-size: 16px;
  color: #18181B;
  margin: 0 0 16px;
  line-height: 1.5;
}

.sd-unauthorized__hint {
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  margin: 0;
  line-height: 1.6;
  max-width: 420px;
}

@media (max-width: 640px) {
  .sd-unauthorized {
    padding: 36px 24px;
  }
  .sd-unauthorized__logo {
    width: 96px;
  }
  .sd-unauthorized__title {
    font-size: 24px;
  }
}.asset-setup {
  background: #fafafa;
  min-height: 100vh;
  padding: 80px 48px 48px;
  display: flex;
  flex-direction: column;
}
.asset-setup__header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}
.asset-setup__back-btn {
  display: flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 8px;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  transition: border-color 0.2s, background 0.2s;
}
.asset-setup__back-btn:hover {
  border-color: #201E52;
  background: #F0F0FF;
}
.asset-setup__title {
  font-family: "Inter-600";
  font-size: 24px;
  color: #000000;
  margin: 0;
}
.asset-setup__selection-info {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}
.asset-setup__info-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.12);
  border-radius: 12px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.06);
  padding: 16px 24px;
  min-width: 200px;
}
.asset-setup__info-label {
  font-family: "Inter-400";
  font-size: 12px;
  color: #71717A;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.asset-setup__info-value {
  font-family: "Inter-600";
  font-size: 18px;
  color: #000000;
}
.asset-setup__body {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  flex: 1;
  min-height: 0;
}
.asset-setup__section-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 22px;
  padding: 0 8px;
  border-radius: 100px;
  background: #E8E8FD;
  font-family: "Inter-600";
  font-size: 12px;
  color: #37348E;
  flex-shrink: 0;
}
.asset-setup__sidebar {
  width: 260px;
  flex-shrink: 0;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.12);
  border-radius: 16px;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: sticky;
  top: 80px;
  max-height: calc(100vh - 120px);
}
.asset-setup__sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.1);
  flex-shrink: 0;
}
.asset-setup__sidebar-title {
  font-family: "Inter-600";
  font-size: 14px;
  color: #000000;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.asset-setup__team-list {
  overflow-y: auto;
  flex: 1;
  padding: 8px;
}
.asset-setup__team-list::-webkit-scrollbar {
  width: 4px;
}
.asset-setup__team-list::-webkit-scrollbar-track {
  background: transparent;
}
.asset-setup__team-list::-webkit-scrollbar-thumb {
  background: rgba(76, 76, 77, 0.2);
  border-radius: 4px;
}
.asset-setup__sidebar-empty {
  font-family: "Inter-400";
  font-size: 13px;
  color: #71717A;
  text-align: center;
  padding: 24px 16px;
  margin: 0;
}
.asset-setup__team-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: none;
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
  text-align: left;
  transition: background 0.15s;
}
.asset-setup__team-item:hover {
  background: #F6F6F6;
}
.asset-setup__team-item--active {
  background: #EEEEFF;
}
.asset-setup__team-item--active .asset-setup__team-item-name {
  color: #37348E;
  font-family: "Inter-600";
}
.asset-setup__team-item--active .asset-setup__team-item-code {
  color: #5753C0;
}
.asset-setup__team-item--active:hover {
  background: #E8E8FD;
}
.asset-setup__team-item--skeleton {
  pointer-events: none;
}
.asset-setup__team-item--skeleton .asset-setup__team-item-avatar {
  background: linear-gradient(90deg, #ebebeb 25%, #f5f5f5 50%, #ebebeb 75%);
  background-size: 800px 100%;
  animation: as-shimmer 1.4s infinite linear;
  border-radius: 50%;
}
.asset-setup__team-item-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #F0F0F0;
}
.asset-setup__team-item-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.asset-setup__team-item-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.asset-setup__team-item-name {
  font-family: "Inter-500";
  font-size: 13px;
  color: #18181B;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.asset-setup__team-item-code {
  font-family: "Inter-400";
  font-size: 12px;
  color: #71717A;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.asset-setup__content {
  flex: 1;
  min-width: 0;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.12);
  border-radius: 16px;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}
.asset-setup__content-header {
  padding: 20px 24px 16px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.1);
}
.asset-setup__content-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.asset-setup__content-title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #000000;
  margin: 0;
}
.asset-setup__content-subtitle {
  display: inline-block;
  margin-top: 4px;
  font-family: "Inter-400";
  font-size: 12px;
  color: #71717A;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.asset-setup__table-wrap {
  overflow-x: auto;
}
.asset-setup__players-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter-500", "Inter", sans-serif;
}
.asset-setup__players-table thead th {
  padding: 12px 20px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #9CA3AF;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  background: #ffffff;
  white-space: nowrap;
}
.asset-setup__players-table tbody td {
  padding: 14px 20px;
  font-size: 14px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
}
.asset-setup__players-table tbody tr:last-child td {
  border-bottom: none;
}
.asset-setup__players-table tbody tr:hover {
  background: #F6F6F6;
}
.asset-setup__player-cell {
  display: flex;
  align-items: center;
  gap: 12px;
}
.asset-setup__player-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: #E8E8FD;
  position: relative;
}
.asset-setup__player-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.asset-setup__player-avatar-initials {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-600";
  font-size: 12px;
  color: #37348E;
  user-select: none;
}
.asset-setup__player-name {
  font-family: "Inter-600";
  font-size: 14px;
  color: #18181B;
}
.asset-setup__img-input {
  display: none;
}
.asset-setup__img-cell {
  display: flex;
  align-items: center;
  min-width: 160px;
}
.asset-setup__img-upload-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  min-width: 140px;
  padding: 10px 12px;
  background: #F6F6F6;
  border: 1.5px dashed rgba(87, 83, 192, 0.35);
  border-radius: 10px;
  cursor: pointer;
  color: #5753C0;
  font-family: "Inter-500";
  font-size: 13px;
  transition: background 0.15s, border-color 0.15s;
}
.asset-setup__img-upload-btn:hover {
  background: #EEEEFF;
  border-color: #5753C0;
}
.asset-setup__img-upload-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
.asset-setup__img-hint {
  font-family: "Inter-400";
  font-size: 10px;
  color: #71717A;
  text-align: center;
  line-height: 1.3;
}
.asset-setup__img-preview-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}
.asset-setup__img-thumbnail-btn {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  overflow: hidden;
  border: 1.5px solid rgba(76, 76, 77, 0.15);
  padding: 0;
  cursor: pointer;
  background: #F6F6F6;
  flex-shrink: 0;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.asset-setup__img-thumbnail-btn:hover {
  border-color: #5753C0;
  box-shadow: 0 0 0 2px rgba(87, 83, 192, 0.15);
}
.asset-setup__img-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.asset-setup__img-actions {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
}
.asset-setup__img-change-btn {
  font-family: "Inter-500";
  font-size: 12px;
  color: #5753C0;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.asset-setup__img-change-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.asset-setup__img-change-btn:hover:not(:disabled) {
  color: #37348E;
}
.asset-setup__img-status {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: "Inter-400";
  font-size: 12px;
}
.asset-setup__img-status--uploading {
  color: #71717A;
}
.asset-setup__img-status--success {
  color: #1AA915;
}
.asset-setup__img-status--error {
  color: #D71D0C;
}
@keyframes as-spin {
  to {
    transform: rotate(360deg);
  }
}
.asset-setup__spinner {
  display: inline-block;
  width: 11px;
  height: 11px;
  border: 2px solid rgba(76, 76, 77, 0.2);
  border-top-color: #71717A;
  border-radius: 50%;
  animation: as-spin 0.7s linear infinite;
  flex-shrink: 0;
}
.asset-setup__lightbox-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 24px;
}
.asset-setup__lightbox-content {
  position: relative;
  background: #ffffff;
  border-radius: 16px;
  padding: 20px;
  max-width: 560px;
  width: 100%;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.asset-setup__lightbox-close {
  position: absolute;
  top: 12px;
  right: 14px;
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: #71717A;
  line-height: 1;
  padding: 4px;
  border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}
.asset-setup__lightbox-close:hover {
  background: #F6F6F6;
  color: #000000;
}
.asset-setup__lightbox-label {
  font-family: "Inter-600";
  font-size: 14px;
  color: #18181B;
  margin: 0;
  padding-right: 32px;
}
.asset-setup__lightbox-img {
  width: 100%;
  max-height: 480px;
  object-fit: contain;
  border-radius: 10px;
  background: #F6F6F6;
}
.asset-setup__skeleton-img-cell {
  width: 140px;
  height: 44px;
  border-radius: 10px;
}
.asset-setup__table-empty {
  padding: 48px 24px;
  text-align: center;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
}
@keyframes as-shimmer {
  0% {
    background-position: -400px 0;
  }
  100% {
    background-position: 400px 0;
  }
}
.asset-setup .asset-setup__table-row--skeleton .asset-setup__player-avatar, .asset-setup__table-row--skeleton .asset-setup .asset-setup__player-avatar, .asset-setup .asset-setup__skeleton-block {
  background: linear-gradient(90deg, #ebebeb 25%, #f5f5f5 50%, #ebebeb 75%);
  background-size: 800px 100%;
  animation: as-shimmer 1.4s infinite linear;
  border-radius: 6px;
}
.asset-setup__skeleton-name {
  width: 100px;
  height: 13px;
}
.asset-setup__skeleton-code {
  width: 52px;
  height: 11px;
  margin-top: 3px;
}
.asset-setup__skeleton-value {
  width: 80px;
  height: 13px;
}
.asset-setup__table-row--skeleton td {
  padding: 14px 20px;
  border-bottom: 1px solid #e5e7eb;
}
.asset-setup__table-row--skeleton .asset-setup__player-avatar {
  border-radius: 50%;
}.my-leagues {
  width: 100%;
  min-height: calc(100vh - 120px);
  background-color: #f5f5f5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 48px;
}

.myleagues-container {
  top: 30px;
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 400px;
  width: 100%;
  background-color: #ffffff;
  border-radius: 9px;
  max-width: 1512px;
  margin: 54px auto;
  padding: 28px 38px;
  box-sizing: border-box;
}

.myleagues-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 21px;
}

.myleagues-header-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.myleagues-title {
  font-size: 28px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(0, 0, 0, 0.8980392157);
  line-height: 120%;
  letter-spacing: 0px;
  margin: 0;
}

.myleagues-subtitle {
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.6);
  line-height: 120%;
  letter-spacing: 1%;
  margin: 0;
}

.myleagues-create-btn {
  display: flex;
  align-items: center;
  gap: 13px;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  border: none;
  padding: 15px 11.5px;
  border-radius: 7px;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myleagues-create-btn img {
  width: 24px;
  height: 24px;
  filter: brightness(0) invert(1);
}
.myleagues-create-btn:hover {
  opacity: 0.9;
}

.myleagues-tabs {
  display: flex;
  gap: 12px;
}

.myleagues-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11.5px 21px;
  background: #f0f0f0;
  border: 1px solid rgba(44, 41, 112, 0.2);
  border-radius: 6px;
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.6);
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.myleagues-tab.active {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
}
.myleagues-tab:hover:not(.active) {
  background: #e5e5e5;
}
.myleagues-tab .myleagues-tab-icon {
  flex-shrink: 0;
}

.myleagues-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  min-height: 300px;
  width: 100%;
}
.myleagues-content.myleagues-content-empty {
  margin-top: 98.5px;
  justify-content: center;
  align-items: center;
}

.myleagues-empty-state {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 416px;
}

.myleagues-empty-illustration {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 784px;
}

.myleagues-empty-image {
  width: 100%;
  max-width: 784px;
  height: auto;
  object-fit: contain;
}

.myleagues-empty-message {
  font-size: 20px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.8980392157);
  margin: 8px 0 0 0;
  line-height: 120%;
}

.myleagues-empty-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #201e52;
  color: #ffffff;
  border: none;
  padding: 12px 24px;
  border-radius: 7px;
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myleagues-empty-cta:hover {
  opacity: 0.9;
}

.myleagues-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  font-size: 16px;
  color: rgba(76, 76, 77, 0.8980392157);
}

.myleagues-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 16px 0;
  margin-top: 24px;
}

.myleagues-pagination-info {
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: 0px;
  color: #6b7280;
  margin-right: 8px;
}

.myleagues-pagination-btn {
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.myleagues-pagination-btn:hover:not(:disabled) {
  background: #f9fafb;
  border-color: #9ca3af;
}
.myleagues-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.myleagues-pagination-pages {
  display: flex;
  align-items: center;
  gap: 4px;
}

.myleagues-pagination-page {
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.myleagues-pagination-page:hover {
  background: #f9fafb;
  border-color: #9ca3af;
}
.myleagues-pagination-page.active {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}

.myleagues-pagination-ellipsis {
  padding: 0 8px;
  font-size: 14px;
  color: #6b7280;
}

.myleagues-list {
  margin-top: 28px;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
  gap: 28px;
}

.myleagues-league-card {
  display: flex;
  align-items: stretch;
  background: #ffffff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
  border-radius: 28px;
  cursor: pointer;
  transition: box-shadow 0.2s;
  text-align: left;
  width: 100%;
  padding: 0px;
  box-sizing: border-box;
  border: none;
  height: 100%;
  outline: none;
}
.myleagues-league-card:focus-visible {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2), 0 0 0 2px #201e52;
}

.myleagues-league-card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px 28px;
  min-width: 0;
}

.myleagues-league-card-badge {
  display: inline-block;
  align-self: flex-start;
  font-size: 12px;
  font-weight: 600;
  line-height: 125%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  color: #ffffff;
  background: #515151;
  padding: 3px 10px;
  border-radius: 20px;
}

.myleagues-league-card-name {
  font-size: 24px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #3B3B3B;
  margin: 0;
  line-height: 120%;
  letter-spacing: 0px;
}

.myleagues-league-card-details {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.myleagues-league-card-detail {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.6);
  line-height: 100%;
}
.myleagues-league-card-detail img {
  width: 18px;
  height: 20px;
  flex-shrink: 0;
  opacity: 0.85;
}

.myleagues-league-card-image-wrap {
  position: relative;
  flex-shrink: 0;
  width: 298px;
  border-radius: 28px;
}

.myleagues-league-card-menu {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
}

.myleagues-league-card-menu-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.92);
  color: #3b3b3b;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  transition: background 0.15s, color 0.15s;
}
.myleagues-league-card-menu-trigger:hover {
  background: #ffffff;
  color: #201e52;
}

.myleagues-league-card-dropdown {
  position: absolute;
  top: 44px;
  right: 0;
  min-width: 168px;
  padding: 6px 0;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  border: 1px solid #e5e7eb;
}

.myleagues-league-card-dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 14px;
  border: none;
  background: transparent;
  font-size: 15px;
  font-family: "Inter-500";
  font-weight: 500;
  color: #4c4c4d;
  cursor: pointer;
  text-align: left;
  transition: background 0.12s, color 0.12s;
}
.myleagues-league-card-dropdown-item:hover {
  background: #f3f4f6;
  color: #201e52;
}

.myleagues-league-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 28px 28px 0;
}

.myleagues-league-card-image-placeholder {
  width: 100%;
  height: 100%;
  min-height: 140px;
  background: linear-gradient(135deg, #e8e8ec 0%, #d8d8e0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  font-weight: 700;
  font-family: "Inter-700";
  color: #9ca3af;
}

.myleagues-league-card-join-btn {
  width: 100%;
  margin-top: 36px;
  padding: 14.5px 24px;
  font-size: 20px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  font-weight: 600;
  background: rgba(87, 83, 192, 0.0705882353);
  color: #201E52;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  align-self: center;
}
.myleagues-league-card-join-btn:hover {
  opacity: 0.95;
}

.myleagues-league-card--with-join {
  cursor: default;
}

.create-league-shell-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(2px);
  opacity: 0;
  animation: create-league-modal-fade-in 160ms ease forwards;
}

.create-league-shell-content {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(92vw, 560px);
  max-height: 90vh;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  outline: none;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 0;
  opacity: 0;
  animation: create-league-modal-zoom-in 180ms ease forwards;
  padding: 28px 32px 24px;
  overflow-y: auto;
}

.create-league-shell-header {
  margin-bottom: 20px;
}

.create-league-shell-title {
  font-size: 22px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  color: #000000;
  text-align: center;
  margin: 0;
}

.create-league-shell-body {
  overflow: visible;
}

.create-league-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.create-league-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.create-league-field label {
  font-size: 16px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  color: #000000;
}
.create-league-field label .required {
  color: #D8252D;
}
.create-league-field input,
.create-league-field select,
.create-league-field textarea {
  width: 100%;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  font-size: 14px;
  line-height: 100%;
  color: #000000;
  background: #ffffff;
  box-sizing: border-box;
  padding: 10px 16px 14px;
  border-radius: 4px;
}
.create-league-field input::placeholder,
.create-league-field select::placeholder,
.create-league-field textarea::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.create-league-field select {
  cursor: pointer;
}

.create-league-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.create-league-field-compact {
  flex: 1 1 140px;
}

.create-league-field-flex {
  flex: 1 1 180px;
}

.create-league-toggle {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 8px;
}
.create-league-toggle .create-league-toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.create-league-toggle .create-league-toggle-desc {
  font-size: 12px;
  line-height: 1.3;
  color: #8e8e8e;
  margin: 0;
}

.create-league-switch {
  width: 48px;
  height: 24px;
  background: #cccccc;
  border: none;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  transition: background 0.2s ease;
}
.create-league-switch.on {
  background: #201e52;
}
.create-league-switch .create-league-switch-slider {
  position: absolute;
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  top: 2px;
  left: 2px;
  transition: transform 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.create-league-switch.on .create-league-switch-slider {
  transform: translateX(22px);
}

.create-league-footer {
  padding-top: 8px;
}

.create-league-submit {
  width: 100%;
  padding: 14px 16px;
  background: #201e52;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  cursor: pointer;
  transition: opacity 0.2s;
}
.create-league-submit:hover:not(:disabled) {
  opacity: 0.95;
}
.create-league-submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

@keyframes create-league-modal-fade-in {
  to {
    opacity: 1;
  }
}
@keyframes create-league-modal-zoom-in {
  from {
    transform: translate(-50%, -50%) scale(0.96);
    opacity: 0;
  }
  to {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
}.edit-league-modal-overlay {
  z-index: 10040;
}

@keyframes edit-league-modal-zoom-in {
  from {
    transform: translate(-50%, -50%) scale(0.96);
    opacity: 0;
  }
  to {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
}
.edit-league-modal-content {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(92vw, 800px);
  max-height: 90vh;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  outline: none;
  z-index: 10041;
  display: flex;
  flex-direction: column;
  gap: 0;
  opacity: 0;
  animation: edit-league-modal-zoom-in 180ms ease forwards;
  padding: 20px 28px 24px;
  overflow-y: auto;
}

.edit-league-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  position: relative;
}

.edit-league-modal-title {
  font-size: 22px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 120%;
  color: #000000;
  margin: 0;
  flex: 1;
  padding-right: 40px;
}

.edit-league-modal-close {
  position: absolute;
  top: -4px;
  right: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: transparent;
  font-size: 26px;
  line-height: 1;
  color: #6b7280;
  cursor: pointer;
  border-radius: 8px;
  transition: background 0.15s, color 0.15s;
}
.edit-league-modal-close:hover {
  background: #f3f4f6;
  color: #111827;
}

.edit-league-modal-loading {
  margin: 24px 0 32px;
  font-size: 15px;
  font-family: "Inter-500";
  color: #4c4c4d;
}

.edit-league-modal-form .create-league-footer {
  margin-top: 8px;
}
/* Grounds step - bulk excel-style editable grid */
.grounds-step {
  /* Days multi-select dropdown */
}
.grounds-step .grounds-bulk-card {
  background: #fff;
  border: 1px solid rgba(198, 197, 212, 0.35);
  border-radius: 14px;
  box-shadow: 0 20px 25px -5px rgba(0, 6, 102, 0.05), 0 8px 10px -6px rgba(0, 6, 102, 0.05);
  overflow: hidden;
  width: 100%;
}
.grounds-step .grounds-bulk-header {
  background: linear-gradient(180deg, #fafbff 0%, #f3f4fb 100%);
  border-bottom: 1px solid rgba(198, 197, 212, 0.4);
  padding: 18px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.grounds-step .grounds-bulk-title {
  font-family: "Manrope", "Inter-700", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  color: #1a1a2e;
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.grounds-step .grounds-bulk-title::before {
  content: "";
  width: 4px;
  height: 18px;
  background: #000666;
  border-radius: 2px;
}
.grounds-step .grounds-bulk-grid-scroll {
  overflow-x: auto;
  background: #fff;
}
.grounds-step .grounds-bulk-grid-scroll::-webkit-scrollbar {
  height: 8px;
}
.grounds-step .grounds-bulk-grid-scroll::-webkit-scrollbar-track {
  background: #f5f5f9;
}
.grounds-step .grounds-bulk-grid-scroll::-webkit-scrollbar-thumb {
  background: rgba(0, 6, 102, 0.2);
  border-radius: 4px;
}
.grounds-step .grounds-bulk-grid-scroll::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 6, 102, 0.35);
}
.grounds-step .grounds-bulk-grid {
  display: inline-block;
  min-width: 100%;
}
.grounds-step .grounds-grid-row {
  display: flex;
  align-items: stretch;
  width: max-content;
  min-width: 100%;
  transition: background 0.12s ease;
}
.grounds-step .grounds-grid-cell {
  border-bottom: 1px solid rgba(198, 197, 212, 0.35);
  border-right: 1px solid rgba(198, 197, 212, 0.25);
  height: 50px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.grounds-step .grounds-grid-cell:last-child {
  border-right: none;
}
.grounds-step .grounds-grid-action-cell {
  width: 49px;
  justify-content: center;
}
.grounds-step .grounds-grid-num-cell {
  width: 44px;
  justify-content: center;
  padding: 0 12px;
  font-family: "Inter-700";
  font-weight: 700;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.6px;
  color: #8a8b9a;
}
.grounds-step .grounds-grid-head-cell {
  padding: 0 16px;
  font-family: "Inter-700";
  font-weight: 700;
  font-size: 11px;
  line-height: 14px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: #5a5b6e;
}
.grounds-step .grounds-grid-head {
  position: sticky;
  top: 0;
  z-index: 2;
}
.grounds-step .grounds-grid-head .grounds-grid-cell {
  background: #f7f8fc;
  border-bottom: 1px solid rgba(198, 197, 212, 0.55);
  height: 44px;
}
.grounds-step .grounds-grid-input-cell {
  padding: 0;
  position: relative;
  transition: background 0.12s ease;
}
.grounds-step .grounds-grid-input-cell:focus-within {
  background: #f5f6ff;
  box-shadow: inset 0 0 0 1.5px #000666;
  z-index: 1;
}
.grounds-step .grounds-grid-input-cell.has-error {
  box-shadow: inset 0 0 0 1.5px #e85757;
  background: #fff5f5;
  z-index: 1;
}
.grounds-step .grounds-grid-phone-container.react-tel-input {
  width: 100%;
  height: 100%;
  font-family: "Inter-500";
}
.grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-input.form-control {
  width: 100%;
  height: 100%;
  border: none;
  background: transparent;
  padding-left: 52px;
  padding-right: 12px;
  font-family: "Inter-500";
  font-size: 13px;
  color: #1a1a2e;
  box-shadow: none;
  border-radius: 0;
}
.grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown {
  background: transparent;
  border: none;
  border-right: 1px solid rgba(198, 197, 212, 0.4);
  border-radius: 0;
}
.grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown.open, .grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown:hover, .grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown:focus {
  background: transparent;
}
.grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown .selected-flag {
  background: transparent;
  border-radius: 0;
  padding-left: 10px;
  width: 44px;
}
.grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown .selected-flag:hover, .grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown .selected-flag:focus, .grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-button.flag-dropdown .selected-flag.open {
  background: rgba(0, 6, 102, 0.04);
}
.grounds-step .grounds-grid-phone-container.react-tel-input .grounds-grid-phone-dropdown {
  font-family: "Inter-500";
  font-size: 13px;
  max-height: 220px;
}
.grounds-step .grounds-grid-input {
  width: 100%;
  height: 100%;
  border: none;
  background: transparent;
  padding: 0 16px;
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 13px;
  line-height: normal;
  color: #1a1a2e;
  outline: none;
  box-sizing: border-box;
}
.grounds-step .grounds-grid-input::placeholder {
  font-family: "Inter-500";
  font-style: normal;
  font-weight: 500;
  color: rgba(76, 76, 77, 0.4);
}
.grounds-step .grounds-days-select {
  position: relative;
  width: 100%;
  height: 100%;
}
.grounds-step .grounds-days-trigger {
  width: 100%;
  height: 100%;
  background: transparent;
  border: none;
  padding: 0 12px 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 13px;
  color: #1a1a2e;
  text-align: left;
  outline: none;
}
.grounds-step .grounds-days-trigger.is-empty {
  color: rgba(76, 76, 77, 0.4);
}
.grounds-step .grounds-days-trigger .grounds-days-chevron {
  flex-shrink: 0;
  color: #8a8b9a;
  transition: transform 0.18s ease;
}
.grounds-step .grounds-days-trigger.is-open .grounds-days-chevron {
  transform: rotate(180deg);
  color: #000666;
}
.grounds-step .grounds-grid-input-cell--days:focus-within {
  background: transparent;
  box-shadow: none;
}
.grounds-step .grounds-grid-row:not(.grounds-grid-head):hover .grounds-grid-cell {
  background: #fafbff;
}
.grounds-step .grounds-grid-row.is-placeholder .grounds-grid-cell {
  background: #fbfbfd;
}
.grounds-step .grounds-grid-row.is-placeholder:hover .grounds-grid-cell {
  background: #f5f6fb;
}
.grounds-step .grounds-grid-delete-btn {
  background: transparent;
  border: none;
  color: #b8b9c4;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s ease;
}
.grounds-step .grounds-grid-delete-btn:hover {
  background: rgba(232, 87, 87, 0.12);
  color: #e85757;
}
.grounds-step .grounds-bulk-footer {
  background: #fafbff;
  border-top: 1px solid rgba(198, 197, 212, 0.4);
  padding: 14px 24px;
}
.grounds-step .grounds-add-row-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(0, 6, 102, 0.06);
  border: 1px dashed rgba(0, 6, 102, 0.3);
  color: #000666;
  font-family: "Inter-600";
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  padding: 8px 14px;
  border-radius: 8px;
  transition: all 0.15s ease;
}
.grounds-step .grounds-add-row-btn:hover {
  background: rgba(0, 6, 102, 0.1);
  border-color: #000666;
}
.grounds-step .grounds-add-row-btn svg {
  flex-shrink: 0;
}

.create-league-step-form.grounds-step {
  max-width: 1318px;
  gap: 0;
}

/* Days dropdown menu — portaled to document.body */
.grounds-days-menu {
  position: fixed;
  background: #fff;
  border: 1px solid rgba(198, 197, 212, 0.6);
  border-radius: 12px;
  box-shadow: 0 18px 36px -10px rgba(0, 6, 102, 0.22), 0 6px 14px -6px rgba(0, 6, 102, 0.1);
  padding: 0;
  z-index: 10000;
  overflow: hidden;
  animation: groundsDaysMenuIn 0.15s ease-out;
}
.grounds-days-menu .grounds-days-menu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: linear-gradient(180deg, #fafbff 0%, #f3f4fb 100%);
  border-bottom: 1px solid rgba(198, 197, 212, 0.5);
  font-family: "Inter-700";
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #5a5b6e;
}
.grounds-days-menu .grounds-days-clear {
  background: transparent;
  border: none;
  color: #000666;
  font-family: "Inter-600";
  font-weight: 600;
  font-size: 11px;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 4px;
  transition: background 0.12s ease;
}
.grounds-days-menu .grounds-days-clear:hover:not(:disabled) {
  background: rgba(0, 6, 102, 0.08);
}
.grounds-days-menu .grounds-days-clear:disabled {
  color: #b8b9c4;
  cursor: not-allowed;
}
.grounds-days-menu .grounds-days-list {
  padding: 6px;
  max-height: 280px;
  overflow-y: auto;
}
.grounds-days-menu .grounds-days-list::-webkit-scrollbar {
  width: 6px;
}
.grounds-days-menu .grounds-days-list::-webkit-scrollbar-thumb {
  background: rgba(0, 6, 102, 0.2);
  border-radius: 3px;
}
.grounds-days-menu .grounds-days-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 13px;
  color: #1a1a2e;
  transition: background 0.12s ease;
  user-select: none;
}
.grounds-days-menu .grounds-days-option:hover {
  background: #f5f6ff;
}
.grounds-days-menu .grounds-days-option input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  border: 1.5px solid #c6c5d4;
  border-radius: 4px;
  background: #fff;
  margin: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.12s ease;
  flex-shrink: 0;
}
.grounds-days-menu .grounds-days-option input[type=checkbox]:checked {
  background: #000666;
  border-color: #000666;
}
.grounds-days-menu .grounds-days-option input[type=checkbox]:checked::after {
  content: "";
  width: 8px;
  height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px);
}
.grounds-days-menu .grounds-days-option input[type=checkbox]:hover:not(:checked) {
  border-color: #000666;
}
.grounds-days-menu .grounds-days-option span {
  flex: 1;
}
.grounds-days-menu .grounds-days-option--all {
  margin: 8px 6px 0;
  font-family: "Inter-600";
  font-weight: 600;
  color: #000666;
  background: rgba(0, 6, 102, 0.05);
}
.grounds-days-menu .grounds-days-option--all:hover {
  background: rgba(0, 6, 102, 0.1);
}
.grounds-days-menu .grounds-days-divider {
  height: 1px;
  background: rgba(198, 197, 212, 0.5);
  margin: 8px 10px 0;
}
.grounds-days-menu .grounds-days-menu-footer {
  border-top: 1px solid rgba(198, 197, 212, 0.5);
  padding: 8px 10px;
  display: flex;
  justify-content: flex-end;
  background: #fafbff;
}
.grounds-days-menu .grounds-days-done {
  background: #000666;
  border: none;
  color: #fff;
  font-family: "Inter-600";
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.4px;
  padding: 7px 18px;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.grounds-days-menu .grounds-days-done:hover {
  background: #00094d;
}

@keyframes groundsDaysMenuIn {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}.league-preview-step .league-preview-about {
  padding-top: 4px;
}
.league-preview-step .league-preview-logo-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #ece9ff 0%, #d4cffb 100%);
}
.league-preview-step .league-preview-empty {
  padding: 18px 4px;
  color: #6b7280;
  font-family: "Inter-500";
  font-size: 13px;
  text-align: center;
  background: #f8fafc;
  border-radius: 8px;
  border: 1px dashed rgba(0, 0, 0, 0.08);
}
.league-preview-step .league-preview-grounds-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.league-preview-step .league-preview-ground-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.05);
}
.league-preview-step .league-preview-ground-item__index {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 99.94%);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-600";
  font-size: 12px;
}
.league-preview-step .league-preview-ground-item__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.league-preview-step .league-preview-ground-item__name {
  font-family: "Inter-600";
  font-size: 14px;
  color: #1a1a2e;
}
.league-preview-step .league-preview-ground-item__addr {
  font-family: "Inter-400";
  font-size: 13px;
  color: #4b5563;
}
.league-preview-step .league-preview-ground-item__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-family: "Inter-500";
  font-size: 12px;
  color: #475569;
  margin-top: 2px;
}
.league-preview-step .league-preview-ground-item__meta strong {
  font-family: "Inter-600";
  color: #1a1a2e;
  margin-right: 4px;
  font-weight: 600;
}.coming-soon {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 0 62px;
  background-color: #FFFFFF;
  position: relative;
}
.coming-soon::before {
  content: "";
  position: absolute;
  inset: 0;
  background-repeat: repeat;
  background-size: 48px 48px;
  background-position: 0 0;
  opacity: 0.06;
  pointer-events: none;
  z-index: 0;
}

.coming-soon__panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  max-width: 560px;
  width: 100%;
  padding: 48px 32px;
  border-radius: 12px;
}

.coming-soon__logo {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  width: 157px;
  height: 171px;
}

.coming-soon__logo-image {
  max-width: 160px;
  max-height: 120px;
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: contain;
}

.coming-soon__headline {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.35;
  color: rgba(0, 0, 0, 0.8980392157);
  text-align: center;
  font-family: "Inter-600";
}

.coming-soon__description {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
}
.coming-soon__description p {
  margin: 0;
  font-size: 20px;
  line-height: 28px;
  color: rgba(76, 76, 77, 0.8980392157);
  font-family: "Inter-500";
}
.coming-soon__description p + p {
  margin-top: 4px;
}

@media (max-width: 768px) {
  .coming-soon {
    padding: 16px;
    min-height: 80vh;
  }
  .coming-soon__panel {
    padding: 32px 24px;
    gap: 20px;
  }
  .coming-soon__logo-image {
    max-width: 120px;
    max-height: 90px;
  }
  .coming-soon__headline {
    font-size: 18px;
  }
  .coming-soon__description p {
    font-size: 14px;
  }
}.personal-details-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.profile-avatar-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  margin-bottom: 8px;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.profile-avatar {
  position: relative;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  overflow: hidden;
  cursor: pointer;
  background: #f3f4f6;
  box-shadow: 0 2px 8px rgba(17, 24, 39, 0.12);
}
.profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.profile-avatar-camera {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #201e52;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(32, 30, 82, 0.35);
  padding: 0;
}
.profile-avatar-camera img {
  width: 14px;
  height: 14px;
  filter: brightness(0) invert(1);
}
.profile-avatar-camera:focus-visible {
  outline: 2px solid rgba(32, 30, 82, 0.45);
  outline-offset: 2px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

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

.personal-details-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.personal-details-field label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.personal-details-field .req {
  color: #dc2626;
}
.personal-details-field input[type=text] {
  padding: 10px 14px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  font-size: 14px;
  font-family: "Inter-500";
}
.personal-details-field input[type=text]:focus {
  outline: none;
  border-color: #201e52;
}
.personal-details-field input[type=text].error {
  border-color: #dc2626;
}
.personal-details-field input[type=text]::placeholder {
  color: #9ca3af;
}
.personal-details-field .field-error {
  font-size: 12px;
  color: #dc2626;
}

.readonly-field {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: #f3f4f6;
  border-radius: 6px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #4b5563;
}
.readonly-field .country-code {
  color: #6b7280;
}
.readonly-field .readonly-value {
  flex: 1;
}

.gender-field {
  margin-top: 4px;
}

.gender-buttons {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.gender-buttons .gender-btn {
  padding: 10px 24px;
  border: 1px solid rgba(76, 76, 77, 0.4);
  border-radius: 999px;
  background: #fff;
  font-size: 14px;
  font-family: "Inter-500";
  color: #374151;
  cursor: pointer;
  transition: all 0.2s;
}
.gender-buttons .gender-btn:hover {
  border-color: #201e52;
  color: #201e52;
}
.gender-buttons .gender-btn.active {
  background: #201e52;
  border-color: #201e52;
  color: #fff;
}

.role-registration {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 8px;
}
.role-registration .create-league-toggle {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  background: #f9fafb;
  border-radius: 8px;
}
.role-registration .create-league-toggle .create-league-toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.role-registration .create-league-toggle .create-league-step-label {
  font-size: 16px;
  font-family: "Inter-600";
  color: #111827;
}
.role-registration .create-league-toggle .create-league-toggle-desc {
  font-size: 12px;
  color: #6b7280;
  margin: 0;
}
.role-registration .create-league-switch {
  width: 48px;
  height: 24px;
  background: #d1d5db;
  border: none;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.role-registration .create-league-switch.on {
  background: #201e52;
}
.role-registration .create-league-switch .create-league-switch-slider {
  position: absolute;
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  top: 2px;
  left: 2px;
  transition: transform 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.role-registration .create-league-switch.on .create-league-switch-slider {
  transform: translateX(22px);
}

.personal-details-actions {
  margin-top: 24px;
}

.btn-continue {
  width: 100%;
  padding: 14px 24px;
  background: #201e52;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  cursor: pointer;
  transition: opacity 0.2s;
}
.btn-continue:hover:not(:disabled) {
  opacity: 0.9;
}
.btn-continue:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

@media (max-width: 520px) {
  .personal-details-grid {
    grid-template-columns: 1fr;
  }
}.player-details-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.player-details-fields {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.player-details-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.player-details-field label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.player-details-field .req {
  color: #dc2626;
}
.player-details-field .field-error {
  font-size: 12px;
  color: #dc2626;
}

.player-details-actions {
  display: flex;
  gap: 16px;
  margin-top: 16px;
  flex-wrap: wrap;
}
.player-details-actions button {
  flex: 1;
  min-width: 140px;
  padding: 14px 24px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  cursor: pointer;
  transition: opacity 0.2s;
}

.btn-complete-later {
  background: #fff;
  color: #201e52;
  border: 1px solid #201e52;
}
.btn-complete-later:hover {
  opacity: 0.9;
  background: #f9fafb;
}

.btn-next {
  background: #201e52;
  color: #fff;
  border: none;
}
.btn-next:hover:not(:disabled) {
  opacity: 0.9;
}
.btn-next:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}.umpire-details-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.umpire-details-fields {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.umpire-details-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.umpire-details-field label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.umpire-details-field .req {
  color: #dc2626;
}
.umpire-details-field input[type=text] {
  padding: 10px 14px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  font-size: 14px;
  font-family: "Inter-500";
}
.umpire-details-field input[type=text]:focus {
  outline: none;
  border-color: #201e52;
}
.umpire-details-field input[type=text].error {
  border-color: #dc2626;
}
.umpire-details-field input[type=text]::placeholder {
  color: #9ca3af;
}
.umpire-details-field .field-error {
  font-size: 12px;
  color: #dc2626;
}

.umpire-details-actions {
  display: flex;
  gap: 16px;
  margin-top: 16px;
  flex-wrap: wrap;
}
.umpire-details-actions button {
  flex: 1;
  min-width: 140px;
  padding: 14px 24px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  cursor: pointer;
  transition: opacity 0.2s;
}

.btn-complete-later {
  background: #fff;
  color: #201e52;
  border: 1px solid #201e52;
}
.btn-complete-later:hover {
  opacity: 0.9;
  background: #f9fafb;
}

.btn-next {
  background: #201e52;
  color: #fff;
  border: none;
}
.btn-next:hover:not(:disabled) {
  opacity: 0.9;
}
.btn-next:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}.scorer-details-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.scorer-details-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  padding: 20px 0;
}
@media (max-width: 768px) {
  .scorer-details-two-col {
    grid-template-columns: 1fr;
  }
}

.scorer-details-col {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.scorer-details-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.scorer-details-field label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.scorer-details-field .req {
  color: #dc2626;
}
.scorer-details-field input[type=text] {
  padding: 10px 14px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  font-size: 14px;
  font-family: "Inter-500";
}
.scorer-details-field input[type=text]:focus {
  outline: none;
  border-color: #201e52;
}
.scorer-details-field input[type=text].error {
  border-color: #dc2626;
}
.scorer-details-field input[type=text]::placeholder {
  color: #9ca3af;
}
.scorer-details-field .field-error {
  font-size: 12px;
  color: #dc2626;
}

.scorer-input-with-prefix {
  display: flex;
  align-items: center;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  background: #fff;
}
.scorer-input-with-prefix.error,
.scorer-input-with-prefix input.error {
  border-color: #dc2626;
}
.scorer-input-with-prefix .prefix {
  padding: 10px 12px 10px 14px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #374151;
}
.scorer-input-with-prefix input {
  flex: 1;
  border: none;
  padding: 10px 14px 10px 0;
}

.scorer-file-upload {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-sizing: border-box;
  min-height: 42px;
  padding: 0px 14px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.2s;
  /** Keep native file input out of flex layout (some engines still size it). */
}
.scorer-file-upload input[type=file] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  white-space: nowrap;
  border: 0;
  clip-path: inset(50%);
  clip: rect(0 0 0 0);
  opacity: 0;
}
.scorer-file-upload:hover {
  border-color: #201e52;
}
.scorer-file-upload .file-value {
  min-width: 0;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: 120%;
  letter-spacing: 0px;
  font-weight: 500;
  color: #4B5563;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scorer-file-upload .file-value:not(:empty) {
  color: #111827;
}
.scorer-file-upload .upload-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  font-family: "Inter-600";
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: 0px;
  font-weight: 600;
  color: #000000;
  border-radius: 6px;
  background-color: #ffffff;
  border: 0.6px solid rgba(0, 0, 0, 0.1411764706);
  box-sizing: border-box;
}

.scorer-details-actions {
  display: flex;
  gap: 16px;
  margin-top: 16px;
  flex-wrap: wrap;
}
.scorer-details-actions button {
  flex: 1;
  min-width: 140px;
  padding: 14px 24px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  cursor: pointer;
  transition: opacity 0.2s;
}.other-info-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

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

.other-info-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.other-info-field label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.other-info-field .req {
  color: #dc2626;
}
.other-info-field input[type=text],
.other-info-field textarea {
  padding: 10px 14px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  font-size: 14px;
  font-family: "Inter-500";
}
.other-info-field input[type=text]:focus,
.other-info-field textarea:focus {
  outline: none;
  border-color: #201e52;
}
.other-info-field input[type=text].error,
.other-info-field textarea.error {
  border-color: #dc2626;
}
.other-info-field input[type=text]::placeholder,
.other-info-field textarea::placeholder {
  color: #9ca3af;
}
.other-info-field textarea {
  resize: vertical;
  min-height: 80px;
}
.other-info-field .other-info-input {
  width: 100%;
}
.other-info-field .field-error {
  font-size: 12px;
  color: #dc2626;
}

.phone-input-container {
  width: 100%;
}

.terms-field {
  margin-top: 8px;
}

.terms-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  font-weight: 400;
}
.terms-checkbox-label input[type=checkbox] {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 2px;
  accent-color: #201e52;
}
.terms-checkbox-label input[type=checkbox].error {
  outline: 2px solid #dc2626;
}
.terms-checkbox-label .terms-text {
  font-size: 13px;
  color: #374151;
  line-height: 1.5;
}

.other-info-actions {
  margin-top: 24px;
}

.btn-explore {
  width: 100%;
  padding: 14px 24px;
  background: #201e52;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  cursor: pointer;
  transition: opacity 0.2s;
}
.btn-explore:hover:not(:disabled) {
  opacity: 0.9;
}
.btn-explore:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

@media (max-width: 520px) {
  .other-info-grid {
    grid-template-columns: 1fr;
  }
}.complete-profile-wrapper {
  position: fixed;
  inset: 0;
  z-index: 1000;
  min-height: 100dvh;
  background: #201e52;
  overflow-y: auto;
}

.complete-profile-background {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  justify-content: center;
  min-height: 100dvh;
  padding: clamp(16px, 3vh, 32px) 16px 40px;
  background: url("/assets/auth_bgImage-DHGdZzs4.svg") center/cover no-repeat;
}
.complete-profile-background::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/bg_cricenter_logo-C3Rtspl-.svg") no-repeat center center;
  background-size: 50% auto;
  opacity: 0.15;
  pointer-events: none;
}
.complete-profile-background .logo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
  position: relative;
  z-index: 1;
}
.complete-profile-background .logo {
  width: 70px;
  height: 74px;
  object-fit: cover;
}
.complete-profile-background .app-name {
  font-family: "Inter-700";
  font-size: 20px;
  color: #ffffff;
  font-style: italic;
  margin: 0;
}

.complete-profile-card {
  position: relative;
  width: 100%;
  max-width: 844px;
  margin: 0 auto;
  padding: 31px 36px 21px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.25);
  z-index: 1;
}

.complete-profile-header {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 20px;
}
.complete-profile-header .complete-profile-back-btn {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 8px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #201e52;
}
.complete-profile-header .complete-profile-back-btn img {
  width: 20px;
  height: 20px;
}
.complete-profile-header .complete-profile-back-btn:hover {
  opacity: 0.8;
}

.complete-profile-stepper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  flex-wrap: wrap;
}

.complete-profile-step-connector {
  width: 33px;
  height: 1px;
  flex-shrink: 0;
  background: rgba(76, 76, 77, 0.25);
}
.complete-profile-step-connector.dark {
  background: #4c4c4d;
}

.complete-profile-step {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #9aa0a6;
  font-family: "Roboto-500";
  font-size: 14px;
}
.complete-profile-step .complete-profile-step-dot {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #d9dbe0;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  background: #fff;
  flex-shrink: 0;
}
.complete-profile-step .complete-profile-step-dot .check {
  font-size: 12px;
  color: #fff;
}
.complete-profile-step.active {
  color: #201e52;
}
.complete-profile-step.active .complete-profile-step-dot {
  border-color: #201e52;
  background: #201e52;
  color: #fff;
}
.complete-profile-step.completed {
  color: #9aa0a6;
}
.complete-profile-step.completed .complete-profile-step-dot {
  border-color: #201e52;
  background: #201e52;
}
.complete-profile-step.completed .check {
  color: #fff;
}

.complete-profile-content {
  position: relative;
}

.profile-step-placeholder {
  padding: 40px 0;
  text-align: center;
  color: #6b7280;
}.user-profile-page-container {
  background: #F3F3F3;
  min-height: 100vh;
  padding: 20px 16px 40px;
  margin-top: 70px;
}

.user-profile-page-wrapper {
  max-width: 1400px;
  margin: 0 auto;
  padding: 24px 16px 40px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.user-profile-page-wrapper .player-info-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #D71D0C;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 13px;
  padding: 4px 12px;
  border-radius: 4px;
  margin-bottom: 16px;
}
.user-profile-page-wrapper .player-info-badge .badge-icon {
  font-weight: 700;
}
.user-profile-page-wrapper .profile-hero-card {
  background: #201E52;
  border-radius: 12px 12px 0 0;
  padding: 32px;
  margin: 0 -16px 24px;
  margin-top: -24px;
  position: relative;
  overflow: hidden;
}
.user-profile-page-wrapper .profile-hero-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  background: linear-gradient(135deg, transparent 0%, rgba(255, 255, 255, 0.03) 100%);
  pointer-events: none;
}
.user-profile-page-wrapper .profile-hero-card .profile-hero-content {
  display: flex;
  align-items: center;
  gap: 24px;
  position: relative;
  z-index: 1;
}
.user-profile-page-wrapper .profile-avatar-section {
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-avatar {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  overflow: visible;
  position: relative;
  background: #ffffff;
  border: 3px solid #ffffff;
}
.user-profile-page-wrapper .profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.user-profile-page-wrapper .profile-avatar .avatar-camera-btn {
  position: absolute;
  bottom: -6px;
  right: -6px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #5753C0;
  color: #ffffff;
  border: 2px solid #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .profile-avatar .avatar-camera-btn:hover {
  background: #201E52;
}
.user-profile-page-wrapper .profile-info-section {
  flex: 1;
  min-width: 0;
}
.user-profile-page-wrapper .profile-info-section .player-name {
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 26px;
  margin: 0 0 8px;
  line-height: 1.2;
}
.user-profile-page-wrapper .profile-info-section .player-code {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.7);
  font-family: "Inter-400";
  font-size: 13px;
  margin-bottom: 8px;
}
.user-profile-page-wrapper .profile-info-section .player-code .code-value {
  color: #ffffff;
  font-family: "Inter-500";
}
.user-profile-page-wrapper .profile-info-section .player-code .copy-btn {
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  padding: 2px;
  font-size: 14px;
  display: flex;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .profile-info-section .player-code .copy-btn:hover {
  color: #ffffff;
}
.user-profile-page-wrapper .profile-info-section .player-description {
  color: rgba(255, 255, 255, 0.6);
  font-family: "Inter-400";
  font-size: 14px;
  margin: 0;
}
.user-profile-page-wrapper .profile-actions-section {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-actions-section .action-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  white-space: nowrap;
}
.user-profile-page-wrapper .profile-actions-section .action-btn svg {
  font-size: 18px;
}
.user-profile-page-wrapper .profile-actions-section .action-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.4);
}
.user-profile-page-wrapper .profile-tabs-section {
  background: none;
  padding: 0;
}
.user-profile-page-wrapper .main-tabs {
  display: flex;
  gap: 32px;
  padding-top: 4px;
  border-bottom: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .main-tabs .main-tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 16px 0;
  font-family: "Inter-500";
  font-size: 15px;
  color: rgb(69, 70, 82);
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .main-tabs .main-tab.active {
  color: #18181B;
  border-bottom-color: #201E52;
}
.user-profile-page-wrapper .main-tabs .main-tab:hover:not(.active) {
  color: #18181B;
}
.user-profile-page-wrapper .tab-divider {
  margin: 0;
  border: none;
  border-top: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .sub-tabs {
  display: flex;
  gap: 12px;
  padding: 16px 0;
}
.user-profile-page-wrapper .sub-tabs .sub-tab {
  padding: 8px 16px;
  border-radius: 20px;
  border: none;
  background: rgba(76, 76, 77, 0.06);
  font-family: "Inter-500";
  font-size: 13px;
  color: #18181B;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .sub-tabs .sub-tab.active {
  background: #201E52;
  color: #ffffff;
}
.user-profile-page-wrapper .sub-tabs .sub-tab:hover:not(.active) {
  background: rgba(76, 76, 77, 0.12);
}
.user-profile-page-wrapper .profile-tab-content {
  min-height: 300px;
  padding: 24px 0;
}
.user-profile-page-wrapper .player-profile-card {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.user-profile-page-wrapper .player-profile-card .player-profile-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #201E52;
  padding: 16px 24px;
}
.user-profile-page-wrapper .player-profile-card .player-profile-header h2 {
  margin: 0;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 16px;
}
.user-profile-page-wrapper .player-profile-card .player-profile-header .edit-btn {
  background: none;
  border: none;
  color: #ffffff;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  padding: 4px;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .player-profile-card .player-profile-header .edit-btn:hover {
  opacity: 0.8;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details {
  background: #ffffff;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  border-bottom: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row:last-child {
  border-bottom: none;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row .detail-label {
  font-family: "Inter-600";
  font-size: 14px;
  color: #18181B;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row .detail-value {
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header p {
  margin: 0;
  font-family: "Inter-500";
  font-size: 20px;
  color: #000000;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .edit-roles-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  border-radius: 8px;
  border: none;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 15px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .edit-roles-btn svg {
  font-size: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .edit-roles-btn:hover {
  background: #2C2970;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .roles-header-actions {
  display: flex;
  gap: 8px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn,
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 8px;
  font-family: "Inter-500";
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn svg,
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn svg {
  font-size: 14px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn {
  border: 1px solid #DBDBDB;
  background: #ffffff;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn:hover {
  border-color: #D71D0C;
  color: #D71D0C;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn {
  border: 1px solid #201E52;
  background: #201E52;
  color: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn:hover {
  background: #2C2970;
  border-color: #2C2970;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card {
  border: 1px solid #F0F0F0;
  border-radius: 12px;
  background: #ffffff;
  overflow: visible;
  transition: all 0.2s ease-in-out;
  position: relative;
  border-left: 4px solid transparent;
  border-left-color: #201E52;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.enabled {
  border-color: #DBDBDB;
  border-left-color: #201E52;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.disabled {
  border-color: #F0F0F0;
  border-left-color: #DBDBDB;
  background: #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.disabled .role-label {
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.disabled .role-icon {
  background: #DBDBDB;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.editing .field-value,
.user-profile-page-wrapper .roles-capabilities-section .role-card.editing .field-input,
.user-profile-page-wrapper .roles-capabilities-section .role-card.editing .multiselect-trigger {
  background: #ffffff;
  border-color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-main {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 24px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  background: #201E52;
  color: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-label {
  flex: 1;
  font-family: "Inter-500";
  font-size: 15px;
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle {
  width: 44px;
  height: 24px;
  border-radius: 12px;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  border: none;
  padding: 0;
  outline: none;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle .toggle-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  position: absolute;
  top: 2px;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.on {
  background: #1AA915;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.on .toggle-thumb {
  left: 22px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.off {
  background: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.off .toggle-thumb {
  left: 2px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-expand-btn {
  background: none;
  border: none;
  color: #71717A;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  padding: 4px;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-expand-btn:hover {
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded {
  padding: 0 24px 18px 80px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded p {
  margin: 0;
  font-family: "Inter-400";
  font-size: 13px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field label {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-value,
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input {
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  background: #F6F6F6;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  padding: 10px 14px;
  min-height: 20px;
  width: 100%;
  box-sizing: border-box;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input {
  outline: none;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input:focus {
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input::placeholder {
  color: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-select {
  appearance: none;
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2371717A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-field-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsules {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsule {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #5753C0;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsule .capsule-remove-btn {
  display: flex;
  align-items: center;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsule .capsule-remove-btn:hover {
  color: #D71D0C;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row .field-input {
  flex: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row .location-add-btn {
  flex-shrink: 0;
  padding: 10px 16px;
  background: #5753C0;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-family: "Inter-500";
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row .location-add-btn:hover {
  opacity: 0.85;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-value-select {
  position: relative;
  padding-right: 32px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-value-select::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #71717A;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid {
    grid-template-columns: 1fr;
  }
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(-n+6) {
  grid-column: span 3;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(n+7) {
  grid-column: span 2;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field label {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-value,
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input {
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  background: #F6F6F6;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  padding: 10px 14px;
  min-height: 20px;
  width: 100%;
  box-sizing: border-box;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input {
  outline: none;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input:focus {
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input::placeholder {
  color: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-select {
  appearance: none;
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2371717A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload {
  display: flex;
  align-items: center;
  gap: 0;
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload .field-input {
  padding-right: 80px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload .upload-btn {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  padding: 6px 16px;
  border-radius: 6px;
  border: 1px solid #DBDBDB;
  background: #ffffff;
  font-family: "Inter-500";
  font-size: 12px;
  color: #18181B;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload .upload-btn:hover {
  border-color: #5753C0;
  color: #5753C0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix {
  display: flex;
  align-items: center;
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix .field-prefix {
  position: absolute;
  left: 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  z-index: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix .field-input {
  padding-left: 28px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix .field-select {
  padding-left: 28px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper {
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-trigger {
  width: 100%;
  text-align: left;
  cursor: pointer;
  background-color: #F6F6F6;
  color: #18181B;
  border: 1px solid #F0F0F0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-trigger:focus {
  outline: none;
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 100;
  overflow: hidden;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  cursor: pointer;
  user-select: none;
  border-bottom: 1px solid #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option.selected {
  background: #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option:hover {
  background: #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: #5753C0;
  cursor: pointer;
  flex-shrink: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear {
  background: none;
  border: none;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  cursor: pointer;
  padding: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear:hover {
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply {
  background: #2d2f6e;
  border: none;
  border-radius: 4px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  cursor: pointer;
  padding: 6px 20px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply:hover {
  opacity: 0.9;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid {
    grid-template-columns: 1fr;
  }
  .user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(-n+6),
  .user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(n+7) {
    grid-column: span 1;
  }
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field label {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-value,
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input {
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  background: #F6F6F6;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  padding: 10px 14px;
  min-height: 20px;
  width: 100%;
  box-sizing: border-box;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input {
  outline: none;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input:focus {
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input::placeholder {
  color: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-select {
  appearance: none;
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2371717A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-with-prefix {
  display: flex;
  align-items: center;
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-with-prefix .field-prefix {
  position: absolute;
  left: 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  z-index: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-with-prefix .field-input {
  padding-left: 28px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .role-toggle {
  width: 44px;
  height: 24px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper {
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-trigger {
  width: 100%;
  text-align: left;
  cursor: pointer;
  background-color: #F6F6F6;
  color: #18181B;
  border: 1px solid #F0F0F0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-trigger:focus {
  outline: none;
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 100;
  overflow: hidden;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  cursor: pointer;
  user-select: none;
  border-bottom: 1px solid #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option.selected {
  background: #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option:hover {
  background: #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: #5753C0;
  cursor: pointer;
  flex-shrink: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear {
  background: none;
  border: none;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  cursor: pointer;
  padding: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear:hover {
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply {
  background: #2d2f6e;
  border: none;
  border-radius: 4px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  cursor: pointer;
  padding: 6px 20px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply:hover {
  opacity: 0.9;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field.streamer-field-full {
  grid-column: span 2;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid {
    grid-template-columns: 1fr;
  }
  .user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field.streamer-field-full {
    grid-column: span 1;
  }
}
@keyframes shimmer {
  0% {
    background-position: -400px 0;
  }
  100% {
    background-position: 400px 0;
  }
}
.user-profile-page-wrapper .shimmer {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.05) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite ease-in-out;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-badge {
  width: 110px;
  height: 28px;
  border-radius: 4px;
  background-color: rgba(216, 37, 45, 0.2);
  margin-bottom: 16px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-hero {
  display: flex;
  align-items: center;
  gap: 24px;
  background: #201E52;
  border-radius: 12px;
  padding: 32px;
  margin-bottom: 24px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-hero .shimmer {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.06) 25%, rgba(255, 255, 255, 0.18) 50%, rgba(255, 255, 255, 0.06) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite ease-in-out;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-avatar {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-line {
  border-radius: 4px;
  height: 16px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-name {
  width: 220px;
  height: 28px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-code {
  width: 180px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-desc {
  width: 280px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-actions {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-btn {
  width: 130px;
  height: 42px;
  border-radius: 8px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tabs {
  background: #ffffff;
  border-radius: 12px;
  padding: 0 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tabs .shimmer {
  background: linear-gradient(90deg, #F0F0F0 25%, #DBDBDB 50%, #F0F0F0 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite ease-in-out;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tab-row {
  display: flex;
  gap: 32px;
  padding: 18px 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tab {
  width: 100px;
  height: 18px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-divider {
  height: 1px;
  background: #F0F0F0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-chip-row {
  display: flex;
  gap: 12px;
  padding: 16px 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-chip {
  width: 80px;
  height: 34px;
  border-radius: 20px;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .profile-hero-card {
    padding: 20px;
  }
  .user-profile-page-wrapper .profile-hero-card .profile-hero-content {
    flex-direction: column;
    text-align: center;
  }
  .user-profile-page-wrapper .profile-actions-section {
    width: 100%;
    justify-content: center;
  }
  .user-profile-page-wrapper .profile-info-section .player-code {
    justify-content: center;
  }
  .user-profile-page-wrapper .main-tabs {
    gap: 20px;
  }
  .user-profile-page-wrapper .sub-tabs {
    flex-wrap: wrap;
  }
  .user-profile-page-wrapper .skeleton-hero {
    flex-direction: column;
    text-align: center;
  }
  .user-profile-page-wrapper .skeleton-actions {
    width: 100%;
    justify-content: center;
  }
  .user-profile-page-wrapper .skeleton-chip-row {
    flex-wrap: wrap;
  }
}
.top-header {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  font-family: "Helvetica-Neue-500";
  font-size: 16px;
  position: fixed;
  left: 0;
  right: 0;
  z-index: 99;
  top: 0;
  width: 100%;
  border-bottom: 2px solid #ff2222;
}
.top-header .header-container {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 60px;
  width: 100%;
  box-sizing: border-box;
}
@media (min-width: 1920px) {
  .top-header .header-container {
    max-width: 1440px;
  }
}
.top-header .header-container .header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 0;
  gap: 0;
  position: relative;
}
.top-header .header-container .header-content .mobile-header-content {
  display: none;
}
.top-header .header-container .header-content .brand-section {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.top-header .header-container .header-content .brand-section .logo-wrapper {
  display: flex;
  align-items: center;
  height: 70px;
  width: 64.75px;
}
.top-header .header-container .header-content .brand-section .logo-wrapper .main-logo {
  height: 50px;
  width: 55px;
  object-fit: contain;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
.top-header .header-container .header-content .brand-section .logo-wrapper .main-logo:hover {
  opacity: 0.9;
}
.top-header .header-container .header-content .brand-section .brand-name {
  font-family: "Inter-700";
  font-weight: 700;
  font-style: italic;
  font-size: 20px;
  line-height: normal;
  text-align: center;
  color: #FFFFFF;
  margin: 0;
  letter-spacing: 0.5px;
}
.top-header .header-container .header-content .vertical-separator {
  width: 0;
  height: 23px;
  margin: 0 20px;
  position: relative;
  flex-shrink: 0;
}
.top-header .header-container .header-content .vertical-separator::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(90deg);
  width: 23px;
  height: 1px;
  background-color: #ffffff;
}
.top-header .header-container .header-content .nav-links {
  display: flex;
  gap: 20px;
  align-items: center;
  flex: 1;
  justify-content: flex-start;
  margin-left: 0;
}
.top-header .header-container .header-content .nav-links .nav-link {
  color: #FFFFFF;
  text-decoration: none;
  font-size: 16px;
  font-family: "Inter-600";
  font-weight: 600;
  font-style: normal;
  line-height: normal;
  padding: 0 12px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 32px;
  border-radius: 18px;
  transition: all 0.3s ease, transform 0.25s ease;
  white-space: nowrap;
}
.top-header .header-container .header-content .nav-links .nav-link::after {
  content: "";
  position: absolute;
  bottom: -3px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 2px;
  background-color: #ff2222;
  transition: width 0.3s ease;
}
.top-header .header-container .header-content .nav-links .nav-link[data-active=true]::after, .top-header .header-container .header-content .nav-links .nav-link:hover {
  color: #FFFFFF;
}
.top-header .header-container .header-content .nav-links .nav-link.is-active {
  color: #FFFFFF;
}
.top-header .header-container .header-content .nav-links .nav-link.is-active::after {
  width: calc(100% + 8px);
}
.top-header .header-container .header-content .nav-links .nav-link-button {
  background: transparent;
  border: none;
  cursor: pointer;
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .nav-link {
  flex-direction: row;
  gap: 8px;
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .company-dropdown-caret {
  width: 10px;
  height: 10px;
  opacity: 0.9;
  transition: transform 0.2s ease;
  filter: brightness(0) invert(1);
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .nav-link.is-open .company-dropdown-caret {
  transform: rotate(180deg);
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .company-dropdown-menu {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  background-color: rgba(27, 26, 79, 0.98);
  min-width: 140px;
  z-index: 1000;
  padding: 6px 0;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  animation: fadeIn 0.2s ease;
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .company-dropdown-menu .company-dropdown-item {
  width: 100%;
  padding: 10px 16px;
  text-align: left;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  font-family: "Inter-600";
  font-weight: 600;
  color: #FFFFFF;
  transition: background-color 0.2s ease;
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .company-dropdown-menu .company-dropdown-item:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
.top-header .header-container .header-content .nav-links .company-dropdown-wrapper .company-dropdown-menu .company-dropdown-item.is-active {
  background-color: rgba(255, 255, 255, 0.08);
}
.top-header .header-container .header-content .header-right {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-shrink: 0;
}
.top-header .header-container .header-content .header-right .vertical-separator {
  width: 0;
  height: 23px;
  position: relative;
  margin: 0;
}
.top-header .header-container .header-content .header-right .vertical-separator::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(90deg);
  width: 23px;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.3);
}
.top-header .header-container .header-content .header-right .search-section {
  display: flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  height: 35px;
  transition: transform 0.2s ease;
}
.top-header .header-container .header-content .header-right .search-section .search-text {
  font-family: "Inter-800";
  font-weight: 800;
  font-size: 16px;
  color: #FFFFFF;
  line-height: 100%;
  letter-spacing: 0%;
}
.top-header .header-container .header-content .header-right .search-section .search-icon-button {
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 23px;
  height: 23px;
}
.top-header .header-container .header-content .header-right .search-section .search-icon-button img {
  width: 23px;
  height: 23px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.top-header .header-container .header-content .header-right .search-section .search-icon-button:hover {
  opacity: 0.9;
}
.top-header .header-container .header-content .header-right .search-section:hover {
  transform: translateY(-1px);
}
.top-header .header-container .header-content .header-right .search-section:hover .search-text {
  transform: translateY(-0.5px);
}
.top-header .header-container .header-content .header-right .header-global-search {
  position: relative;
  display: flex;
  align-items: center;
}
.top-header .header-container .header-content .header-right .header-search-popover {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  width: min(420px, 42vw);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 14px 34px rgba(9, 12, 36, 0.24);
  border: 1px solid rgba(32, 30, 82, 0.08);
  padding: 14px;
  z-index: 140;
  animation: fadeIn 0.18s ease;
}
.top-header .header-container .header-content .header-right .header-search-input-wrap {
  position: relative;
}
.top-header .header-container .header-content .header-right .header-search-input-wrap input {
  width: 96%;
  height: 42px;
  border: 1px solid rgba(44, 41, 112, 0.14);
  border-radius: 10px;
  padding: 0 0 0 14px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #1d1d26;
  outline: none;
}
.top-header .header-container .header-content .header-right .header-search-input-wrap input::placeholder {
  color: rgba(76, 76, 77, 0.85);
}
.top-header .header-container .header-content .header-right .header-search-input-wrap input:focus {
  border-color: rgba(44, 41, 112, 0.4);
  box-shadow: 0 0 0 3px rgba(87, 83, 192, 0.08);
}
.top-header .header-container .header-content .header-right .header-search-input-wrap img {
  position: absolute;
  top: 50%;
  right: 14px;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  opacity: 0.7;
}
.top-header .header-container .header-content .header-right .header-search-results {
  margin-top: 10px;
  max-height: 340px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.top-header .header-container .header-content .header-right .header-search-result-item {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 11px 12px;
  border: none;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.18s ease;
}
.top-header .header-container .header-content .header-right .header-search-result-item:hover {
  background: rgba(87, 83, 192, 0.08);
}
.top-header .header-container .header-content .header-right .header-search-result-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.top-header .header-container .header-content .header-right .header-search-result-title {
  font-family: "Inter-600";
  font-size: 14px;
  color: #151515;
  line-height: 1.35;
}
.top-header .header-container .header-content .header-right .header-search-result-subtitle {
  font-family: "Inter-500";
  font-size: 12px;
  color: #62626d;
  line-height: 1.35;
}
.top-header .header-container .header-content .header-right .header-search-result-type {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 4px 8px;
  font-family: "Inter-600";
  font-size: 11px;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0.02em;
  background: rgba(32, 30, 82, 0.08);
  color: #201e52;
}
.top-header .header-container .header-content .header-right .header-search-result-type.type-player {
  background: rgba(196, 67, 42, 0.1);
  color: #9d2f1b;
}
.top-header .header-container .header-content .header-right .header-search-result-type.type-team {
  background: rgba(28, 124, 84, 0.1);
  color: #136245;
}
.top-header .header-container .header-content .header-right .header-search-result-type.type-tournament {
  background: rgba(45, 78, 194, 0.1);
  color: #2141a0;
}
.top-header .header-container .header-content .header-right .header-search-empty {
  padding: 18px 12px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #6a6a75;
  text-align: center;
}
.top-header .header-container .header-content .header-right .signin-section {
  display: flex;
  gap: 7px;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  height: 35px;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.top-header .header-container .header-content .header-right .signin-section .signin-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}
.top-header .header-container .header-content .header-right .signin-section .signin-text {
  font-family: "Inter-800";
  font-weight: 800;
  font-size: 16px;
  color: #FFFFFF;
  line-height: 100%;
  letter-spacing: 0%;
  transition: transform 0.2s ease;
}
.top-header .header-container .header-content .header-right .signin-section:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}
.top-header .header-container .header-content .header-right .signin-section:hover .signin-text {
  transform: translateY(-0.5px);
}
.top-header .header-container .header-content .header-right .statgpt-button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  height: 35px;
  background: #ffffff;
  border: none;
  border-radius: 29px;
  cursor: pointer;
  box-shadow: 0px 0px 6.8px 0px rgba(43, 129, 148, 0.8);
  transition: all 0.2s ease;
  backdrop-filter: blur(15px);
  flex-shrink: 0;
}
.top-header .header-container .header-content .header-right .statgpt-button .statgpt-button-content {
  display: flex;
  align-items: center;
  gap: 4px;
}
.top-header .header-container .header-content .header-right .statgpt-button .statgpt-button-content .statgpt-icon {
  width: 17px;
  height: 17px;
  object-fit: contain;
}
.top-header .header-container .header-content .header-right .statgpt-button .statgpt-button-content .statgpt-text {
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 14px;
  color: #201E52;
  line-height: normal;
}
.top-header .header-container .header-content .header-right .statgpt-button:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}
.top-header .header-container .header-content .header-right .statgpt-button:active {
  transform: translateY(0);
}
.top-header .header-container .header-content .header-right .icon-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: transparent;
  color: #ffffff;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease;
  padding: 0;
}
.top-header .header-container .header-content .header-right .icon-button img {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.top-header .header-container .header-content .header-right .icon-button:hover {
  background-color: rgba(255, 255, 255, 0.1);
  opacity: 0.9;
}
.top-header .header-container .header-content .header-right .icon-button:active {
  opacity: 0.8;
}
.top-header .header-container .header-content .header-right .icon-button.search-button img, .top-header .header-container .header-content .header-right .icon-button.notification-button img {
  filter: brightness(0) invert(1);
}
.top-header .header-container .header-content .header-right .icon-button.profile-button {
  padding: 2px;
}
.top-header .header-container .header-content .header-right .icon-button.profile-button .profile-img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper {
  position: relative;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background-color: transparent;
  border: none;
  color: #FFFFFF;
  font-size: 14px;
  font-family: "Helvetica-Neue-400";
  font-weight: 400;
  cursor: pointer;
  border-radius: 6px;
  transition: background-color 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button .location-icon {
  width: 16px;
  height: 16px;
  object-fit: contain;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button .location-text {
  white-space: nowrap;
  transition: transform 0.2s ease;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button .dropdown-arrow {
  width: 12px;
  height: 12px;
  object-fit: contain;
  transition: transform 0.2s ease;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button:hover {
  background-color: rgba(255, 255, 255, 0.1);
  opacity: 0.9;
  transform: translateY(-1px);
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button:hover .location-text {
  transform: translateY(-0.5px);
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-button:active {
  opacity: 0.8;
}
.top-header .header-container .header-content .header-right .location-dropdown-wrapper .location-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  min-width: 180px;
  z-index: 1000;
  padding: 8px 0;
  animation: fadeIn 0.2s ease;
}
.top-header .header-container .header-content .header-right .profile-dropdown-wrapper {
  position: relative;
}
.top-header .header-container .header-content .header-right .profile-dropdown-wrapper .profile-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  min-width: 260px;
  z-index: 1000;
  padding: 8px 0;
  animation: fadeIn 0.2s ease;
}
.top-header .header-container .header-content .header-right .profile-dropdown-wrapper .profile-dropdown-menu .profile-dropdown-button {
  width: 100%;
  padding: 12px 16px;
  text-align: left;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 14px;
  font-family: "Helvetica-Neue-400";
  color: #18181B;
  transition: background-color 0.2s ease;
}
.top-header .header-container .header-content .header-right .profile-dropdown-wrapper .profile-dropdown-menu .profile-dropdown-button:hover {
  background-color: #F0F0F0;
}
.top-header .header-container .header-content .header-right .profile-dropdown-wrapper .profile-dropdown-menu .profile-dropdown-button:active {
  background-color: #DBDBDB;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper {
  position: relative;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .user-initial-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 35px;
  height: 35px;
  border: 1px solid #ffffff;
  border-radius: 31px;
  background: transparent;
  cursor: pointer;
  transition: all 0.2s ease;
  padding: 0;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .user-initial-button .user-initial {
  color: #FFFFFF;
  font-family: "Inter-600";
  font-size: 14px;
  line-height: 1;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .user-initial-button .user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  filter: brightness(0) invert(1);
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .user-initial-button:hover {
  background-color: rgba(255, 255, 255, 0.1);
  opacity: 0.9;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .user-initial-button:active {
  opacity: 0.8;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .profile-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  min-width: 260px;
  z-index: 1000;
  padding: 8px 0;
  animation: fadeIn 0.2s ease;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .profile-dropdown-menu .profile-dropdown-button {
  width: 100%;
  padding: 12px 16px;
  text-align: left;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 14px;
  font-family: "Helvetica-Neue-400";
  color: #18181B;
  transition: background-color 0.2s ease;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .profile-dropdown-menu .profile-dropdown-button:hover {
  background-color: #F0F0F0;
}
.top-header .header-container .header-content .header-right .user-initial-wrapper .profile-dropdown-menu .profile-dropdown-button:active {
  background-color: #DBDBDB;
}
@media (max-width: 1200px) {
  .top-header .header-container {
    padding: 0 40px;
  }
  .top-header .header-container .header-content .brand-section {
    gap: 8px;
  }
  .top-header .header-container .header-content .brand-section .logo-wrapper .main-logo {
    height: 60px;
    width: 55px;
  }
  .top-header .header-container .header-content .brand-section .brand-name {
    font-size: 24px;
  }
  .top-header .header-container .header-content .nav-links {
    gap: 16px;
  }
  .top-header .header-container .header-content .nav-links .nav-link {
    font-size: 14px;
  }
  .top-header .header-container .header-content .header-right {
    gap: 8px;
  }
  .top-header .header-container .header-content .header-right .header-search-popover {
    width: min(360px, 48vw);
  }
  .top-header .header-container .header-content .header-right .search-section,
  .top-header .header-container .header-content .header-right .signin-section {
    padding: 6px 8px;
    height: 32px;
  }
  .top-header .header-container .header-content .header-right .search-section .search-text,
  .top-header .header-container .header-content .header-right .search-section .signin-text,
  .top-header .header-container .header-content .header-right .signin-section .search-text,
  .top-header .header-container .header-content .header-right .signin-section .signin-text {
    font-size: 14px;
  }
  .top-header .header-container .header-content .header-right .search-section .search-icon-button img,
  .top-header .header-container .header-content .header-right .search-section .signin-icon,
  .top-header .header-container .header-content .header-right .signin-section .search-icon-button img,
  .top-header .header-container .header-content .header-right .signin-section .signin-icon {
    width: 20px;
    height: 20px;
  }
  .top-header .header-container .header-content .header-right .icon-button {
    width: 36px;
    height: 36px;
  }
  .top-header .header-container .header-content .header-right .icon-button img {
    width: 18px;
    height: 18px;
  }
  .top-header .header-container .header-content .header-right .location-button {
    padding: 6px 10px;
    font-size: 13px;
  }
}
@media (max-width: 768px) {
  .top-header {
    border-bottom: none;
  }
  .top-header .header-container {
    padding: 0 12px;
  }
  .top-header .header-container .header-content {
    height: 74px;
    flex-wrap: nowrap;
  }
  .top-header .header-container .header-content .mobile-header-content {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-icon-btn,
  .top-header .header-container .header-content .mobile-header-content .mobile-avatar-btn,
  .top-header .header-container .header-content .mobile-header-content .mobile-avatar-initial-btn,
  .top-header .header-container .header-content .mobile-header-content .mobile-brand-button {
    border: none;
    background: transparent;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-hamburger {
    display: inline-flex;
    flex-direction: column;
    gap: 3px;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-hamburger span {
    width: 16px;
    height: 2px;
    background: #FFFFFF;
    border-radius: 2px;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-brand-button {
    gap: 8px;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-brand-logo {
    width: 29.06px;
    height: 31px;
    object-fit: contain;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-brand-text {
    font-family: "Inter-700";
    font-size: 24px;
    line-height: 1;
    color: #FFFFFF;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .mobile-notification-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    filter: brightness(0) invert(1);
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .mobile-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .mobile-avatar-initial-btn {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.8);
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .mobile-avatar-initial-btn span {
    font-family: "Inter-700";
    font-size: 14px;
    color: #FFFFFF;
    text-transform: uppercase;
    line-height: 1;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .profile-dropdown-menu {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    min-width: 140px;
    z-index: 1000;
    padding: 8px 0;
    animation: fadeIn 0.2s ease;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .profile-dropdown-menu .profile-dropdown-button {
    width: 100%;
    padding: 10px 14px;
    text-align: left;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 14px;
    font-family: "Helvetica-Neue-400";
    color: #18181B;
  }
  .top-header .header-container .header-content .mobile-header-content .mobile-header-actions .profile-dropdown-menu .profile-dropdown-button:hover {
    background-color: #F0F0F0;
  }
  .top-header .header-container .header-content .mobile-nav-panel {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: rgba(27, 26, 79, 0.98);
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
    z-index: 120;
  }
  .top-header .header-container .header-content .mobile-nav-panel .mobile-nav-link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 40px;
    padding: 0 10px;
    border: none;
    background: transparent;
    color: #FFFFFF;
    text-transform: uppercase;
    font-family: "Inter-700";
    font-size: 13px;
    letter-spacing: 0.3px;
    cursor: pointer;
    border-radius: 6px;
  }
  .top-header .header-container .header-content .mobile-nav-panel .mobile-nav-link:hover {
    background: #FFFFFF;
    color: #000000;
  }
  .top-header .header-container .header-content .mobile-nav-panel .mobile-nav-link.is-active {
    background: #FFFFFF;
    color: #000000;
  }
  .top-header .header-container .header-content .brand-section,
  .top-header .header-container .header-content .vertical-separator,
  .top-header .header-container .header-content .nav-links,
  .top-header .header-container .header-content .header-right {
    display: none;
  }
  .top-header .header-container .header-content .brand-section {
    gap: 6px;
  }
  .top-header .header-container .header-content .brand-section .logo-wrapper {
    height: 50px;
    width: 45px;
  }
  .top-header .header-container .header-content .brand-section .logo-wrapper .main-logo {
    height: 50px;
    width: 45px;
  }
  .top-header .header-container .header-content .brand-section .brand-name {
    font-size: 20px;
  }
  .top-header .header-container .header-content .brand-section .vertical-separator {
    height: 18px;
  }
  .top-header .header-container .header-content .brand-section .vertical-separator::before {
    width: 18px;
  }
  .top-header .header-container .header-content .nav-links {
    gap: 12px;
    order: 3;
    width: 100%;
    justify-content: center;
    margin-top: 8px;
  }
  .top-header .header-container .header-content .nav-links .nav-link {
    font-size: 12px;
  }
  .top-header .header-container .header-content .header-right {
    gap: 6px;
  }
  .top-header .header-container .header-content .header-right .header-search-popover {
    width: min(92vw, 340px);
    right: -12px;
  }
  .top-header .header-container .header-content .header-right .search-section,
  .top-header .header-container .header-content .header-right .signin-section {
    padding: 4px 6px;
    height: 28px;
  }
  .top-header .header-container .header-content .header-right .search-section .search-text,
  .top-header .header-container .header-content .header-right .search-section .signin-text,
  .top-header .header-container .header-content .header-right .signin-section .search-text,
  .top-header .header-container .header-content .header-right .signin-section .signin-text {
    font-size: 12px;
  }
  .top-header .header-container .header-content .header-right .search-section .search-icon-button img,
  .top-header .header-container .header-content .header-right .search-section .signin-icon,
  .top-header .header-container .header-content .header-right .signin-section .search-icon-button img,
  .top-header .header-container .header-content .header-right .signin-section .signin-icon {
    width: 18px;
    height: 18px;
  }
  .top-header .header-container .header-content .header-right .vertical-separator {
    height: 18px;
  }
  .top-header .header-container .header-content .header-right .vertical-separator::before {
    width: 18px;
  }
  .top-header .header-container .header-content .header-right .icon-button {
    width: 32px;
    height: 32px;
  }
  .top-header .header-container .header-content .header-right .icon-button img {
    width: 16px;
    height: 16px;
  }
  .top-header .header-container .header-content .header-right .icon-button.profile-button .profile-img {
    width: 28px;
    height: 28px;
  }
  .top-header .header-container .header-content .header-right .location-button {
    padding: 6px 8px;
    font-size: 12px;
    gap: 6px;
  }
  .top-header .header-container .header-content .header-right .location-button .location-icon {
    width: 14px;
    height: 14px;
  }
  .top-header .header-container .header-content .header-right .location-button .dropdown-arrow {
    width: 10px;
    height: 10px;
  }
}
@media (max-width: 768px) and (max-width: 420px) {
  .top-header .header-content .mobile-header-content .mobile-brand-text {
    font-size: 21px;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.sub-header {
  background-color: #ffffff;
  color: #000000;
  border-bottom: 1px solid #ffffff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  height: auto;
  position: fixed;
  left: 0;
  right: 0;
  z-index: 98;
  top: 53px;
}
@media (max-width: 768px) {
  .sub-header {
    top: 74px;
  }
}
.sub-header .header-container {
  max-width: 1600px;
  margin: 0 auto;
}
@media (min-width: 1920px) {
  .sub-header .header-container {
    max-width: 1440px;
  }
}
@media (max-width: 768px) {
  .sub-header .header-container.custom-container {
    padding-left: 0;
    padding-right: 0;
  }
}
.sub-header .header-container .header-content {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 75px;
  position: relative;
  /* Desktop: wrappers are transparent — children participate in this flex row */
}
@media (min-width: 769px) {
  .sub-header .header-container .header-content .sub-header-top-row,
  .sub-header .header-container .header-content .sub-header-nav-row {
    display: contents;
  }
  .sub-header .header-container .header-content .sub-header-leading {
    order: 1;
  }
  .sub-header .header-container .header-content .heading {
    order: 2;
  }
  .sub-header .header-container .header-content .divider {
    order: 3;
  }
  .sub-header .header-container .header-content .tabs {
    order: 4;
    min-width: 0;
    flex-shrink: 1;
  }
  .sub-header .header-container .header-content .sub-header-share {
    order: 5;
    margin-left: auto;
  }
  .sub-header .header-container .header-content .global-search-bar {
    order: 6;
    position: relative;
    flex-shrink: 0;
    width: 260px;
  }
  .sub-header .header-container .header-content .global-search-bar__input-wrap {
    position: relative;
    display: flex;
    align-items: center;
  }
  .sub-header .header-container .header-content .global-search-bar__icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    pointer-events: none;
    opacity: 0.6;
  }
  .sub-header .header-container .header-content .global-search-bar__input {
    width: 100%;
    height: 36px;
    padding: 0 16px 0 40px;
    border: 1px solid rgba(76, 76, 77, 0.25);
    border-radius: 40px;
    background: #ffffff;
    font-family: "Inter-500";
    font-size: 14px;
    color: #1d1d26;
    outline: none;
    transition: border-color 0.15s;
  }
  .sub-header .header-container .header-content .global-search-bar__input::placeholder {
    color: rgba(76, 76, 77, 0.6);
    font-family: "Inter-500";
    font-size: 14px;
  }
  .sub-header .header-container .header-content .global-search-bar__input:focus {
    border-color: #201E52;
  }
  .sub-header .header-container .header-content .global-search-bar__dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    width: 100%;
    min-width: 280px;
    background: #ffffff;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
    border-radius: 7px;
    z-index: 200;
    max-height: 280px;
    overflow-y: auto;
    padding: 6px 0;
  }
  .sub-header .header-container .header-content .global-search-bar__list {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .sub-header .header-container .header-content .global-search-bar__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 16px;
    cursor: pointer;
    transition: background 0.15s;
  }
  .sub-header .header-container .header-content .global-search-bar__item:hover {
    background: #f1f6ff;
  }
  .sub-header .header-container .header-content .global-search-bar__item-title {
    font-family: "Inter-500";
    font-size: 14px;
    color: #0b0b0c;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .sub-header .header-container .header-content .global-search-bar__item-type {
    flex-shrink: 0;
    border-radius: 999px;
    padding: 2px 8px;
    font-family: "Inter-600";
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    background: rgba(32, 30, 82, 0.08);
    color: #201E52;
  }
  .sub-header .header-container .header-content .global-search-bar__item-type.type-league {
    background: rgba(16, 185, 129, 0.12);
    color: #065f46;
  }
  .sub-header .header-container .header-content .global-search-bar__item-type.type-tournament {
    background: rgba(59, 130, 246, 0.12);
    color: #1e40af;
  }
  .sub-header .header-container .header-content .global-search-bar__item-type.type-team {
    background: rgba(245, 158, 11, 0.12);
    color: #92400e;
  }
  .sub-header .header-container .header-content .global-search-bar__item-type.type-player {
    background: rgba(196, 67, 42, 0.12);
    color: #991b1b;
  }
  .sub-header .header-container .header-content .global-search-bar__empty {
    padding: 12px 16px;
    font-family: "Inter-500";
    font-size: 14px;
    color: #6b7280;
  }
  .sub-header .header-container .header-content .round-button {
    order: 7;
    margin-left: 0;
    display: flex;
  }
}
.sub-header .header-container .header-content .sub-header-top-row {
  align-items: center;
  min-width: 0;
}
.sub-header .header-container .header-content .sub-header-leading {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.sub-header .header-container .header-content .sub-header-nav-row {
  min-width: 0;
}
.sub-header .header-container .header-content .sub-header-back {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 6px;
  cursor: pointer;
}
.sub-header .header-container .header-content .sub-header-back img {
  width: 18px;
  height: 18px;
  display: block;
}
.sub-header .header-container .header-content .sub-header-back:hover {
  background: rgba(0, 0, 0, 0.06);
}
.sub-header .header-container .header-content .sub-header-back:focus-visible {
  outline: 2px solid #2C2970;
  outline-offset: 2px;
}
.sub-header .header-container .header-content .sub-header-vrule {
  flex-shrink: 0;
  align-self: center;
  height: 1.5rem;
  width: 1px;
  background-color: rgba(76, 76, 77, 0.22);
}
.sub-header .header-container .header-content .sub-header-home {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 6px;
  cursor: pointer;
  color: #201e52;
}
.sub-header .header-container .header-content .sub-header-home svg {
  display: block;
}
.sub-header .header-container .header-content .sub-header-home:hover {
  background: rgba(32, 30, 82, 0.06);
}
.sub-header .header-container .header-content .sub-header-home:focus-visible {
  outline: 2px solid #2C2970;
  outline-offset: 2px;
}
.sub-header .header-container .header-content .heading {
  display: flex;
  align-items: center;
  gap: 6px;
  border: none;
  background: transparent;
  font-family: "Inter-700";
  font-size: 14px;
  font-weight: 700;
  color: #201e52;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0;
  max-width: min(420px, 34vw);
}
@media (min-width: 1920px) {
  .sub-header .header-container .header-content .heading {
    font-size: 16px;
    max-width: min(480px, 32vw);
  }
}
.sub-header .header-container .header-content .heading .heading-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sub-header .header-container .header-content .heading img {
  cursor: pointer;
  flex-shrink: 0;
}
@media (max-width: 768px) {
  .sub-header .header-container .header-content .heading {
    font-family: "Inter-700";
    font-size: 11px;
  }
}
.sub-header .header-container .header-content .divider {
  height: 1.5rem;
  width: 1px;
  background-color: rgba(76, 76, 77, 0.6);
}
.sub-header .header-container .header-content .tabs {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  font-size: 15px;
  /* Use buttons for tab triggers — <a href="#"> fights HashRouter (#/routes) and can prevent navigate() from applying. */
}
@media (min-width: 769px) and (max-width: 1200px) {
  .sub-header .header-container .header-content .tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    flex-shrink: 1;
    min-width: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 1rem;
  }
  .sub-header .header-container .header-content .tabs::-webkit-scrollbar {
    display: none;
  }
  .sub-header .header-container .header-content .tabs a,
  .sub-header .header-container .header-content .tabs button.tab-link {
    flex-shrink: 0;
    white-space: nowrap;
  }
}
.sub-header .header-container .header-content .tabs a,
.sub-header .header-container .header-content .tabs button.tab-link {
  appearance: none;
  background: none;
  border: none;
  margin: 0;
  padding: 0 0 5px;
  cursor: pointer;
  font: inherit;
  text-decoration: none;
  font-family: "Inter-500";
  position: relative;
  color: rgba(76, 76, 77, 0.6);
}
.sub-header .header-container .header-content .tabs a.active,
.sub-header .header-container .header-content .tabs button.tab-link.active {
  color: #2C2970;
}
.sub-header .header-container .header-content .tabs a.active::after,
.sub-header .header-container .header-content .tabs button.tab-link.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2.5px;
  background-color: var(--Primary-2, #2C2970);
}
.sub-header .header-container .header-content .tabs a::after,
.sub-header .header-container .header-content .tabs button.tab-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 2.5px;
  background-color: var(--Primary-2, #2C2970);
  transition: width 0.5s ease;
}
.sub-header .header-container .header-content .tabs a:hover::after,
.sub-header .header-container .header-content .tabs button.tab-link:hover::after {
  width: 100%;
}
.sub-header .header-container .header-content .tabs a:hover,
.sub-header .header-container .header-content .tabs button.tab-link:hover {
  color: #2C2970;
}
@media (min-width: 769px) {
  .sub-header .header-container .header-content .tabs a:not(.active),
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active) {
    color: #6b7280;
  }
  .sub-header .header-container .header-content .tabs a:not(.active)::after,
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active)::after {
    display: none;
  }
  .sub-header .header-container .header-content .tabs a:not(.active):hover,
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active):hover {
    color: #4b5563;
  }
  .sub-header .header-container .header-content .tabs a:not(.active):hover::after,
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active):hover::after {
    width: 0 !important;
  }
  .sub-header .header-container .header-content .tabs a.active,
  .sub-header .header-container .header-content .tabs button.tab-link.active {
    color: #201e52;
    font-family: "Inter-700";
  }
  .sub-header .header-container .header-content .tabs a.active::after,
  .sub-header .header-container .header-content .tabs button.tab-link.active::after {
    height: 3px;
    background-color: #201e52;
  }
  .sub-header .header-container .header-content .tabs a.active:hover,
  .sub-header .header-container .header-content .tabs button.tab-link.active:hover {
    color: #201e52;
  }
}
.sub-header .header-container .header-content .round-button {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border: none;
  background: #ffffff;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.sub-header .header-container .header-content .round-button img {
  transition: transform 0.25s ease;
}
.sub-header .header-container .header-content .sub-header-share {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: none;
  border-radius: 999px;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #fff;
  font-family: "Inter-200";
  font-size: 12px;
  font-weight: 500;
  padding: 8px 14px;
  cursor: pointer;
  transition: filter 0.2s ease;
}
.sub-header .header-container .header-content .sub-header-share .share-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.sub-header .header-container .header-content .sub-header-share img {
  width: 14px;
  height: 14px;
  display: block;
}
.sub-header .header-container .header-content .sub-header-share:hover {
  filter: brightness(1.05);
}
.sub-header .header-container .header-content .sub-header-share:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 2px;
}
.sub-header .header-container .header-content .league-popover {
  position: absolute;
  top: 85%;
  left: 0;
  margin-top: 5px;
  z-index: 80;
  transform-origin: top left;
  transform: translateY(-6px) scale(0.98);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0.22s;
}
.sub-header .header-container .header-content .league-popover.large .surface {
  width: 506px;
}
.sub-header .header-container .header-content .league-popover.small .surface {
  width: 241px;
}
.sub-header .header-container .header-content .league-popover.open {
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0s;
}
.sub-header .header-container .header-content .league-popover .surface {
  background: #ffffff;
  border-radius: 7px;
  box-shadow: 0px 0px 2.5px 0px rgba(0, 0, 0, 0.2);
  padding: 16px 12px;
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.sub-header .header-container .header-content .league-popover .searchbox {
  position: relative;
  margin-bottom: 0;
}
.sub-header .header-container .header-content .league-popover .searchbox input {
  height: 40px;
  width: 100%;
  border: none;
  background: #ffffff;
  padding: 0 40px 0 12px;
  font-size: 14px;
  font-family: "Inter-500";
  color: rgba(76, 76, 77, 0.6);
  outline: none;
  border-radius: 6px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}
.sub-header .header-container .header-content .league-popover .searchbox input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
}
.sub-header .header-container .header-content .league-popover .searchbox img {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  width: 24px;
  height: 24px;
}
.sub-header .header-container .header-content .league-popover .list.one-col.list--search-results {
  max-height: min(50vh, 320px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding-right: 4px;
}
.sub-header .header-container .header-content .league-popover .list.list--search-empty {
  min-height: 48px;
  justify-content: center;
}
.sub-header .header-container .header-content .league-popover .league-search-empty {
  margin: 0;
  padding: 12px 10px;
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(76, 76, 77, 0.75);
  text-align: center;
}
.sub-header .header-container .header-content .league-popover .list.one-col {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 241px;
}
.sub-header .header-container .header-content .league-popover .list.one-col .league-names-wrapper {
  height: 39px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 5px;
  transition: background-color 0.2s ease;
}
.sub-header .header-container .header-content .league-popover .list.one-col .league-names-wrapper .item {
  cursor: pointer;
  color: #000000;
  text-align: left;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: normal;
  margin: 0;
  padding: 0;
  width: 100%;
  transition: color 0.2s ease;
}
.sub-header .header-container .header-content .league-popover .list.one-col .league-names-wrapper .item.active {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.sub-header .header-container .header-content .league-popover .list.one-col .league-names-wrapper:hover .item {
  color: #201E52;
}
.sub-header .header-container .header-content .league-popover .list.one-col .league-names-wrapper.active {
  background: #f3f3ff;
}
.sub-header .header-container .header-content .league-popover .list.one-col .league-names-wrapper.active .item {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.sub-header .header-container .header-content .league-popover .list.two-col {
  display: grid;
  grid-template-columns: 241px 229px;
  column-gap: 36px;
  row-gap: 0;
  width: auto;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper {
  height: 39px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 5px;
  transition: background-color 0.2s ease;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper .item {
  cursor: pointer;
  color: #000000;
  text-align: left;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: normal;
  margin: 0;
  padding: 0;
  width: 100%;
  transition: color 0.2s ease;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper .item.active {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper:hover .item {
  color: #201E52;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper.active {
  background: #f3f3ff;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper.active .item {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper.view-more-wrapper {
  background: transparent;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper.view-more-wrapper .view-all {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  transition: color 0.2s ease;
}
.sub-header .header-container .header-content .league-popover .list.two-col .league-names-wrapper.view-more-wrapper .view-all:hover {
  color: #201E52;
}
@media (max-width: 768px) {
  .sub-header .header-container .header-content {
    flex-direction: column;
    align-items: stretch;
    height: auto;
    min-height: 0;
    gap: 0;
    /* Global search is a desktop-only affordance */
  }
  .sub-header .header-container .header-content .global-search-bar {
    display: none !important;
  }
  .sub-header .header-container .header-content .sub-header-leading .sub-header-vrule {
    display: none;
  }
  .sub-header .header-container .header-content .sub-header-leading {
    gap: 4px;
    justify-self: start;
  }
  .sub-header .header-container .header-content .sub-header-top-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) 44px;
    align-items: center;
    gap: 8px;
    min-height: 52px;
    padding: 8px 12px;
    background: #ffffff;
  }
  .sub-header .header-container .header-content .sub-header-home {
    width: 36px;
    height: 36px;
  }
  .sub-header .header-container .header-content .sub-header-home svg {
    width: 18px;
    height: 18px;
  }
  .sub-header .header-container .header-content .heading {
    justify-self: center;
    min-width: 0;
    width: 100%;
    max-width: min(100%, 100vw - 100px);
    justify-content: center;
    gap: 6px;
    font-size: 11px;
    font-family: "Inter-700";
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1.2;
  }
  .sub-header .header-container .header-content .heading .heading-label {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
  }
  .sub-header .header-container .header-content .heading img {
    flex-shrink: 0;
    width: 12px;
    height: auto;
  }
  .sub-header .header-container .header-content .round-button {
    order: unset;
    margin-left: 0;
    justify-self: end;
    width: 36px;
    height: 36px;
    box-shadow: none;
    border: 1px solid rgba(76, 76, 77, 0.18);
  }
  .sub-header .header-container .header-content .sub-header-share {
    display: none;
  }
  .sub-header .header-container .header-content .sub-header-nav-row {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #f3f4f6;
    border-top: 1px solid #e5e7eb;
    box-sizing: border-box;
  }
  .sub-header .header-container .header-content .divider {
    display: none;
  }
  .sub-header .header-container .header-content .tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 1.15rem;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 12px 14px 10px;
    margin: 0;
    align-items: flex-end;
    font-size: 14px;
  }
  .sub-header .header-container .header-content .tabs::-webkit-scrollbar {
    display: none;
  }
  .sub-header .header-container .header-content .tabs a,
  .sub-header .header-container .header-content .tabs button.tab-link {
    flex-shrink: 0;
    padding: 0 2px 10px;
    color: #6b7280;
    white-space: nowrap;
  }
  .sub-header .header-container .header-content .tabs a.active,
  .sub-header .header-container .header-content .tabs button.tab-link.active {
    color: #201e52;
    font-family: "Inter-700";
  }
  .sub-header .header-container .header-content .tabs a.active::after,
  .sub-header .header-container .header-content .tabs button.tab-link.active::after {
    height: 3px;
    background-color: #201e52;
  }
  .sub-header .header-container .header-content .tabs a:not(.active)::after,
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active)::after {
    display: none;
  }
  .sub-header .header-container .header-content .tabs a:not(.active):hover,
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active):hover {
    color: #6b7280;
  }
  .sub-header .header-container .header-content .tabs a:not(.active):hover::after,
  .sub-header .header-container .header-content .tabs button.tab-link:not(.active):hover::after {
    width: 0 !important;
  }
  .sub-header .header-container .header-content .league-popover {
    left: 50% !important;
    right: auto;
    transform: translate(-50%, -6px) scale(0.98);
    transform-origin: top center;
  }
  .sub-header .header-container .header-content .league-popover.open {
    transform: translate(-50%, 0) scale(1);
  }
}
@media (max-width: 620px) {
  .sub-header .header-container .header-content .league-popover.large .surface {
    width: min(92vw, 680px);
  }
  .sub-header .header-container .header-content .league-popover.small .surface {
    width: min(92vw, 420px);
  }
  .sub-header .header-container .header-content .league-popover .list.two-col {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}
.sub-header .header-container .sub-header-nav-row {
  display: flex;
  align-items: center;
  padding: 0 0 4px;
  min-width: 0;
}
.sub-header .header-container .sub-header-nav-row .divider {
  height: 1.5rem;
  width: 1px;
  background-color: rgba(76, 76, 77, 0.6);
  flex-shrink: 0;
}
.sub-header .header-container .sub-header-nav-row .tabs {
  display: flex;
  gap: 1.5rem;
  align-items: center;
  font-size: 15px;
  overflow-x: auto;
  flex-wrap: nowrap;
  min-width: 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sub-header .header-container .sub-header-nav-row .tabs::-webkit-scrollbar {
  display: none;
}
.sub-header .header-container .sub-header-nav-row .tabs a,
.sub-header .header-container .sub-header-nav-row .tabs button.tab-link {
  appearance: none;
  background: none;
  border: none;
  margin: 0;
  padding: 0 0 5px;
  cursor: pointer;
  font: inherit;
  text-decoration: none;
  font-family: "Inter-500";
  position: relative;
  color: rgba(76, 76, 77, 0.6);
  flex-shrink: 0;
  white-space: nowrap;
}
.sub-header .header-container .sub-header-nav-row .tabs a.active,
.sub-header .header-container .sub-header-nav-row .tabs button.tab-link.active {
  color: #2C2970;
}
.sub-header .header-container .sub-header-nav-row .tabs a.active::after,
.sub-header .header-container .sub-header-nav-row .tabs button.tab-link.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2.5px;
  background-color: var(--Primary-2, #2C2970);
}
.sub-header .header-container .sub-header-nav-row .tabs a::after,
.sub-header .header-container .sub-header-nav-row .tabs button.tab-link::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 2.5px;
  background-color: var(--Primary-2, #2C2970);
  transition: width 0.5s ease;
}
.sub-header .header-container .sub-header-nav-row .tabs a:hover::after,
.sub-header .header-container .sub-header-nav-row .tabs button.tab-link:hover::after {
  width: 100%;
}
.sub-header .header-container .sub-header-nav-row .tabs a:hover,
.sub-header .header-container .sub-header-nav-row .tabs button.tab-link:hover {
  color: #2C2970;
}
@media (max-width: 768px) {
  .sub-header .header-container .sub-header-nav-row {
    flex-direction: column;
    width: 100%;
    background: #f3f4f6;
    border-top: 1px solid #e5e7eb;
    box-sizing: border-box;
    padding: 0;
    align-items: stretch;
  }
  .sub-header .header-container .sub-header-nav-row .divider {
    display: none;
  }
  .sub-header .header-container .sub-header-nav-row .tabs {
    gap: 1.15rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 12px 14px 10px;
    margin: 0;
    align-items: flex-end;
    font-size: 14px;
  }
  .sub-header .header-container .sub-header-nav-row .tabs a,
  .sub-header .header-container .sub-header-nav-row .tabs button.tab-link {
    flex-shrink: 0;
    padding: 0 2px 10px;
    color: #6b7280;
    white-space: nowrap;
  }
  .sub-header .header-container .sub-header-nav-row .tabs a.active,
  .sub-header .header-container .sub-header-nav-row .tabs button.tab-link.active {
    color: #201e52;
    font-family: "Inter-700";
  }
  .sub-header .header-container .sub-header-nav-row .tabs a.active::after,
  .sub-header .header-container .sub-header-nav-row .tabs button.tab-link.active::after {
    height: 3px;
    background-color: #201e52;
  }
  .sub-header .header-container .sub-header-nav-row .tabs a:not(.active)::after,
  .sub-header .header-container .sub-header-nav-row .tabs button.tab-link:not(.active)::after {
    display: none;
  }
  .sub-header .header-container .sub-header-nav-row .tabs a:not(.active):hover,
  .sub-header .header-container .sub-header-nav-row .tabs button.tab-link:not(.active):hover {
    color: #6b7280;
  }
  .sub-header .header-container .sub-header-nav-row .tabs a:not(.active):hover::after,
  .sub-header .header-container .sub-header-nav-row .tabs button.tab-link:not(.active):hover::after {
    width: 0 !important;
  }
}

.details {
  position: fixed;
  left: 0;
  right: 0;
  top: 128px;
  z-index: 97;
  margin: 0;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  background: transparent;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.22s ease, padding 0.22s ease;
}
@media (max-width: 768px) {
  .details {
    top: 180px;
    padding: 0 12px 16px;
  }
}
.details .details-inner {
  background: #ffffff;
  padding: 14px 16px;
  display: block;
  max-width: 100%;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(-10px);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.22s ease;
}
.details.open {
  max-height: calc(100dvh - 128px - 8px);
  overflow-x: hidden;
  overflow-y: auto;
  opacity: 1;
  pointer-events: auto;
  background: rgba(15, 23, 42, 0.45);
}
@media (max-width: 768px) {
  .details.open {
    max-height: calc(100dvh - 188px - 8px);
  }
}
.details.open .details-inner {
  transform: translateY(0);
  opacity: 1;
}
body.route-hide-top-header .details {
  top: 75px;
}
@media (max-width: 768px) {
  body.route-hide-top-header .details {
    top: 168px;
  }
}
body.route-hide-top-header .details.open {
  max-height: calc(100dvh - 83px - 8px);
}
@media (max-width: 768px) {
  body.route-hide-top-header .details.open {
    max-height: calc(100dvh - 176px - 8px);
  }
}
.details .details-league-card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
@media (min-width: 901px) {
  .details .details-league-card {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
  }
}
.details .details-league-card__main {
  display: flex;
  gap: 12px;
  flex: 1;
  min-width: 0;
  align-items: flex-start;
}
.details .logo-wrap {
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 12px;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  display: grid;
  place-items: center;
}
.details .logo-wrap img {
  width: 40px;
  height: 40px;
  object-fit: contain;
  border-radius: 4px;
}
.details .details-league-card__content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.details .title-line {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.details .title-line h2 {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-family: "Inter-700";
  font-size: 17px;
  line-height: 1.3;
  color: #111827;
  font-weight: 700;
}
.details .title-line .share {
  flex-shrink: 0;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #fff;
  border: none;
  border-radius: 999px;
  font-family: "Inter-200";
  font-size: 12px;
  font-weight: 500;
  padding: 8px 14px;
  cursor: pointer;
}
.details .details-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 20px;
  align-items: start;
}
@media (max-width: 600px) {
  .details .details-meta-grid {
    grid-template-columns: 1fr;
  }
}
.details .details-meta-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.details .details-meta-item .label {
  color: #6b7280;
  font-family: "Inter-200";
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
}
.details .details-meta-item .value {
  color: #111827;
  font-family: "Inter-700";
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  word-break: break-word;
}
.details .organizer {
  margin-left: 0;
  width: 100%;
}
@media (min-width: 901px) {
  .details .organizer {
    margin-left: auto;
    width: auto;
    flex-shrink: 0;
  }
}
.details .organizer .org-card {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  width: 100%;
}
@media (min-width: 901px) {
  .details .organizer .org-card {
    min-width: 220px;
    width: auto;
  }
}
.details .organizer .org-card .avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}
.details .organizer .org-card .org-info {
  flex: 1;
  min-width: 0;
}
.details .organizer .org-card .org-info .name {
  font-family: "Inter-700";
  font-size: 14px;
  color: #111827;
}
.details .organizer .org-card .org-info .role {
  color: #6b7280;
  font-family: "Inter-200";
  font-size: 12px;
  margin-top: 2px;
}
.details .organizer .org-card .chev {
  font-size: 22px;
  color: #111827;
}

.sub-header-not-open {
  min-height: 75px;
  height: auto;
}
@media (max-width: 768px) {
  .sub-header-not-open {
    min-height: 0;
  }
}

body.route-hide-top-header {
  /* Extra clearance when sub-header uses two stacked rows on small screens */
}
body.route-hide-top-header .sub-header {
  top: 0;
}
@media (max-width: 768px) {
  body.route-hide-top-header .sub-header {
    top: 0;
  }
}
@media (max-width: 768px) {
  body.route-hide-top-header .main-wrapper {
    padding-top: 48px;
  }
}

.heading {
  font-family: "Inter-200";
  color: #000000;
  font-size: 24px;
}

.custom-container {
  max-width: 1600px;
  padding: 0px 75px;
}
@media (max-width: 1024px) {
  .custom-container {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media (max-width: 768px) {
  .custom-container {
    padding-left: 0px;
    padding-right: 0px;
  }
}

.main-middle-content-wrap {
  margin-top: 60px;
}

body.route-hide-top-header .main-team-content-wrap .main-middle-content-wrap {
  margin-top: 75px;
}
body.route-hide-top-header .main-tournament-wrap .main-middle-content-wrap {
  padding-top: 86px;
}
body.route-hide-top-header .main-match-wrapper .main-middle-content-wrap {
  padding-top: 75px;
}

/* Sticky-footer via min-height: pushes the wrapper tall enough that the
   footer (≈520px) lands near the viewport bottom on short pages. No flex/grid
   change, so child layouts inside the wrapper are unaffected. */
.main-wrapper {
  max-width: 1600px;
  margin: 0 auto;
  min-height: calc(100vh - 520px);
}

.main-wrap {
  max-width: 1905px;
  margin: 0 auto;
  min-height: calc(100vh - 520px);
}

.page-full-bleed {
  width: 100%;
  max-width: none;
  margin: 0;
  min-height: calc(100vh - 520px);
}

@font-face {
  font-family: "Inter-700";
  src: url("Inter_Bold.woff") format("woff"), url("/assets/Inter_Bold-DzQoVMa1.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-800";
  src: url("Inter_Bold.woff") format("woff"), url("/assets/Inter_Bold-DzQoVMa1.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-200";
  src: url("Inter18pt-Medium.woff") format("woff"), url("/assets/Inter_Medium-DdIK2NG7.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-300";
  src: url("Inter18pt-Regular.woff") format("woff"), url("/assets/Inter_Regular-bpaRfaPF.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-100";
  src: url("Inter18pt-Regular.woff") format("woff"), url("/assets/Inter_Regular-bpaRfaPF.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-400";
  src: url("Inter18pt-Regular.woff") format("woff"), url("/assets/Inter_Regular-bpaRfaPF.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-500";
  src: url("Inter18pt-SemiBold.woff") format("woff"), url("/assets/Inter_SemiBold-DFR3GhXk.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter-600";
  src: url("Inter18pt-SemiBold.woff") format("woff"), url("/assets/Inter_SemiBold-DFR3GhXk.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Helvetica-Neue-400";
  src: url("HelveticaNeue-Medium.woff") format("woff"), url("/assets/Helvetica_Neue_Medium-nY4gFZKd.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Helvetica-Neue-500";
  src: url("HelveticaNeue-Bold.woff") format("woff"), url("/assets/Helvetica_Neue_Bold-DO_R-aWA.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans - 300";
  src: url("/assets/PlusJakartaSans-Light-CzxMRZd7.woff") format("woff"), url("/assets/PlusJakartaSans-Light-DT9Bvzyz.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans - 400";
  src: url("/assets/PlusJakartaSans-Regular-Rt4dwF3f.woff") format("woff"), url("/assets/PlusJakartaSans-Regular-BgSirFPE.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans - 500";
  src: url("/assets/PlusJakartaSans-Medium-BlMlLoCO.woff") format("woff"), url("/assets/PlusJakartaSans-Medium-Can1--5F.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans - 600";
  src: url("/assets/PlusJakartaSans-SemiBold-DNItwQju.woff") format("woff"), url("/assets/PlusJakartaSans-SemiBold-9Y23Ft4o.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans - 700";
  src: url("/assets/PlusJakartaSans-Bold-BhnPt4fp.woff") format("woff"), url("/assets/PlusJakartaSans-Bold-DCHBRBov.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans - 800";
  src: url("/assets/PlusJakartaSans-ExtraBold-BpjKp0Zc.woff") format("woff"), url("/assets/PlusJakartaSans-ExtraBold-2lK3j245.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Bebas-Neue-100";
  src: url("/assets/BebasNeue-Regular-D3EjCNNz.woff") format("woff"), url("/assets/BebasNeue-Regular-DmMozy3k.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto-500";
  src: url("/assets/Roboto-Regular-BNXupZos.woff") format("woff"), url("/assets/Roboto-Regular-xuM68Ixk.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.form-control-wrap {
  display: flex;
  gap: 20px;
}
.form-control-wrap .form-group {
  width: 100%;
  margin-bottom: 20px;
}
.form-control-wrap .form-group label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.form-control-wrap .form-group label .req {
  color: #e11d48;
}
.form-control-wrap .form-group label > .req:first-child {
  margin-right: 4px;
  margin-left: 0;
}
.form-control-wrap .form-group label > .req:last-child:not(:first-child) {
  margin-left: 2px;
}
.form-control-wrap .form-group p {
  font-family: "Inter-100";
  font-size: 14px;
  margin-top: 5px;
}
.form-control-wrap .form-group .form-control {
  height: 40px;
  width: 95%;
  padding: 0 12px;
  border-radius: 4px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  outline: none;
  background: #fff;
  box-shadow: 0px 1px 2px 0px rgba(77, 64, 85, 0.1019607843);
  margin-top: 2px;
}
.form-control-wrap .form-group .form-control:focus {
  border-color: #000000;
}
.form-control-wrap .form-group .form-control::placeholder {
  color: rgba(76, 76, 77, 0.4509803922);
  font-family: "Inter-100";
}
.form-control-wrap .form-group .phone-input-field {
  padding: 0px 45px;
  margin-top: 2px !important;
  width: 100%;
}
.form-control-wrap .form-group .react-tel-input .flag-dropdown {
  margin-top: 2px !important;
}

.breadcrumb-container {
  display: flex;
  padding: 20px 0px;
  flex-direction: row;
  gap: 10px;
  flex-wrap: nowrap;
  align-items: center;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.breadcrumb-container::-webkit-scrollbar {
  display: none;
}
.breadcrumb-container .breadcrumb-item {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
  white-space: nowrap;
  flex-shrink: 0;
}
.breadcrumb-container .breadcrumb-item.clickable {
  cursor: pointer;
}
.breadcrumb-container .breadcrumb-item-active {
  cursor: pointer;
  color: #000000;
  font-family: "Inter-500";
  font-size: 14px;
  white-space: nowrap;
  flex-shrink: 0;
}
.breadcrumb-container .breadcrumb-separator {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.breadcrumb-container .clickable {
  cursor: pointer;
}
@media (max-width: 768px) {
  .breadcrumb-container {
    padding: 12px 0px;
    gap: 6px;
    flex-wrap: wrap;
    row-gap: 3px;
  }
  .breadcrumb-container .breadcrumb-item,
  .breadcrumb-container .breadcrumb-item-active {
    font-size: 12px;
    line-height: 1.4;
    white-space: normal;
  }
}

.no-data-found {
  font-size: 16px;
  color: #18181B;
  font-family: "Inter-200";
  height: calc(100vh - 424px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.no-data-found img {
  height: 200px;
}
.no-data-found p {
  font-family: "Inter-500";
}

.field-error {
  border-color: #e11d48 !important;
  box-shadow: 0 0 0 1px rgba(225, 29, 72, 0.1333333333);
}

.err-msg {
  margin-top: 4px;
  font-size: 12px;
  color: #e11d48;
}

.app-dialog {
  /* optional: if you ever add a wrapper */
}

.app-dialog-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  animation: app-dialog-fade-in 160ms ease forwards;
}

.app-dialog-content {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  outline: none;
  z-index: 999;
  width: 92vw;
  max-height: 86vh;
  display: flex;
  flex-direction: column;
  opacity: 0;
  transform-origin: center;
  animation: app-dialog-zoom-in 180ms ease forwards;
}
.app-dialog-content.app-dialog-content-sm {
  max-width: 480px;
}
.app-dialog-content.app-dialog-content-md {
  max-width: 720px;
}
.app-dialog-content.app-dialog-content-lg {
  max-width: 960px;
}
.app-dialog-content.app-dialog-content-custom {
  max-width: var(--app-dialog-max-w, 900px);
}
.app-dialog-content .app-dialog-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.app-dialog-content .app-dialog-header .app-dialog-title {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.2;
  color: #121212;
}
.app-dialog-content .app-dialog-header .app-dialog-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 32px;
  width: 32px;
  border-radius: 8px;
  border: 1px solid #e9e9e9;
  background: #fff;
  cursor: pointer;
}
.app-dialog-content .app-dialog-header .app-dialog-close:hover {
  background: #f5f5f5;
}
.app-dialog-content .app-dialog-description {
  color: #6b7280;
  font-size: 14px;
  margin-bottom: 12px;
}
.app-dialog-content .app-dialog-body {
  flex: 1 1 auto;
  overflow: auto;
}
.app-dialog-content .app-dialog-footer {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* animations */
@keyframes app-dialog-fade-in {
  to {
    opacity: 1;
  }
}
@keyframes app-dialog-zoom-in {
  from {
    transform: translate(-50%, -50%) scale(0.96);
    opacity: 0;
  }
  to {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
}
.ti-section {
  position: relative;
  z-index: 1;
  padding: 0px 10px 18px;
}
.ti-section .ti-section-title {
  margin: 0px 0 10px;
  font-size: 16px;
  font-family: "Inter-700";
  color: #000000;
}

.player-card-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px;
}
@media (max-width: 1100px) {
  .player-card-wrap {
    --cols: 3;
  }
}
@media (max-width: 780px) {
  .player-card-wrap {
    --cols: 2;
  }
}
@media (max-width: 520px) {
  .player-card-wrap {
    --cols: 1;
  }
}

.ti-player {
  background: #fff;
  border: 1px solid rgba(76, 76, 77, 0.4509803922);
  border-radius: 3px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 179px;
  height: 220px;
}

.ti-player--clickable {
  cursor: pointer;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.ti-player--clickable:hover {
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
}
.ti-player--clickable:focus-visible {
  outline: 2px solid #2c2970;
  outline-offset: 2px;
}

.ti-hero {
  position: relative;
  height: 130px;
}
.ti-hero .ti-skill-icons,
.ti-hero .ti-hero-corner-right {
  position: absolute;
  top: 8px;
  right: 8px;
  display: flex;
  gap: 6px;
  align-items: center;
  z-index: 2;
}
.ti-hero .ti-skill-icons img,
.ti-hero .ti-hero-corner-right img {
  width: 20px;
  height: 20px;
}

.ti-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: bottom center;
}

.ti-badge {
  position: absolute;
  top: 8px;
  left: 8px;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 12px;
  line-height: 1;
  z-index: 3;
}
.ti-badge img {
  width: 16px;
  height: 16px;
}

.ti-badge + .ti-badge {
  left: 44px;
}

.ti-badge--captain,
.ti-badge--vice {
  border: none;
  color: #fff;
  font-weight: 800;
  text-transform: lowercase;
}

.ti-badge-letter,
.ti-badge-vice-text {
  display: block;
  color: rgba(123, 97, 255, 0.45);
  line-height: 1;
  font-size: 12px;
  font-family: "Inter-700", system-ui, sans-serif;
}

.ti-badge-letter {
  font-size: 14px;
}

.ti-badge-vice-text {
  font-size: 14px;
  letter-spacing: 0.02em;
}

/* WK: purple gloves only (no white circle) — same accent as C / VC */
.ti-wk-badge {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  background: transparent;
  border: none;
  box-shadow: none;
}
.ti-wk-badge img {
  width: 24px;
  height: 24px;
  object-fit: contain;
  /* Align glove art to Playing XI purple */
  filter: drop-shadow(0 0 0.5px rgba(123, 97, 255, 0.35));
}

.ti-wk {
  position: absolute;
  top: 10px;
  right: 12px;
  font-size: 20px;
  line-height: 1;
}

.ti-divider {
  height: 1px;
  background: rgba(76, 76, 77, 0.4509803922);
}

.ti-meta {
  text-align: center;
  padding: 12px 10px 8px;
}
.ti-meta .ti-name {
  font-family: "Inter-500";
  font-size: 16px;
  letter-spacing: 0.5px;
  color: #0f172a;
  line-height: 1.2;
}
.ti-meta .ti-role {
  margin-top: 2px;
  font-size: 11px;
  font-family: "Inter-100";
  color: rgba(0, 0, 0, 0.7411764706);
}

.ti-merge-btn {
  margin: 0px 5px 7px;
  padding: 10px 12px;
  border: 1px solid #201E52;
  background: #201E52;
  color: #fff;
  font-weight: 700;
  font-size: 14px;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease;
}
.ti-merge-btn:hover {
  background: rgb(24.7142857143, 23.1696428571, 63.3303571429);
}
.ti-merge-btn:active {
  opacity: 0.9;
}

.ti-empty {
  height: 120px;
  display: grid;
  place-items: center;
  color: #98a2b3;
  border: 1px dashed #e5e7eb;
  border-radius: 10px;
  background: #fafafb;
  font-family: "Inter-500";
  font-size: 14px;
}

.home-container .home-wrapper {
  padding-bottom: 30px;
  padding-top: 20px;
  /* small screens */
  /* Use either class; keep one in JSX */
}
.home-container .home-wrapper .home-top-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.home-container .home-wrapper .home-top-bar .global-search-bar {
  position: relative;
  flex-shrink: 0;
  width: 300px;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__input-wrap {
  position: relative;
  display: flex;
  align-items: center;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  pointer-events: none;
  opacity: 0.6;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__input {
  width: 100%;
  height: 36px;
  padding: 0 16px 0 40px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 40px;
  background: #ffffff;
  font-family: "Inter-500";
  font-size: 14px;
  color: #1d1d26;
  outline: none;
  transition: border-color 0.15s;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__input:focus {
  border-color: rgba(76, 76, 77, 0.5);
}
.home-container .home-wrapper .home-top-bar .global-search-bar__dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  min-width: 280px;
  background: #ffffff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
  border-radius: 7px;
  z-index: 20;
  max-height: 280px;
  overflow-y: auto;
  padding: 6px 0;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 16px;
  cursor: pointer;
  transition: background 0.15s;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item:hover {
  background: #f1f6ff;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item-title {
  font-family: "Inter-500";
  font-size: 14px;
  color: #0b0b0c;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item-type {
  flex-shrink: 0;
  border-radius: 999px;
  padding: 2px 8px;
  font-family: "Inter-600";
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  background: rgba(32, 30, 82, 0.08);
  color: #201e52;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item-type.type-league {
  background: rgba(16, 185, 129, 0.12);
  color: #065f46;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item-type.type-tournament {
  background: rgba(59, 130, 246, 0.12);
  color: #1e40af;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item-type.type-team {
  background: rgba(245, 158, 11, 0.12);
  color: #92400e;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__item-type.type-player {
  background: rgba(196, 67, 42, 0.12);
  color: #991b1b;
}
.home-container .home-wrapper .home-top-bar .global-search-bar__empty {
  padding: 12px 16px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #6b7280;
}
.home-container .home-wrapper .tournaments-wrapper {
  display: flex;
  height: 40px;
  justify-content: space-between;
  align-items: center;
  padding: 61.5px 0px 0px;
}
.home-container .home-wrapper .tournaments-wrapper .heading {
  font-size: 20px;
  margin: 0;
  font-family: "Inter-500";
}
.home-container .home-wrapper .tournaments-wrapper .searchbox {
  position: relative;
  width: 30%;
  /* Dropdown */
}
.home-container .home-wrapper .tournaments-wrapper .searchbox input {
  height: 35px;
  width: 85%;
  padding: 0 40px 0 14px;
  outline: none;
  border-radius: 100px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  background: #ffffff;
}
@media (min-width: 1920px) {
  .home-container .home-wrapper .tournaments-wrapper .searchbox input {
    height: 40px;
  }
}
.home-container .home-wrapper .tournaments-wrapper .searchbox input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
  line-height: normal;
}
.home-container .home-wrapper .tournaments-wrapper .searchbox img {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
@media (min-width: 1920px) {
  .home-container .home-wrapper .tournaments-wrapper .searchbox img {
    right: 35px;
  }
}
@media (min-width: 1600px) {
  .home-container .home-wrapper .tournaments-wrapper .searchbox img {
    right: 25px;
  }
}
.home-container .home-wrapper .tournaments-wrapper .searchbox .search-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 50%;
  background: #ffffff;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
  border-radius: 7px;
  z-index: 20;
  max-height: 240px;
  overflow-y: auto;
  padding: 8px 0;
  /* empty / loading */
}
.home-container .home-wrapper .tournaments-wrapper .searchbox .search-dropdown .tournaments-names-wrapper {
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-container .home-wrapper .tournaments-wrapper .searchbox .search-dropdown .item {
  padding: 12px 16px;
  font-size: 16px;
  line-height: 24px;
  color: #0b0b0c;
  cursor: pointer;
  transition: background 0.15s ease;
  font-family: "Inter-500";
  font-size: 14px;
}
.home-container .home-wrapper .tournaments-wrapper .searchbox .search-dropdown .item:hover, .home-container .home-wrapper .tournaments-wrapper .searchbox .search-dropdown .item:focus {
  background: #f1f6ff;
}
.home-container .home-wrapper .tournaments-wrapper .searchbox .search-dropdown .empty {
  padding: 12px 16px;
  font-size: 15px;
  color: #6b7280;
}
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider {
  position: relative;
}
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .swiper-button-prev,
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .swiper-button-next {
  display: none;
}
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .swiper-button-disabled {
  visibility: hidden;
}
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .custom-prev-arrow,
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .custom-next-arrow {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  left: -25px;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #ffffff;
  border: none;
  box-shadow: 1px 0px 7.6px 0px rgba(0, 0, 0, 0.2);
}
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .custom-next-arrow {
  right: -30px !important;
  position: absolute;
  left: auto;
  z-index: 10;
}
.home-container .home-wrapper .tournaments-carousel .custom-slick-slider .swiper-slide {
  width: 265px !important;
  margin-right: 0px !important;
}
@media (max-width: 768px) {
  .home-container .home-wrapper .tournaments-carousel .tournament-card .tournament-status {
    display: none !important;
  }
}
.home-container .home-wrapper .matches-carousel .custom-slick-slider {
  position: relative;
  /* Let Swiper set slide width + spaceBetween; fixed width + zero margin caused flush/overlapping cards */
}
.home-container .home-wrapper .matches-carousel .custom-slick-slider .swiper-button-prev,
.home-container .home-wrapper .matches-carousel .custom-slick-slider .swiper-button-next {
  display: none;
}
.home-container .home-wrapper .matches-carousel .custom-slick-slider .swiper-button-disabled {
  visibility: hidden;
}
.home-container .home-wrapper .matches-carousel .custom-slick-slider .custom-prev-arrow,
.home-container .home-wrapper .matches-carousel .custom-slick-slider .custom-next-arrow {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  left: -25px;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: #ffffff;
  border: none;
  box-shadow: 1px 0px 7.6px 0px rgba(0, 0, 0, 0.2);
}
.home-container .home-wrapper .matches-carousel .custom-slick-slider .custom-next-arrow {
  right: -30px !important;
  position: absolute;
  left: auto;
  z-index: 10;
}
.home-container .home-wrapper .matches-carousel .custom-slick-slider .swiper-slide {
  height: auto;
  box-sizing: border-box;
}
.home-container .home-wrapper .tournaments-wrapper {
  display: flex;
  flex-direction: row;
  gap: 20px;
}
.home-container .home-wrapper .tournament-card {
  position: relative;
  width: 100%;
  max-width: 295px;
  height: 200px;
  margin-top: 15px;
  background: url("/assets/bg_image_card-BteOmsN6.svg") no-repeat center;
  background-size: cover;
  border-radius: 12px;
  overflow: hidden;
}
.home-container .home-wrapper .tournament-card .tournament-card-edit-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 6;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.22);
  color: #ffffff;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
  transition: background 0.15s ease, transform 0.15s ease;
}
.home-container .home-wrapper .tournament-card .tournament-card-edit-btn:hover {
  background: rgba(255, 255, 255, 0.38);
  transform: scale(1.05);
}
.home-container .home-wrapper .tournament-card.tournament-card--editable .tournament-status {
  top: 52px;
}
.home-container .home-wrapper .tournament-card .tournament-status {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #D71D0C;
  color: #ffffff;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-family: "Inter-700";
  text-align: end;
  margin-top: 10px;
  right: 10px;
}
.home-container .home-wrapper .tournament-card .tournament-status span {
  font-style: italic;
}
.home-container .home-wrapper .tournament-card .card-image {
  position: relative;
  width: 100%;
  height: 100%;
}
.home-container .home-wrapper .tournament-card .card-image .card-bg-images {
  display: flex;
  gap: 130px;
  width: 100%;
  height: 100%;
}
.home-container .home-wrapper .tournament-card .card-image .card-info {
  position: absolute;
  top: 75px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  text-align: center;
  color: #ffffff;
}
.home-container .home-wrapper .tournament-card .card-image .card-info:hover {
  transform: translateX(-50%) scale(1.07);
  cursor: pointer;
}
.home-container .home-wrapper .tournament-card .card-image .card-info p {
  margin: 5px 0;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
}
.home-container .home-wrapper .tournament-card .card-image .card-info .tournament-title {
  font-size: 18px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-family: "Bebas-Neue-100";
  font-weight: 500;
  font-style: italic;
}
.home-container .home-wrapper .tournament-card .card-image .card-info .tournament-dates {
  font-size: 17px;
  margin-top: 5px;
  font-family: "Bebas Neue Pro";
  font-weight: 100;
}
.home-container .home-wrapper .tournament-card .location-info {
  background-color: #F0F0F0;
  width: 100%;
  height: 25px;
  text-align: center;
  padding-top: 8px;
}
.home-container .home-wrapper .tournament-card .location-info img {
  text-align: center;
}
.home-container .home-wrapper .tournament-card .location-info span {
  font-family: "Inter-200";
  font-size: 14px;
}
.home-container .home-wrapper .matches-wrapper .heading {
  margin-bottom: 16px;
  font-size: 20px;
  font-family: "Inter-500";
}
.home-container .home-wrapper .matches-wrapper .matches-carousel .swiper-slide .live-matches-grid {
  width: 100%;
}
.home-container .home-wrapper .matches-wrapper .matches-carousel .swiper-slide .live-match-card {
  min-width: 0;
  max-width: 100%;
  flex: 1 1 auto;
}
.home-container .home-wrapper .matches-wrapper .live-matches-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
@media (max-width: 768px) {
  .home-container .home-wrapper .matches-wrapper .live-matches-grid {
    flex-direction: column;
    gap: 12px;
  }
}
.home-container .home-wrapper .matches-wrapper .live-match-card {
  background: #f5f5f5;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 6px;
  flex: 1 1 400px;
  min-width: 330px;
  max-width: 455px;
  cursor: pointer;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator .live-tag {
  font-family: "Inter-700";
  font-size: 12px;
  color: #d8252d;
  line-height: 0;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator .upcoming-tag {
  font-family: "Inter-700";
  font-size: 12px;
  color: #e15600;
  line-height: 0;
  font-weight: 800;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator .result-tag {
  color: #201E52;
  font-family: "Inter-700";
  font-size: 12px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator .match-date {
  font-family: "Inter-700";
  font-size: 12px;
  color: #000000;
  font-weight: 700;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator .match-info {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "Inter-200";
  font-size: 13px;
  color: rgba(76, 76, 77, 0.8);
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .live-indicator .match-info .separator {
  color: rgba(76, 76, 77, 0.8);
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-logo {
  width: 28px;
  height: 28px;
  background: white;
  border: 0.389px solid #7571cb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-logo img {
  width: 18.667px;
  height: 18.667px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.79);
  letter-spacing: -0.4px;
  text-transform: capitalize;
  overflow-wrap: break-all;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score {
  display: flex;
  align-items: center;
  gap: 8px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.79);
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs {
  display: flex;
  align-items: center;
  gap: 8px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs .score {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs .overs {
  font-family: "Inter-500";
  font-size: 12px;
  color: #4c4c4d;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
  flex: 1;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row {
  display: flex;
  align-items: center;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-logo {
  width: 28px;
  height: 28px;
  background: white;
  border: 0.389px solid #7571cb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-logo img {
  width: 18.667px;
  height: 18.667px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  letter-spacing: -0.4px;
  text-transform: capitalize;
  font-weight: 600;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section {
  display: flex;
  justify-content: flex-end;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info .time-label {
  font-family: "Inter-500";
  font-size: 12px;
  color: rgba(0, 0, 0, 0.79);
  font-weight: 500;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info .time-value {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  font-weight: 600;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .countdown-section {
  display: flex;
  justify-content: flex-start;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .countdown-section .countdown-text {
  font-family: "Inter-500";
  font-size: 13px;
  color: #433fac;
  font-weight: 500;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .countdown-section .countdown-text .countdown-bold {
  font-family: "Inter-500";
  font-weight: 600;
  color: #433fac;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .live-match-header .result-text {
  color: #107E0C;
  font-family: "Inter-200";
  font-size: 12px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details .umpire-info {
  font-family: "Inter-500";
  font-size: 13px;
  color: rgba(0, 0, 0, 0.63);
  margin: 0;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details .umpire-info .label {
  font-family: "Inter-500";
  color: #000000;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details .venue-info {
  display: flex;
  align-items: center;
  gap: 6px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details .venue-info .venue-icon {
  width: 16px;
  height: 16px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details .venue-info .venue-icon img {
  width: 100%;
  height: 100%;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-details .venue-info .venue-name {
  font-family: "Inter-500";
  font-size: 13px;
  color: #201E52;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .divider-line {
  height: 1px;
  background: linear-gradient(90deg, #ffffff 0%, rgba(87, 83, 192, 0.67) 43.1%, rgba(87, 83, 192, 0.67) 52.1%, #ffffff 100%);
  width: 100%;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-center-btn {
  background: #201E52;
  border: 1px solid rgba(67, 63, 172, 0.36);
  border-radius: 36px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-center-btn span {
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-center-btn .btn-icon {
  width: 24px;
  height: 24px;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-center-btn .btn-icon img {
  width: 100%;
  height: 100%;
}
.home-container .home-wrapper .matches-wrapper .live-match-card .live-match-content .match-center-btn:hover {
  background: #201E52;
  transform: translateY(-1px);
}
@media (max-width: 480px) {
  .home-container .home-wrapper .matches-wrapper .matches-card .match-card {
    width: 100%;
    height: auto;
  }
}
.home-container .home-wrapper .points-table-wrapper {
  margin-top: 16px;
  /* filter chips row — navy triggers + panels (scoped to league home points table only) */
  /* small screens */
}
.home-container .home-wrapper .points-table-wrapper .heading {
  margin-bottom: 16px;
  font-size: 20px;
  font-family: "Inter-500";
}
.home-container .home-wrapper .points-table-wrapper .subtitle {
  color: #000000;
  font-family: "Inter-200";
  font-size: 14px;
  margin-bottom: 10px;
}
.home-container .home-wrapper .points-table-wrapper .controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
  /* League home points-table filters only — panels + list rows (subheader uses separate markup) */
}
.home-container .home-wrapper .points-table-wrapper .controls .chip {
  background: #201e52;
  color: #ffffff;
  border: 1px solid #161448;
  padding: 10px 14px;
  border-radius: 8px;
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.home-container .home-wrapper .points-table-wrapper .controls .chip:hover:not(:disabled) {
  background: #2a2768;
}
.home-container .home-wrapper .points-table-wrapper .controls .chip:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none;
}
.home-container .home-wrapper .points-table-wrapper .controls .chip.open {
  box-shadow: 0 2px 8px rgba(32, 30, 82, 0.25);
}
.home-container .home-wrapper .points-table-wrapper .controls .chip .chip-label {
  min-width: 0;
  max-width: min(240px, 28vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}
.home-container .home-wrapper .points-table-wrapper .controls .chip .caret {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
}
.home-container .home-wrapper .points-table-wrapper .controls .chip .caret img {
  width: 11px;
  height: auto;
  display: block;
}
.home-container .home-wrapper .points-table-wrapper .controls .chips-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown {
  position: relative;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 5px;
  z-index: 80;
  transform-origin: top left;
  transform: translateY(-6px) scale(0.98);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0.22s;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover.large .surface {
  width: 430px;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover.open {
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0s;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .surface {
  background: #ffffff;
  border-radius: 7px;
  box-shadow: 0px 0px 2.5px 0px rgba(0, 0, 0, 0.2);
  padding: 16px 12px;
  width: auto;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .searchbox {
  position: relative;
  margin-bottom: 0;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .searchbox input {
  height: 40px;
  width: 100%;
  border: none;
  background: #ffffff;
  padding: 0 40px 0 12px;
  font-size: 14px;
  font-family: "Inter-500";
  color: rgba(76, 76, 77, 0.6);
  outline: none;
  border-radius: 6px;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .searchbox input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .searchbox img {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  width: 24px;
  height: 24px;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 241px;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col .tournaments-names-wrapper {
  height: 39px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 5px;
  transition: background-color 0.2s ease;
  overflow: hidden;
  box-sizing: border-box;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col .tournaments-names-wrapper .item {
  cursor: pointer;
  color: #000000;
  text-align: left;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: normal;
  margin: 0;
  padding: 0;
  width: 100%;
  transition: color 0.2s ease;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col .tournaments-names-wrapper .item.active {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col .tournaments-names-wrapper:hover .item {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col .tournaments-names-wrapper.active {
  background: #f3f3ff;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.one-col .tournaments-names-wrapper.active .item {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 10px;
  row-gap: 0;
  width: 100%;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper {
  height: 39px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border-radius: 5px;
  transition: background-color 0.2s ease;
  overflow: hidden;
  box-sizing: border-box;
  max-width: 100%;
  width: 100%;
  min-width: 0;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper .item {
  cursor: pointer;
  color: #000000;
  text-align: left;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: normal;
  margin: 0;
  padding: 0;
  width: 100%;
  transition: color 0.2s ease;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper .item.active {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper:hover .item {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper.active {
  background: #f3f3ff;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper.active .item {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper.view-more-wrapper {
  background: transparent;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper.view-more-wrapper .view-all {
  color: #201E52;
  font-family: "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  transition: color 0.2s ease;
}
.home-container .home-wrapper .points-table-wrapper .controls .tournaments-list-dropdown .league-popover .list.two-col .tournaments-names-wrapper.view-more-wrapper .view-all:hover {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown {
  position: relative;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 5px;
  z-index: 80;
  transform-origin: top left;
  transform: translateY(-6px) scale(0.98);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0.22s;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover.large .surface {
  width: 430px;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover.open {
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0s;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .surface {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: #ffffff;
  box-shadow: 0 0 2.5px 0 rgba(0, 0, 0, 0.2);
  padding: 14px;
  width: 200px;
  height: auto;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .searchbox {
  position: relative;
  margin-bottom: 12px;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .searchbox input {
  height: 40px;
  width: 100%;
  border: 1px solid #eceef2;
  background: #ffffff;
  padding: 0 40px 0 14px;
  font-size: 14px;
  outline: none;
  border-radius: 6px;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .searchbox img {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.one-col {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.one-col p {
  cursor: pointer;
  color: #000000;
  font-family: "Inter-200";
  font-size: 12px;
  line-height: normal;
  display: block;
  padding: 0px 5px;
  margin: 0;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.one-col p:hover {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.one-col p:active {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 30px;
  row-gap: 0px;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.two-col .item {
  cursor: pointer;
  color: #000000;
  text-align: left;
  font-family: "Inter-200";
  font-size: 12px;
  line-height: normal;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.two-col .item:hover {
  background-color: #F0F0FF;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .list.two-col .active {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .view-all {
  text-align: left;
  border: 0;
  background: transparent;
  font-size: 16px;
  line-height: 1.4;
  padding: 10px 12px;
  border-radius: 8px;
  color: #111827;
  cursor: pointer;
}
.home-container .home-wrapper .points-table-wrapper .controls .divison-list-dropdown .league-popover .view-all {
  color: #5753C0;
  font-family: "Inter-200";
  text-decoration: none;
  padding: 10px 12px;
  font-size: 14px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown {
  position: relative;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 5px;
  z-index: 80;
  transform-origin: top left;
  transform: translateY(-6px) scale(0.98);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0.22s;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover.large .surface {
  width: 430px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover.open {
  transform: translateY(0) scale(1);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform 0.22s ease, opacity 0.18s ease, visibility 0s 0s;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .surface {
  position: relative;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  background: #ffffff;
  box-shadow: 0 0 2.5px 0 rgba(0, 0, 0, 0.2);
  padding: 14px;
  width: 200px;
  height: auto;
  left: -110px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .searchbox {
  position: relative;
  margin-bottom: 12px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .searchbox input {
  height: 40px;
  width: 100%;
  border: 1px solid #eceef2;
  background: #ffffff;
  padding: 0 40px 0 14px;
  font-size: 14px;
  outline: none;
  border-radius: 6px;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .searchbox img {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.one-col {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.one-col p {
  cursor: pointer;
  margin: 0;
  color: #000000;
  font-family: "Inter-200";
  font-size: 12px;
  line-height: normal;
  display: block;
  padding: 0px 5px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.one-col p:hover {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 30px;
  row-gap: 0px;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.two-col .item {
  cursor: pointer;
  color: #000000;
  text-align: left;
  font-family: "Inter-200";
  font-size: 12px;
  line-height: normal;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.two-col .item:hover {
  background-color: #F0F0FF;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .list.two-col .active {
  color: #201E52;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .view-all {
  text-align: left;
  border: 0;
  background: transparent;
  font-size: 16px;
  line-height: 1.4;
  padding: 10px 12px;
  border-radius: 8px;
  color: #111827;
  cursor: pointer;
}
.home-container .home-wrapper .points-table-wrapper .controls .group-list-dropdown .league-popover .view-all {
  color: #5753C0;
  font-family: "Inter-200";
  text-decoration: none;
  padding: 10px 12px;
  font-size: 14px;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover {
  /* Center panel under trigger so rightmost filters don’t clip off-screen */
  left: 45%;
  right: auto;
  width: max-content;
  max-width: calc(90vw - 24px);
  transform-origin: top center;
  transform: translateX(-50%) translateY(-6px) scale(0.98);
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover.open,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover.open,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover.open {
  transform: translateX(-55%) translateY(0) scale(1);
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .surface,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .surface,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .surface {
  left: auto;
  position: relative;
  max-width: calc(100vw - 24px);
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
  padding: 12px;
  min-width: 280px;
  width: auto;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover.open.small .surface, .home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover.open.large .surface,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover.open.small .surface,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover.open.large .surface,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover.open.small .surface,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover.open.large .surface {
  width: min(360px, 100vw - 32px);
  max-width: min(506px, 100vw - 32px);
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .searchbox,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .searchbox,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .searchbox {
  margin-bottom: 10px;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .searchbox input,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .searchbox input,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .searchbox input {
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  box-shadow: none;
  background: #fff;
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .searchbox input::placeholder,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .searchbox input::placeholder,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .searchbox input::placeholder {
  color: #9ca3af;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .searchbox img,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .searchbox img,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .searchbox img {
  opacity: 0.55;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .list.one-col,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .list.one-col,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .list.one-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .list.two-col,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .list.two-col,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .list.two-col {
  column-gap: 12px;
  row-gap: 4px;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .division-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .groups-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .division-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .groups-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .division-names-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .groups-names-wrapper {
  display: flex;
  align-items: center;
  padding: 8px 10px;
  min-height: 40px;
  border-radius: 8px;
  box-sizing: border-box;
  transition: background 0.15s ease;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .division-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .groups-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .division-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .groups-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .division-names-wrapper .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .groups-names-wrapper .item {
  font-family: "Inter-600", "Inter-SemiBold", Helvetica, sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: #111827;
  margin: 0;
  padding: 0;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .division-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .groups-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .division-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .groups-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .division-names-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .groups-names-wrapper:hover {
  background: #f4f6fb;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .division-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .groups-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .division-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .groups-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .division-names-wrapper.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .groups-names-wrapper.active {
  background: #eef2ff;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .division-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .division-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .groups-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .groups-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .division-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .division-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .groups-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .groups-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .division-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .division-names-wrapper.active .item.active,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .groups-names-wrapper.active .item,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .groups-names-wrapper.active .item.active {
  color: #201e52;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper {
  background: transparent;
  padding: 6px 4px;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper:hover,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper:hover {
  background: transparent;
}
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .tournaments-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper .view-all,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .divison-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper .view-all,
.home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .group-list-dropdown .league-popover .tournaments-names-wrapper.view-more-wrapper .view-all {
  color: #201e52;
  font-family: "Inter-600";
  font-weight: 600;
  font-size: 14px;
}
@media (max-width: 620px) {
  .home-container .home-wrapper .points-table-wrapper .controls .league-popover.large .surface {
    width: min(92vw, 680px);
  }
  .home-container .home-wrapper .points-table-wrapper .controls .league-popover.small .surface {
    width: min(92vw, 420px);
  }
  .home-container .home-wrapper .points-table-wrapper .controls .league-popover .list.two-col {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .home-container .home-wrapper .points-table-wrapper .controls .points-home-filter-dropdowns .chip .chip-label {
    max-width: min(200px, 52vw);
  }
}
.home-container .home-wrapper .points-table-wrapper .group-title {
  font-family: "Inter-700";
  color: #000000;
  letter-spacing: 0.3px;
  margin: 12px 0 8px;
  text-transform: uppercase;
  font-size: 14px;
  display: flex;
  gap: 5px;
}
.home-container .home-wrapper .points-table-wrapper .table-card {
  background: #ffffff;
  overflow: hidden;
}
.home-container .home-wrapper .points-table-wrapper .table-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -ms-overflow-style: none;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.home-container .home-wrapper .points-table-wrapper .table-scroll::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.home-container .home-wrapper .points-table-wrapper table.points-table {
  width: 100%;
  /* Same column widths for every group table so headers/stats line up vertically */
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  /* optional: also tighten the body cells for those stat columns */
}
.home-container .home-wrapper .points-table-wrapper table.points-table thead {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  border-radius: 10px 10px 0 0;
}
.home-container .home-wrapper .points-table-wrapper table.points-table thead th {
  padding: 12px 20px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  text-align: center;
  white-space: nowrap;
  font-family: "Inter-200";
  color: #ffffff;
  overflow: hidden;
  text-overflow: ellipsis;
}
.home-container .home-wrapper .points-table-wrapper table.points-table thead th.col-team {
  width: 34%;
  text-align: left;
  font-family: "Inter-200";
  color: #ffffff;
}
.home-container .home-wrapper .points-table-wrapper table.points-table thead th:last-child {
  width: 0;
  padding-left: 0;
  padding-right: 0;
  overflow: hidden;
}
.home-container .home-wrapper .points-table-wrapper table.points-table .points-table tbody td.slim,
.home-container .home-wrapper .points-table-wrapper table.points-table .points-table tbody td.big {
  padding-left: 8px;
  padding-right: 8px;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody tr {
  transition: background 120ms ease;
  position: relative;
  border-radius: 10px;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody tr:hover {
  background: #ffffff;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td {
  padding: 5px;
  text-align: center;
  font-size: 14px;
  white-space: nowrap;
  font-family: "Inter-200";
  color: #000000;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.team-cell {
  text-align: left;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.team-cell .rank {
  flex-shrink: 0;
  width: 22px;
  text-align: right;
  color: #000000;
  font-weight: 800;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.team-cell .logo {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  overflow: hidden;
  background: #f1f5f9;
  display: grid;
  place-items: center;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.team-cell .logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.team-cell .logo .fallback {
  font-size: 12px;
  color: #000000;
  font-weight: 800;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.team-cell .name {
  flex: 1;
  min-width: 0;
  font-family: "Inter-200";
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.big {
  font-family: "Inter-200";
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell .form {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell .form .dot {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-family: "Inter-200";
  color: #ffffff;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell .form .win {
  background: #1AA915;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell .form .loss {
  background: #D8252D;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell .form .tie {
  background: #9ca3af;
  color: #111827;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.form-cell .form .nr {
  background: #a78bfa;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody td.row-actions {
  width: 40px;
  padding-right: 18px;
}
.home-container .home-wrapper .points-table-wrapper table.points-table tbody .row-divider .border-bottom {
  height: 1.3px;
  background: #DBDBDB;
}
@media (max-width: 640px) {
  .home-container .home-wrapper .points-table-wrapper .subtitle {
    margin-bottom: 8px;
  }
  .home-container .home-wrapper .points-table-wrapper .group-title {
    margin: 8px 0;
  }
  .home-container .home-wrapper .points-table-wrapper table.points-table thead th {
    padding: 10px;
  }
  .home-container .home-wrapper .points-table-wrapper table.points-table tbody td {
    padding: 12px 10px;
  }
}
.home-container .home-wrapper .league-stats {
  margin-top: 40px;
  width: 100%;
  min-width: 0;
  /* Size breakpoints to the stats column (not only viewport), so cards don’t
     collapse to one column when the page is wide but this block is narrow. */
  container-type: inline-size;
  container-name: league-stats;
  /* responsive (viewport fallback when container queries aren’t enough) */
}
.home-container .home-wrapper .league-stats .heading {
  margin-bottom: 16px;
  font-size: 20px;
  font-family: "Inter-500";
}
.home-container .home-wrapper .league-stats .stats-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  width: 100%;
  min-width: 0;
}
.home-container .home-wrapper .league-stats .stat-card {
  background: #fff;
  border: 1px solid #e8e9ef;
  border-radius: 14px;
  overflow: hidden;
}
.home-container .home-wrapper .league-stats .stat-card .card-header {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #fff;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.home-container .home-wrapper .league-stats .stat-card .card-header .left {
  display: flex;
  align-items: center;
  gap: 8px;
}
.home-container .home-wrapper .league-stats .stat-card .card-header .left .icon {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
  line-height: 1;
}
.home-container .home-wrapper .league-stats .stat-card .card-header .left .icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.home-container .home-wrapper .league-stats .stat-card .card-header .left .title {
  font-size: 12px;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  font-family: "Inter-200";
}
.home-container .home-wrapper .league-stats .stat-card .card-header .view-all {
  font-family: "Inter-200";
  font-size: 12px;
  text-decoration: underline;
  background-color: #5753C0;
  border: none;
  color: #ffffff;
}
.home-container .home-wrapper .league-stats .stat-card .card-body {
  display: flex;
  flex-direction: column;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row.headings {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  padding: 8px 12px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row.headings .row-left {
  font-family: "Inter-200";
  color: #18181B;
  font-size: 12px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row.headings .right-columns {
  display: flex;
  gap: 20px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row.headings .right-columns .column-data {
  text-align: center;
  font-family: "Inter-200";
  color: #18181B;
  font-size: 12px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row {
  padding: 10px 12px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .right-columns {
  display: flex;
  gap: 20px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .right-columns .multi-column {
  display: flex;
  gap: 6px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .right-columns .multi-column .column-data {
  min-width: 40px;
  text-align: center;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .right-columns .column-data {
  font-weight: 500;
  text-align: right;
  font-family: "Inter-200";
  font-size: 14px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .row-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .row-left .avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: #e9ecf6;
  flex: 0 0 36px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .row-left .avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .row-left .who {
  min-width: 0;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .row-left .who .name {
  font-family: "Inter-200";
  color: #18181B;
  font-size: 14px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .row-left .who .team {
  color: #71717A;
  font-size: 12px;
  margin-top: 2px;
  font-family: "Inter-200";
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row .value {
  font-family: "Inter-200";
  color: #18181B;
  font-size: 14px;
}
.home-container .home-wrapper .league-stats .stat-card .card-body .row:nth-child(even) {
  background: #F0F0FF;
}
@media (max-width: 1024px) {
  .home-container .home-wrapper .league-stats .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .home-container .home-wrapper .league-stats .stats-grid {
    grid-template-columns: 1fr;
  }
}

/* League stats card grid — follow the stats block width, not the full viewport */
@container league-stats (max-width: 900px) {
  .home-container .home-wrapper .league-stats .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@container league-stats (max-width: 520px) {
  .home-container .home-wrapper .league-stats .stats-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) {
  .main-tournament-wrap .custom-container.main-middle-content-wrap {
    padding-left: 12px;
    padding-right: 12px;
  }
  .main-tournament-wrap .breadcrumb-container {
    padding: 12px 0 8px;
    gap: 6px;
    flex-wrap: wrap;
    row-gap: 4px;
  }
  .main-tournament-wrap .breadcrumb-container .breadcrumb-item,
  .main-tournament-wrap .breadcrumb-container .breadcrumb-item-active {
    font-size: 12px;
    line-height: 1.35;
  }
}
@media (max-width: 480px) {
  .main-tournament-wrap .custom-container.main-middle-content-wrap {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.main-tournament-wrap .main-middle-content-wrap {
  margin-top: 0px;
  padding-top: 1px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container {
  background-color: #ffffff;
  padding: 16px 30px;
  height: auto;
  min-height: auto;
  border-radius: 9px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container.tournaments-wrapper-container--empty {
  min-height: calc(100vh - 192px);
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .heading {
  font-size: 18px;
  font-family: "Inter-500";
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper {
  display: flex;
  gap: 16px;
  align-items: center;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 5px;
  min-width: 0;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .tournaments-tab-scroll {
  display: flex;
  flex: 1;
  flex-wrap: wrap;
  gap: 15px;
  align-items: center;
  min-width: 0;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .tab {
  padding: 8px 16px;
  font-size: 16px;
  cursor: pointer;
  background-color: #F6F6F6;
  border: none;
  border-radius: 20px;
  transition: 0.3s ease;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .tab.active {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: white;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .tab:hover {
  background-color: #ddd;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons img {
  display: block;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 300px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  left: 14px;
  width: 16px;
  height: 16px;
  padding: 0;
  opacity: 0.7;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper input {
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  width: 100%;
  height: 40px;
  font-size: 14px;
  color: #111827;
  border-radius: 999px;
  padding: 0 16px 0 40px;
  background: #fff;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper input::placeholder {
  color: #9ca3af;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper input:focus {
  border-color: rgba(44, 41, 112, 0.28);
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.08);
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper .search-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  background: #ffffff;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
  border-radius: 7px;
  z-index: 20;
  max-height: 240px;
  overflow-y: auto;
  padding: 8px 0;
  /* empty / loading */
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper .search-dropdown .tournaments-names-wrapper {
  margin: 0;
  padding: 0;
  list-style: none;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper .search-dropdown .item {
  padding: 12px 16px;
  font-size: 16px;
  line-height: 24px;
  color: #0b0b0c;
  cursor: pointer;
  transition: background 0.15s ease;
  font-family: "Inter-500";
  font-size: 14px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper .search-dropdown .item:hover, .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper .search-dropdown .item:focus {
  background: #f1f6ff;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournament-search-wrapper .search-dropdown .empty {
  padding: 12px 16px;
  font-size: 15px;
  color: #6b7280;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .view-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid #d9dde6;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .create-button {
  opacity: 1;
  gap: 6px;
  border-radius: 8px;
  padding-top: 10px;
  padding-right: 12px;
  padding-bottom: 10px;
  padding-left: 12px;
  background-color: #201E52;
  color: #ffffff;
  display: flex;
  cursor: pointer;
  border: none;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .create-button span {
  font-family: "Inter-500";
  font-size: 18px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournaments-view-toggle {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  border-radius: 10px;
  transition: background-color 0.18s ease, opacity 0.18s ease;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournaments-view-toggle img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  opacity: 0.65;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournaments-view-toggle.active {
  background: #e8ebf2;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournaments-view-toggle.active img {
  opacity: 1;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper .right-icons .tournaments-view-toggle:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.45);
  outline-offset: 1px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper {
  display: flex;
  flex-direction: row;
  gap: 8px;
  margin-top: 20px;
  flex-wrap: wrap;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card {
  position: relative;
  width: calc(20% - 30px);
  padding-bottom: 33px;
  max-width: 295px;
  height: 200px;
  background: url("/assets/bg_image_card-BteOmsN6.svg") no-repeat center;
  background-size: cover;
  border-radius: 12px;
  overflow: hidden;
}
@media (max-width: 1520px) {
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card {
    width: calc(25% - 30px);
  }
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .tournament-card-edit-btn {
  position: absolute;
  top: 10px;
  right: 8px;
  z-index: 6;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.22);
  color: #ffffff;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
  transition: background 0.15s ease, transform 0.15s ease;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .tournament-card-edit-btn:hover {
  background: rgba(255, 255, 255, 0.38);
  transform: scale(1.05);
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card.tournament-card--editable .tournament-status {
  margin-top: 58px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .tournament-status {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #D71D0C;
  color: #ffffff;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-family: "Inter-700";
  text-align: end;
  margin-top: 26px;
  right: 5px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .tournament-status span {
  font-style: italic;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image {
  position: relative;
  width: 100%;
  height: 100%;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-bg-images {
  display: flex;
  gap: 85px;
  width: 100%;
  height: 100%;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info {
  position: absolute;
  top: 75px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  text-align: center;
  color: #ffffff;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info:hover {
  transform: translateX(-50%) scale(1.07);
  cursor: pointer;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info p {
  margin: 5px 0;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info .tournament-title {
  font-size: 18px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-family: "Bebas-Neue-100";
  font-weight: 500;
  font-style: italic;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info .tournament-dates {
  font-size: 17px;
  margin-top: 5px;
  font-family: "Bebas Neue Pro";
  font-weight: 100;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .location-info {
  background-color: #F0F0F0;
  width: 100%;
  height: 25px;
  text-align: center;
  padding-top: 8px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .location-info img {
  text-align: center;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .location-info span {
  font-family: "Inter-200";
  font-size: 14px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper {
  width: 100%;
  overflow-x: auto;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper tr {
  cursor: pointer;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th,
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td {
  text-align: left;
  padding: 12px;
  border-bottom: 1.5px solid #ddd;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th {
  color: #333;
  font-family: "Inter-700";
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td {
  font-family: "Inter-100";
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td .cell-with-icon {
  display: flex;
  gap: 5px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td .tournament-table-name-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td .tournament-table-edit-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid #201e52;
  border-radius: 6px;
  background: #f4f4fb;
  color: #201e52;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td .tournament-table-edit-btn:hover {
  background: #201e52;
  color: #ffffff;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(1),
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(1) {
  width: 45%;
  font-size: 14px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(2),
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(2) {
  width: 15%;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(3),
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(3) {
  width: 10%;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(4),
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(4) {
  width: 10%;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(2),
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(3),
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(4) {
  font-size: 12px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper .status.live {
  color: #e74c3c;
  font-weight: bold;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper .status .cell-with-icon .live-text {
  padding-top: 5px;
}
@media screen and (max-width: 768px) {
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th,
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td {
    padding: 8px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(1),
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(1) {
    width: 50%;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(2),
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(2) {
    width: 20%;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(3),
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(3) {
    width: 20%;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper th:nth-child(4),
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .table-wrapper td:nth-child(4) {
    width: 10%;
  }
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-load-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 18px;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-load-more-btn {
  border: 1px solid #d6d6dc;
  border-radius: 12px;
  background: #fff;
  color: #25253f;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: 1;
  padding: 12px 20px;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-load-more-btn:hover {
  border-color: #b8b8c7;
  box-shadow: 0 6px 16px rgba(37, 37, 63, 0.1);
}
.main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-load-more-btn:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 2px;
}
@media (max-width: 1024px) and (min-width: 769px) {
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container {
    padding: 30px 20px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper {
    gap: 12px;
    flex-wrap: wrap;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper {
    gap: 10px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper .tournament-search-wrapper {
    width: 200px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper {
    gap: 12px;
    margin-top: 16px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card {
    width: calc(33.33% - 9px) !important;
    max-width: none;
  }
}
@media (max-width: 900px) and (min-width: 769px) {
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card {
    width: calc(50% - 6px) !important;
  }
}
@media (max-width: 768px) {
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container {
    padding: 20px 12px;
    border-radius: 0;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .heading {
    font-size: 17px;
    margin: 0;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper {
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
    align-items: stretch;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper .tournament-search-wrapper {
    flex: 1;
    min-width: 0;
    width: auto;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper .tournament-search-wrapper .search-dropdown {
    width: 100%;
    min-width: 0;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper .create-button {
    align-items: center;
    flex-shrink: 0;
    padding: 10px 12px;
    white-space: nowrap;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper .create-button span {
    font-size: 14px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-tab-wrapper {
    display: none;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper {
    flex-direction: column;
    flex-wrap: nowrap;
    margin-top: 16px;
    gap: 12px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card {
    width: 100% !important;
    max-width: none !important;
    height: auto;
    min-height: 188px;
    padding-bottom: 0;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .tournament-status {
    display: none !important;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image {
    min-height: 160px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info:hover {
    transform: translate(-50%, -50%) scale(1.03);
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info .tournament-title {
    font-size: 15px;
    letter-spacing: 1.2px;
    padding: 0 10px;
    line-height: 1.25;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .card-image .card-info .tournament-dates {
    font-size: 14px;
    margin-top: 6px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .location-info {
    height: auto;
    min-height: 40px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-wrapper .tournament-card .location-info span {
    font-size: 13px;
    text-align: center;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .no-data-found {
    padding: 32px 12px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .no-data-found p {
    font-size: 15px;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container {
    padding: 16px 10px;
  }
  .main-tournament-wrap .main-middle-content-wrap .tournaments-wrapper-container .tournaments-main-heading-wrapper .right-wrapper .create-button span {
    font-size: 13px;
  }
}

.gallery-wrapper {
  padding-top: 20px;
  /* responsiveness */
}
.gallery-wrapper .gallery-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.gallery-wrapper .gallery-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.gallery-wrapper .gallery-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.gallery-wrapper .gallery-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.gallery-wrapper .gallery-btn--primary {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
}
.gallery-wrapper .gallery-btn--danger {
  background: #ffffff;
  color: #ef4444;
  border-color: #fca5a5;
}
.gallery-wrapper .gallery-btn--secondary {
  background: #ffffff;
  color: #2c2970;
  border-color: #d1d5db;
}
.gallery-wrapper .gallery-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 17px;
  align-items: center;
}
.gallery-wrapper .gallery-card {
  position: relative;
  height: 247px;
  flex: 0 0 calc((100% - 51px) / 4);
  min-width: 0;
  border-radius: 2px;
  overflow: hidden;
  background: #000000;
  box-shadow: 0px 0px 3.7px 0px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}
.gallery-wrapper .gallery-card.is-selected {
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.24);
}
.gallery-wrapper .gallery-card .gallery-select {
  position: absolute;
  left: 12px;
  top: 12px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid #ffffff;
  background: rgba(255, 255, 255, 0.16);
  z-index: 3;
  cursor: pointer;
}
.gallery-wrapper .gallery-card .gallery-select.is-selected {
  background: #ffffff;
  box-shadow: inset 0 0 0 4px #2c2970;
}
.gallery-wrapper .gallery-card .gallery-img-wrapper {
  position: absolute;
  height: 276px;
  left: -21px;
  top: -18px;
  width: 414px;
}
.gallery-wrapper .gallery-card .gallery-img-wrapper .gallery-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
}
.gallery-wrapper .gallery-card .gallery-overlay {
  position: absolute;
  background: linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0) 90.643%);
  height: 144px;
  left: -7px;
  top: 103px;
  width: 395px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25), 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.gallery-wrapper .gallery-card .gallery-content {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  left: 19px;
  bottom: 19px;
  width: calc(100% - 38px);
  max-width: 174px;
  z-index: 1;
}
.gallery-wrapper .gallery-card .gallery-content .gallery-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.gallery-wrapper .gallery-card .gallery-content .gallery-info .gallery-match {
  font-family: "Inter-700";
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  margin: 0;
  line-height: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  max-width: 100%;
}
.gallery-wrapper .gallery-card .gallery-content .gallery-info .gallery-date {
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.68);
  letter-spacing: 1.96px;
  margin: 0;
  line-height: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.gallery-wrapper .gallery-card .gallery-badge {
  position: absolute;
  backdrop-filter: blur(1.05px);
  -webkit-backdrop-filter: blur(1.05px);
  background: rgba(0, 0, 0, 0.62);
  display: flex;
  height: 24px;
  align-items: center;
  justify-content: space-between;
  right: 0;
  top: 0;
  padding: 3px 6px;
  width: 50px;
  z-index: 2;
  box-sizing: border-box;
}
.gallery-wrapper .gallery-card .gallery-badge .gallery-count {
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: 1.96px;
  margin: 0;
  line-height: normal;
  flex-shrink: 0;
}
.gallery-wrapper .gallery-card .gallery-badge .gallery-icon {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
  display: block;
}
.gallery-wrapper .gallery-card:hover .gallery-img {
  transform: scale(1.02);
}
@media (max-width: 1200px) {
  .gallery-wrapper .gallery-card {
    flex: 0 0 calc((100% - 34px) / 3);
  }
}
@media (max-width: 900px) {
  .gallery-wrapper .gallery-card {
    flex: 0 0 calc((100% - 17px) / 2);
  }
}
@media (max-width: 520px) {
  .gallery-wrapper .gallery-card {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .gallery-wrapper .gallery-header {
    flex-direction: column;
    align-items: stretch;
  }
  .gallery-wrapper .gallery-actions {
    width: 100%;
  }
  .gallery-wrapper .gallery-btn {
    flex: 1 1 160px;
  }
}
.gallery-wrapper .no-data-found {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 30px;
}
.gallery-wrapper .no-data-found img {
  height: 200px;
}
.gallery-wrapper .gallery-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 0;
  color: #7a7a7a;
  font-family: "Inter-500";
}

.about-wrapper {
  padding-top: 20px;
}

.squads-wrapper {
  padding-top: 20px;
  padding-bottom: 20px;
}
.squads-wrapper .topbar {
  display: flex;
  align-items: center;
  margin-bottom: 14px;
  width: 100%;
}
.squads-wrapper .topbar .heading {
  margin-right: auto;
  font-family: "Inter-500";
}
.squads-wrapper .topbar .filters {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.squads-wrapper .topbar .filters .filter-dropdown {
  position: relative;
}
.squads-wrapper .topbar .filters .chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(0, 0, 0, 0.5019607843);
  color: #000000;
  border-radius: 10px;
  background: #ffffff;
  font-size: 14px;
  cursor: pointer;
  font-family: "Inter-100";
  white-space: nowrap;
  min-width: 150px;
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.squads-wrapper .topbar .filters .chip .caret {
  font-size: 12px;
  transform: translateY(1px);
  margin-left: auto;
  display: flex;
  align-items: center;
  transition: transform 0.2s ease;
}
.squads-wrapper .topbar .filters .chip .caret img {
  transition: transform 0.2s ease;
}
.squads-wrapper .topbar .filters .chip .caret.open img {
  transform: rotate(180deg);
}
.squads-wrapper .topbar .filters .dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  min-width: 250px;
  background: #ffffff;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
  border-radius: 7px;
  z-index: 20;
  max-height: 300px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.squads-wrapper .topbar .filters .dropdown-menu .searchbox {
  position: relative;
  padding: 8px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.squads-wrapper .topbar .filters .dropdown-menu .searchbox input {
  height: 40px;
  width: 100%;
  border: 1px solid rgba(76, 76, 77, 0.25);
  background: #ffffff;
  padding: 0 40px 0 14px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #000000;
  outline: none;
  border-radius: 40px;
  box-sizing: border-box;
}
.squads-wrapper .topbar .filters .dropdown-menu .searchbox input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
}
.squads-wrapper .topbar .filters .dropdown-menu .searchbox img {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  width: 20px;
  height: 20px;
}
.squads-wrapper .topbar .filters .dropdown-menu .dropdown-list {
  max-height: 240px;
  overflow-y: auto;
  padding: 4px 0;
}
.squads-wrapper .topbar .filters .dropdown-menu .dropdown-list .dropdown-item {
  padding: 12px 16px;
  cursor: pointer;
  color: #000000;
  font-family: "Inter-500";
  font-size: 14px;
  transition: background-color 0.2s ease;
}
.squads-wrapper .topbar .filters .dropdown-menu .dropdown-list .dropdown-item:hover {
  background-color: #f3f3f3;
}
.squads-wrapper .topbar .filters .dropdown-menu .dropdown-list .dropdown-empty {
  padding: 12px 16px;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
  text-align: center;
}
.squads-wrapper .topbar .filters .searchbox {
  position: relative;
  min-width: 200px;
  max-width: 300px;
  flex: 1 1 auto;
}
.squads-wrapper .topbar .filters .searchbox input {
  height: 40px;
  width: 100%;
  max-width: 100%;
  border: 1px solid rgba(76, 76, 77, 0.25);
  background: #ffffff;
  padding: 0 40px 0 14px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #000000;
  outline: none;
  border-radius: 40px;
  box-sizing: border-box;
}
.squads-wrapper .topbar .filters .searchbox input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
}
.squads-wrapper .topbar .filters .searchbox img {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  width: 20px;
  height: 20px;
}
.squads-wrapper .topbar .filters .icon-btn {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}
.squads-wrapper .squads-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 0;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
}
.squads-wrapper .player-card-wrap {
  width: 100%;
}
.squads-wrapper .player-card-wrap .ti-player {
  height: 170px;
}

.grounds-wrapper {
  padding-top: 20px;
  /* responsiveness */
}
.grounds-wrapper .grounds-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.grounds-wrapper .grounds-header-right {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-left: auto;
}
.grounds-wrapper .grounds-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.grounds-wrapper .heading {
  margin-bottom: 0;
  font-family: "Inter-500";
}
.grounds-wrapper .grounds-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.grounds-wrapper .grounds-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.grounds-wrapper .grounds-btn--primary {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
}
.grounds-wrapper .grounds-btn--secondary {
  background: #ffffff;
  color: #2c2970;
  border-color: #c7cae4;
}
.grounds-wrapper .grounds-btn--danger {
  background: #ffffff;
  color: #ef4444;
  border-color: #fca5a5;
}
.grounds-wrapper .grounds-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid #d9dde6;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.grounds-wrapper .grounds-view-toggle {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
  transition: background-color 0.18s ease, opacity 0.18s ease;
}
.grounds-wrapper .grounds-view-toggle img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  opacity: 0.65;
}
.grounds-wrapper .grounds-view-toggle.active {
  background: #e8ebf2;
}
.grounds-wrapper .grounds-view-toggle.active img {
  opacity: 1;
}
.grounds-wrapper .grounds-view-toggle:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 1px;
}
.grounds-wrapper .grounds-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 17px;
  align-items: center;
  padding-bottom: 30px;
}
.grounds-wrapper .grounds-grid .ground-card {
  position: relative;
  min-height: 200px;
  height: auto;
  flex: 0 0 calc((100% - 51px) / 4);
  min-width: 0;
  border-radius: 13px;
  overflow: hidden;
  background: #000000;
  box-shadow: 0px 0px 3.7px 0px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}
.grounds-wrapper .grounds-grid .ground-card.is-selected {
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.24);
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-actions {
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  gap: 8px;
  z-index: 2;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 8px;
  background: rgba(17, 24, 39, 0.68);
  color: #ffffff;
  cursor: pointer;
  transition: all 0.2s ease;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action:hover:not(:disabled) {
  background: rgba(31, 41, 55, 0.88);
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action--select {
  width: 16px;
  height: 16px;
  border-radius: 2px;
  border: 1px solid #2c2970;
  background: #ffffff;
  padding: 0;
  margin-top: 8px;
  position: relative;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action--select::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 4px;
  height: 8px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action--select.is-selected {
  background: #2c2970;
  border-color: #2c2970;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action--select.is-selected::after {
  opacity: 1;
}
.grounds-wrapper .grounds-grid .ground-card .ground-card-action--danger:hover:not(:disabled) {
  background: rgba(127, 29, 29, 0.92);
}
.grounds-wrapper .grounds-grid .ground-card .ground-img-wrapper {
  position: absolute;
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
}
.grounds-wrapper .grounds-grid .ground-card .ground-img-wrapper img.ground-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
}
.grounds-wrapper .grounds-grid .ground-card .overlay {
  position: absolute;
  background: linear-gradient(to top, #000000 20.447%, rgba(0, 0, 0, 0) 90.643%);
  height: 100%;
  left: 0;
  top: 0;
  width: 100%;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25), 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.grounds-wrapper .grounds-grid .ground-card .content {
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  width: calc(100% - 40px);
  max-width: 274px;
  z-index: 1;
  padding-bottom: 3px;
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-info {
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-items: center;
  width: 100%;
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-info .ground-name {
  font-family: "Inter-700";
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  color: #ffffff;
  margin: 0;
  line-height: normal;
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-info .ground-city {
  font-family: "Inter-500";
  font-size: 12px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.68);
  letter-spacing: 1.96px;
  margin: 0;
  text-transform: uppercase;
}
.grounds-wrapper .grounds-grid .ground-card .content .divider-line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 1px;
  position: relative;
  transform: rotate(180deg);
}
.grounds-wrapper .grounds-grid .ground-card .content .divider-line::after {
  content: "";
  position: absolute;
  width: 60px;
  height: 1px;
  background: rgba(255, 255, 255, 0.3);
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-meta {
  display: flex;
  font-family: "Inter-500";
  font-size: 12px;
  font-weight: 500;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  color: #ffffff;
  line-height: 0;
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-meta .meta-item {
  margin: 0;
  line-height: normal;
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-meta .meta-item .meta-label {
  font-family: "Inter-500";
  font-weight: 600;
  font-style: normal;
}
.grounds-wrapper .grounds-grid .ground-card .content .ground-meta .meta-item .meta-value {
  color: rgba(255, 255, 255, 0.68);
}
.grounds-wrapper .grounds-grid .ground-card:hover img.ground-img {
  transform: scale(1.02);
}
.grounds-wrapper .grounds-list-wrap {
  width: 100%;
  overflow-x: auto;
  padding-bottom: 30px;
}
.grounds-wrapper .grounds-list-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter-500";
}
.grounds-wrapper .grounds-list-table thead th {
  padding: 12px 16px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #9ca3af;
  text-align: left;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
  white-space: nowrap;
}
.grounds-wrapper .grounds-list-table tbody tr {
  cursor: pointer;
  transition: background 0.18s ease;
}
.grounds-wrapper .grounds-list-table tbody tr:hover {
  background: #f9fafb;
}
.grounds-wrapper .grounds-list-table tbody tr.is-selected {
  background: #f0f4ff;
}
.grounds-wrapper .grounds-list-table tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid #e5e7eb;
  vertical-align: middle;
}
.grounds-wrapper .grounds-list-name {
  font-size: 14px;
  font-family: "Inter-600";
  color: #1f2937;
}
.grounds-wrapper .grounds-list-address {
  font-size: 13px;
  color: #4b5563;
}
.grounds-wrapper .grounds-list-value {
  font-size: 13px;
  color: #4b5563;
}
.grounds-wrapper .grounds-list-edit-btn {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d9dde6;
  border-radius: 8px;
  background: #ffffff;
  color: #2c2970;
  cursor: pointer;
}
.grounds-wrapper .grounds-list-edit-btn:hover {
  background: #f5f6fa;
}
@media (max-width: 1200px) {
  .grounds-wrapper .ground-card {
    flex: 0 0 calc((100% - 34px) / 3);
  }
}
@media (max-width: 900px) {
  .grounds-wrapper .ground-card {
    flex: 0 0 calc((100% - 17px) / 2);
  }
}
@media (max-width: 520px) {
  .grounds-wrapper .ground-card {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .grounds-wrapper .grounds-header {
    flex-direction: column;
    align-items: stretch;
  }
  .grounds-wrapper .grounds-header-right {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    margin-left: 0;
  }
  .grounds-wrapper .grounds-view-switch {
    align-self: flex-end;
  }
  .grounds-wrapper .grounds-header-actions {
    width: 100%;
  }
  .grounds-wrapper .grounds-btn {
    width: 100%;
  }
}
.grounds-wrapper .no-data-found {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 30px;
}
.grounds-wrapper .no-data-found img {
  height: 200px;
}
.grounds-wrapper .grounds-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 0;
  color: #7a7a7a;
  font-family: "Inter-500";
}

.ground-delete-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  z-index: 1000;
}

.ground-delete-modal {
  width: 100%;
  max-width: 410px;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  padding: 28px 18px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-family: "Inter-400", "Inter", sans-serif;
  text-align: center;
}
.ground-delete-modal__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e32735;
}
.ground-delete-modal__title {
  margin: 0;
  color: #111111;
  font-family: "Inter-600", "Inter", sans-serif;
  font-size: 24px;
  line-height: 1.2;
}
.ground-delete-modal__text {
  margin: 0;
  color: #8a8a8a;
  font-family: "Inter-400", "Inter", sans-serif;
  font-size: 13px;
  line-height: 1.4;
}
.ground-delete-modal__actions {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 4px;
}
.ground-delete-modal__btn {
  flex: 1 1 0;
  min-height: 40px;
  border-radius: 4px;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.ground-delete-modal__btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.ground-delete-modal__btn--cancel {
  background: #ffffff;
  border-color: #ffb3b8;
  color: #e32735;
}
.ground-delete-modal__btn--delete {
  background: #e32735;
  color: #ffffff;
}

.request-wrapper {
  padding-top: 20px;
}

.main-match-wrapper .main-middle-content-wrap {
  margin-top: 0px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper {
  margin-top: 5px;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper {
  position: relative;
  display: flex;
  align-items: flex-start;
  background-color: #201e52;
  background-image: url("/assets/TournamentHbg-D7ATlbKU.png");
  min-height: 37px;
  padding: 18px 28px 28px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 20px 20px 16px 16px;
  overflow: hidden;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(37, 34, 98, 0.08) 0%, rgba(37, 34, 98, 0) 55%);
  pointer-events: none;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper .match-name {
  position: relative;
  z-index: 1;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  margin: 0;
  max-width: 70%;
}
@media (max-width: 768px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper {
    padding: 16px 18px 24px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper .match-name {
    font-size: 16px;
    max-width: 100%;
  }
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .gallery-details-header-wrapper {
  background-image: url("/assets/match_bg_image-BSXyer--.svg");
  height: 79px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 12px;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .gallery-details-header-wrapper .gallery-details-header-content {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 25px;
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 0 30px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .gallery-details-header-wrapper .gallery-details-header-content .gallery-details-back-button {
  cursor: pointer;
  flex-shrink: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .gallery-details-header-wrapper .gallery-details-header-content .gallery-details-match-info {
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex: 1;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .gallery-details-header-wrapper .gallery-details-header-content .gallery-details-match-info .gallery-details-match-title {
  font-family: "Inter-500";
  font-size: 15px;
  color: #ffffff;
  text-transform: uppercase;
  margin: 0;
  line-height: normal;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .gallery-details-header-wrapper .gallery-details-header-content .gallery-details-match-info .gallery-details-match-meta {
  font-family: "Inter-100";
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 1.6px;
  margin: 0;
  line-height: normal;
  opacity: 85%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container {
  position: relative;
  top: -25px;
  z-index: 2;
  isolation: isolate;
  left: 0;
  right: 0;
  margin: 0 auto;
  background-color: #ffffff;
  border-radius: 7px;
  padding: 7px 24px 28px;
  box-shadow: 0 6px 18px rgba(20, 20, 43, 0.06);
  min-height: calc(100vh - 265px);
  /* global keyframes + responsive */
}
@media (min-width: 1920px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container {
    width: 96.7%;
  }
}
@media (min-width: 1600px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container {
    width: 96.8%;
  }
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header {
  position: relative;
  z-index: 3;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .matches-main-header {
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
  position: relative;
  z-index: 3;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .matches-main-header .heading {
  font-size: 20px;
  font-family: "Inter-500";
  margin: 0 0 12px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 5px;
  position: relative;
  z-index: 4;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs .chip {
  min-height: 42px;
  padding: 10px 18px;
  border: none;
  border-radius: 999px;
  background: #f3f3f5;
  color: #2f2f31;
  font-family: "Inter-700";
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs .chip.active {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(32, 30, 82, 0.2);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs .chip:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 2px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data {
  display: flex;
  align-items: center;
  gap: 30px;
  position: relative;
  z-index: 4;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data > .button-wrap {
  cursor: pointer;
  color: #ffffff;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data > .button-wrap span {
  font-size: 15px;
  margin-top: 3px;
  font-family: "Inter-200";
  color: #ffffff;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data > .button-wrap .schdule-button {
  border-radius: 5px;
  border: none;
  padding: 6px 10px;
  background-color: #201E52;
  display: flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data > .button-wrap:hover {
  filter: brightness(0.95);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .button-wrap--end {
  margin-left: auto;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  z-index: 4;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search {
  position: relative;
  z-index: 4;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search input {
  width: 300px;
  height: 40px;
  padding: 0 16px 0 40px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  border-radius: 999px;
  outline: none;
  background: #ffffff;
  background-image: url("data:image/svg+xml,%3csvg%20width='24'%20height='25'%20viewBox='0%200%2024%2025'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M19.6%2021.5L13.3%2015.2C12.8%2015.6%2012.225%2015.9167%2011.575%2016.15C10.925%2016.3833%2010.2333%2016.5%209.5%2016.5C7.68333%2016.5%206.14583%2015.8708%204.8875%2014.6125C3.62917%2013.3542%203%2011.8167%203%2010C3%208.18333%203.62917%206.64583%204.8875%205.3875C6.14583%204.12917%207.68333%203.5%209.5%203.5C11.3167%203.5%2012.8542%204.12917%2014.1125%205.3875C15.3708%206.64583%2016%208.18333%2016%2010C16%2010.7333%2015.8833%2011.425%2015.65%2012.075C15.4167%2012.725%2015.1%2013.3%2014.7%2013.8L21%2020.1L19.6%2021.5ZM9.5%2014.5C10.75%2014.5%2011.8125%2014.0625%2012.6875%2013.1875C13.5625%2012.3125%2014%2011.25%2014%2010C14%208.75%2013.5625%207.6875%2012.6875%206.8125C11.8125%205.9375%2010.75%205.5%209.5%205.5C8.25%205.5%207.1875%205.9375%206.3125%206.8125C5.4375%207.6875%205%208.75%205%2010C5%2011.25%205.4375%2012.3125%206.3125%2013.1875C7.1875%2014.0625%208.25%2014.5%209.5%2014.5Z'%20fill='%234C4C4D'%20fill-opacity='0.6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: 14px center;
  background-size: 16px 16px;
  font-size: 14px;
  color: #111827;
  position: relative;
  z-index: 1;
  pointer-events: auto;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search input::placeholder {
  color: #9ca3af;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search input:focus {
  border-color: rgba(44, 41, 112, 0.28);
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.08);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap {
  cursor: pointer;
  cursor: pointer;
  color: #ffffff;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap span {
  font-size: 15px;
  margin-top: 3px;
  font-family: "Inter-200";
  color: #ffffff;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap .schdule-button {
  border-radius: 5px;
  border: none;
  padding: 0px 15px;
  background-color: #201E52;
  display: flex;
  gap: 5px;
  padding: 6px 10px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap:hover {
  filter: brightness(0.95);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filters {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filters .filter {
  padding: 8px 12px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid #201e52;
  background: #ffffff;
  font-weight: 600;
  cursor: pointer;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons {
  display: flex;
  gap: 12px;
  align-items: center;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid #d9dde6;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
  transition: background-color 0.18s ease, opacity 0.18s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  opacity: 0.65;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle.active {
  background: #e8ebf2;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle.active img {
  opacity: 1;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar {
  position: relative;
  display: inline-block;
  z-index: 5;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar .date-calendar-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 999px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  width: 150px;
  padding: 5px;
  height: 41.6px;
  background-color: #ffffff;
  cursor: pointer;
  position: relative;
  z-index: 1;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar .date-calendar-filter img {
  pointer-events: none;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar .calendar-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.18);
  overflow: hidden;
  width: 385px;
  z-index: 1;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray {
  margin-top: 12px;
  width: 97%;
  background: #F3F3F3;
  border-radius: 12px;
  padding: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  animation: slideDown 160ms ease-out;
  position: relative;
  z-index: 4;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray .tray-left {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray .tray-left .filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding: 8px 12px;
  border-radius: 11px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  background: #ffffff;
  font-family: "Inter-500";
  cursor: pointer;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-200";
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray .tray-left .filter img {
  pointer-events: none;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray .tray-right {
  margin-left: auto;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray .tray-right .btn-clear {
  background-color: #ffffff;
  border: 1px solid var(--Accent---2, rgba(76, 76, 77, 0.2509803922));
  border-radius: 6px;
  padding: 8px 12px;
  font-family: "Inter-500";
  color: #0f172a;
  cursor: pointer;
  font-family: "Inter-200";
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray .tray-right .btn-clear:hover {
  background: #e2e8f0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-load-more-wrap {
  display: flex;
  justify-content: center;
  margin: 20px 0 4px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-load-more-btn {
  min-height: 44px;
  padding: 10px 28px;
  border-radius: 999px;
  border: none;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 14px;
  cursor: pointer;
  transition: filter 0.2s ease, opacity 0.2s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-load-more-btn:hover:not(:disabled) {
  filter: brightness(1.05);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-load-more-btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 720px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-wrapper-container .filter-tray {
    flex-direction: column;
    align-items: stretch;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-wrapper-container .filter-tray .tray-right {
    width: 100%;
    display: flex;
    justify-content: flex-end;
  }
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .cards {
  display: grid;
  gap: 12px;
  background-color: #FCFCFF;
  border: 1px solid #FCFCFF;
  box-shadow: 0px 1px 4.1px 0px rgba(0, 0, 0, 0.1803921569);
  border-radius: 12px;
  margin-top: 10px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card {
  display: grid;
  grid-template-columns: 1.2fr 1.6fr 1px 0.6fr;
  align-items: stretch;
  gap: 16px;
  padding: 10px 18px 0px 10px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(20, 20, 43, 0.03);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .match-card-meta-with-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .match-card-meta-with-actions .meta {
  flex: 1;
  min-width: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .match-edit-icon-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid rgba(32, 30, 82, 0.22);
  border-radius: 8px;
  background: #ffffff;
  color: #201e52;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .match-edit-icon-btn:hover {
  background: rgba(32, 30, 82, 0.06);
  border-color: #201e52;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .match-edit-icon-btn:active {
  transform: scale(0.96);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .meta {
  cursor: pointer;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .meta .tag {
  display: inline-block;
  font-family: "Inter-700";
  color: #201E52;
  margin-bottom: 6px;
  font-size: 12px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .meta .details p {
  margin: 0 0 2px;
  font-family: "Inter-700";
  font-size: 13px;
  line-height: 1.3;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .meta .details .sub {
  color: rgba(0, 0, 0, 0.6784313725);
  font-family: "Inter-200";
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams {
  display: flex;
  flex-direction: column;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams::after {
  position: absolute;
  left: -11px;
  top: 42%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams::before {
  position: absolute;
  right: -18px;
  top: 42%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .second-row {
  padding-top: 6px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: 12px;
  padding-left: 12px;
  padding-right: 12px;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row:first-child::after {
  position: absolute;
  left: 50%;
  bottom: 0;
  top: 110%;
  transform: translateX(-50%);
  height: 1px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 322px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .name-and-chip {
  display: flex;
  gap: 20px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .name-and-chip .team {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .name-and-chip .chip-blue {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 7px;
  font-size: 16px;
  line-height: 18px;
  font-family: "Inter-600";
  background: #F4F4FF;
  color: #201E52;
  border: 1px solid rgba(244, 244, 255, 0.2);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .score {
  display: flex;
  gap: 2px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .score .runs {
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .score .ovr {
  display: block;
  font-size: 14px;
  color: #4c4c4d;
  font-family: "Inter-500";
  margin-top: 5px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .row .status {
  justify-self: end;
  font-family: "Inter-500";
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .teams .green-text {
  text-align: center;
  color: #1c8847;
  font-family: "Inter-700";
  font-size: 14px;
  padding: 5px 5px;
  margin: 0 auto;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams {
  display: flex;
  gap: 15px;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams::after {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams::before {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows {
  display: flex;
  flex-direction: column;
  padding-left: 20px;
  gap: 10px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: 12px;
  padding-left: 12px;
  padding-right: 12px;
  position: relative;
  padding-bottom: 5px;
  width: 330px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row:first-child::after {
  position: absolute;
  left: 55%;
  bottom: 0px;
  transform: translateX(-50%);
  height: 1px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 280px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .name-and-chip {
  display: flex;
  gap: 20px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .name-and-chip .team {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .name-and-chip .chip-blue {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 7px;
  font-size: 12px;
  line-height: 18px;
  font-family: "Inter-200";
  background: #F4F4FF;
  color: #7571CB;
  border: 1px solid rgba(244, 244, 255, 0.2);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .score {
  display: flex;
  gap: 2px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .score .runs {
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .score .ovr {
  display: block;
  font-size: 14px;
  color: #4c4c4d;
  font-family: "Inter-500";
  margin-top: 5px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .status {
  justify-self: end;
  font-family: "Inter-500";
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .time-data {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-right: 20px;
  padding-top: 30px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .time-data .date {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  margin: 0 0 2px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .time-data .time {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .time-data .time .hours {
  font-family: "Inter-700";
  font-size: 20px;
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .upcoming-teams .time-data .time .ampm {
  font-family: "Inter-500";
  font-size: 12px;
  color: #4c4c4d;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .divider {
  width: 1px;
  margin: 0 4px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .cta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .cta .btn.btn-secondary {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
  border-radius: 8px;
  padding: 10px 16px;
  border: none;
  font-weight: 700;
  cursor: pointer;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .cta .btn.btn-secondary:hover {
  filter: brightness(0.95);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-matches-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 10px;
}
@media (max-width: 768px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-matches-grid {
    flex-direction: column;
    gap: 12px;
  }
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card {
  background: #f5f5f5;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 6px;
  flex: 1 1 400px;
  min-width: 330px;
  max-width: 455px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-edit-icon-btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid rgba(32, 30, 82, 0.22);
  border-radius: 8px;
  background: #ffffff;
  color: #201e52;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-edit-icon-btn:hover {
  background: rgba(32, 30, 82, 0.06);
  border-color: #201e52;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-edit-icon-btn:active {
  transform: scale(0.96);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-match-header-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-match-header-row .live-indicator {
  flex: 1;
  min-width: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator {
  display: flex;
  flex-direction: column;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .live-tag {
  font-family: "Inter-700";
  font-size: 12px;
  color: #d8252d;
  line-height: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .upcoming-tag {
  font-family: "Inter-700";
  font-size: 12px;
  color: #e15600;
  line-height: 0;
  font-weight: 800;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .result-tag {
  color: #201E52;
  font-family: "Inter-700";
  font-size: 12px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-date {
  font-family: "Inter-700";
  font-size: 12px;
  color: #000000;
  margin-top: 6px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "Inter-200";
  font-size: 13px;
  color: rgba(76, 76, 77, 0.8);
  margin-top: 10px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info .separator {
  color: rgba(76, 76, 77, 0.8);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info .match-context-league,
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info .match-context-tournament {
  font-family: "Inter-200";
  font-size: 13px;
  color: rgba(76, 76, 77, 0.8);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-logo {
  width: 28px;
  height: 28px;
  background: white;
  border: 0.389px solid #7571cb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-logo img {
  width: 18.667px;
  height: 18.667px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.79);
  letter-spacing: -0.4px;
  text-transform: capitalize;
  overflow-wrap: break-word;
  max-width: 180px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score {
  display: flex;
  align-items: center;
  gap: 8px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.79);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs {
  display: flex;
  align-items: center;
  gap: 8px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs .score {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs .overs {
  font-family: "Inter-500";
  font-size: 12px;
  color: #4c4c4d;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
  flex: 1;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row {
  display: flex;
  align-items: center;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-logo {
  width: 28px;
  height: 28px;
  background: white;
  border: 0.389px solid #7571cb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-logo img {
  width: 18.667px;
  height: 18.667px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  letter-spacing: -0.4px;
  text-transform: capitalize;
  font-weight: 600;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section {
  display: flex;
  justify-content: flex-end;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info .time-label {
  font-family: "Inter-500";
  font-size: 12px;
  color: rgba(0, 0, 0, 0.79);
  font-weight: 500;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info .time-value {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  font-weight: 600;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .countdown-section {
  display: flex;
  justify-content: flex-start;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .countdown-section .countdown-text {
  font-family: "Inter-500";
  font-size: 13px;
  color: #433fac;
  font-weight: 500;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .countdown-section .countdown-text .countdown-bold {
  font-family: "Inter-500";
  font-weight: 600;
  color: #433fac;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .live-match-header .result-text {
  color: #107E0C;
  font-family: "Inter-200";
  font-size: 12px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details .umpire-info {
  font-family: "Inter-500";
  font-size: 13px;
  color: rgba(0, 0, 0, 0.63);
  margin: 0;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details .umpire-info .label {
  font-family: "Inter-500";
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info {
  display: flex;
  align-items: center;
  gap: 6px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info .venue-icon {
  width: 16px;
  height: 16px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info .venue-icon img {
  width: 100%;
  height: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info .venue-name {
  font-family: "Inter-500";
  font-size: 13px;
  color: #201E52;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .divider-line {
  height: 1px;
  background: linear-gradient(90deg, #ffffff 0%, rgba(87, 83, 192, 0.67) 43.1%, rgba(87, 83, 192, 0.67) 52.1%, #ffffff 100%);
  width: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .upcoming-match-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  border: 1px solid rgba(67, 63, 172, 0.36);
  border-radius: 36px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn span {
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn .btn-icon {
  width: 24px;
  height: 24px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn .btn-icon img {
  width: 100%;
  height: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn:hover {
  background: #201E52;
  transform: translateY(-1px);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn--secondary {
  background: #ffffff;
  border: 1px solid #201e52;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn--secondary span {
  color: #201e52;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content .match-center-btn--secondary:hover {
  background: rgba(32, 30, 82, 0.06);
  transform: translateY(-1px);
}
@media (max-width: 1200px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container {
    width: 99%;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card {
    grid-template-columns: 1fr;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .divider {
    display: none;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .match-card .cta {
    justify-content: flex-start;
    margin-top: 8px;
    gap: 8px;
    flex-wrap: wrap;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .controls .search input {
    width: 240px;
  }
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame {
  align-items: center;
  background-color: #f5f5ff;
  display: flex;
  justify-content: space-between;
  padding: 8px 16px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .header-info-text {
  color: #37348E;
  font-family: "Inter-700";
  font-size: 14px;
  letter-spacing: -0.4px;
  line-height: normal;
  width: 350px;
  max-width: 350px;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .header-info-text::before {
  content: "";
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 0.7px;
  height: 70px;
  background: rgba(76, 76, 77, 0.4);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 25px;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 {
  align-items: center;
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 813px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .match-info {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  height: 81px;
  justify-content: space-between;
  max-width: 292px;
  position: relative;
  margin-left: 45px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .match-info::before {
  content: "";
  position: absolute;
  right: -8px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 70px;
  background: rgba(76, 76, 77, 0.4);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .match-info .match-type {
  align-self: stretch;
  color: #7571CB;
  font-family: "Inter-700";
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.4px;
  line-height: normal;
  margin-top: -1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .match-info .match-details {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  height: 52px;
  justify-content: space-between;
  position: relative;
  width: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .match-info .match-details .text-wrapper {
  align-self: stretch;
  color: #000000;
  font-family: "Inter-500";
  font-size: 13px;
  line-height: normal;
  margin: 0 auto;
  position: relative;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .match-info .match-details .p {
  align-self: stretch;
  color: rgba(0, 0, 0, 0.6784313725);
  font-family: "Inter-200";
  font-size: 13px;
  line-height: normal;
  position: relative;
  margin: 0;
  color: rgba(0, 0, 0, 0.6784313725);
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .line {
  height: 52px;
  object-fit: cover;
  position: relative;
  width: 1px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 11px;
  position: relative;
  width: 445px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .header-info-text-2 {
  color: #4C4C4D;
  font-family: "Inter-500";
  font-size: 13px;
  font-weight: 500;
  height: 17px;
  letter-spacing: -0.4px;
  line-height: normal;
  margin-top: -1px;
  text-align: center;
  width: 445px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 24px;
  justify-content: center;
  width: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 {
  align-items: center;
  display: flex;
  gap: 10px;
  position: relative;
  width: 180px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .team-info {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .team-info .team-logo {
  align-items: center;
  background-color: #ffffff;
  border: 2px solid;
  border-color: #7571CB;
  border-radius: 43px;
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  overflow: hidden;
  padding: 6px 7px;
  width: 33px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .team-info .team-logo .ellipse {
  aspect-ratio: 1;
  height: 35px;
  margin-left: -1px;
  margin-right: -1px;
  object-fit: cover;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 126px;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .team-name {
  color: var(--variable-collection-black);
  font-family: "Inter-Medium", Helvetica;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.4px;
  line-height: normal;
  margin-top: -1px;
  width: fit-content;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 9px;
  width: 100%;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score {
  color: var(--variable-collection-black-duplicate);
  font-family: "Inter-SemiBold", Helvetica;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1px;
  width: fit-content;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score-2 {
  color: var(--variable-collection-black-duplicate);
  font-family: "Inter-Regular", Helvetica;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: normal;
  width: fit-content;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score-2 .span {
  color: #4c4c4d;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score-2 .text-wrapper-2 {
  color: #000000;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .create-button {
  align-items: center;
  background-color: #201E52;
  border-radius: 4px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 2px;
  height: 35px;
  justify-content: center;
  padding: 0px 10px;
  cursor: pointer;
}
.main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .frame .div .create-button .header-title {
  color: #ffffff;
  font-family: "Inter-Medium", Helvetica;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: normal;
  width: fit-content;
}
@media (max-width: 1400px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item {
    flex-wrap: wrap;
    min-height: auto;
    padding: 12px 16px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-result-section {
    width: 100%;
    margin-bottom: 12px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section {
    width: 100%;
    gap: 20px;
    flex-direction: column;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section .match-info-wrapper {
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section .match-info-wrapper .match-info-section {
    width: 100%;
    height: auto;
    gap: 8px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section .match-info-wrapper .vertical-divider-wrapper {
    display: none;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section .match-info-wrapper .teams-score-section {
    width: 100%;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section .match-action-section {
    width: 100%;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .past-matches-list-container .past-match-list-item .match-middle-section .match-action-section .match-center-button {
    width: 100%;
  }
}

/* ── Narrow/mobile layout via JS class (works in any wrapper context) ── */
.matches-header.matches-header--narrow .matches-main-header {
  margin-top: 0;
}
.matches-header.matches-header--narrow .matches-main-header .heading {
  font-size: 15px;
  line-height: 1.2;
  margin: 0 0 10px;
}
.matches-header.matches-header--narrow .toolbar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin-top: 0;
  gap: 12px;
}
.matches-header.matches-header--narrow .toolbar .tabs {
  order: 2;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 8px;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.matches-header.matches-header--narrow .toolbar .tabs::-webkit-scrollbar {
  display: none;
}
.matches-header.matches-header--narrow .toolbar .tabs .chip {
  flex-shrink: 0;
  min-height: 34px;
  padding: 8px 14px;
  font-size: 12px;
  letter-spacing: 0.04em;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data {
  order: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls .search {
  flex: 1;
  min-width: 0;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls .search input {
  width: 100%;
  height: 40px;
  padding: 0 14px 0 40px;
  border-radius: 10px;
  font-size: 14px;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls .button-wrap {
  flex-shrink: 0;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls .button-wrap .schdule-button {
  border-radius: 10px;
  padding: 0 14px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  gap: 8px;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls .button-wrap .schdule-button img {
  width: 16px;
  height: 16px;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .controls .button-wrap .schdule-button span {
  font-size: 14px;
  margin-top: 0;
}
.matches-header.matches-header--narrow .toolbar .right-filters-data .date-calendar,
.matches-header.matches-header--narrow .toolbar .right-filters-data .filter-view-icons {
  display: none;
}
.matches-header.matches-header--narrow .filter-tray {
  display: none;
}

/* ── Tournament Matches — tablet layout (769 – 1024px) ── */
@media (max-width: 1024px) and (min-width: 769px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper {
    padding: 16px 22px 24px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .images-name-wrapper .match-name {
    font-size: 18px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container {
    padding-left: 16px;
    padding-right: 16px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .matches-main-header {
    gap: 10px;
    flex-wrap: wrap;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .matches-main-header .controls .search input {
    width: 200px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar {
    flex-wrap: wrap;
    gap: 8px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .date-calendar .calendar-popover {
    width: min(385px, 80vw);
    right: 0;
  }
  .live-match-card {
    flex: 1 1 300px;
    min-width: 280px;
    max-width: none;
  }
}
/* Tournament Matches — mobile Figma layout.
   Must use the same ancestor chain as the nested desktop rules or these lose the cascade. */
@media (max-width: 768px) {
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container {
    border-radius: 12px;
    top: -12px;
    padding-top: 12px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .matches-main-header {
    margin-top: 0;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .matches-main-header .heading {
    margin: 0 0 12px;
    font-size: 15px;
    line-height: 1.2;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    margin-top: 0;
    gap: 12px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 2px;
    margin: 0;
    order: 2;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs::-webkit-scrollbar {
    display: none;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .tabs .chip {
    flex-shrink: 0;
    min-height: 34px;
    padding: 8px 14px;
    font-size: 12px;
    letter-spacing: 0.04em;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data {
    width: 100%;
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    order: 1;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search {
    flex: 1;
    min-width: 0;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search input {
    width: 100%;
    height: 40px;
    padding: 0 14px 0 40px;
    border-radius: 10px;
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3csvg%20width='24'%20height='25'%20viewBox='0%200%2024%2025'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M19.6%2021.5L13.3%2015.2C12.8%2015.6%2012.225%2015.9167%2011.575%2016.15C10.925%2016.3833%2010.2333%2016.5%209.5%2016.5C7.68333%2016.5%206.14583%2015.8708%204.8875%2014.6125C3.62917%2013.3542%203%2011.8167%203%2010C3%208.18333%203.62917%206.64583%204.8875%205.3875C6.14583%204.12917%207.68333%203.5%209.5%203.5C11.3167%203.5%2012.8542%204.12917%2014.1125%205.3875C15.3708%206.64583%2016%208.18333%2016%2010C16%2010.7333%2015.8833%2011.425%2015.65%2012.075C15.4167%2012.725%2015.1%2013.3%2014.7%2013.8L21%2020.1L19.6%2021.5ZM9.5%2014.5C10.75%2014.5%2011.8125%2014.0625%2012.6875%2013.1875C13.5625%2012.3125%2014%2011.25%2014%2010C14%208.75%2013.5625%207.6875%2012.6875%206.8125C11.8125%205.9375%2010.75%205.5%209.5%205.5C8.25%205.5%207.1875%205.9375%206.3125%206.8125C5.4375%207.6875%205%208.75%205%2010C5%2011.25%205.4375%2012.3125%206.3125%2013.1875C7.1875%2014.0625%208.25%2014.5%209.5%2014.5Z'%20fill='%234C4C4D'%20fill-opacity='0.6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: 14px center;
    background-size: 16px 16px;
    font-size: 14px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap {
    flex-shrink: 0;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap .schdule-button {
    flex-shrink: 0;
    border-radius: 10px;
    padding: 0 14px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    gap: 8px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap .schdule-button img {
    width: 16px;
    height: 16px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap .schdule-button span {
    font-size: 14px;
    margin-top: 0;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar,
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons {
    display: none !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-header .filter-tray {
    display: none !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-matches-grid {
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    width: 100%;
    background: #f5f5f5 !important;
    border: 1px solid rgba(76, 76, 77, 0.14) !important;
    border-radius: 10px !important;
    box-shadow: none;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-content {
    padding: 14px 14px 16px !important;
    gap: 12px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-match-header {
    gap: 10px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .live-tag,
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .upcoming-tag,
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .result-tag {
    line-height: 1.25 !important;
    letter-spacing: 0.06em;
    font-size: 12px !important;
    word-break: break-word;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .match-info {
    align-items: flex-start;
    flex-wrap: wrap;
    margin-top: 8px !important;
    row-gap: 2px;
    font-size: 12px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .match-info .separator {
    font-size: 12px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .match-info .match-context-league,
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .live-indicator .match-info .match-context-tournament {
    font-size: 12px !important;
    line-height: 1.35;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-section {
    gap: 10px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-section .team-row .team-info .team-name {
    max-width: none !important;
    font-size: 13px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-section .team-row .team-info .team-logo {
    width: 26px !important;
    height: 26px !important;
    flex-shrink: 0;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-section .team-row .team-score .score-with-overs .score {
    font-size: 13px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-section .team-row .team-score .score-with-overs .overs {
    font-size: 11px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-and-time-section {
    flex-direction: column;
    align-items: stretch !important;
    gap: 12px;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-and-time-section .time-section {
    justify-content: flex-start;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .teams-and-time-section .time-section .time-info {
    align-items: flex-start;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .match-details {
    gap: 8px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .match-details .umpire-info {
    font-size: 12px !important;
    line-height: 1.4;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .match-details .venue-info .venue-name {
    font-size: 12px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .match-center-btn {
    width: 100%;
    max-width: none;
    border-radius: 36px !important;
    padding: 11px 16px !important;
    justify-content: center;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .match-center-btn span {
    font-size: 15px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .match-center-btn .btn-icon {
    display: flex;
    width: 20px !important;
    height: 20px !important;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .live-match-card .upcoming-match-actions .match-center-btn {
    width: 100%;
  }
  .main-match-wrapper .main-middle-content-wrap .match-bg-wrapper .matches-wrapper-container .matches-load-more-wrap {
    margin-top: 16px;
    padding-bottom: 8px;
  }
}
.create-tournament-wrapper {
  top: 120px;
  position: relative;
  min-height: 600px;
}
.create-tournament-wrapper .background-image-wrapper .background-image {
  background-image: url("/assets/TournamentHbg-D7ATlbKU.png");
  height: 210px;
  background-size: cover;
  background-position: inherit;
  background-repeat: no-repeat;
  padding-top: 5px;
}
.create-tournament-wrapper .background-image-wrapper .background-image p {
  text-align: center;
  font-family: "Inter-600";
  color: #ffffff;
  font-size: 36px;
}
.create-tournament-wrapper .create-tourmament-wrap {
  position: relative;
  background: #ffffff;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -85px;
  width: 90%;
  border-radius: 10px;
  padding: 32px 43px 28px;
  box-shadow: 0 6px 18px rgba(20, 20, 43, 0.06);
  overflow: hidden;
}
.create-tournament-wrapper .create-tourmament-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/bg_cricenter_logo-C3Rtspl-.svg") no-repeat center center;
  background-size: 55% auto;
  pointer-events: none;
  z-index: 0;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-header {
  display: flex;
  align-items: center;
  gap: 12px;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-header img {
  cursor: pointer;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-header .heading {
  font-size: 24px;
  font-family: "Inter-500";
  margin: 0;
  color: #000000;
  line-height: 120%;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps {
  display: flex;
  gap: 80px;
  margin: 30px 0 20px;
  padding: 0px 30px;
  list-style: none;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps .step {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #9aa0a6;
  font-family: "Roboto-500";
  /* faint connector */
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps .step .dot {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #d9dbe0;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
  background: #fff;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps .step.active {
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps .step.active .dot {
  border-color: #4c5bd4;
  color: #4c5bd4;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps .step + .step {
  position: relative;
}
.create-tournament-wrapper .create-tourmament-wrap .ct-steps .step + .step::before {
  content: "";
  position: absolute;
  left: -70px;
  top: 50%;
  width: 60px;
  height: 1px;
  background: var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  transform: translateY(-50%);
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap {
  padding: 12px 80px 24px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form {
  /* Required asterisk: leading (prefix) vs trailing (suffix) */
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form label .req {
  color: #e11d48;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .ct-char-counter {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #6b7280;
  text-align: right;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .err-msg {
  color: #d8252d;
  font-size: 13px;
  margin: 4px 0 0;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form label > .req:first-child {
  margin-right: 4px;
  margin-left: 0;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form label > .req:last-child:not(:first-child) {
  margin-left: 2px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .sec-title {
  font-size: 18px;
  font-family: "Inter-200";
  margin: 8px 0 14px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .soft-sep {
  border: 0;
  border-top: 1px solid #eee;
  margin: 18px 0;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .score-rule-wrap {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
  align-items: end;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .score-rule-wrap .over-bolwer label,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .score-rule-wrap .points-data-wrap .points-data label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .score-rule-wrap .over-bolwer input,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .score-rule-wrap .points-data-wrap .points-data input {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border-radius: 4px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  outline: none;
  background: #fff;
  box-shadow: 0px 1px 2px 0px rgba(77, 64, 85, 0.1019607843);
  margin-top: 2px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .score-rule-wrap .points-data-wrap {
  display: contents;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper {
  display: flex;
  margin-top: 20px;
  gap: 200px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .match-type label {
  font-family: "Inter-200";
  font-size: 14px;
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .match-type label .req {
  color: #e11d48;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .match-type .chip-group {
  display: flex;
  gap: 5px;
  margin-top: 10px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .match-type .chip-group .chip {
  border: 1px solid var(--Primary-1, #201e52);
  background: #ffffff;
  color: #201E52;
  font-family: "Inter-200";
  padding: 8px 10px;
  height: 36px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .match-type .chip-group .chip.selected, .create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .match-type .chip-group .chip:hover {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .ball-type label {
  font-family: "Inter-200";
  font-size: 14px;
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .ball-type label .req {
  color: #e11d48;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .ball-type .chip-group {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .ball-type .chip-group .chip {
  border: 1px solid var(--Primary-1, #201e52);
  background: #fff;
  color: #201E52;
  font-family: "Inter-200";
  padding: 8px 10px;
  height: 36px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .ball-type .chip-group .chip.selected, .create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .match-type-wrapper .ball-type .chip-group .chip:hover {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap {
  display: flex;
  gap: 70px;
  margin-top: 20px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .over-wrap,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .wicket-wrap {
  display: flex;
  flex-direction: column;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .over-wrap label,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .wicket-wrap label {
  font-family: "Inter-200";
  font-size: 14px;
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .over-wrap input,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .wicket-wrap input {
  height: 40px;
  width: 180px;
  padding: 0 12px;
  border-radius: 4px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  outline: none;
  background: #fff;
  box-shadow: 0px 1px 2px 0px rgba(77, 64, 85, 0.1019607843);
  margin-top: 4px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .over-wrap input:focus,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .wicket-wrap input:focus {
  border-color: #000000;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .over-wrap input::placeholder,
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .other-limited-wrap .wicket-wrap input::placeholder {
  color: rgba(76, 76, 77, 0.4509803922);
  font-family: "Inter-100";
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper {
  display: flex;
  margin-top: 20px;
  gap: 200px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper .category-wrap label {
  font-family: "Inter-200";
  font-size: 14px;
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper .category-wrap label .req {
  color: #e11d48;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper .category-wrap .chip-group {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper .category-wrap .chip-group .chip {
  border: 1px solid var(--Primary-1, #201e52);
  background: #fff;
  color: #201E52;
  font-family: "Inter-200";
  padding: 8px 10px;
  height: 36px;
  border-radius: 5px;
  font-size: 11px;
  cursor: pointer;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper .category-wrap .chip-group .chip.selected, .create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .tournament-category-wrapper .category-wrap .chip-group .chip:hover {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .date-range {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 8px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .date-range .dash {
  display: flex;
  align-items: center;
  color: #9aa0a6;
  padding: 0 6px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .date-range input[type=date] {
  height: 40px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  margin: 20px 0 12px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle input {
  display: none;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle .slider {
  position: relative;
  width: 40px;
  height: 20px;
  border-radius: 999px;
  background: #cccccc;
  transition: background 0.2s ease;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle .slider::after {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s ease;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle input:checked + .slider {
  background: #201E52;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle input:checked + .slider::after {
  transform: translateX(20px);
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .toggles .toggle .label {
  font-family: "Inter-200";
  color: #111827;
  font-size: 14px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-textarea {
  display: flex;
  flex-direction: column;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-textarea label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-textarea label .req {
  color: #e11d48;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-textarea .textarea {
  margin-top: 10px;
  height: 100px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-textarea .textarea:focus {
  border-color: #000000;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-textarea .textarea::placeholder {
  color: rgba(76, 76, 77, 0.4509803922);
  font-family: "Inter-100";
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-bottom: 8px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-input-wrap {
  display: flex;
  align-items: stretch;
  gap: 10px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  border-radius: 6px;
  background: #fff;
  padding: 4px 4px 4px 12px;
  box-shadow: 0px 1px 2px 0px rgba(77, 64, 85, 0.1019607843);
  max-width: 520px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-input-wrap .form-control {
  flex: 1 1 auto;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-family: "Inter-200";
  font-size: 14px;
  color: #111827;
  padding: 0;
  height: 36px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-input-wrap .form-control::placeholder {
  color: rgba(76, 76, 77, 0.4509803922);
  font-family: "Inter-100";
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-input-wrap .btn {
  height: 36px;
  padding: 0 18px;
  border-radius: 4px;
  font-family: "Inter-500";
  font-size: 13px;
  cursor: pointer;
  border: 1px solid var(--Primary-1, #201e52);
  background: #201E52;
  color: #ffffff;
  white-space: nowrap;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-input-wrap .btn.btn-outline {
  background: #ffffff;
  color: #201E52;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-input-wrap .btn.btn-text {
  background: transparent;
  border: none;
  color: #d8252d;
  padding: 0 8px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-preview {
  display: block;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  object-fit: cover;
  max-height: 160px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  max-width: 520px;
  min-height: 140px;
  background: #fafbff;
  border: 1.5px dashed #c2c8e0;
  border-radius: 8px;
  color: #4a4f6a;
  cursor: pointer;
  padding: 18px;
  transition: border-color 0.15s ease, background 0.15s ease;
  font-family: "Inter-500";
  position: relative;
  overflow: hidden;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone.empty:hover {
  border-color: #201e52;
  background: #f3f5ff;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #eef0fb;
  color: #201e52;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  font-family: "Inter-600";
  line-height: 1;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-title {
  font-size: 14px;
  font-family: "Inter-600";
  color: #201e52;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-hint {
  font-size: 12px;
  color: #6b7280;
  font-family: "Inter-400";
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone.has-image {
  padding: 0;
  border-style: solid;
  border-color: #e3e6f3;
  background: #fff;
  cursor: default;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-img {
  width: 100%;
  height: 100%;
  max-height: 220px;
  object-fit: cover;
  display: block;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-overlay {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: flex;
  gap: 8px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-overlay .btn {
  height: 32px;
  padding: 0 14px;
  border-radius: 4px;
  font-family: "Inter-500";
  font-size: 13px;
  cursor: pointer;
  border: 1px solid var(--Primary-1, #201e52);
  background: #201E52;
  color: #ffffff;
  white-space: nowrap;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-overlay .btn.btn-outline {
  background: #ffffff;
  color: #201E52;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .form-group-banner .banner-dropzone .banner-dropzone-overlay .btn.btn-text {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #d8252d;
  color: #d8252d;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 20px;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .actions .btn {
  height: 40px;
  padding: 0 16px;
  border-radius: 4px;
  font-family: "Inter-500";
  cursor: pointer;
  border: 1px solid var(--Primary-1, #201e52);
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .actions .btn.btn-light {
  background: #ffffff;
  color: #201E52;
  border: 1px solid var(--Primary-1, #201e52);
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .actions .btn.btn-primary {
  background: #201E52;
  color: #ffffff;
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .actions .btn:hover:not(:disabled) {
  filter: brightness(0.97);
}
.create-tournament-wrapper .create-tourmament-wrap .common-stepper-details-wrap .ct-form .actions .btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.preview-wrap .ct-form label .req {
  color: #e11d48;
}
.preview-wrap .ct-form label > .req:first-child {
  margin-right: 4px;
  margin-left: 0;
}
.preview-wrap .ct-form label > .req:last-child:not(:first-child) {
  margin-left: 2px;
}
.preview-wrap .ct-form .form-control-wrap .form-group .date-view {
  display: flex;
  gap: 10px;
}
.preview-wrap .ct-form .form-control-wrap .form-group .date-view p {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
}
.preview-wrap .ct-form .form-control-wrap .form-group .date-view span {
  color: #000000;
  font-family: "Inter-500";
  font-size: 12px;
  margin-top: 7px;
}
.preview-wrap .ct-form .score-rule-wrap {
  display: flex;
  gap: 15px;
}
.preview-wrap .ct-form .score-rule-wrap .over-bolwer {
  width: 400px;
}
.preview-wrap .ct-form .score-rule-wrap .over-bolwer label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
}
.preview-wrap .ct-form .score-rule-wrap .over-bolwer p {
  font-family: "Inter-100";
  font-size: 14px;
}
.preview-wrap .ct-form .score-rule-wrap .points-data-wrap {
  display: flex;
  gap: 5px;
}
.preview-wrap .ct-form .score-rule-wrap .points-data-wrap .points-data {
  width: 118px;
}
.preview-wrap .ct-form .score-rule-wrap .points-data-wrap .points-data label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  white-space: nowrap;
}
.preview-wrap .ct-form .score-rule-wrap .points-data-wrap .points-data p {
  font-family: "Inter-100";
  font-size: 14px;
}
.preview-wrap .ct-form .match-type-wrap {
  display: flex;
  gap: 95px;
  margin-top: 15px;
}
.preview-wrap .ct-form .match-type-wrap .left-wrapper .match-type {
  display: flex;
  gap: 20px;
}
.preview-wrap .ct-form .match-type-wrap .left-wrapper .match-type label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-top: 13px;
}
.preview-wrap .ct-form .match-type-wrap .left-wrapper .match-type p {
  font-family: "Inter-200";
  font-size: 14px;
}
.preview-wrap .ct-form .match-type-wrap .right-wrapper .lock-type {
  display: flex;
  gap: 20px;
}
.preview-wrap .ct-form .match-type-wrap .right-wrapper .lock-type label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  margin-top: 13px;
}
.preview-wrap .ct-form .match-type-wrap .right-wrapper .lock-type p {
  font-family: "Inter-200";
  font-size: 14px;
}

/* container */
.react-confirm-alert-body.success-dialog {
  width: 500px;
  max-width: 90vw;
  background: #fff;
  border-radius: 8px;
  padding: 28px 24px 24px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

/* green check with dots feel */
.success-icon-wrap {
  display: flex;
  justify-content: center;
}

.success-icon {
  position: relative;
  margin: 0 auto;
}
.success-icon img {
  width: 130px;
}

.success-icon .confetti {
  position: absolute;
  inset: -16px;
  background: radial-gradient(circle at 20% 30%, #22c55e 2px, transparent 3px), radial-gradient(circle at 70% 20%, #22c55e 2px, transparent 3px), radial-gradient(circle at 80% 60%, #16a34a 2px, transparent 3px), radial-gradient(circle at 35% 80%, #16a34a 2px, transparent 3px);
  opacity: 0.6;
  pointer-events: none;
  border-radius: 50%;
}

/* headings */
.success-title {
  font-family: "Inter-500";
  font-size: 22px;
  margin: 8px 0 6px;
  color: #111827;
}

.success-subtitle {
  font-size: 14px;
  color: rgba(76, 76, 77, 0.6);
  line-height: 1.45;
  margin: 0 auto 18px;
  max-width: 520px;
  font-family: "Roboto-500";
}

/* button area uses the provided class name */
.react-confirm-alert-button-group.success-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 8px;
  flex-wrap: wrap;
}

/* primary button */
.success-btn {
  background: #0a5f07 !important;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 12px 20px;
  font-family: "Inter-700";
  cursor: pointer;
  min-width: 180px;
  min-height: 50px;
  transition: filter 0.15s ease;
}

.success-btn:hover {
  filter: brightness(0.96);
}

/* secondary / BACK TO HOME */
.success-btn-outline {
  background: #fff !important;
  color: #201e52;
  border: 2px solid #201e52;
}

/* optional: overlay tone (if you imported default CSS, override) */
.react-confirm-alert-overlay {
  background: rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(1px);
}

.calendar {
  width: 100%;
  position: relative;
  box-shadow: 0px 0px 4.8px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  font-size: 16px;
  color: #000;
  font-family: "Inter-400";
  /* shared utilities inside calendar */
}
.calendar .auto-layout-vertical {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.calendar .year {
  position: relative;
  letter-spacing: -0.18px;
  line-height: 20px;
  font-family: "Inter-500";
}
.calendar .icon {
  cursor: pointer;
  position: relative;
}
.calendar .vector-icon {
  position: absolute;
  height: 30.5%;
  width: 50%;
  top: 35%;
  right: 25%;
  bottom: 34.5%;
  left: 25%;
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
}
.calendar .yesterday {
  position: relative;
  letter-spacing: -0.18px;
  line-height: 20px;
}
.calendar .select {
  align-self: stretch;
  border-radius: 8px 8px 0 0;
  background-color: #fff;
  border-bottom: 2px solid rgba(32, 30, 82, 0.12);
  display: flex;
  align-items: center;
  padding: 8px 10px 8px 16px;
  gap: 6px;
  position: relative;
}
.calendar .select .auto-layout-vertical {
  cursor: pointer;
}
.calendar .select .auto-layout-vertical .year { /* inherits base .year */ }
.calendar .select .tournament-dropdown-points-tab {
  width: 20%;
  position: absolute;
  top: 80%;
  z-index: 1;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  background-color: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px;
  box-sizing: border-box;
  text-align: center;
  font-size: 14px;
  color: #000;
  font-family: "Inter-400";
}
.calendar .select .tournament-dropdown-points-tab .filter-options {
  width: 55px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.calendar .select .tournament-dropdown-points-tab .filter-options .filter-option {
  height: 28px;
  display: flex;
  align-items: center;
  padding: 10px;
  box-sizing: border-box;
}
.calendar .select .tournament-dropdown-points-tab .filter-options .filter-option .filter-option-text {
  position: relative;
  font-weight: 500;
}
.calendar .popup {
  align-self: stretch;
  box-shadow: 0px 16px 32px rgba(23, 37, 76, 0.12);
  border-radius: 8px;
  background-color: #fff;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.calendar .popup .auto-layout-vertical-parent {
  margin-top: 10px;
  display: flex;
  gap: 0;
}
.calendar .popup .auto-layout-vertical-parent .calendar-auto-layout-vertical {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  box-sizing: border-box;
}
.calendar .popup .auto-layout-vertical-parent .calendar-auto-layout-vertical .auto-layout-vertical {
  cursor: pointer;
}
.calendar .popup .auto-layout-vertical-parent .calendar-auto-layout-vertical .auto-layout-vertical .auto-layout-vertical3 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 8px 12px;
  color: #201E52;
}
.calendar .popup .auto-layout-vertical-parent .calendar-auto-layout-vertical .auto-layout-vertical .auto-layout-vertical3 .year { /* Today */ }
.calendar .popup .auto-layout-vertical-parent .calendar-auto-layout-vertical .auto-layout-vertical .auto-layout-vertical4 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 8px 12px;
}
.calendar .popup .auto-layout-vertical-parent .calendar-auto-layout-vertical .auto-layout-vertical .auto-layout-vertical4 .yesterday { /* Yesterday/Last week/etc */ }
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 {
  width: 284px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px 16px;
  box-sizing: border-box;
  gap: 12px;
  text-align: center;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal {
  align-self: stretch;
  display: flex;
  align-items: center;
  padding: 0 0 0 8px;
  gap: 16px;
  text-align: left;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal .month {
  flex: 1;
  position: relative;
  letter-spacing: -0.18px;
  line-height: 20px;
  font-family: "Inter-500";
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal .calendar-auto-layout-horizontal {
  display: flex;
  align-items: flex-start;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal .calendar-auto-layout-horizontal .date {
  border-radius: 24px;
  background-color: rgba(24, 30, 48, 0);
  display: flex;
  align-items: flex-start;
  padding: 8px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal .calendar-auto-layout-horizontal .date .icon .chevron-left-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal2 {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  color: rgba(76, 76, 77, 0.6);
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal2 .auto-layout-vertical9 {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 8px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .auto-layout-horizontal2 .auto-layout-vertical9 .yesterday { /* Mo, Tu, ... */ }
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container {
  width: 252px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  /* final row variant also uses .auto-layout-horizontal2 again */
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekother-month-ran,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekother-month-ran2,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangem,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekend-rangem,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weektoday-rangenon,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangee,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangen11 {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekother-month-ran {
  border-radius: 18px;
  background-color: rgba(24, 30, 48, 0);
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekother-month-ran2 {
  border-radius: 18px 0 0 18px;
  background-color: rgba(32, 30, 82, 0.12);
  color: #fff;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekend-rangem {
  background-color: rgba(32, 30, 82, 0.12);
  color: #000;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangem {
  background-color: rgba(32, 30, 82, 0.12);
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangee {
  border-radius: 0 18px 18px 0;
  background-color: rgba(32, 30, 82, 0.12);
  color: #fff;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weektoday-rangenon {
  border-radius: 18px;
  background-color: rgba(24, 30, 48, 0);
  color: #201E52;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangen11 {
  border-radius: 18px;
  background-color: rgba(24, 30, 48, 0);
  color: #000;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .auto-layout-vertical16,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .auto-layout-vertical18 {
  width: 28px;
  border-radius: 14px;
  height: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px;
  box-sizing: border-box;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .auto-layout-vertical18 {
  background-color: #201E52;
  color: #fff;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .auto-layout-vertical-child {
  width: 2px;
  position: relative;
  border-radius: 50%;
  background-color: #000;
  height: 2px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekother-month-ran2 .auto-layout-vertical18 .year { /* 28 */ }
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekweekday-rangem,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekweekday-rangee,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekweekend-rangem,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekother-month-ran,
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weektoday-rangenon {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekweekday-rangem {
  background-color: rgba(32, 30, 82, 0.12);
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekweekday-rangee {
  border-radius: 0 18px 18px 0;
  background-color: rgba(32, 30, 82, 0.12);
  color: #fff;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekweekend-rangem {
  background-color: rgba(32, 30, 82, 0.12);
  color: #000;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weekother-month-ran {
  border-radius: 18px;
  background-color: rgba(24, 30, 48, 0);
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .day-of-a-weektoday-rangenon {
  border-radius: 18px;
  background-color: rgba(24, 30, 48, 0);
  color: #201E52;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .auto-layout-vertical16 {
  width: 28px;
  border-radius: 14px;
  height: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px;
  box-sizing: border-box;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .auto-layout-vertical18 {
  width: 28px;
  border-radius: 14px;
  background-color: #201E52;
  color: #fff;
  height: 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px;
  box-sizing: border-box;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .auto-layout-vertical18 .ellipse-div {
  width: 100%;
  position: relative;
  border-radius: 50%;
  background-color: #000;
  height: 2px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal4 .auto-layout-vertical-child {
  width: 2px;
  position: relative;
  border-radius: 50%;
  background-color: #000;
  height: 2px;
}
.calendar .popup .auto-layout-vertical-parent .auto-layout-vertical8 .date-container .auto-layout-horizontal2 .day-of-a-weekweekday-rangen11 {
  border-radius: 18px;
  background-color: rgba(24, 30, 48, 0);
  color: #000;
}
.calendar .reset-parent {
  align-self: stretch;
  background-color: #fff;
  border-top: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 52px;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 54px;
  gap: 10px;
  text-align: center;
  color: #201E52;
}
.calendar .reset-parent .reset {
  width: 196px;
  border-radius: 8px;
  background-color: rgba(24, 30, 48, 0);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  box-sizing: border-box;
}
.calendar .reset-parent .reset .year { /* Reset / Apply text styles from base .year */ }
.calendar .reset-parent .frame-child {
  width: 1px;
  position: relative;
  border-right: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 26px;
}

.main-team-content-wrap {
  min-height: calc(100vh - 192px);
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper {
  padding: 10px 0px 40px;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container {
  background-color: #ffffff;
  padding: 61.5px 30px;
  border-radius: 7px;
  /* GRID with gap-as-dividers: perfectly continuous lines + rounded corners */
  /* Tablet: 3 columns */
  /* Mobile: 2 columns */
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 6px 0 0px;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-header .heading {
  margin: 0;
  font-family: "Inter-500";
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .tournament-filter {
  min-width: 200px;
  max-width: 280px;
  flex-shrink: 0;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-card {
  background: #fff;
  border: 1px solid #eaecf0;
  border-radius: 14px;
  padding: 0; /* the grid draws inner dividers */
  overflow: hidden;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-grid {
  --cols: 4; /* desktop columns */
  display: grid;
  grid-template-columns: repeat(var(--cols), 1fr);
  gap: 1px; /* this becomes the divider */
  background: #eef0f4; /* divider color */
  border-radius: inherit;
  overflow: hidden;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .team-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  padding: 18px 20px;
  background: #fff; /* sits on top of the divider background */
  border: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .team-cell:hover {
  background: #fafafb;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .team-cell .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: #f1f5f9;
  display: grid;
  place-items: center;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .team-cell .logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .team-cell .name {
  font-family: "Inter-700";
  color: #111827;
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}
@media (max-width: 1024px) {
  .main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-grid {
    --cols: 3;
  }
}
@media (max-width: 640px) {
  .main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-wrapper {
    padding: 16px;
  }
  .main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .teams-grid {
    --cols: 2;
  }
  .main-team-content-wrap .main-middle-content-wrap .teams-wrapper .team-wrapper-container .team-cell {
    padding: 14px 16px;
    min-height: 64px;
  }
}

.tournament-team-wrap {
  min-height: calc(100vh - 192px);
}
.tournament-team-wrap .tournament-middle-wrap {
  margin: 0px;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container {
  background-color: #ffffff;
  border-radius: 7px;
  /* GRID with gap-as-dividers: perfectly continuous lines + rounded corners */
  /* Tablet: 3 columns */
  /* Mobile: 2 columns */
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 6px 0 16px;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-header .heading {
  margin: 0;
  font-family: "Inter-500";
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .tournament-filter {
  min-width: 200px;
  max-width: 280px;
  flex-shrink: 0;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-card {
  background: #fff;
  border: 1px solid #eaecf0;
  border-radius: 14px;
  padding: 0; /* the grid draws inner dividers */
  overflow: hidden;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-grid {
  --cols: 4; /* desktop columns */
  display: grid;
  grid-template-columns: repeat(var(--cols), 1fr);
  gap: 1px; /* this becomes the divider */
  background: #eef0f4; /* divider color */
  border-radius: inherit;
  overflow: hidden;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .team-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  padding: 18px 20px;
  background: #fff; /* sits on top of the divider background */
  border: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .team-cell:hover {
  background: #fafafb;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .team-cell .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: #f1f5f9;
  display: grid;
  place-items: center;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .team-cell .logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .team-cell .name {
  font-family: "Inter-700";
  color: #111827;
  font-size: 15px;
}
@media (max-width: 1024px) {
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-grid {
    --cols: 3;
  }
}
@media (max-width: 640px) {
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-wrapper {
    padding: 16px;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-grid {
    --cols: 2;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .team-cell {
    padding: 14px 16px;
    min-height: 64px;
  }
}

.teams-header {
  flex-wrap: wrap;
  gap: 12px;
}

.tournament-teams-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  justify-content: space-between;
  flex-wrap: wrap;
}
.tournament-teams-controls .teams-filters {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.tournament-teams-controls .teams-action-btns {
  display: flex;
  gap: 10px;
}
.tournament-teams-controls .teams-action-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-family: "Inter-500";
  cursor: pointer;
  white-space: nowrap;
}
.tournament-teams-controls .teams-action-btn--edit {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #fff;
  border: none;
}
.tournament-teams-controls .teams-action-btn--create {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #fff;
  border: none;
}

.team-cell-wrap {
  background: #fff;
  display: flex;
  flex-direction: column;
}
.team-cell-wrap .team-cell-top {
  display: flex;
  align-items: center;
  padding: 14px 16px 8px;
  gap: 8px;
}
.team-cell-wrap .team-cell-top:hover {
  background: #fafafb;
}
.team-cell-wrap .team-cell-top .team-cell {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  cursor: pointer;
  background: transparent;
  border: 0;
  text-align: left;
  min-width: 0;
}
.team-cell-wrap .team-cell-top .team-cell .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  overflow: hidden;
  background: #f1f5f9;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.team-cell-wrap .team-cell-top .team-cell .logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.team-cell-wrap .team-cell-top .team-cell .name {
  font-family: "Inter-700";
  color: #111827;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}
.team-cell-wrap .team-cell-top .team-edit-btn {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: #6b7280;
  line-height: 0;
}
.team-cell-wrap .team-cell-top .team-edit-btn:hover {
  color: #1a2b4b;
}
.team-cell-wrap .team-stats {
  display: flex;
  gap: 6px;
  padding: 0 16px 12px;
  flex-wrap: wrap;
}
.team-cell-wrap .team-stats .stat-badge {
  font-size: 11px;
  border-radius: 20px;
  padding: 2px 8px;
  white-space: nowrap;
  border: 1px solid;
}
.team-cell-wrap .team-stats .stat-badge strong {
  font-family: "Inter-700";
}
.team-cell-wrap .team-stats .stat-badge--played {
  color: #374151;
  background: #f3f4f6;
  border-color: #d1d5db;
}
.team-cell-wrap .team-stats .stat-badge--played strong {
  color: #111827;
}
.team-cell-wrap .team-stats .stat-badge--won {
  color: #065f46;
  background: #d1fae5;
  border-color: #6ee7b7;
}
.team-cell-wrap .team-stats .stat-badge--won strong {
  color: #065f46;
}
.team-cell-wrap .team-stats .stat-badge--lost {
  color: #991b1b;
  background: #fee2e2;
  border-color: #fca5a5;
}
.team-cell-wrap .team-stats .stat-badge--lost strong {
  color: #991b1b;
}
.team-cell-wrap .team-stats .stat-badge--tie {
  color: #92400e;
  background: #fef3c7;
  border-color: #fcd34d;
}
.team-cell-wrap .team-stats .stat-badge--tie strong {
  color: #92400e;
}

.teams-view-toggle {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: #1a2b4b;
  line-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.teams-view-toggle:hover {
  opacity: 0.7;
}

@media (max-width: 768px) {
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-header {
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-header .heading {
    font-size: 16px;
    flex: 1;
    margin: 0;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-header .teams-view-toggle {
    order: 2;
    margin-left: auto;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-header .tournament-teams-controls {
    order: 3;
    width: 100%;
    margin-top: 10px;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .tournament-teams-controls {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    flex: unset;
    width: 100%;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .tournament-teams-controls .teams-filters {
    flex-wrap: nowrap;
    gap: 8px;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .tournament-teams-controls .teams-filters .tournament-filter {
    flex: 1;
    min-width: 0;
    max-width: unset;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .tournament-teams-controls .teams-action-btns {
    display: flex;
    gap: 8px;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .tournament-teams-controls .teams-action-btns .teams-action-btn {
    flex: 1;
    justify-content: center;
  }
  .tournament-team-wrap .tournament-middle-wrap .teams-wrapper .team-wrapper-container .teams-grid {
    --cols: 1 !important;
  }
}
.set-divisions-dialog .app-dialog-header {
  justify-content: center;
  padding: 20px 24px 0;
}
.set-divisions-dialog .app-dialog-title {
  text-align: center;
  font-size: 18px;
}
.set-divisions-dialog .app-dialog-body {
  padding: 20px 24px 24px;
}
.set-divisions-dialog .set-divisions-form {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.set-divisions-dialog .set-divisions-form .set-divisions-fields {
  display: flex;
  gap: 20px;
}
.set-divisions-dialog .set-divisions-form .set-divisions-fields .set-divisions-field {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.set-divisions-dialog .set-divisions-form .set-divisions-fields .set-divisions-field .set-divisions-label {
  font-size: 13px;
  font-family: "Inter-500";
  color: #374151;
}
.set-divisions-dialog .set-divisions-form .set-divisions-fields .set-divisions-field .set-divisions-input {
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  color: #111827;
  outline: none;
  width: 100%;
}
.set-divisions-dialog .set-divisions-form .set-divisions-fields .set-divisions-field .set-divisions-input::placeholder {
  color: #9ca3af;
}
.set-divisions-dialog .set-divisions-form .set-divisions-fields .set-divisions-field .set-divisions-input:focus {
  border-color: #1a2b4b;
}
.set-divisions-dialog .set-divisions-form .set-divisions-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}
.set-divisions-dialog .set-divisions-form .set-divisions-footer .set-divisions-cancel {
  padding: 10px 28px;
  border: 1.5px solid #e53935;
  border-radius: 8px;
  color: #e53935;
  background: #fff;
  font-size: 14px;
  cursor: pointer;
  font-family: "Inter-500";
}
.set-divisions-dialog .set-divisions-form .set-divisions-footer .set-divisions-create {
  padding: 10px 28px;
  background: #1a2b4b;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  cursor: pointer;
  font-family: "Inter-500";
}
.set-divisions-dialog .set-divisions-form .set-divisions-footer .set-divisions-create:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.update-team-dialog .app-dialog-header {
  justify-content: center;
  padding: 20px 24px 0;
}
.update-team-dialog .app-dialog-title {
  text-align: center;
  font-size: 18px;
}
.update-team-dialog .app-dialog-body {
  padding: 20px 24px 24px;
}
.update-team-dialog .update-team-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.update-team-dialog .update-team-form .update-team-row {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.update-team-dialog .update-team-form .update-team-row .update-team-field {
  flex: 1;
}
.update-team-dialog .update-team-form .update-team-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.update-team-dialog .update-team-form .update-team-field .update-team-label {
  font-size: 13px;
  font-family: "Inter-500";
  color: #374151;
}
.update-team-dialog .update-team-form .update-team-field .team-image-upload {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 9px 10px;
  min-height: 42px;
  cursor: pointer;
}
.update-team-dialog .update-team-form .update-team-field .team-image-upload .team-image-placeholder {
  flex: 1;
  font-size: 13px;
  color: #9ca3af;
}
.update-team-dialog .update-team-form .update-team-field .team-image-upload .team-image-preview {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 6px;
  flex-shrink: 0;
}
.update-team-dialog .update-team-form .update-team-field .team-image-upload .upload-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: #fff;
  font-size: 12px;
  cursor: pointer;
  color: #374151;
  white-space: nowrap;
  margin-left: auto;
}
.update-team-dialog .update-team-form .update-team-field .update-team-input {
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  color: #111827;
  outline: none;
  height: 42px;
}
.update-team-dialog .update-team-form .update-team-field .update-team-input::placeholder {
  color: #9ca3af;
}
.update-team-dialog .update-team-form .update-team-field .update-team-input:focus {
  border-color: #1a2b4b;
}
.update-team-dialog .update-team-form .update-team-desc-field .update-team-textarea {
  padding: 10px 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 14px;
  color: #111827;
  outline: none;
  resize: vertical;
  width: 100%;
  box-sizing: border-box;
  font-family: inherit;
}
.update-team-dialog .update-team-form .update-team-desc-field .update-team-textarea::placeholder {
  color: #9ca3af;
}
.update-team-dialog .update-team-form .update-team-desc-field .update-team-textarea:focus {
  border-color: #1a2b4b;
}
.update-team-dialog .update-team-form .update-team-loading {
  padding: 32px;
  text-align: center;
  color: #6b7280;
  font-size: 14px;
}
.update-team-dialog .update-team-form .update-team-submit {
  width: 100%;
  padding: 13px;
  background: #1a2b4b;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-family: "Inter-500";
  cursor: pointer;
  margin-top: 4px;
}
.update-team-dialog .update-team-form .update-team-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.create-division-page {
  width: 100%;
  height: 100%;
  margin-top: 70px;
  min-height: 100vh;
  background: #eceff3;
  padding: 24px 20px 40px;
  box-sizing: border-box;
}
.create-division-page .create-division-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}
.create-division-page .create-division-header .create-division-back {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  line-height: 0;
}
.create-division-page .create-division-header .create-division-back img {
  width: 20px;
  height: 20px;
}
.create-division-page .create-division-header .create-division-title {
  font-size: 20px;
  font-family: "Inter-700";
  color: #111827;
  margin: 0;
}
.create-division-page .create-division-body {
  max-width: 1440px;
  margin: 0 auto;
  border: 2px dashed #2563eb;
  border-radius: 14px;
  padding: 22px 20px 26px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  background: #f3f4f6;
  box-sizing: border-box;
}
.create-division-page .division-block {
  background: transparent;
  border: none;
  border-radius: 0;
}
.create-division-page .division-block .division-block-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 2px 14px;
  margin-bottom: 4px;
  background: transparent;
  border-bottom: 1px solid #d1d5db;
}
.create-division-page .division-block .division-block-header .division-block-title-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.create-division-page .division-block .division-block-header .division-name {
  font-family: "Inter-700";
  font-size: 16px;
  color: #111827;
  letter-spacing: -0.01em;
}
.create-division-page .division-block .division-block-header .division-name-input {
  font-family: "Inter-700";
  font-size: 16px;
  color: #111827;
  border: 1px solid #94a3b8;
  border-radius: 8px;
  padding: 6px 10px;
  outline: none;
  background: #fff;
  min-width: 160px;
}
.create-division-page .division-block .division-block-header .division-name-input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
}
.create-division-page .division-block .division-block-header .division-edit-btn {
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px;
  line-height: 0;
  border-radius: 6px;
  color: #1d4ed8;
}
.create-division-page .division-block .division-block-header .division-edit-btn:hover {
  background: rgba(37, 99, 235, 0.1);
}
.create-division-page .division-block .division-block-header .division-delete-btn {
  flex-shrink: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 6px;
  line-height: 0;
  border-radius: 6px;
  color: #dc2626;
}
.create-division-page .division-block .division-block-header .division-delete-btn:hover {
  background: rgba(220, 38, 38, 0.1);
}
.create-division-page .division-block .division-block-groups {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.create-division-page .group-block {
  padding: 16px 18px 18px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e8eaef;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 4px 14px rgba(15, 23, 42, 0.06);
}
.create-division-page .group-block .group-block-header {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 14px 16px;
  margin-bottom: 14px;
}
@media (max-width: 640px) {
  .create-division-page .group-block .group-block-header {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}
.create-division-page .group-block .group-block-header .group-label {
  font-family: "Inter-700";
  font-size: 15px;
  color: #000000;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.create-division-page .group-block .group-block-header .group-name-input {
  width: 100%;
  min-width: 0;
  padding: 10px 14px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #111827;
  outline: none;
  background: #fff;
  box-sizing: border-box;
}
.create-division-page .group-block .group-block-header .group-name-input::placeholder {
  color: #94a3b8;
}
.create-division-page .group-block .group-block-header .group-name-input:focus {
  border-color: #64748b;
}
.create-division-page .group-block .group-block-header .add-teams-btn {
  padding: 10px 18px;
  background: #1e1b4b;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-family: "Inter-600";
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(30, 27, 75, 0.2);
}
.create-division-page .group-block .group-block-header .add-teams-btn:hover {
  background: #312e81;
}
.create-division-page .group-block .group-teams {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  margin-top: 2px;
}
.create-division-page .group-block .group-teams .team-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  padding: 6px 10px 6px 8px;
  border: none;
  border-radius: 9999px;
  background: #f3f4f6;
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  color: #000000;
  line-height: 1.25;
  box-sizing: border-box;
}
.create-division-page .group-block .group-teams .team-chip-thumb {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  overflow: hidden;
  background: #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
}
.create-division-page .group-block .group-teams .team-chip-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.create-division-page .group-block .group-teams .team-chip-name {
  flex: 1;
  min-width: 0;
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 14px;
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.create-division-page .group-block .group-teams .team-chip-remove {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-left: 4px;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 9999px;
  cursor: pointer;
  color: #6b7280;
  transition: color 0.12s ease, background 0.12s ease;
}
.create-division-page .group-block .group-teams .team-chip-remove svg {
  display: block;
}
.create-division-page .group-block .group-teams .team-chip-remove:hover {
  color: #374151;
  background: rgba(0, 0, 0, 0.06);
}
.create-division-page .group-block .group-teams .team-chip-remove:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.35);
}
.create-division-page .create-division-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 8px;
  padding-top: 20px;
  border-top: 1px solid #d1d5db;
}
.create-division-page .create-division-footer .division-footer-edit {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  background: #fff;
  border: 1.5px solid #1e1b4b;
  border-radius: 10px;
  color: #1e1b4b;
  font-size: 14px;
  font-family: "Inter-500";
  cursor: pointer;
}
.create-division-page .create-division-footer .division-footer-edit:hover {
  background: #f8fafc;
}
.create-division-page .create-division-footer .division-footer-save {
  padding: 10px 24px;
  background: #1e1b4b;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-family: "Inter-600";
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(30, 27, 75, 0.2);
}
.create-division-page .create-division-footer .division-footer-save:hover:not(:disabled) {
  background: #312e81;
}
.create-division-page .create-division-footer .division-footer-save:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.atm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.atm-modal {
  background: #fff;
  border-radius: 14px;
  width: 680px;
  max-width: 95vw;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.atm-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid #eaecf0;
}
.atm-header .atm-title {
  font-size: 18px;
  font-family: "Inter-700";
  color: #111827;
  margin: 0;
}
.atm-header .atm-close {
  background: none;
  border: none;
  font-size: 22px;
  color: #6b7280;
  cursor: pointer;
  line-height: 1;
  padding: 0 4px;
}

.atm-tabs {
  display: flex;
  gap: 0;
  padding: 0 24px;
  border-bottom: 1px solid #eaecf0;
}
.atm-tabs .atm-tab {
  padding: 12px 20px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  font-size: 14px;
  font-family: "Inter-500";
  color: #6b7280;
  cursor: pointer;
  margin-bottom: -1px;
}
.atm-tabs .atm-tab.atm-tab--active {
  color: #1a2b4b;
  border-bottom-color: #1a2b4b;
}

.atm-grid {
  flex: 1;
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: #eef0f4;
  padding: 0;
}
@media (max-width: 600px) {
  .atm-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.atm-empty {
  grid-column: 1/-1;
  text-align: center;
  color: #9ca3af;
  padding: 40px;
  background: #fff;
}

.atm-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: #fff;
  cursor: pointer;
  user-select: none;
}
.atm-card.atm-card--selected {
  background: #f0f4ff;
}
.atm-card .atm-card-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #1a2b4b;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.atm-card .atm-card-avatar .atm-card-avatar-initials {
  color: #fff;
  font-size: 16px;
  font-family: "Inter-700";
}
.atm-card .atm-card-body {
  flex: 1;
  min-width: 0;
}
.atm-card .atm-card-body .atm-card-name {
  font-size: 13px;
  font-family: "Inter-600";
  color: #111827;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.atm-card .atm-card-body .atm-card-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.atm-card .atm-card-body .atm-card-stats .atm-stat {
  font-size: 10px;
  color: #6b7280;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 1px 5px;
}
.atm-card .atm-card-body .atm-card-stats .atm-stat b {
  color: #111827;
}
.atm-card .atm-checkbox {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: #1a2b4b;
}

.atm-footer {
  padding: 16px 24px;
  border-top: 1px solid #eaecf0;
  display: flex;
  justify-content: flex-end;
}
.atm-footer .atm-add-btn {
  padding: 10px 28px;
  background: #1a2b4b;
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-family: "Inter-500";
  cursor: pointer;
}
.atm-footer .atm-add-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.atm-create-form {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.atm-create-form .atm-create-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
@media (max-width: 600px) {
  .atm-create-form .atm-create-row {
    grid-template-columns: 1fr;
  }
}
.atm-create-form .atm-create-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.atm-create-form .atm-create-field.atm-create-field--full {
  grid-column: 1/-1;
}
.atm-create-form .atm-create-field label {
  font-size: 13px;
  font-family: "Inter-500";
  color: #374151;
}
.atm-create-form .atm-create-field .atm-required {
  color: #ef4444;
  margin-left: 2px;
}
.atm-create-form .atm-create-field input,
.atm-create-form .atm-create-field textarea {
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
  color: #111827;
  outline: none;
  resize: none;
}
.atm-create-form .atm-create-field input:focus,
.atm-create-form .atm-create-field textarea:focus {
  border-color: #1a2b4b;
}
.atm-create-form .atm-image-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.atm-create-form .atm-image-row input[type=text] {
  flex: 1;
}
.atm-create-form .atm-image-row .atm-file-hidden {
  display: none;
}
.atm-create-form .atm-image-row .atm-upload-btn {
  padding: 8px 14px;
  background: #f3f4f6;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  white-space: nowrap;
}

body.route-tournaments-team-info .main-wrap {
  padding-top: 0;
  margin-top: 0;
}

.team-info-wrapper {
  position: relative;
  box-sizing: border-box;
  padding-top: 75px;
  margin-top: 0;
}
@media (max-width: 768px) {
  .team-info-wrapper {
    padding-top: 75px;
  }
}
.team-info-wrapper .background-image-wrapper {
  height: 180px;
  background: url("/assets/TournamentHbg-D7ATlbKU.png") center/cover no-repeat;
  background-size: cover;
  background-position: inherit;
  background-repeat: no-repeat;
}
.team-info-wrapper .background-image-wrapper .team-info {
  display: flex;
  justify-content: space-between;
}
.team-info-wrapper .background-image-wrapper .team-info .left-block {
  display: flex;
  gap: 45px;
  padding: 0px 25px;
}
.team-info-wrapper .background-image-wrapper .team-info .left-block .name-logo {
  display: flex;
  gap: 10px;
}
.team-info-wrapper .background-image-wrapper .team-info .left-block .name-logo p {
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 30px;
}
.team-info-wrapper .background-image-wrapper .team-info .left-block .name-logo img {
  height: 45px;
  margin-top: 27px;
}
.team-info-wrapper .background-image-wrapper .team-info .left-block .players {
  display: flex;
  gap: 10px;
  padding-top: 30px;
}
.team-info-wrapper .background-image-wrapper .team-info .left-block .players button {
  background: rgba(255, 255, 255, 0.0705882353);
  border: none;
  height: 35px;
  width: 120px;
  border-radius: 10px;
  color: #ffffff;
  font-family: "Inter-100";
}
.team-info-wrapper .background-image-wrapper .team-info .join-button {
  padding-top: 30px;
  margin-right: 30px;
  display: flex;
  gap: 10px;
  align-items: center;
  /* Legacy primary actions were direct children; do not restyle My Team–style Share/Edit */
}
.team-info-wrapper .background-image-wrapper .team-info .join-button .team-info-hero-actions {
  flex-shrink: 0;
}
.team-info-wrapper .background-image-wrapper .team-info .join-button > button {
  background-color: #201E52;
  border: none;
  border-radius: 50px;
  padding: 17px 11px 20px;
  width: 100%;
  height: 30px;
  color: #ffffff;
  font-family: "Inter-200";
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
}
.team-info-wrapper .background-image-wrapper .team-info .join-button > button:hover {
  filter: brightness(0.95);
}
.team-info-wrapper .background-image-wrapper .team-info .join-button .export-data-button {
  background-color: #ffffff;
  color: #7571CB;
  border: 1px solid #7571CB;
  font-family: "Inter-200";
  white-space: nowrap;
  min-width: 120px;
}
.team-info-wrapper .team-info-wrap {
  position: relative;
  width: 92%;
  margin: 0 auto;
  top: -70px;
  background: #fff;
  border-radius: 10px;
  padding: 7px 24px 28px;
  box-shadow: 0 6px 18px rgba(20, 20, 43, 0.06);
  overflow: hidden;
  margin-top: 0;
  min-height: calc(100vh - 148px);
}
.team-info-wrapper .team-info-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/bg_cricenter_logo-C3Rtspl-.svg") center/55% auto no-repeat;
  opacity: 0.55;
  pointer-events: none;
}
.team-info-wrapper .team-info-wrap .ct-header {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 2px 10px 0px;
}
.team-info-wrapper .team-info-wrap .ct-header .ti-back {
  cursor: pointer;
}
.team-info-wrapper .team-info-wrap .ct-header .heading {
  font-size: 22px;
  font-weight: 700;
  margin: 0;
}
.team-info-wrapper .team-info-wrap .ct-header .ti-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.team-info-wrapper .team-info-wrap .ct-header .ti-actions .ti-select {
  position: relative;
}
.team-info-wrapper .team-info-wrap .ct-header .ti-actions .ti-select select {
  appearance: none;
  padding: 10px 36px 10px 12px;
  border: 1px solid #201E52;
  border-radius: 8px;
  background: #fff;
  font-family: "Inter-500";
  font-size: 14px;
  color: #111827;
  min-width: 330px;
}
.team-info-wrapper .team-info-wrap .ct-header .ti-actions .ti-select .ti-caret {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #475467;
  font-size: 12px;
  pointer-events: none;
}
.team-info-wrapper .team-info-wrap .tab-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
}
.team-info-wrapper .team-info-wrap .tab-section .ti-tabs {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 10px 14px;
  align-items: center;
}
.team-info-wrapper .team-info-wrap .tab-section .ti-tabs .ti-tab {
  border: none;
  margin: 0;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: 1.2;
  padding: 10px 22px;
  border-radius: 999px;
  cursor: pointer;
  background: #F3F3F3;
  color: #18181B;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.team-info-wrapper .team-info-wrap .tab-section .ti-tabs .ti-tab:hover:not(.is-active) {
  background: #E8E8FD;
  color: #201E52;
}
.team-info-wrapper .team-info-wrap .tab-section .ti-tabs .ti-tab.is-active {
  color: #ffffff;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  box-shadow: 0 1px 2px rgba(32, 30, 82, 0.12);
}
.team-info-wrapper .team-info-wrap .tab-section .ti-tabs .ti-tab:focus-visible {
  outline: 2px solid #2C2970;
  outline-offset: 2px;
}
.team-info-wrapper .team-info-wrap .tab-section .buttons {
  display: flex;
  gap: 10px;
  margin-right: 10px;
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .share-button {
  border: 1px solid var(--Primary-1, #201e52);
  background-color: #ffffff;
  color: #201E52;
  display: flex;
  gap: 10px;
  width: 50%;
  border-radius: 5px;
  height: 37px;
  align-items: center;
  cursor: pointer;
  transition: all 0.2s ease;
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .share-button:hover {
  background-color: #f8f8f8;
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .share-button p {
  padding-top: 3px;
  font-family: "Inter-200";
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .add-player-button {
  background-color: #201E52;
  color: #ffffff;
  font-family: "Inter-100";
  border-radius: 5px;
  height: 37px;
  width: auto;
  min-width: 160px;
  padding: 0 20px;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .add-player-button:hover {
  filter: brightness(0.95);
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .export-pdf-button {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  font-family: "Inter-200";
  border-radius: 5px;
  height: 37px;
  padding: 0 20px;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
}
.team-info-wrapper .team-info-wrap .tab-section .buttons .export-pdf-button:hover {
  filter: brightness(0.95);
}
.team-info-wrapper .team-info-wrap .team-info-gallery-details-header {
  position: relative;
  z-index: 1;
  margin: 0 10px 12px;
  border-radius: 12px;
  overflow: hidden;
  background-image: url("/assets/match_bg_image-BSXyer--.svg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  min-height: 79px;
}
.team-info-wrapper .team-info-wrap .team-info-gallery-details-header .team-info-gallery-details-header__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 18px 24px 22px;
}
.team-info-wrapper .team-info-wrap .team-info-gallery-details-header .team-info-gallery-details-back {
  cursor: pointer;
  flex-shrink: 0;
  width: 22px;
  height: auto;
}
.team-info-wrapper .team-info-wrap .team-info-gallery-details-header .team-info-gallery-details-titles {
  flex: 1;
  min-width: 0;
}
.team-info-wrapper .team-info-wrap .team-info-gallery-details-header .team-info-gallery-details-title {
  font-family: "Inter-500";
  font-size: 15px;
  color: #ffffff;
  text-transform: uppercase;
  margin: 0 0 6px;
  line-height: 1.25;
  word-break: break-word;
}
.team-info-wrapper .team-info-wrap .team-info-gallery-details-header .team-info-gallery-details-meta {
  font-family: "Inter-100";
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 1.2px;
  margin: 0;
  line-height: 1.3;
}
.team-info-wrapper .team-info-wrap .team-info-photos-panel,
.team-info-wrapper .team-info-wrap .team-info-gallery-details-panel {
  position: relative;
  z-index: 1;
  padding-top: 4px;
  min-height: 200px;
}
.team-info-wrapper .team-info-wrap .team-info-wrap-section .ti-section {
  position: relative;
  z-index: 1;
  padding: 0px 10px 18px;
  /* Team Info members — same PlayerCard as squads/matches; layout chrome only */
}
.team-info-wrapper .team-info-wrap .team-info-wrap-section .ti-section .ti-section-title {
  margin: 0px 0 10px;
  font-size: 16px;
  font-family: "Inter-700";
  color: #000000;
}
.team-info-wrapper .team-info-wrap .team-info-wrap-section .ti-section .ti-player {
  border-radius: 12px;
  border-color: #e5e7eb;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}
.team-info-wrapper .team-info-wrap .team-info-wrap-section .ti-section .ti-player .ti-name {
  font-family: "Inter-700";
  font-weight: 700;
  color: #1e3a5f;
}
.team-info-wrapper .team-info-wrap .team-info-wrap-section .ti-section .ti-player .ti-role {
  color: #6b7280;
  font-family: "Inter-500";
  font-size: 13px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper {
  /* table */
  /* responsive */
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  padding: 10px 16px;
  border-bottom: 1px solid #e9edf3;
  background: #F3F3F3;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper {
  position: relative;
  display: inline-block;
  width: 23%;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .filter-chip {
  padding: 10px 14px;
  height: 37px;
  border-radius: 11px;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  background: #fff;
  font-family: "Inter-500";
  color: #000000;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  width: 100%;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .filter-chip .caret {
  font-size: 12px;
  line-height: 1;
  color: #6b7280;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .dropdown-list {
  position: absolute;
  top: calc(100% - 13px);
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  border-radius: 8px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.08);
  z-index: 20;
  max-height: 280px;
  overflow-y: auto;
  padding: 4px 0;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .dropdown-item {
  padding: 10px 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  transition: background 0.2s;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .dropdown-item:hover {
  background: #f8f8f8;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .dropdown-item.is-selected {
  background: #eef2ff;
  color: #201E52;
  font-family: "Inter-500";
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .dropdown-wrapper .dropdown-item .check-icon {
  width: 13px;
  height: 13px;
  min-width: 13px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .segmented {
  display: inline-flex;
  padding: 4px;
  background: #fff;
  border: 1px solid #e9edf3;
  border-radius: 12px;
  gap: 4px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .segmented__item {
  padding: 8px 12px;
  border-radius: 8px;
  border: 0;
  background: transparent;
  color: #000000;
  font-weight: 600;
  cursor: pointer;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-filters .segmented__item.is-active {
  background: #eef2ff;
  color: #201E52;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap {
  position: relative;
  background: url("/assets/TournamentHbg-D7ATlbKU.png") center/cover no-repeat;
  background-size: cover;
  background-position: inherit;
  background-repeat: no-repeat;
  color: #ffffff;
  margin-top: 15px;
  display: flex;
  flex-direction: row;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .image-wrap .hero__avatar {
  object-fit: cover;
  display: block;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* responsive (keeps the same look; just fewer columns) */
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding-top: 20px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .hero__title {
  display: flex;
  gap: 10px;
  flex-direction: row;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .hero__title .hero__rank {
  font-size: 48px;
  font-family: "Inter-700";
  opacity: 0.9;
  color: rgba(255, 255, 255, 0.2196078431);
  font-size: 75px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .hero__title .hero__name {
  display: flex;
  flex-direction: column;
  letter-spacing: 0.5px;
  gap: 0px;
  margin-top: 27px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .hero__title .hero__name .title {
  font-family: "Inter-100";
  font-size: 20px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .hero__title .hero__name .name {
  font-size: 30px;
  font-family: "Inter-500";
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .btn-ghost {
  grid-column: 3;
  grid-row: 1;
  height: 36px;
  align-self: start;
  padding: 0 14px;
  border-radius: 10px;
  background: #ffffff;
  color: #201E52;
  font-family: "Inter-700";
  cursor: pointer;
  transition: 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: none;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .btn-ghost:hover {
  background: rgba(255, 255, 255, 0.18);
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .top-data-wrap .btn-ghost .btn-ghost__icon {
  width: 16px;
  height: 16px;
  display: block;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .hero__stats {
  grid-column: 2/-1;
  grid-row: 2;
  display: grid;
  grid-template-columns: repeat(10, minmax(84px, 1fr));
  gap: 0;
  margin-top: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  overflow: hidden;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .hero__stats .stat {
  display: grid;
  place-items: center;
  padding: 12px 8px;
  text-align: center;
  position: relative;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .hero__stats .stat:not(:first-child)::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 40px;
  background: #474747;
  content: "";
  width: 1px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .hero__stats .stat .stat__value {
  font-family: "Inter-100";
  font-size: 16px;
  color: #ffffff;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .hero__stats .stat .stat__label {
  font-size: 11px;
  opacity: 0.85;
  margin-top: 2px;
  color: #ffffff;
  font-family: "Inter-100";
}
@media (max-width: 1080px) {
  .team-info-wrapper .team-info-wrap .stats-wrapper .main-banner-wrap .main-data-wrap .hero__stats {
    grid-template-columns: repeat(5, minmax(84px, 1fr));
  }
}
@media (max-width: 1080px) {
  .team-info-wrapper .team-info-wrap .stats-wrapper .tis-hero .hero__stats {
    grid-template-columns: repeat(5, minmax(84px, 1fr));
  }
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table {
  padding: 8px 3px 14px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(210px, 1.4fr) repeat(9, minmax(80px, 0.9fr)) minmax(90px, 0.9fr);
  align-items: center;
  gap: 8px;
  padding: 0px 10px 0px 0px;
  border-bottom: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  background: #fbfbfb;
  margin-top: 5px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row::before {
  content: "";
  position: absolute;
  height: 53px;
  left: 0;
  width: 4px;
  background: linear-gradient(180deg, #433fac);
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__name {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-left: 8px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__name .row__rank {
  color: rgba(0, 0, 0, 0.4);
  font-family: "Inter-700";
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__name .row__player {
  color: #000000;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  color: #201E52;
  font-family: "Inter-100";
  font-size: 16px;
  cursor: pointer;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__name .row__player:hover {
  text-decoration: underline;
  color: #201E52;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__cell {
  text-align: center;
  position: relative;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__cell::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 35px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__runs {
  text-align: center;
  padding: 10px 10px;
  background-color: #f1f0ff;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__value {
  font-family: "Inter-700";
  font-size: 14px;
  line-height: 1.1;
  color: #201E52;
}
.team-info-wrapper .team-info-wrap .stats-wrapper .tis-table .row .row__label {
  color: #6b7280;
  font-size: 11px;
  margin-top: 2px;
  color: #201E52;
  font-family: "Inter-200";
}
@media (max-width: 1080px) {
  .team-info-wrapper .team-info-wrap .stats-wrapper .tis-hero .hero__stats {
    grid-template-columns: repeat(5, minmax(84px, 1fr));
  }
}

.team-info-matches-wrapper-container {
  position: relative;
  top: -20px;
  z-index: 2;
  isolation: isolate;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 96%;
  border-radius: 7px;
  padding: 20px 24px 28px;
  /* global keyframes + responsive */
}
.team-info-matches-wrapper-container .matches-header {
  position: relative;
  z-index: 3;
}
.team-info-matches-wrapper-container .matches-header .matches-main-header {
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
  position: relative;
  z-index: 3;
}
.team-info-matches-wrapper-container .matches-header .matches-main-header .heading {
  font-size: 20px;
  font-family: "Inter-500";
  margin: 0 0 12px;
}
.team-info-matches-wrapper-container .matches-header .toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 5px;
  position: relative;
  z-index: 4;
}
.team-info-matches-wrapper-container .matches-header .toolbar .tabs {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.team-info-matches-wrapper-container .matches-header .toolbar .tabs .chip {
  min-height: 42px;
  padding: 10px 18px;
  border: none;
  border-radius: 999px;
  background: #f3f3f5;
  color: #2f2f31;
  font-family: "Inter-700";
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.team-info-matches-wrapper-container .matches-header .toolbar .tabs .chip.active {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(32, 30, 82, 0.2);
}
.team-info-matches-wrapper-container .matches-header .toolbar .tabs .chip:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 2px;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data {
  display: flex;
  align-items: center;
  gap: 30px;
  position: relative;
  z-index: 4;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  z-index: 4;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search {
  position: relative;
  z-index: 4;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search input {
  width: 300px;
  height: 41.6px;
  padding: 0 14px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  border-radius: 999px;
  outline: none;
  background: #ffffff;
  position: relative;
  z-index: 1;
  pointer-events: auto;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .search input:focus {
  background: #201E52;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap {
  cursor: pointer;
  cursor: pointer;
  color: #ffffff;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap span {
  font-size: 15px;
  margin-top: 3px;
  font-family: "Inter-200";
  color: #ffffff;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap .schdule-button {
  border-radius: 5px;
  border: none;
  padding: 0px 15px;
  background-color: #201E52;
  display: flex;
  gap: 5px;
  padding: 6px 10px;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .controls .button-wrap:hover {
  filter: brightness(0.95);
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filters {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filters .filter {
  padding: 8px 12px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid #201e52;
  background: #ffffff;
  font-weight: 600;
  cursor: pointer;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons {
  display: flex;
  gap: 12px;
  align-items: center;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px;
  border: 1px solid #d9dde6;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: transparent;
  cursor: pointer;
  transition: background-color 0.18s ease, opacity 0.18s ease;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  opacity: 0.65;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle.active {
  background: #e8ebf2;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle.active img {
  opacity: 1;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .filter-view-icons .matches-view-toggle:focus-visible {
  outline: 2px solid rgba(44, 41, 112, 0.35);
  outline-offset: 1px;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar {
  position: relative;
  display: inline-block;
  z-index: 5;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar .date-calendar-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 999px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  width: 150px;
  padding: 5px;
  height: 41.6px;
  background-color: #ffffff;
  cursor: pointer;
  position: relative;
  z-index: 1;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar .date-calendar-filter img {
  pointer-events: none;
}
.team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data .date-calendar .calendar-popover {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.18);
  overflow: hidden;
  width: 385px;
  z-index: 1;
}
.team-info-matches-wrapper-container .matches-header .filter-tray {
  margin-top: 12px;
  width: 97%;
  display: flex;
  gap: 30px;
  background: #F3F3F3;
  border-radius: 12px;
  padding: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  animation: slideDown 160ms ease-out;
  position: relative;
  z-index: 4;
}
.team-info-matches-wrapper-container .matches-header .filter-tray .tray-left {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.team-info-matches-wrapper-container .matches-header .filter-tray .tray-left .filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  gap: 30px;
  border-radius: 11px;
  border: 1px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  background: #ffffff;
  font-family: "Inter-500";
  cursor: pointer;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-200";
}
.team-info-matches-wrapper-container .matches-header .filter-tray .tray-left .filter img {
  pointer-events: none;
}
.team-info-matches-wrapper-container .matches-header .filter-tray .tray-right {
  margin-left: auto;
}
.team-info-matches-wrapper-container .matches-header .filter-tray .tray-right .btn-clear {
  background-color: #ffffff;
  border: 1px solid var(--Accent---2, rgba(76, 76, 77, 0.2509803922));
  border-radius: 6px;
  padding: 8px 12px;
  font-family: "Inter-500";
  color: #0f172a;
  cursor: pointer;
  font-family: "Inter-200";
}
.team-info-matches-wrapper-container .matches-header .filter-tray .tray-right .btn-clear:hover {
  background: #e2e8f0;
}
.team-info-matches-wrapper-container .matches-header .matches-load-more-wrap {
  display: flex;
  justify-content: center;
  margin: 20px 0 4px;
}
.team-info-matches-wrapper-container .matches-header .matches-load-more-btn {
  min-height: 44px;
  padding: 10px 28px;
  border-radius: 999px;
  border: none;
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 14px;
  cursor: pointer;
  transition: filter 0.2s ease, opacity 0.2s ease;
}
.team-info-matches-wrapper-container .matches-header .matches-load-more-btn:hover:not(:disabled) {
  filter: brightness(1.05);
}
.team-info-matches-wrapper-container .matches-header .matches-load-more-btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}
.team-info-matches-wrapper-container .frame {
  align-items: center;
  background-color: #f5f5ff;
  display: flex;
  justify-content: space-between;
  padding: 8px 16px;
}
.team-info-matches-wrapper-container .frame .header-info-text {
  color: #37348E;
  font-family: "Inter-700";
  font-size: 14px;
  letter-spacing: -0.4px;
  line-height: normal;
  width: 350px;
  max-width: 350px;
  position: relative;
}
.team-info-matches-wrapper-container .frame .header-info-text::before {
  content: "";
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 0.7px;
  height: 70px;
  background: rgba(76, 76, 77, 0.4);
}
.team-info-matches-wrapper-container .frame .div {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 25px;
  position: relative;
}
.team-info-matches-wrapper-container .frame .div .div-2 {
  align-items: center;
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 813px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .match-info {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  height: 81px;
  justify-content: space-between;
  max-width: 292px;
  position: relative;
  margin-left: 45px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .match-info::before {
  content: "";
  position: absolute;
  right: -8px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 70px;
  background: rgba(76, 76, 77, 0.4);
}
.team-info-matches-wrapper-container .frame .div .div-2 .match-info .match-type {
  align-self: stretch;
  color: #7571CB;
  font-family: "Inter-700";
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.4px;
  line-height: normal;
  margin-top: -1px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .match-info .match-details {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  height: 52px;
  justify-content: space-between;
  position: relative;
  width: 100%;
}
.team-info-matches-wrapper-container .frame .div .div-2 .match-info .match-details .text-wrapper {
  align-self: stretch;
  color: #000000;
  font-family: "Inter-500";
  font-size: 13px;
  line-height: normal;
  margin: 0 auto;
  position: relative;
}
.team-info-matches-wrapper-container .frame .div .div-2 .match-info .match-details .p {
  align-self: stretch;
  color: rgba(0, 0, 0, 0.6784313725);
  font-family: "Inter-200";
  font-size: 13px;
  line-height: normal;
  position: relative;
  margin: 0 auto;
  color: rgba(0, 0, 0, 0.6784313725);
}
.team-info-matches-wrapper-container .frame .div .div-2 .line {
  height: 52px;
  object-fit: cover;
  position: relative;
  width: 1px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 11px;
  position: relative;
  width: 445px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .header-info-text-2 {
  color: #4C4C4D;
  font-family: "Inter-500";
  font-size: 13px;
  font-weight: 500;
  height: 17px;
  letter-spacing: -0.4px;
  line-height: normal;
  margin-top: -1px;
  text-align: center;
  width: 445px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 24px;
  justify-content: center;
  width: 100%;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 {
  align-items: center;
  display: flex;
  gap: 10px;
  position: relative;
  width: 180px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .team-info {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .team-info .team-logo {
  align-items: center;
  background-color: #ffffff;
  border: 2px solid;
  border-color: #7571CB;
  border-radius: 43px;
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  overflow: hidden;
  padding: 6px 7px;
  width: 36px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .team-info .team-logo .ellipse {
  aspect-ratio: 1;
  height: 24px;
  margin-left: -1px;
  margin-right: -1px;
  object-fit: cover;
  width: 24px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 126px;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .team-name {
  color: var(--variable-collection-black);
  font-family: "Inter-Medium", Helvetica;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.4px;
  line-height: normal;
  margin-top: -1px;
  width: fit-content;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 9px;
  width: 100%;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score {
  color: var(--variable-collection-black-duplicate);
  font-family: "Inter-SemiBold", Helvetica;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1px;
  width: fit-content;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score-2 {
  color: var(--variable-collection-black-duplicate);
  font-family: "Inter-Regular", Helvetica;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: normal;
  width: fit-content;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score-2 .span {
  color: #4c4c4d;
}
.team-info-matches-wrapper-container .frame .div .div-2 .div-3 .div-4 .div-5 .div-6 .div-7 .team-score-2 .text-wrapper-2 {
  color: #000000;
}
.team-info-matches-wrapper-container .frame .div .create-button {
  align-items: center;
  background-color: #201E52;
  border-radius: 4px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 2px;
  height: 35px;
  justify-content: center;
  padding: 0px 10px;
}
.team-info-matches-wrapper-container .frame .div .create-button .header-title {
  color: #ffffff;
  font-family: "Inter-Medium", Helvetica;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: normal;
  width: fit-content;
}
.team-info-matches-wrapper-container .live-matches-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 10px;
}
@media (max-width: 768px) {
  .team-info-matches-wrapper-container .live-matches-grid {
    flex-direction: column;
    gap: 12px;
  }
}
.team-info-matches-wrapper-container .live-match-card {
  background: #f5f5f5;
  border: 1px solid rgba(76, 76, 77, 0.14);
  border-radius: 6px;
  flex: 1 1 400px;
  min-width: 330px;
  max-width: 455px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .live-tag {
  font-family: "Inter-700";
  font-size: 12px;
  color: #d8252d;
  line-height: 0;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .upcoming-tag {
  font-family: "Inter-700";
  font-size: 12px;
  color: #e15600;
  line-height: 0;
  font-weight: 800;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .result-tag {
  color: #201E52;
  font-family: "Inter-700";
  font-size: 12px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-date {
  font-family: "Inter-700";
  font-size: 12px;
  color: #000000;
  font-weight: 700;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: "Inter-200";
  font-size: 13px;
  color: rgba(76, 76, 77, 0.8);
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info .separator {
  color: rgba(76, 76, 77, 0.8);
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info .match-context-league,
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .live-indicator .match-info .match-context-tournament {
  font-family: "Inter-200";
  font-size: 13px;
  color: rgba(76, 76, 77, 0.8);
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-logo {
  width: 28px;
  height: 28px;
  background: white;
  border: 0.389px solid #7571cb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-logo img {
  width: 18.667px;
  height: 18.667px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-info .team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.79);
  letter-spacing: -0.4px;
  text-transform: capitalize;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score {
  display: flex;
  align-items: center;
  gap: 8px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.79);
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs {
  display: flex;
  align-items: center;
  gap: 8px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs .score {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-section .team-row .team-score .score-with-overs .overs {
  font-family: "Inter-500";
  font-size: 12px;
  color: #4c4c4d;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section {
  display: flex;
  flex-direction: column;
  gap: 9px;
  flex: 1;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row {
  display: flex;
  align-items: center;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info {
  display: flex;
  align-items: center;
  gap: 12px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-logo {
  width: 28px;
  height: 28px;
  background: white;
  border: 0.389px solid #7571cb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-logo img {
  width: 18.667px;
  height: 18.667px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .teams-section .team-row .team-info .team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  letter-spacing: -0.4px;
  text-transform: capitalize;
  font-weight: 600;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section {
  display: flex;
  justify-content: flex-end;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info .time-label {
  font-family: "Inter-500";
  font-size: 12px;
  color: rgba(0, 0, 0, 0.79);
  font-weight: 500;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .teams-and-time-section .time-section .time-info .time-value {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  font-weight: 600;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .countdown-section {
  display: flex;
  justify-content: flex-start;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .countdown-section .countdown-text {
  font-family: "Inter-500";
  font-size: 13px;
  color: #433fac;
  font-weight: 500;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .countdown-section .countdown-text .countdown-bold {
  font-family: "Inter-500";
  font-weight: 600;
  color: #433fac;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .live-match-header .result-text {
  color: #107E0C;
  font-family: "Inter-200";
  font-size: 12px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 10px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details .umpire-info {
  font-family: "Inter-500";
  font-size: 13px;
  color: rgba(0, 0, 0, 0.63);
  margin: 0;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details .umpire-info .label {
  font-family: "Inter-500";
  color: #000000;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info {
  display: flex;
  align-items: center;
  gap: 6px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info .venue-icon {
  width: 16px;
  height: 16px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info .venue-icon img {
  width: 100%;
  height: 100%;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-details .venue-info .venue-name {
  font-family: "Inter-500";
  font-size: 13px;
  color: #201E52;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .divider-line {
  height: 1px;
  background: linear-gradient(90deg, #ffffff 0%, rgba(87, 83, 192, 0.67) 43.1%, rgba(87, 83, 192, 0.67) 52.1%, #ffffff 100%);
  width: 100%;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-center-btn {
  background: #201E52;
  border: 1px solid rgba(67, 63, 172, 0.36);
  border-radius: 36px;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-center-btn span {
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-center-btn .btn-icon {
  width: 24px;
  height: 24px;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-center-btn .btn-icon img {
  width: 100%;
  height: 100%;
}
.team-info-matches-wrapper-container .live-match-card .live-match-content .match-center-btn:hover {
  background: #201E52;
  transform: translateY(-1px);
}
@media (max-width: 1200px) {
  .team-info-matches-wrapper-container {
    width: 99%;
  }
  .team-info-matches-wrapper-container .match-card {
    grid-template-columns: 1fr;
  }
  .team-info-matches-wrapper-container .match-card .divider {
    display: none;
  }
  .team-info-matches-wrapper-container .match-card .cta {
    justify-content: flex-start;
    margin-top: 8px;
  }
  .team-info-matches-wrapper-container .controls .search input {
    width: 240px;
  }
}
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 720px) {
  .team-info-matches-wrapper-container .matches-wrapper-container .filter-tray {
    flex-direction: column;
    align-items: stretch;
  }
  .team-info-matches-wrapper-container .matches-wrapper-container .filter-tray .tray-right {
    width: 100%;
    display: flex;
    justify-content: flex-end;
  }
}
.team-info-matches-wrapper-container .cards {
  display: grid;
  gap: 12px;
  background-color: #FCFCFF;
  border: 1px solid #FCFCFF;
  box-shadow: 0px 1px 4.1px 0px rgba(0, 0, 0, 0.1803921569);
  border-radius: 12px;
  margin-top: 10px;
}
.team-info-matches-wrapper-container .match-card {
  display: grid;
  grid-template-columns: 1.2fr 1.6fr 1px 0.6fr;
  align-items: stretch;
  gap: 16px;
  padding: 10px 18px 0px 10px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(20, 20, 43, 0.03);
}
.team-info-matches-wrapper-container .match-card .meta .tag {
  display: inline-block;
  font-family: "Inter-700";
  color: #7571CB;
  margin-bottom: 6px;
  font-size: 12px;
}
.team-info-matches-wrapper-container .match-card .meta .details p {
  margin: 0 0 2px;
  font-family: "Inter-700";
  font-size: 13px;
  line-height: 1.3;
}
.team-info-matches-wrapper-container .match-card .meta .details .sub {
  color: rgba(0, 0, 0, 0.6784313725);
  font-family: "Inter-200";
}
.team-info-matches-wrapper-container .match-card .teams {
  display: flex;
  flex-direction: column;
  position: relative;
}
.team-info-matches-wrapper-container .match-card .teams::after {
  position: absolute;
  left: -11px;
  top: 42%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.team-info-matches-wrapper-container .match-card .teams::before {
  position: absolute;
  right: -18px;
  top: 42%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.team-info-matches-wrapper-container .match-card .teams .second-row {
  padding-top: 6px;
}
.team-info-matches-wrapper-container .match-card .teams .row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: 12px;
  padding-left: 12px;
  padding-right: 12px;
  position: relative;
}
.team-info-matches-wrapper-container .match-card .teams .row:first-child::after {
  position: absolute;
  left: 50%;
  bottom: 0;
  top: 110%;
  transform: translateX(-50%);
  height: 1px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 322px;
}
.team-info-matches-wrapper-container .match-card .teams .row .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.team-info-matches-wrapper-container .match-card .teams .row .name-and-chip {
  display: flex;
  gap: 20px;
}
.team-info-matches-wrapper-container .match-card .teams .row .name-and-chip .team {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .teams .row .name-and-chip .chip-blue {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 7px;
  font-size: 12px;
  line-height: 18px;
  font-family: "Inter-200";
  background: #F4F4FF;
  color: #7571CB;
  border: 1px solid rgba(244, 244, 255, 0.2);
}
.team-info-matches-wrapper-container .match-card .teams .row .score {
  display: flex;
  gap: 2px;
}
.team-info-matches-wrapper-container .match-card .teams .row .score .runs {
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .teams .row .score .ovr {
  display: block;
  font-size: 14px;
  color: #4c4c4d;
  font-family: "Inter-500";
  margin-top: 5px;
}
.team-info-matches-wrapper-container .match-card .teams .row .status {
  justify-self: end;
  font-family: "Inter-500";
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .teams .green-text {
  text-align: center;
  color: #1c8847;
  font-family: "Inter-700";
  font-size: 14px;
  padding: 5px 5px;
  margin: 0 auto;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams {
  display: flex;
  gap: 15px;
  position: relative;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams::after {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams::before {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 1px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows {
  display: flex;
  flex-direction: column;
  padding-left: 20px;
  gap: 10px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  align-items: center;
  gap: 12px;
  padding-left: 12px;
  padding-right: 12px;
  position: relative;
  padding-bottom: 5px;
  width: 330px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row:first-child::after {
  position: absolute;
  left: 55%;
  bottom: 0px;
  transform: translateX(-50%);
  height: 1px;
  background: rgba(76, 76, 77, 0.2509803922);
  content: "";
  width: 280px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .logo {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .name-and-chip {
  display: flex;
  gap: 20px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .name-and-chip .team {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .name-and-chip .chip-blue {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 7px;
  font-size: 12px;
  line-height: 18px;
  font-family: "Inter-200";
  background: #F4F4FF;
  color: #7571CB;
  border: 1px solid rgba(244, 244, 255, 0.2);
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .score {
  display: flex;
  gap: 2px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .score .runs {
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .score .ovr {
  display: block;
  font-size: 14px;
  color: #4c4c4d;
  font-family: "Inter-500";
  margin-top: 5px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .upcoming-teams-rows .upcoming-row .status {
  justify-self: end;
  font-family: "Inter-500";
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .time-data {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-right: 20px;
  padding-top: 30px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .time-data .date {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  margin: 0 0 2px;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .time-data .time {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin: 0;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .time-data .time .hours {
  font-family: "Inter-700";
  font-size: 20px;
  color: #000000;
}
.team-info-matches-wrapper-container .match-card .upcoming-teams .time-data .time .ampm {
  font-family: "Inter-500";
  font-size: 12px;
  color: #4c4c4d;
}
.team-info-matches-wrapper-container .match-card .divider {
  width: 1px;
  margin: 0 4px;
}
.team-info-matches-wrapper-container .match-card .cta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.team-info-matches-wrapper-container .match-card .cta .btn.btn-secondary {
  background: #201E52;
  color: #ffffff;
  border-radius: 5px;
  padding: 10px 16px;
  border: none;
  font-weight: 700;
  cursor: pointer;
}
.team-info-matches-wrapper-container .match-card .cta .btn.btn-secondary:hover {
  filter: brightness(0.95);
}
@media (max-width: 1200px) {
  .team-info-matches-wrapper-container {
    width: 99%;
  }
  .team-info-matches-wrapper-container .match-card {
    grid-template-columns: 1fr;
  }
  .team-info-matches-wrapper-container .match-card .divider {
    display: none;
  }
  .team-info-matches-wrapper-container .match-card .cta {
    justify-content: flex-start;
    margin-top: 8px;
  }
  .team-info-matches-wrapper-container .controls .search input {
    width: 240px;
  }
}

.atm-modal--options {
  width: 440px;
  max-width: 95vw;
  max-height: min(90vh, 520px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.atm-modal--options .atm-add-teams-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px 24px 24px;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.atm-modal--options .atm-add-teams-label {
  margin: 0;
  font-size: 14px;
  font-family: "Inter-500";
  color: #374151;
  line-height: 1.45;
}
.atm-modal--options .atm-add-teams-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.atm-modal--options .atm-add-teams-btn {
  width: 100%;
  padding: 14px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-family: "Inter-600";
  line-height: 1.35;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  box-sizing: border-box;
}
.atm-modal--options .atm-add-teams-btn--secondary {
  background: #fff;
  color: #1e1b4b;
  border: 1.5px solid #1e1b4b;
}
.atm-modal--options .atm-add-teams-btn--secondary:hover {
  background: #f0f4ff;
}
.atm-modal--options .atm-add-teams-btn--primary {
  background: #1e1b4b;
  color: #fff;
  border: 1.5px solid #1e1b4b;
}
.atm-modal--options .atm-add-teams-btn--primary:hover {
  background: #312e81;
  border-color: #312e81;
}

.atm-modal--create-team {
  width: 720px;
  max-width: 96vw;
  max-height: 92vh;
  overflow-y: auto;
  box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25);
}
.atm-modal--create-team .atm-header--create-team {
  position: relative;
  justify-content: center;
  align-items: center;
  padding: 22px 48px 16px;
  border-bottom: none;
}
.atm-modal--create-team .atm-header--create-team .atm-title--centered {
  margin: 0 auto;
  text-align: center;
  font-size: 18px;
  font-family: "Inter-700";
  color: #111827;
}
.atm-modal--create-team .atm-header--create-team .atm-close--floating {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
}
.atm-modal--create-team .atm-create-form-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 8px 28px 28px;
}
.atm-modal--create-team .atm-create-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px 18px;
}
@media (max-width: 700px) {
  .atm-modal--create-team .atm-create-row {
    grid-template-columns: 1fr;
  }
}
.atm-modal--create-team .atm-create-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.atm-modal--create-team .atm-create-field.atm-create-field--full {
  width: 100%;
}
.atm-modal--create-team .atm-create-field label {
  font-size: 13px;
  font-family: "Inter-500";
  color: #111827;
}
.atm-modal--create-team .atm-create-field .atm-required {
  color: #ef4444;
  margin-left: 2px;
}
.atm-modal--create-team .atm-create-field input:not(.atm-image-combo-input),
.atm-modal--create-team .atm-create-field textarea.atm-create-textarea {
  border: 1px solid #d1d5db;
  border-radius: 8px;
  padding: 10px 14px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #111827;
  outline: none;
  width: 100%;
  box-sizing: border-box;
  background: #fff;
}
.atm-modal--create-team .atm-create-field input:not(.atm-image-combo-input)::placeholder,
.atm-modal--create-team .atm-create-field textarea.atm-create-textarea::placeholder {
  color: #9ca3af;
  font-style: italic;
}
.atm-modal--create-team .atm-create-field input:not(.atm-image-combo-input):focus,
.atm-modal--create-team .atm-create-field textarea.atm-create-textarea:focus {
  border-color: #94a3b8;
}
.atm-modal--create-team .atm-create-field textarea.atm-create-textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.45;
}
.atm-modal--create-team .atm-image-input-combo {
  position: relative;
  display: flex;
  align-items: stretch;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}
.atm-modal--create-team .atm-image-input-combo:focus-within {
  border-color: #94a3b8;
}
.atm-modal--create-team .atm-image-input-combo .atm-image-combo-input {
  flex: 1;
  min-width: 0;
  border: none;
  border-radius: 0;
  padding: 10px 12px;
  font-size: 14px;
  font-family: "Inter-500";
  color: #111827;
  outline: none;
  background: transparent;
}
.atm-modal--create-team .atm-image-input-combo .atm-image-combo-input::placeholder {
  color: #9ca3af;
  font-style: italic;
}
.atm-modal--create-team .atm-image-input-combo .atm-upload-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  border: none;
  border-left: 1px solid #e5e7eb;
  background: #fafafa;
  cursor: pointer;
  font-size: 13px;
  font-family: "Inter-500";
  color: #9ca3af;
  white-space: nowrap;
  flex-shrink: 0;
}
.atm-modal--create-team .atm-image-input-combo .atm-upload-inline .atm-upload-icon {
  flex-shrink: 0;
  color: #9ca3af;
}
.atm-modal--create-team .atm-image-input-combo .atm-upload-inline:hover {
  background: #f3f4f6;
  color: #6b7280;
}
.atm-modal--create-team .atm-image-input-combo .atm-upload-inline:hover .atm-upload-icon {
  color: #6b7280;
}
.atm-modal--create-team .atm-file-hidden {
  display: none;
}
.atm-modal--create-team .atm-create-approve-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 0 8px;
}
.atm-modal--create-team .atm-create-approve-copy {
  flex: 1;
  min-width: 0;
}
.atm-modal--create-team .atm-create-approve-title {
  display: block;
  font-size: 14px;
  font-family: "Inter-700";
  color: #111827;
  margin-bottom: 4px;
}
.atm-modal--create-team .atm-create-approve-desc {
  margin: 0;
  font-size: 13px;
  font-family: "Inter-400";
  color: #6b7280;
  line-height: 1.45;
}
.atm-modal--create-team .atm-create-switch {
  position: relative;
  width: 48px;
  height: 28px;
  flex-shrink: 0;
  border: none;
  border-radius: 14px;
  background: #d1d5db;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s ease;
}
.atm-modal--create-team .atm-create-switch:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}
.atm-modal--create-team .atm-create-switch.atm-create-switch--on {
  background: #1e1b4b;
}
.atm-modal--create-team .atm-create-switch-knob {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
  transition: transform 0.2s ease;
  pointer-events: none;
}
.atm-modal--create-team .atm-create-switch--on .atm-create-switch-knob {
  transform: translateX(20px);
}
.atm-modal--create-team .atm-create-submit-wrap {
  padding-top: 8px;
}
.atm-modal--create-team .atm-create-team-submit {
  width: 100%;
  padding: 14px 20px;
  border: none;
  border-radius: 10px;
  background: #1e1b4b;
  color: #fff;
  font-size: 15px;
  font-family: "Inter-600";
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(30, 27, 75, 0.2);
  transition: background 0.15s ease;
}
.atm-modal--create-team .atm-create-team-submit:hover {
  background: #312e81;
}

.atm-add-teams-shell {
  margin-top: 75px;
  min-height: 100vh;
  background: linear-gradient(165deg, #1e1b4b 0%, #15133a 40%, #1a2744 100%);
  padding: 24px 16px 36px;
  box-sizing: border-box;
}

.atm-add-teams-panel {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.28);
  padding: 26px 28px 22px;
  overflow: hidden;
}

.atm-add-teams-watermark {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 0;
  text-align: center;
}

.atm-add-teams-watermark-brand {
  font-size: clamp(32px, 7vw, 64px);
  font-family: "Inter-800";
  font-weight: 800;
  color: rgba(148, 163, 184, 0.11);
  letter-spacing: 0.08em;
  line-height: 1;
}

.atm-add-teams-watermark-tag {
  display: block;
  margin-top: 10px;
  font-size: 10px;
  font-family: "Inter-500";
  letter-spacing: 0.28em;
  color: rgba(148, 163, 184, 0.14);
  max-width: 220px;
  line-height: 1.5;
}

.atm-add-teams-header-row {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.atm-add-teams-back {
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  line-height: 0;
}
.atm-add-teams-back img {
  width: 20px;
  height: 20px;
}

.atm-add-teams-page-title {
  margin: 0;
  font-size: 20px;
  font-family: "Inter-700";
  color: #111827;
}

.atm-add-teams-toolbar {
  position: relative;
  /* Above .atm-listing-grid--add-teams so the tournament dropdown menu paints over team cards */
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 22px;
}

.atm-add-teams-tournament-dd {
  min-width: 220px;
  max-width: 100%;
  flex: 1 1 240px;
  position: relative;
  z-index: 21;
}
.atm-add-teams-tournament-dd .form-dropdown {
  width: 100%;
  max-width: 320px;
}
.atm-add-teams-tournament-dd .form-dropdown__list {
  z-index: 100;
}

.atm-add-teams-create-outline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: #fff;
  border: 1.5px solid #1e1b4b;
  border-radius: 10px;
  color: #1e1b4b;
  font-size: 14px;
  font-family: "Inter-600";
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease;
}
.atm-add-teams-create-outline:hover {
  background: #f4f6ff;
}
.atm-add-teams-create-outline .atm-add-teams-create-plus {
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
}

.atm-listing-grid--add-teams {
  position: relative;
  z-index: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: visible;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .atm-listing-grid--add-teams {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 520px) {
  .atm-listing-grid--add-teams {
    grid-template-columns: 1fr;
  }
}
.atm-listing-grid--add-teams .atm-listing-empty-state {
  grid-column: 1/-1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 72px 40px;
  border: 1px dashed #e2e8f0;
  border-radius: 12px;
  background: #fafafa;
}
.atm-listing-grid--add-teams .atm-listing-empty-text {
  color: #64748b;
  font-size: 15px;
  margin: 0;
  font-family: "Inter-500";
}
.atm-listing-grid--add-teams .atm-listing-empty-btn {
  background: #1e1b4b;
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 12px 24px;
  font-size: 14px;
  font-family: "Inter-600";
  cursor: pointer;
}
.atm-listing-grid--add-teams .atm-listing-empty-btn:hover {
  background: #312e81;
}

.atm-listing-card--add-teams {
  position: relative;
  display: block;
  padding: 16px 44px 16px 16px;
  background: #fafbfc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  cursor: pointer;
  user-select: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.atm-listing-card--add-teams:hover {
  border-color: #cbd5e1;
}
.atm-listing-card--add-teams.atm-listing-card--selected {
  background: #f0f4ff;
  border-color: #a5b4fc;
  box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.2);
}
.atm-listing-card--add-teams .atm-listing-checkbox {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  accent-color: #1e1b4b;
}
.atm-listing-card--add-teams .atm-listing-card-main {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}
.atm-listing-card--add-teams .atm-listing-avatar--logo {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
  background: #e2e8f0;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.atm-listing-card--add-teams .atm-listing-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.atm-listing-card--add-teams .atm-listing-body {
  flex: 1;
  min-width: 0;
  padding-top: 2px;
}
.atm-listing-card--add-teams .atm-listing-name {
  font-size: 15px;
  font-family: "Inter-700";
  color: #0f172a;
  display: block;
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.atm-listing-card--add-teams .atm-listing-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 0;
}
.atm-listing-card--add-teams .atm-listing-stat {
  font-size: 9px;
  font-family: "Inter-600";
  letter-spacing: 0.02em;
  padding: 4px 8px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid currentColor;
  white-space: nowrap;
}
.atm-listing-card--add-teams .atm-listing-stat b {
  font-family: "Inter-700";
  margin-left: 2px;
}
.atm-listing-card--add-teams .atm-listing-stat--played {
  color: #2563eb;
  border-color: #2563eb;
  background: rgba(37, 99, 235, 0.06);
}
.atm-listing-card--add-teams .atm-listing-stat--played b {
  color: #1d4ed8;
}
.atm-listing-card--add-teams .atm-listing-stat--won {
  color: #16a34a;
  border-color: #16a34a;
  background: rgba(22, 163, 74, 0.06);
}
.atm-listing-card--add-teams .atm-listing-stat--won b {
  color: #15803d;
}
.atm-listing-card--add-teams .atm-listing-stat--lost {
  color: #dc2626;
  border-color: #dc2626;
  background: rgba(220, 38, 38, 0.06);
}
.atm-listing-card--add-teams .atm-listing-stat--lost b {
  color: #b91c1c;
}
.atm-listing-card--add-teams .atm-listing-stat--tie {
  color: #64748b;
  border-color: #94a3b8;
  background: rgba(148, 163, 184, 0.08);
}
.atm-listing-card--add-teams .atm-listing-stat--tie b {
  color: #475569;
}

.atm-add-teams-footer {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: flex-end;
  padding-top: 22px;
  margin-top: 8px;
}

.atm-add-teams-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  background: #1e1b4b;
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 15px;
  font-family: "Inter-600";
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(30, 27, 75, 0.25);
  transition: background 0.15s ease;
}
.atm-add-teams-add-btn:hover:not(:disabled) {
  background: #312e81;
}
.atm-add-teams-add-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.atm-add-teams-add-btn .atm-add-teams-add-icon {
  font-size: 20px;
  font-weight: 600;
  line-height: 1;
}

.create-division-page .atm-create-new-btn {
  margin-left: auto;
  padding: 8px 18px;
  background: #fff;
  border: 1.5px solid #1a2b4b;
  border-radius: 8px;
  color: #1a2b4b;
  font-size: 13px;
  font-family: "Inter-500";
  cursor: pointer;
}
.create-division-page .atm-create-new-btn:hover {
  background: #f0f4ff;
}
.create-division-page .atm-listing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: #eef0f4;
  border: 1px solid #eef0f4;
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 24px;
}
@media (max-width: 700px) {
  .create-division-page .atm-listing-grid {
    grid-template-columns: 1fr 1fr;
  }
}
.create-division-page .atm-listing-empty-state {
  grid-column: 1/-1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 80px 48px;
  background: #fff;
}
.create-division-page .atm-listing-empty-text {
  color: #9ca3af;
  font-size: 15px;
  margin: 0;
}
.create-division-page .atm-listing-empty-btn {
  background: #1a73e8;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 12px 28px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.create-division-page .atm-listing-empty-btn:hover {
  background: #1558b0;
}
.create-division-page .atm-listing-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: #fff;
  cursor: pointer;
  user-select: none;
}
.create-division-page .atm-listing-card.atm-listing-card--selected {
  background: #f0f4ff;
}
.create-division-page .atm-listing-card .atm-listing-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #1a2b4b;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.create-division-page .atm-listing-card .atm-listing-avatar .atm-listing-avatar-initials {
  color: #fff;
  font-size: 16px;
  font-family: "Inter-700";
}
.create-division-page .atm-listing-card .atm-listing-body {
  flex: 1;
  min-width: 0;
}
.create-division-page .atm-listing-card .atm-listing-body .atm-listing-name {
  font-size: 13px;
  font-family: "Inter-600";
  color: #111827;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.create-division-page .atm-listing-card .atm-listing-body .atm-listing-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}
.create-division-page .atm-listing-card .atm-listing-body .atm-listing-stats .atm-listing-stat {
  font-size: 10px;
  color: #6b7280;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  padding: 1px 5px;
}
.create-division-page .atm-listing-card .atm-listing-body .atm-listing-stats .atm-listing-stat b {
  color: #111827;
}
.create-division-page .atm-listing-card .atm-listing-checkbox {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: #1a2b4b;
}

/* Team-info matches tab: mobile Figma layout.
   teams.scss is imported after matches.scss — duplicate mobile rules here so they win over
   .team-info-matches-wrapper-container desktop blocks above. */
@media (max-width: 768px) {
  .team-info-matches-wrapper-container {
    padding-left: 12px !important;
    padding-right: 12px !important;
    border-radius: 12px;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: 8px;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header .heading {
    margin: 0 0 10px;
    font-size: 17px;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header .controls {
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header .controls .search {
    flex: 1;
    min-width: 0;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header .controls .search input {
    width: 100%;
    height: 40px;
    padding: 0 14px 0 40px;
    border-radius: 999px;
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3csvg%20width='24'%20height='25'%20viewBox='0%200%2024%2025'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M19.6%2021.5L13.3%2015.2C12.8%2015.6%2012.225%2015.9167%2011.575%2016.15C10.925%2016.3833%2010.2333%2016.5%209.5%2016.5C7.68333%2016.5%206.14583%2015.8708%204.8875%2014.6125C3.62917%2013.3542%203%2011.8167%203%2010C3%208.18333%203.62917%206.64583%204.8875%205.3875C6.14583%204.12917%207.68333%203.5%209.5%203.5C11.3167%203.5%2012.8542%204.12917%2014.1125%205.3875C15.3708%206.64583%2016%208.18333%2016%2010C16%2010.7333%2015.8833%2011.425%2015.65%2012.075C15.4167%2012.725%2015.1%2013.3%2014.7%2013.8L21%2020.1L19.6%2021.5ZM9.5%2014.5C10.75%2014.5%2011.8125%2014.0625%2012.6875%2013.1875C13.5625%2012.3125%2014%2011.25%2014%2010C14%208.75%2013.5625%207.6875%2012.6875%206.8125C11.8125%205.9375%2010.75%205.5%209.5%205.5C8.25%205.5%207.1875%205.9375%206.3125%206.8125C5.4375%207.6875%205%208.75%205%2010C5%2011.25%205.4375%2012.3125%206.3125%2013.1875C7.1875%2014.0625%208.25%2014.5%209.5%2014.5Z'%20fill='%234C4C4D'%20fill-opacity='0.6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: 14px center;
    background-size: 16px 16px;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header .controls .button-wrap .schdule-button {
    flex-shrink: 0;
    border-radius: 999px;
    padding: 8px 14px;
    min-height: 40px;
    display: flex;
    align-items: center;
    white-space: nowrap;
  }
  .team-info-matches-wrapper-container .matches-header .matches-main-header .controls .button-wrap .schdule-button span {
    font-size: 14px;
    margin-top: 0;
  }
  .team-info-matches-wrapper-container .matches-header .toolbar {
    flex-wrap: wrap;
    margin-top: 12px;
    gap: 0;
  }
  .team-info-matches-wrapper-container .matches-header .toolbar .tabs {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 4px;
    margin: 0 -2px;
    padding-left: 2px;
    padding-right: 2px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .team-info-matches-wrapper-container .matches-header .toolbar .tabs::-webkit-scrollbar {
    display: none;
  }
  .team-info-matches-wrapper-container .matches-header .toolbar .tabs .chip {
    flex-shrink: 0;
    min-height: 38px;
    padding: 8px 16px;
    font-size: 12px;
    letter-spacing: 0.04em;
  }
  .team-info-matches-wrapper-container .matches-header .toolbar .right-filters-data {
    display: none !important;
  }
  .team-info-matches-wrapper-container .matches-header .filter-tray {
    display: none !important;
  }
  .team-info-matches-wrapper-container .live-matches-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
  }
  .team-info-matches-wrapper-container .live-match-card {
    flex: 1 1 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    width: 100%;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 3px rgba(17, 24, 39, 0.06);
  }
  .team-info-matches-wrapper-container .live-match-card .live-match-content {
    padding: 14px 14px 16px !important;
    gap: 12px !important;
  }
  .team-info-matches-wrapper-container .live-match-card .live-indicator .live-tag,
  .team-info-matches-wrapper-container .live-match-card .live-indicator .upcoming-tag {
    line-height: 1.25 !important;
    letter-spacing: 0.06em;
    font-size: 11px !important;
  }
  .team-info-matches-wrapper-container .live-match-card .live-indicator .result-tag {
    line-height: 1.25 !important;
    font-size: 11px !important;
    word-break: break-word;
  }
  .team-info-matches-wrapper-container .live-match-card .live-indicator .match-info {
    align-items: flex-start;
    flex-wrap: wrap;
    margin-top: 8px !important;
    row-gap: 2px;
  }
  .team-info-matches-wrapper-container .live-match-card .live-indicator .match-info .match-context-league,
  .team-info-matches-wrapper-container .live-match-card .live-indicator .match-info .match-context-tournament {
    font-size: 12px !important;
    line-height: 1.35;
  }
  .team-info-matches-wrapper-container .live-match-card .teams-and-time-section {
    flex-direction: column;
    align-items: stretch !important;
    gap: 12px;
  }
  .team-info-matches-wrapper-container .live-match-card .teams-and-time-section .time-section {
    justify-content: flex-start;
  }
  .team-info-matches-wrapper-container .live-match-card .teams-and-time-section .time-section .time-info {
    align-items: flex-start;
  }
  .team-info-matches-wrapper-container .live-match-card .team-row .team-info .team-name {
    max-width: none !important;
  }
  .team-info-matches-wrapper-container .live-match-card .match-center-btn {
    width: 100%;
    max-width: none;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    justify-content: center;
  }
  .team-info-matches-wrapper-container .live-match-card .match-center-btn .btn-icon {
    display: none;
  }
  .team-info-matches-wrapper-container .live-match-card .upcoming-match-actions .match-center-btn {
    width: 100%;
  }
  .team-info-matches-wrapper-container .matches-load-more-wrap {
    margin-top: 16px;
    padding-bottom: 8px;
  }
}
.profile-wrapper-container {
  background-color: #ffffff;
  padding: 85px 5px;
}
.profile-wrapper-container .profile-wrap {
  position: relative;
  width: 92%;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 7px;
  box-shadow: 0 6px 18px rgba(20, 20, 43, 0.06);
  overflow: hidden;
  min-height: 700px;
}
.profile-wrapper-container .profile-wrap .back-button {
  padding: 3px 10px;
  cursor: pointer;
}
.profile-wrapper-container .profile-wrap .profile-no-player,
.profile-wrapper-container .profile-wrap .profile-loading,
.profile-wrapper-container .profile-wrap .profile-error {
  padding: 60px 24px;
  text-align: center;
  color: #6b7280;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 16px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap {
  position: relative;
  background: url("/assets/TournamentHbg-D7ATlbKU.png") center/cover no-repeat;
  background-size: cover;
  background-position: inherit;
  background-repeat: no-repeat;
  color: #ffffff;
  display: flex;
  flex-direction: row;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data {
  display: flex;
  flex-direction: row;
  padding-left: 50px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  padding-left: 20px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .main-name {
  font-family: "Inter-100";
  font-size: 20px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .last-name {
  font-family: "Inter-500";
  font-size: 30px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .country-data {
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .country-data .flag {
  margin-top: 12px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .country-data .country-name {
  font-family: "Inter-100";
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .basic-details {
  display: flex;
  flex-direction: row;
  gap: 40px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  padding: 10px 35px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .basic-details .label-value {
  position: relative;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .basic-details .label-value:not(:first-child)::before {
  position: absolute;
  left: -23px;
  top: 50%;
  transform: translateY(-50%);
  height: 32px;
  background: #474747;
  content: "";
  width: 1px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .basic-details .label-value .label {
  font-family: "Inter-100";
  font-size: 14px;
  opacity: 80%;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .profile-data .basic-details .label-value .value {
  font-family: "Inter-100";
  font-size: 16px;
  margin-top: 6px;
  opacity: 80%;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .compare {
  margin-left: 175px;
}
.profile-wrapper-container .profile-wrap .background-image-wrap .banner-data .top-data .compare .compare-button {
  margin-top: 30px;
  margin-left: auto;
  border: 1px solid #FFFFFF;
  background-color: transparent;
  color: #ffffff;
  display: flex;
  gap: 10px;
  padding: 10px 20px;
  border-radius: 20px;
}
.profile-wrapper-container .profile-wrap .after-main-container {
  padding: 15px 30px;
}
.profile-wrapper-container .profile-wrap .after-main-container .tab-wrapper {
  display: flex;
  gap: 10px;
  margin-top: 10px;
}
.profile-wrapper-container .profile-wrap .after-main-container .tab-wrapper .format-tab {
  padding: 10px 24px;
  border-radius: 20px;
  border: none;
  font-family: "Inter-500", "Inter", sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  background: rgba(76, 76, 77, 0.06);
  color: rgba(0, 0, 0, 0.85);
  transition: background 0.2s, color 0.2s;
}
.profile-wrapper-container .profile-wrap .after-main-container .tab-wrapper .format-tab:hover {
  background: rgba(76, 76, 77, 0.12);
}
.profile-wrapper-container .profile-wrap .after-main-container .tab-wrapper .format-tab.active {
  background: #2C2970;
  color: #ffffff;
}
.profile-wrapper-container .profile-wrap .after-main-container .tab-wrapper .format-tab.active:hover {
  background: rgb(36.6666666667, 34.1666666667, 93.3333333333);
}
.profile-wrapper-container .profile-wrap .after-main-container .tables-wrapper {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  width: 100%;
  margin: 0 auto;
  padding: 20px 0;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card {
  background: #ffffff;
  border: 1px solid #ffffff;
  box-shadow: 0px 0px 4.1px 0px rgba(0, 0, 0, 0.1803921569);
  border-radius: 12px;
  overflow: hidden;
  min-width: 390px;
  max-width: 520px;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .card-head {
  background: #2C2970;
  color: #ffffff;
  padding: 14px 18px;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .card-head .head-left .icon {
  width: 24px;
  height: 24px;
  opacity: 0.9;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .card-head .head-left .title {
  font-size: 16px;
  font-family: "Inter-200";
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin: 0;
  line-height: 1;
  text-align: center;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .card-body {
  padding: 0;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 18px;
  position: relative;
  background: #fff;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 0;
  height: 1px;
  background: rgba(76, 76, 77, 0.2509803922);
  pointer-events: none;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row .label {
  font-size: 14px;
  font-family: "Inter-200";
  text-transform: uppercase;
  letter-spacing: 0.3px;
  line-height: 1.2;
  color: #2C2970;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row .value {
  font-size: 14px;
  font-family: "Inter-200";
  letter-spacing: 0.2px;
  margin-left: auto;
  text-align: right;
  min-width: 48px;
  color: #2C2970;
}
.profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row.last {
  border-bottom: none;
}
@media (max-width: 1600px) {
  .profile-wrapper-container .profile-wrap .after-main-container .tables-wrapper {
    gap: 20px;
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row {
    padding: 12px 16px;
  }
}
@media (max-width: 1400px) {
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .card-head .title {
    font-size: 15px;
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row .label,
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row .value {
    font-size: 13.5px;
  }
}
@media (max-width: 1200px) {
  .profile-wrapper-container .profile-wrap .after-main-container {
    /* likely 2-up */
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card {
    flex: 1 1 45%;
  }
}
@media (max-width: 992px) {
  .profile-wrapper-container .profile-wrap .after-main-container .tables-wrapper {
    justify-content: center;
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card {
    flex: 1 1 48%;
    max-width: 560px;
  }
}
@media (max-width: 768px) {
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card {
    flex: 1 1 100%;
    min-width: 0;
    border-radius: 10px;
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .card-head {
    padding: 12px 16px;
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row {
    padding: 12px 16px;
  }
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row .label,
  .profile-wrapper-container .profile-wrap .after-main-container .stat-card .stat-row .value {
    font-size: 13px;
  }
}

.ground-details-wrapper {
  min-height: 100vh;
  padding-top: 24px;
  padding-bottom: 50px;
  position: relative;
}
.ground-details-wrapper .ground-details-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50vh;
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.ground-details-wrapper .ground-details-container {
  position: relative;
  max-width: 1387px;
  margin: 0 auto;
  background: transparent;
  border-radius: 20px 20px 16px 16px;
  overflow: visible;
  padding: 0;
  padding-bottom: 0;
  min-height: 1199px;
}
.ground-details-wrapper .ground-details-container::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 55px;
  background: linear-gradient(180deg, #322c7a 0%, #272062 100%);
  border-radius: 20px 20px 0 0;
  z-index: 1;
}
.ground-details-wrapper .ground-details-container .ground-back-button {
  position: absolute;
  left: 10px;
  top: 18px;
  z-index: 15;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s ease;
}
.ground-details-wrapper .ground-details-container .ground-back-button:hover {
  opacity: 0.8;
}
.ground-details-wrapper .ground-details-container .ground-back-button img {
  width: 24px;
  height: 24px;
  pointer-events: none;
}
.ground-details-wrapper .ground-details-container .ground-background-image {
  display: none;
}
.ground-details-wrapper .ground-details-container .ground-background-image::before {
  content: "";
  position: absolute;
  width: 455px;
  height: 482.576px;
  left: 1006px;
  top: -191.44px;
  background: url("/assets/match_bg_image-BSXyer--.svg") no-repeat center;
  background-size: cover;
  opacity: 0.05;
}
.ground-details-wrapper .ground-details-container .ground-header-info {
  position: absolute;
  left: 46px;
  top: 10px;
  z-index: 10;
  color: #ffffff;
}
.ground-details-wrapper .ground-details-container .ground-header-info .ground-title {
  font-family: "Inter-700";
  font-size: 20px;
  color: #ffffff;
  text-transform: uppercase;
  margin: 0;
  line-height: normal;
  letter-spacing: 0.2px;
}
.ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 2px;
  width: auto;
}
.ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info .ground-meta-item {
  font-family: "Inter-500";
  font-size: 13px;
  font-style: normal;
  color: rgba(255, 255, 255, 0.78);
  margin: 0;
  line-height: normal;
}
.ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info .ground-meta-item .meta-label-bold {
  font-family: "Inter-500";
  font-weight: 600;
  font-style: normal;
}
.ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info .ground-meta-item .meta-value {
  font-family: "Inter-500";
  font-weight: 500;
  font-style: normal;
}
.ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info .ground-meta-divider {
  width: 16px;
  height: 1px;
  background: rgba(255, 255, 255, 0.45);
  transform: rotate(90deg);
  flex-shrink: 0;
}
.ground-details-wrapper .ground-details-container .ground-content-container {
  position: relative;
  left: 50%;
  top: 55px;
  transform: translateX(-50%);
  width: 1387px;
  min-height: 1200px;
  background: #ffffff;
  border-radius: 9px;
  overflow: hidden;
  overflow-y: auto;
  box-shadow: 0px 0px 3.7px 0px rgba(0, 0, 0, 0.25);
  z-index: 2;
  margin-bottom: 50px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.ground-details-wrapper .ground-details-container .ground-content-container::-webkit-scrollbar {
  display: none;
  width: 0;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-decorative-shape {
  position: absolute;
  width: 451px;
  height: 451px;
  pointer-events: none;
  opacity: 0.05;
  background: url("/assets/match_bg_image-BSXyer--.svg") no-repeat center;
  background-size: contain;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-decorative-shape.decorative-shape-1 {
  left: -241.4px;
  top: 689.6px;
  transform: rotate(315deg);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-decorative-shape.decorative-shape-2 {
  right: -137.4px;
  top: 73.46px;
  transform: rotate(60deg);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-image-section {
  position: relative;
  width: 100%;
  height: 344px;
  overflow: hidden;
  box-shadow: 0px 0px 3.7px 0px rgba(0, 0, 0, 0.25);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-image-section .ground-main-image {
  width: 100%;
  height: 625px;
  object-fit: cover;
  object-position: center;
  margin-top: -221px;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section {
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 21px;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-title {
  font-family: "Inter-700";
  font-size: 24px;
  font-weight: bold;
  font-style: italic;
  color: #000000;
  text-transform: uppercase;
  text-align: center;
  margin: 0;
  width: 100%;
  line-height: normal;
  letter-spacing: 0;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container {
  width: 100%;
  max-width: 948px;
  aspect-ratio: 1219/727;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: relative;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s ease;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link:hover {
  transform: scale(1.02);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link .ground-map-placeholder-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  text-align: center;
  z-index: 2;
  position: relative;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link .ground-map-placeholder-content .map-icon {
  font-size: 48px;
  margin-bottom: 16px;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link .ground-map-placeholder-content .map-placeholder-text {
  font-family: "Inter-500";
  font-size: 18px;
  color: #ffffff;
  margin: 0 0 12px 0;
  font-weight: 600;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link .ground-map-placeholder-content .map-address {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
  max-width: 600px;
  line-height: 1.5;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link .ground-map-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.3);
  color: #ffffff;
  padding: 12px;
  text-align: center;
  font-family: "Inter-500";
  font-size: 14px;
  transition: background 0.3s ease;
  z-index: 3;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .ground-map-fallback .ground-map-link:hover .ground-map-overlay {
  background: rgba(0, 0, 0, 0.5);
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container .map-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f0f0f0;
  color: #4c4c4d;
  font-family: "Inter-500";
  font-size: 16px;
}
.ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .ground-address-text {
  font-family: "Inter-700";
  font-size: 16px;
  font-weight: bold;
  font-style: italic;
  color: #000000;
  text-transform: capitalize;
  text-align: left;
  width: 100%;
  max-width: 948px;
  margin: 0;
  line-height: normal;
}
@media (max-width: 1600px) {
  .ground-details-wrapper .ground-details-container {
    max-width: 100%;
    margin-top: 20px;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container {
    width: 100%;
    max-width: 1387px;
    left: 50%;
    transform: translateX(-50%);
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section {
    padding-top: 10px;
  }
}
@media (max-width: 1200px) {
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section {
    padding-top: 10px;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-container {
    max-width: 100%;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .ground-address-text {
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .ground-details-wrapper {
    padding-top: 16px;
  }
  .ground-details-wrapper .ground-details-container {
    border-radius: 16px 16px 12px 12px;
  }
  .ground-details-wrapper .ground-details-container .ground-header-info {
    left: 20px;
    top: 15px;
  }
  .ground-details-wrapper .ground-details-container .ground-header-info .ground-title {
    font-size: 20px;
  }
  .ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: auto;
  }
  .ground-details-wrapper .ground-details-container .ground-header-info .ground-meta-info .ground-meta-divider {
    display: none;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container {
    top: 60px;
    border-radius: 0;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-image-section {
    height: 250px;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-image-section .ground-main-image {
    height: 450px;
    margin-top: -150px;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section {
    padding-top: 10px;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .map-title {
    font-size: 20px;
  }
  .ground-details-wrapper .ground-details-container .ground-content-container .ground-map-section .ground-address-text {
    font-size: 14px;
  }
}

.matches-details-wrapper {
  min-height: 500px;
  /* Player name → profile (used in scorecard / summary tables) */
}
.matches-details-wrapper button.player-name-link {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  text-align: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.matches-details-wrapper .matches-detail-wrap {
  padding: 90px 30px;
  margin-top: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper {
  background-color: #ffffff;
  min-height: 500px;
  position: relative;
  z-index: 5;
  overflow: visible;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .back-button {
  cursor: pointer;
  padding: 10px 10px 0px 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  height: auto;
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  isolation: isolate;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("/assets/bg_cricenter_logo-C3Rtspl-.svg") center/42% auto no-repeat;
  opacity: 0.7;
  pointer-events: none;
  z-index: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper > * {
  position: relative;
  z-index: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(28, 26, 78, 0.12) 0%, rgba(28, 26, 78, 0) 48%);
  pointer-events: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-shell {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  padding: 24px 36px 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-main {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  flex: 1;
  min-width: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-back-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: none;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-back-button img {
  width: 18px;
  height: 18px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-content {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
  min-width: 0;
  padding-bottom: 18px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .result-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.45);
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 10px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .meta-text {
  color: rgba(255, 255, 255, 0.9);
  font-family: "Inter-500";
  font-size: 13px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-title {
  margin: 0;
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 20px;
  line-height: 1.35;
  max-width: 760px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-venue {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-family: "Inter-200";
  font-size: 13px;
  line-height: 1.4;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 820px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-row:first-child {
  border-top: none;
  padding-top: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-identity {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-logo {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #ffffff;
  border: 2px solid #ff8a3d;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin: 0;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-logo img {
  width: 30px;
  height: 30px;
  object-fit: contain;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-name {
  margin: 0;
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 29px;
  font-style: italic;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-score {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 8px;
  flex-shrink: 0;
  text-align: right;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .score-value {
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 30px;
  line-height: 1;
  white-space: nowrap;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .score-overs {
  color: rgba(255, 255, 255, 0.78);
  font-family: "Inter-500";
  font-size: 15px;
  line-height: 1;
  white-space: nowrap;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-awards {
  width: 334px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-shrink: 0;
  padding-top: 2px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-card {
  background: #FFFFFF;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  min-height: 74px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-image {
  width: 48px;
  height: 48px;
  object-fit: cover;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-label {
  margin: 0;
  color: #4C4C4D;
  font-family: "Inter-600";
  font-size: 16px;
  letter-spacing: 1.5;
  text-transform: uppercase;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-name {
  margin: 0;
  color: #000000;
  font-family: "Inter-600";
  font-size: 14px;
  line-height: 120%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-detail {
  margin: 0;
  color: #000000;
  font-family: "Inter-500";
  font-size: 14px;
  line-height: 120%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .match-result {
  margin: 0;
  position: relative;
  z-index: 1;
  width: 100%;
  background: #7571CB;
  padding: 13.5px 28px;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .match-result span {
  display: block;
  margin: 0 auto;
  padding: 0;
  background: transparent;
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 20px;
  line-height: 120%;
  text-transform: uppercase;
}
@media (max-width: 1200px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-shell {
    gap: 18px;
    padding: 24px 24px 0;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-name {
    font-size: 24px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .score-value {
    font-size: 26px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-awards {
    width: 220px;
  }
}
@media (max-width: 960px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-shell {
    flex-direction: column;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-awards {
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-award-card {
    flex: 1 1 260px;
  }
}
@media (max-width: 768px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-shell {
    padding: 20px 18px 0;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-main {
    gap: 12px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-title {
    font-size: 16px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-name {
    font-size: 18px;
    white-space: normal;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-team-score {
    justify-content: flex-start;
    text-align: left;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .score-value {
    font-size: 20px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .score-overs {
    font-size: 13px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .ended-match-summary-awards {
    flex-direction: column;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper.ended-match-summary-header .match-result {
    padding: 10px 14px;
  }
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .main-heading {
  text-align: center;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding-top: 15px;
  font-family: "Inter-500";
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  gap: 100px;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap {
  display: flex;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap .team-wrap {
  display: flex;
  flex-direction: column;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap .team-wrap .team-name {
  margin-left: 40px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap .team-wrap .team-name span {
  color: #ffffff;
  font-family: "Inter-500";
  white-space: pre-line;
  text-transform: uppercase;
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap .score-wrap {
  display: flex;
  flex-direction: column;
  color: #ffffff;
  margin-top: 25px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap .score-wrap .scores {
  font-size: 25px;
  font-family: "Inter-700";
  letter-spacing: 1px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .left-team-wrap .score-wrap .over {
  font-size: 14px;
  font-family: "Inter-100";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper::before {
  position: absolute;
  top: 42%;
  transform: translateY(-50%);
  height: 71px;
  background: rgba(255, 255, 255, 0.2509803922);
  content: "";
  width: 1px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap {
  display: flex;
  gap: 52px;
  margin-left: 110px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap .score-wrap {
  display: flex;
  flex-direction: column;
  color: #ffffff;
  margin-top: 25px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap .score-wrap .scores {
  font-size: 25px;
  font-family: "Inter-700";
  letter-spacing: 1px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap .score-wrap .over {
  font-size: 14px;
  font-family: "Inter-100";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap .team-wrap {
  display: flex;
  flex-direction: column;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap .team-wrap .team-name {
  white-space: pre-line;
  margin-left: 45px;
  text-transform: uppercase;
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .team-and-scrore-wrapper .right-team-wrap .team-wrap .team-name span {
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 18px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .match-result {
  text-align: center;
  margin-top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .match-result span {
  padding: 5px 240px;
  background: linear-gradient(90deg, #5753c0 0%, #ff4242 146.06%);
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 14px;
  text-transform: uppercase;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match {
  position: relative;
  background: url("/assets/playerOfTheMatch_image-BoHZ4dId.svg");
  background-repeat: no-repeat;
  background-size: auto;
  margin: 0 auto;
  width: 661px;
  display: table;
  padding-bottom: 5px;
}
@media (min-width: 1440px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match {
    width: 550px;
  }
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match .player-title {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 20px 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match .player-title p {
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match .player-title .name-image {
  display: flex;
  gap: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match .player-title .name-image p {
  font-family: "Inter-700";
  font-size: 16px;
}
@media (max-width: 1440px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .background-image-wrapper .player-match .player-title .name-image img {
    height: 55px;
    width: 60px;
  }
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .tabs-wrapper {
  background-color: #ffffff;
  border-bottom: 2px solid var(--accent-2-separate-line, rgba(76, 76, 77, 0.2509803922));
  padding-top: 20px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .tabs-wrapper .tabs {
  display: flex;
  gap: 24px; /* spacing between tabs */
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .tabs-wrapper .tab {
  background: none;
  border: none;
  font-size: 16px;
  color: rgba(76, 76, 77, 0.6);
  cursor: pointer;
  padding: 0;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .tabs-wrapper:hover {
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .tabs-wrapper .active {
  font-family: "Inter-700";
  color: #2C2970;
  border-bottom: 2.5px solid #2C2970;
  padding-bottom: 2px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .text-section {
  background-color: #F0F0F0;
  color: #000000;
  padding: 5px 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .text-section p {
  font-family: "Inter-500";
  font-size: 16px;
  margin-top: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .text-section span {
  padding-top: 5px;
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-500";
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper {
  display: flex;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary {
  width: 60%;
  border-right: 1px solid rgba(76, 76, 77, 0.0588235294);
  /* Responsive adjustments */
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .scorecard-text {
  background-color: #EEEEFF;
  font-family: "Inter-200";
  padding: 12px 20px;
  margin: 0px;
  font-size: 14px;
  color: #000000;
  border-radius: 4px 4px 0 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 4px;
  overflow: hidden;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper p,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper p {
  font-size: 14px;
  font-family: "Inter-700";
  padding-left: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .over,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .over {
  color: rgba(76, 76, 77, 0.6);
  font-size: 12px;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container {
  display: flex;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section {
  flex: 1;
  border-right: 1px solid rgba(76, 76, 77, 0.1490196078);
  border-left: 1px solid rgba(76, 76, 77, 0.1490196078);
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
  border-top: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table thead th,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table thead th {
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row {
  transition: background-color 0.2s ease;
  border-bottom: 1px solid #f0f0f0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row:hover,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row:hover {
  background-color: #EEEEFF;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td {
  padding: 12px 20px;
  font-size: 13px;
  vertical-align: middle;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-name,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-name {
  font-family: "Inter-200";
  color: #000000;
  text-decoration: underline;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-name:hover,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-name:hover {
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-runs, .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-balls, .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-wickets,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-runs,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-balls,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-wickets {
  text-align: center;
  font-family: "Inter-500";
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td .over,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td .over {
  color: rgba(76, 76, 77, 0.6);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-balls, .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-runs:last-child,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-balls,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .bowling-section .scorecard-table tbody .player-row td.player-runs:last-child {
  color: #666666;
  font-weight: 400;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section {
  flex: 1;
  border-right: 1px solid rgba(76, 76, 77, 0.1490196078);
  border-left: 1px solid rgba(76, 76, 77, 0.1490196078);
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
  border-top: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table thead th,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table thead th {
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row {
  transition: background-color 0.2s ease;
  border-bottom: 1px solid #f0f0f0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row:hover,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row:hover {
  background-color: #EEEEFF;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td {
  padding: 12px 15px;
  font-size: 13px;
  vertical-align: middle;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-name,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-name {
  font-family: "Inter-500";
  color: #000000;
  text-decoration: underline;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-name:hover,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-name:hover {
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-runs, .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-balls, .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-wickets,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-runs,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-balls,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-wickets {
  text-align: center;
  font-family: "Inter-500";
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-runs:contains("*"), .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-balls:contains("*"), .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-wickets:contains("*"),
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-runs:contains("*"),
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-balls:contains("*"),
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td.player-wickets:contains("*") {
  color: #28a745;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td .over,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container .batting-section .scorecard-table tbody .player-row td .over {
  color: rgba(76, 76, 77, 0.6);
}
@media (max-width: 768px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .first-team-score-wrapper .scorecard-table-container,
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .second-team-score-wrapper .scorecard-table-container {
    flex-direction: column;
  }
}
@media (max-width: 768px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .scorecard-text {
    padding: 10px 15px;
    font-size: 13px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .scorecard-table thead th,
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .scorecard-table tbody td {
    padding: 8px 10px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .scorecard-table tbody td {
    font-size: 12px;
  }
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .fill-scrorecard p {
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
  width: 100%;
  padding: 0px 0px 15px 0px;
  text-align: center;
  color: #201E52;
  text-decoration: underline;
  cursor: pointer;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .text-data {
  width: 100%;
  display: flex;
  background-color: rgba(117, 113, 203, 0.0509803922);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .text-data p {
  padding: 20px 20px;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section {
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item {
  display: flex;
  align-items: flex-start;
  padding: 12px 16px;
  gap: 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item:last-child {
  border-bottom: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .ball-number {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 50px;
  flex-shrink: 0;
  gap: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .ball-number .over {
  font-size: 13px;
  font-weight: 600;
  color: #333333;
  margin-bottom: 4px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .ball-number .ball-indicator {
  width: 24px;
  height: 24px;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: white;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .ball-number .runs {
  border: 1px solid var(--accent, #4c4c4d);
  color: #000000;
  padding: 5px 5px;
  border-radius: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .ball-number .dot {
  border: 1px solid var(--accent, #4c4c4d);
  color: #000000;
  padding: 5px 5px;
  border-radius: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .ball-number .boundary {
  background-color: #107E0C;
  padding: 5px 5px;
  border-radius: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content {
  flex: 1;
  min-width: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content .ball-description {
  margin-bottom: 4px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content .ball-description strong {
  font-size: 14px;
  font-family: "Inter-200";
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content .commentary-text {
  font-size: 12px;
  line-height: 1.4;
  color: rgba(0, 0, 0, 0.6980392157);
  margin-bottom: 8px;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content .bowling-figures {
  background-color: #EEEEFF;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  color: #000000;
  margin-top: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content .bowling-figures .bowler-name {
  font-family: "Inter-500";
  color: #000000;
  margin-right: 8px;
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-section .commentary-item .commentary-content .bowling-figures .bowling-stats {
  font-family: "Inter-500";
  color: #000000;
  margin-right: 8px;
  font-size: 14px;
}
@media (max-width: 600px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-item {
    padding: 10px 12px;
    gap: 10px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .ball-number {
    min-width: 45px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .over {
    font-size: 12px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .ball-indicator {
    width: 22px;
    height: 22px;
    font-size: 11px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .ball-description strong {
    font-size: 13px;
  }
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .commentary-text {
    font-size: 12px;
  }
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container {
  margin-bottom: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-header {
  background-color: #EEEEFF;
  padding: 3px 20px;
  height: 37px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-header p {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row {
  display: flex;
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row.header-row {
  background-color: rgba(76, 76, 77, 0.04);
  height: 46px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row.header-row .header-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row.header-row .header-cell p {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell {
  display: flex;
  align-items: center;
  padding: 12px 16px;
  height: 53px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.team-cell {
  width: 395px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.team-cell ol {
  display: block;
  list-style: decimal;
  margin: 0;
  padding: 0;
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.team-cell ol li {
  margin-left: 27px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.team-cell ol li .team-info {
  display: flex;
  align-items: center;
  gap: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.team-cell ol li .team-info img {
  width: 21.716px;
  height: 21.716px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.team-cell ol li .team-info p {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  text-transform: uppercase;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.stat-cell {
  width: 80px;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-content .upcoming-points-table-row .upcoming-points-table-cell.stat-cell p {
  font-family: "Inter-500";
  font-size: 13px;
  color: #000000;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-footer {
  border-top: 1px solid rgba(76, 76, 77, 0.15);
  padding: 10px 20px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-points-table-container .upcoming-points-table-footer p {
  font-family: "Inter-500";
  font-size: 16px;
  color: #433fac;
  text-decoration: underline;
  text-transform: uppercase;
  margin: 0;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container {
  margin-bottom: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-header {
  background-color: #EEEEFF;
  padding: 3px 20px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-header p {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams {
  display: flex;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list {
  width: 588px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item {
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
  padding: 0px 15px;
  height: 53px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item:last-child {
  border-bottom: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item ol {
  display: block;
  list-style: decimal;
  margin: 0;
  padding: 0;
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item ol li {
  margin-left: 27px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item ol li .team-info {
  display: flex;
  align-items: center;
  gap: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item ol li .team-info img {
  width: 21.716px;
  height: 21.716px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-team-list .upcoming-recent-performance-team-item ol li .team-info p {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  text-transform: uppercase;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row {
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
  height: 53px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  gap: 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row:last-child {
  border-bottom: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons {
  display: flex;
  gap: 4px;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon {
  width: 24px;
  height: 21px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.result-win {
  background-color: rgba(53, 183, 48, 0.84);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.result-loss {
  background-color: #ff6b6d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon span {
  font-family: "Inter-700";
  font-size: 13px;
  color: white;
  letter-spacing: -0.6316px;
  font-weight: 600;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.has-tooltip {
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.has-tooltip .result-icon-tooltip {
  position: absolute;
  bottom: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.85);
  border-radius: 4px;
  width: 180px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
  padding: 8px 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.has-tooltip .result-icon-tooltip p {
  font-family: "Inter-500";
  font-size: 16px;
  color: white;
  margin: 0;
  text-align: center;
  line-height: 24px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.has-tooltip .result-icon-tooltip .tooltip-arrow {
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.85);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .result-icons .result-icon.has-tooltip:hover .result-icon-tooltip {
  opacity: 1;
  visibility: visible;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .dropdown-icon {
  width: 20px;
  height: 20px;
  cursor: pointer;
  transition: transform 0.3s ease;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .dropdown-icon.open {
  transform: rotate(180deg);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-teams .upcoming-recent-performance-results .upcoming-recent-performance-result-row .arrow-icon {
  width: 20px;
  height: 20px;
  transform: rotate(180deg);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details {
  margin-top: 15px;
  padding: 0 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left {
  display: flex;
  align-items: flex-start;
  gap: 17px;
  flex: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .result-icon {
  width: 24px;
  height: 21px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .result-icon.result-win {
  background-color: rgba(53, 183, 48, 0.84);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .result-icon.result-loss {
  background-color: #ff6b6d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .result-icon span {
  font-family: "Inter-700";
  font-size: 13px;
  color: white;
  letter-spacing: -0.6316px;
  font-weight: 600;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .match-info {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 360px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .match-info .match-title {
  font-family: "Inter-700";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  margin: 0;
  font-weight: 600;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-left .match-info .match-result {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  margin: 0;
  font-weight: 400;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-right {
  display: flex;
  align-items: center;
  gap: 4px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-right .view-scorecard {
  font-family: "Inter-500";
  font-style: italic;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.6);
  text-decoration: underline;
  margin: 0;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-recent-performance-container .upcoming-recent-performance-content .upcoming-recent-performance-details .upcoming-recent-performance-detail-item .detail-right .arrow-icon-small {
  width: 20px;
  height: 20px;
  transform: rotate(90deg);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container {
  margin-bottom: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-header .upcoming-players-list-header-item {
  background-color: #EEEEFF;
  padding: 3px 20px;
  height: 37px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-header .upcoming-players-list-header-item p {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item {
  background-color: white;
  border-bottom: 1px solid rgba(76, 76, 77, 0.15);
  border-right: 1px solid rgba(76, 76, 77, 0.15);
  padding: 5px 5px;
  height: 72px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item .player-info {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 72px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item .player-info .player-image-wrapper {
  width: 54px;
  height: 54px;
  border-radius: 27px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  overflow: hidden;
  flex-shrink: 0;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item .player-info .player-image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item .player-info .player-details {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 42px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item .player-info .player-details .player-name {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .scorecard-summary .upcoming-players-list-container .upcoming-players-list-content .upcoming-players-list-column .upcoming-players-list-item .player-info .player-details .player-stats {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(76, 76, 77, 0.6);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details {
  width: 40%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-text {
  background-color: #EEEEFF;
  font-family: "Inter-200";
  padding: 12px 20px;
  margin: 0px;
  font-weight: 600;
  font-size: 14px;
  color: #000000;
  border-radius: 4px 4px 0 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .location {
  background-color: rgba(76, 76, 77, 0.0588235294);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .location p {
  padding: 10px 20px 10px 20px;
  color: #000000;
  font-family: "Inter-200";
  font-size: 14px;
  text-decoration: underline;
  margin: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data {
  /* media / avatars — kept from your original sizes */
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background: #fff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr {
  height: 42px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.15);
  border-top: 1px solid rgba(76, 76, 77, 0.15);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr th,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td {
  box-sizing: border-box;
  padding: 10px 20px;
  vertical-align: middle;
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr th {
  width: 243px;
  color: #000000;
  text-align: left;
  font-family: "Inter-500";
  border-right: 1px solid rgba(76, 76, 77, 0.15);
  white-space: nowrap;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td {
  text-align: left;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td .right-label {
  color: rgba(76, 76, 77, 0.85);
  font-family: "Inter-200";
  font-size: 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td.with-media {
  display: flex;
  align-items: center;
  gap: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td .official-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td .official-list .official {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  padding-bottom: 7px;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td .official-list .official:first-child::after {
  content: "";
  position: absolute;
  left: -20px;
  right: -20px;
  bottom: 0;
  height: 1px;
  background: rgba(76, 76, 77, 0.15);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data table tbody tr td .official-list .official .right-label {
  font-weight: 500;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data .ellipse-118 {
  border-radius: 50%;
  width: 21px;
  height: 21px;
  object-fit: cover;
  flex: 0 0 21px;
  aspect-ratio: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data .image-397,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data .image-396,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data .image-398,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data .image-399 {
  width: 28px;
  height: 28px;
  object-fit: cover;
  flex: 0 0 28px;
  aspect-ratio: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .match-summary-wrapper .match-details .match-detail-data .player-name {
  font-family: "Inter-200";
  color: rgba(76, 76, 77, 0.85);
  font-weight: 500;
  line-height: 1.2;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper.with-videos .scorecard-content-wrapper {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper.with-videos .scorecard-main {
  flex: 0 0 100%;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper.with-videos .video-highlights-wrapper {
  flex: 0 0 30%;
  width: 30%;
  position: sticky;
  top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .scorecard-content-wrapper {
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .scorecard-main {
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .scorecard-tabs {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
  padding: 15px 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .scorecard-tabs .tab-item {
  background: rgba(76, 76, 77, 0.0784313725);
  border-radius: 36px;
  padding: 0px 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 35px;
  color: #4c4c4d;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .scorecard-tabs .tab-item p {
  text-align: center;
  font-family: "Inter-200";
  font-size: 14px;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .scorecard-tabs .active {
  background: #ffffff;
  border-radius: 36px;
  border-style: solid;
  border: 1px solid #201E52;
  padding: 0px 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 35px;
  cursor: pointer;
  color: #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper {
  align-items: center;
  background-color: #EEEEFF;
  border: 2px solid #EEEEFF;
  display: flex;
  justify-content: space-between;
  padding: 0px 15px;
  height: 35px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper .nav-right-text {
  color: #000000;
  font-family: "Inter-SemiBold", Helvetica;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
  width: fit-content;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper .nav-right-text .text-wrapper {
  color: #000000;
  font-family: "Inter-500";
  font-size: 17px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper .nav-right-text .over-span {
  color: rgba(0, 0, 0, 0.8392156863);
  font-family: "Inter-500";
  font-size: 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper .nav-left-text .text-wrapper-2 {
  color: rgba(0, 0, 0, 0.8392156863);
  font-family: "Inter-500";
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper .nav-left-text .text-wrapper-3 {
  color: #000000;
  font-size: 20px;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .team-wrapper .nav-left-text .text-wrapper-4 {
  color: #000000;
  font-size: 17px;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper {
  display: flex;
  justify-content: center;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table {
  width: 100%;
  border-collapse: collapse;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table thead {
  background-color: #f9f9f9;
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table thead th {
  padding: 7px 15px;
  text-align: left;
  font-family: "Inter-100";
  color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table thead th:nth-child(n+3) {
  width: 7%;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tbody td {
  padding: 10px 15px;
  font-family: "Inter-200";
  color: rgba(76, 76, 77, 0.8509803922);
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tbody tr {
  border-bottom: 1px solid #ddd;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tbody tr .player-name {
  color: #000000;
  text-decoration: underline;
  font-family: "Inter-500";
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tbody tr .stats {
  font-family: "Inter-200";
  color: #000000;
  font-size: 13px;
  width: 7%;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tfoot {
  background-color: #f9f9f9;
  font-family: "Inter-Bold", Helvetica;
  font-size: 16px;
  font-weight: 700;
  color: #333;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tfoot .total-row {
  font-size: 16px;
  font-family: "Inter-700";
  background-color: #f9f9f9;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tfoot .total-row td {
  padding: 10px 15px;
  text-align: left;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .stats-table tfoot .total-row td:last-child {
  padding-left: 30px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .table-wrapper .bowling-stats-table thead th:nth-child(n+2) {
  width: 7%;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets {
  padding: 0px 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .nav-text {
  color: #000000;
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .nav-text .text-wrapper {
  font-family: "Inter-500";
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .nav-text .span {
  font-family: "Inter-100";
  text-transform: capitalize;
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .nav-text .text-wrapper-2 {
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .did-not-bat .nav-text {
  color: var(--variable-collection-black);
  font-family: "Inter-SemiBold", Helvetica;
  font-size: 18px;
  font-weight: 400;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .did-not-bat .text-wrapper {
  font-family: "Inter-500";
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .team-wrap .fall-wickets .did-not-bat .span {
  font-family: "Inter-Regular", Helvetica;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .second-team {
  margin-top: 30px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap {
  margin-top: 30px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .team-wrapper {
  align-items: center;
  background-color: #EEEEFF;
  border: 2px solid #EEEEFF;
  display: flex;
  justify-content: space-between;
  padding: 0px 30px;
  height: 35px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .team-wrapper .nav-right-text {
  color: #000000;
  font-family: "Inter-SemiBold", Helvetica;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
  width: fit-content;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .team-wrapper .nav-right-text .text-wrapper {
  color: #000000;
  font-family: "Inter-500";
  font-size: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-one {
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-one li {
  margin-bottom: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-one .text-wrapper {
  color: #000000;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-one .span {
  color: #000000;
  font-family: "Inter-100";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-one .score {
  color: #201E52;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-two {
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-two li {
  margin-bottom: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-two .text-wrapper {
  color: #000000;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-two .span {
  color: #000000;
  font-family: "Inter-100";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-flow-wrap .match-flow-data-wrap .team-two .score {
  color: #201E52;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap {
  margin-top: 30px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .team-wrapper {
  align-items: center;
  background-color: #EEEEFF;
  border: 2px solid #EEEEFF;
  display: flex;
  justify-content: space-between;
  padding: 0px 30px;
  height: 35px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .team-wrapper .nav-right-text {
  color: #000000;
  font-family: "Inter-SemiBold", Helvetica;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
  width: fit-content;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .team-wrapper .nav-right-text .text-wrapper {
  color: #000000;
  font-family: "Inter-500";
  font-size: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .location {
  padding: 3px 16px;
  background: #f9f9f9;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .location p {
  color: #000000;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-decoration-line: underline;
  text-transform: capitalize;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap {
  width: 100%;
  position: relative;
  margin-top: 20px;
  text-align: left;
  font-size: 14px;
  color: #000;
  font-family: Inter;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table {
  border-collapse: collapse;
  table-layout: fixed;
  background: #fff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody tr {
  border: 1px solid rgba(76, 76, 77, 0.15);
  height: 40px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody tr th,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody tr td {
  box-sizing: border-box;
  vertical-align: middle;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody tr th {
  width: 378px;
  padding: 10px;
  border-right: 1px solid rgba(76, 76, 77, 0.15);
  font-family: "Inter-500";
  text-align: left;
  color: #000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody tr td {
  width: 530px;
  padding: 10px 20px;
  text-align: left;
  font-family: "Inter-200";
  font-size: 12px;
  color: rgba(76, 76, 77, 0.85);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody tr td.is-strong {
  font-family: "Inter-500";
  font-size: 12px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody .series-row {
  height: 132px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody .series-row th {
  height: 132px;
  padding: 10px;
  border-right: 1px solid rgba(76, 76, 77, 0.15);
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .matches-scorecard-wrapper .match-details-wrap .match-details-table-wrap table tbody .series-row td {
  padding: 10px 20px;
  font-family: "Inter-200";
  font-size: 12px;
  color: rgba(76, 76, 77, 0.85);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper {
  margin-top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent {
  position: relative;
  padding: 0px 20px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
  text-align: center;
  font-size: 16px;
  color: #4c4c4d;
  font-family: Inter;
  z-index: 2;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent.tabs-parent--menu-open {
  z-index: 20;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  min-width: 200px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  z-index: 100;
  padding: 4px 0;
  text-align: left;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__option {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px 14px;
  border: none;
  background: #fff;
  font-family: "Inter-500", Inter, sans-serif;
  font-size: 14px;
  color: #374151;
  cursor: pointer;
  text-align: left;
  gap: 4px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__option:hover {
  background: #f3f4f6;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__option.is-active {
  background: #eef2ff;
  color: #3730a3;
  font-weight: 600;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__option--clear {
  color: #6b7280;
  font-size: 13px;
  border-top: 1px solid #f3f4f6;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__option--clear:hover {
  background: #fef2f2;
  color: #b91c1c;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__group-label {
  padding: 8px 14px 4px;
  font-family: "Inter-600", Inter, sans-serif;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9ca3af;
  pointer-events: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__divider {
  height: 1px;
  background: #f3f4f6;
  margin: 4px 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__badge--4 {
  background: #bbf7d0;
  color: #15803d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__badge--6 {
  background: #d1fae5;
  color: #065f46;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__badge--w {
  background: #fee2e2;
  color: #b91c1c;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__status {
  margin-left: auto;
  font-size: 11px;
  padding-left: 8px;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__status--batting {
  color: #16a34a;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu__status--out {
  color: #dc2626;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .commentary-filter-menu--full {
  min-width: 240px;
  max-height: 380px;
  overflow-y: auto;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item--dropdown {
  position: relative;
  cursor: pointer;
  overflow: visible;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item {
  border-radius: 36px;
  background-color: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 35px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  gap: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item .frame-icon {
  width: 24px;
  position: relative;
  height: 24px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item .tab-label {
  position: relative;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item.tab-item--dropdown:not(.tab-item-tab-item):not(.tab-item2) {
  min-width: 160px;
  justify-content: space-between;
  padding-inline: 14px 12px;
  overflow: visible;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item.tab-item--dropdown:not(.tab-item-tab-item):not(.tab-item2) .tab-item-frame-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item-tab-item {
  width: 232px;
  border-radius: 36px;
  background-color: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 35px;
  overflow: visible;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  gap: 0px;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item-tab-item .tab-item-frame-icon {
  width: 24px;
  position: relative;
  height: 24px;
  object-fit: contain;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item-tab-item .tab-label {
  position: relative;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item2 {
  width: 197px;
  border-radius: 36px;
  background-color: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 35px;
  overflow: visible;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item2 .frame-icon {
  width: 24px;
  position: relative;
  height: 24px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item2 .tab-label {
  position: relative;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .tabs-parent .tab-item2 .tab-item-frame-icon {
  width: 24px;
  position: relative;
  height: 24px;
  object-fit: contain;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-infinite-scroll {
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-load-sentinel {
  height: 1px;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-infinite-status {
  padding: 16px 20px;
  text-align: center;
  font-family: "Inter-500";
  font-size: 14px;
  color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-infinite-status--error {
  color: #b91c1c;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-infinite-status--more {
  color: #6b7280;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-infinite-status--end {
  color: #9ca3af;
  font-size: 13px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-content {
  width: 100%;
  margin-top: 20px;
  background-color: rgba(117, 113, 203, 0.05);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 20px;
  box-sizing: border-box;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-content .team-name {
  text-transform: capitalize;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-content .team-name .sunrisers-hyderabad-made {
  margin: 0;
  font-family: "Inter-200";
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-timeline {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 20px;
  box-sizing: border-box;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-timeline .team-name {
  text-transform: capitalize;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-timeline .team-name .player-of-the-match {
  margin: 0;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-timeline .team-name .players-says {
  margin: 0;
  font-family: "Inter-100";
  color: #000000;
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .commentary-timeline .frame-icon {
  width: 17px;
  position: relative;
  height: 17px;
  opacity: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings {
  display: flex;
  flex-direction: column;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section.commentary-section--after-summary {
  border-top: 1px solid rgba(76, 76, 77, 0.1490196078);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item {
  display: flex;
  align-items: flex-start;
  padding: 12px 16px;
  gap: 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item:last-child {
  border-bottom: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 50px;
  flex-shrink: 0;
  gap: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .over {
  font-size: 13px;
  font-weight: 600;
  color: #333333;
  margin-bottom: 4px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .wicket-red {
  width: 100%;
  border-radius: 8px;
  background-color: #d8252d;
  padding: 10px;
  color: #fff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .wicket-red .wicket {
  text-transform: capitalize;
  font-family: "Inter-700";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .ball-indicator {
  width: 24px;
  height: 24px;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: white;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .runs {
  border: 1px solid var(--accent, #4c4c4d);
  color: #000000;
  padding: 5px 5px;
  border-radius: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .dot {
  border: 1px solid var(--accent, #4c4c4d);
  color: #000000;
  padding: 5px 5px;
  border-radius: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .ball-number .boundary {
  background-color: #107E0C;
  padding: 5px 5px;
  border-radius: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data {
  flex: 1;
  min-width: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data .ball-description {
  margin-bottom: 4px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data .ball-description strong {
  font-size: 14px;
  font-family: "Inter-200";
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data .commentary-text {
  font-size: 12px;
  line-height: 1.4;
  color: rgba(0, 0, 0, 0.6980392157);
  margin-bottom: 8px;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data .bowling-figures {
  background-color: #EEEEFF;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  color: #000000;
  margin-top: 8px;
  width: 50%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data .bowling-figures .bowler-name {
  font-family: "Inter-500";
  color: #000000;
  margin-right: 8px;
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .commentary-section .commentary-item .commentary-content-data .bowling-figures .bowling-stats {
  font-family: "Inter-500";
  color: #000000;
  margin-right: 8px;
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary {
  width: 100%;
  background-color: rgba(87, 83, 192, 0.04);
  height: 110px;
  overflow: hidden;
  text-align: left;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header {
  background-color: rgba(23, 178, 255, 0.25);
  display: flex;
  gap: 450px;
  height: 40px;
  padding: 0px 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-left {
  display: flex;
  align-items: center;
  gap: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-left .title {
  font-family: "Inter-500";
  font-size: 15px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-left .meta {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  color: #4c4c4d;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-left .meta .meta-item {
  position: relative;
  font-weight: 500;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-left .meta .dot {
  width: 3px;
  height: 3px;
  position: relative;
  border-radius: 50%;
  background-color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-right {
  display: flex;
  align-items: center;
  gap: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-right .score {
  font-family: "Inter-500";
  font-size: 15px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-right .rate {
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 14px;
  color: #4c4c4d;
  font-family: "Inter-200";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-header .header-right .rate .meta-item {
  position: relative;
  font-weight: 500;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap {
  display: flex;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting {
  padding: 0px 20px 20px;
  background-color: rgba(23, 178, 255, 0.13);
  border-right: 1px solid rgba(0, 0, 0, 0.21);
  box-sizing: border-box;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting .batting-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting .batting-inner .names {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting .batting-inner .names .text {
  font-family: "Inter-200";
  font-size: 14px;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting .batting-inner .figures-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting .batting-inner .figures-right .text-wrap {
  font-family: "Inter-500";
  font-size: 12px;
  align-self: stretch;
  white-space: pre-wrap;
  margin: 0;
  color: #4C4C4D;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-batting .batting-inner .figures-right .text {
  text-align: right;
  font-family: "Inter-500";
  font-size: 12px;
  margin: 0;
  color: #4C4C4D;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling {
  padding: 0px 20px 20px;
  background-color: rgba(23, 178, 255, 0.13);
  box-sizing: border-box;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling .bowling-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling .bowling-inner .names {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling .bowling-inner .names .text {
  font-family: "Inter-200";
  font-size: 14px;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling .bowling-inner .figures-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling .bowling-inner .figures-right .text-wrap {
  font-family: "Inter-500";
  font-size: 12px;
  margin: 0;
  align-self: stretch;
  white-space: pre-wrap;
  color: #4C4C4D;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .commentary-wrapper .team-and-innings .over-summary .over-summary-team-wrap .over-summary-bowling .bowling-inner .figures-right .text {
  text-align: right;
  font-family: "Inter-500";
  font-size: 12px;
  margin: 0;
  color: #4C4C4D;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap {
  padding: 20px 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap {
  width: 100%;
  border-radius: 16px;
  padding: 20px 20px;
  background-color: rgba(243, 243, 255, 0.53);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 42px;
  padding: 10px 30px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group {
  width: 192px;
  position: relative;
  height: 293px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent {
  position: relative;
  top: 22px;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .player-image-icon {
  position: relative;
  object-fit: cover;
  height: 225px;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .add-player {
  position: absolute;
  border-radius: 34px;
  background-color: #ffffff;
  border: 1px solid #201E52;
  box-sizing: border-box;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 19px 22px;
  gap: 0px;
  top: 195px;
  width: 140%;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .add-player .select {
  position: relative;
  font-weight: 600;
  color: #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .add-player .select-icon {
  width: 18px;
  position: relative;
  height: 18px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab {
  position: absolute;
  top: calc(100% + 15px);
  left: -20px;
  z-index: 1;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);
  border-radius: 7px;
  background-color: #ffffff;
  display: flex;
  flex-direction: column;
  padding: 16px 12px;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .search {
  align-self: stretch;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
  border-radius: 6px;
  background-color: #ffffff;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  box-sizing: border-box;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .search .search-input {
  flex: 1;
  border: none;
  outline: none;
  font-family: "Inter-100";
  background: transparent;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .search .frame-icon {
  width: 24px;
  height: 24px;
  position: relative;
  flex-shrink: 0;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .division-list {
  padding: 0px;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .division-list .player-detail {
  padding: 0px 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  gap: 0px;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .division-list .player-detail:first-child {
  margin-top: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .division-list .player-detail:hover {
  background-color: #F3F3F3;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .division-list .player-detail .player-name {
  position: relative;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .tournament-dropdown-points-tab .division-list .player-detail .division-name {
  position: relative;
  font-size: 14px;
  font-family: "Inter-500";
  color: rgba(76, 76, 77, 0.6);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .player-image-parent .right-player-list {
  left: -120px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .frame-icon2 {
  position: absolute;
  height: 30px;
  left: 0;
  top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .player-one-group .frame-icon4 {
  position: absolute;
  top: 20px;
  height: 30px;
  left: 155px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper {
  width: 726px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  font-size: 16px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .selected-player-data {
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 12px;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .selected-player-data .selected-players {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .selected-player-data .selected-players .player-name {
  font-family: "Inter-500";
  font-size: 18px;
  color: #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .selected-player-data .selected-players .division-name {
  font-family: "Inter-200";
  font-size: 14px;
  color: #201E52;
  text-align: left;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container {
  align-self: stretch;
  height: 167px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0px;
  margin-top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-parent,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-group,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-container,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .frame-div {
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  box-sizing: border-box;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-parent .header-title,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-group .header-title,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-container .header-title,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .frame-div .header-title {
  width: 200px;
  position: relative;
  font-weight: 600;
  display: inline-block;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-parent .header-title2,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-group .header-title2,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-container .header-title2,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .frame-div .header-title2 {
  width: 180px;
  position: relative;
  text-transform: uppercase;
  font-family: "Inter-500";
  text-align: center;
  display: inline-block;
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-parent .header-title3,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-group .header-title3,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-container .header-title3,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .frame-div .header-title3 {
  width: 200px;
  position: relative;
  font-weight: 600;
  text-align: right;
  display: inline-block;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-parent {
  background-color: #E8E8FD;
  height: 42px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-group {
  height: 39px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .header-title-container {
  background-color: #E8E8FD;
  height: 43px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .analysis-wrap .analysis-parent .middle-wrapper .frame-container .frame-div {
  height: 42px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .compare-player-wrap h3 {
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .compare-player-wrap .player-chip {
  width: 17%;
  position: relative;
  border-radius: 63px;
  background-color: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.1490196078);
  box-sizing: border-box;
  height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 12px;
  gap: 0px;
  text-align: left;
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .compare-player-wrap .player-chip .player-detail {
  display: flex;
  align-items: center;
  gap: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .compare-player-wrap .player-chip .player-detail .player-image {
  width: 40px;
  position: relative;
  border-radius: 36px;
  max-height: 100%;
  object-fit: cover;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .compare-player-wrap .player-chip .player-detail .player-name {
  position: relative;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .analysis-compare-wrap .compare-player-wrap .player-chip .plus-icon {
  width: 24px;
  position: relative;
  height: 24px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap {
  width: 100%;
  position: relative;
  height: 63px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 19px;
  text-align: center;
  font-size: var(--fs-20);
  color: var(--color-slateblue);
  font-family: var(--font-inter);
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap .overall-tab {
  width: 50%;
  box-sizing: border-box;
  height: 67px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  gap: 5px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap .overall-tab p {
  text-transform: capitalize;
  font-family: "Inter-500";
  color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap .overall-tab .each-other {
  text-transform: capitalize;
  font-family: "Inter-500";
  color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap .overall-tab .vs {
  font-family: "Inter-500";
  color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap .tab-active {
  border-bottom: 2px solid #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap .tab-active p {
  color: #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .tabs-wrap:after {
  content: "";
  position: absolute;
  left: 0px;
  right: 0px;
  top: 63px;
  bottom: 0;
  height: 2px;
  background: rgba(76, 76, 77, 0.15);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap {
  position: relative;
  z-index: 20;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper {
  position: relative;
  z-index: 30;
  margin-top: 20px;
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 34px;
  gap: 0px;
  text-align: left;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap {
  z-index: 40;
  border-radius: 50px;
  background-color: #fff;
  border: 1px solid rgba(76, 76, 77, 0.6);
  box-sizing: border-box;
  min-width: 168px;
  max-width: 260px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 16px;
  gap: 10px;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .chip-wrapper {
  min-width: 0;
  flex: 1;
  border-radius: 50px;
  background-color: #db540b;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .chip-text {
  font-family: "Inter-500";
  color: #ffffff;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .dropdown-icon {
  width: 24px;
  height: 24px;
  object-fit: contain;
  flex-shrink: 0;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare {
  z-index: 10050;
  width: min(460px, 100vw - 40px);
  position: absolute;
  box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.18);
  border-radius: 8px;
  background-color: #fff;
  height: auto;
  text-align: left;
  font-size: 16px;
  color: #000;
  font-family: Inter;
  z-index: 1;
  bottom: 0;
  right: 0;
  top: 60px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap {
  background-color: #ffffff;
  box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.18);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child {
  display: flex;
  flex-direction: row;
  gap: 0;
  border-bottom: 2px solid rgba(76, 76, 77, 0.0588235294);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection {
  display: flex;
  flex-direction: column;
  width: 34%;
  min-width: 120px;
  background-color: rgba(76, 76, 77, 0.0588235294);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent {
  margin-top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type {
  padding: 1px 20px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type p {
  font-family: "Inter-500";
  font-size: 16px;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type.disabled p {
  cursor: not-allowed;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type .selection-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #201E52;
  display: inline-block;
  margin-left: 8px;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .active {
  background-color: #ffffff;
  color: #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent {
  width: 66%;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs input {
  cursor: pointer;
  width: 18px;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs .filter-option-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs p {
  font-family: "Inter-200";
  margin: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs small {
  color: rgba(76, 76, 77, 0.7);
  font-family: "Inter-200";
  white-space: normal;
  overflow-wrap: anywhere;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding: 20px 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer button {
  border-radius: 33px;
  background-color: rgba(24, 30, 48, 0);
  border: 2px solid #433fac;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 36px;
  cursor: pointer;
  color: #201E52;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer .apply-button {
  background-color: #201E52;
  color: #ffffff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer .apply-button.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: rgba(67, 63, 172, 0.5);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer .apply-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: rgba(67, 63, 172, 0.5);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .filter-wrapper .filter-wrap .left-compare-wrap {
  left: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper {
  width: 100%;
  background-color: #ffffff;
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 16px 34px;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-text {
  text-transform: uppercase;
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap .match-comparison {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap .match-comparison .left-number-wrapper {
  width: 70px;
  border-radius: 8px;
  background-color: #7571CB;
  height: 49px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap .match-comparison .left-number-wrapper .number {
  text-transform: uppercase;
  font-family: "Inter-500";
  color: #ffffff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap .match-comparison .title {
  text-transform: uppercase;
  font-family: "Inter-200";
  color: #4c4c4d;
  font-size: 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap .match-comparison .right-number-wrapper {
  width: 70px;
  height: 49px;
  border-radius: 8px;
  background-color: #201e52;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .overall-tabs-wrap .matches-wrapper .match-comparison-wrap .match-comparison .right-number-wrapper .number {
  text-transform: uppercase;
  font-family: "Inter-500";
  color: #ffffff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper {
  position: relative;
  z-index: 20;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper {
  position: relative;
  z-index: 30;
  margin-top: 20px;
  width: 100%;
  background-color: #fff;
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
  box-sizing: border-box;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 34px;
  gap: 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap {
  z-index: 40;
  border-radius: 50px;
  background-color: #fff;
  border: 1px solid rgba(76, 76, 77, 0.6);
  box-sizing: border-box;
  min-width: 168px;
  max-width: 260px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 16px;
  gap: 10px;
  position: relative;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .chip-wrapper {
  min-width: 0;
  flex: 1;
  border-radius: 50px;
  background-color: #db540b;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .chip-text {
  font-family: "Inter-500";
  color: #ffffff;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .dropdown-icon {
  width: 24px;
  height: 24px;
  object-fit: contain;
  flex-shrink: 0;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare {
  z-index: 10050;
  width: min(460px, 100vw - 40px);
  position: absolute;
  border-radius: 8px;
  background-color: #fff;
  height: auto;
  text-align: left;
  font-size: 16px;
  color: #000;
  font-family: Inter;
  z-index: 1;
  left: 0;
  bottom: 0;
  right: 0;
  top: 60px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap {
  background-color: #ffffff;
  box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.18);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child {
  display: flex;
  flex-direction: row;
  gap: 0;
  border-bottom: 2px solid rgba(76, 76, 77, 0.0588235294);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection {
  display: flex;
  flex-direction: column;
  width: 34%;
  min-width: 120px;
  background-color: rgba(76, 76, 77, 0.0588235294);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent {
  margin-top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type {
  padding: 1px 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .select-type p {
  font-family: "Inter-500";
  font-size: 16px;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .left-selection .select-type-parent .active {
  background-color: #ffffff;
  color: #201E52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent {
  width: 66%;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  gap: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs input {
  cursor: pointer;
  width: 18px;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs .filter-option-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs p {
  font-family: "Inter-200";
  margin: 0;
  white-space: normal;
  overflow-wrap: anywhere;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-compare-child .right-radio-parent .radio-inputs small {
  font-family: "Inter-200";
  color: rgba(76, 76, 77, 0.72);
  white-space: normal;
  overflow-wrap: anywhere;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding: 20px 0px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer button {
  border-radius: 33px;
  background-color: rgba(24, 30, 48, 0);
  border: 2px solid #433fac;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 36px;
  cursor: pointer;
  color: #201E52;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .filter-wrapper .filter-wrap .filter-compare .main-filter-wrap .filter-footer .apply-button {
  background-color: #201E52;
  color: #ffffff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .header-wrap {
  width: 100%;
  margin-top: 20px;
  background-color: #eeeeff;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  align-content: center;
  padding: 0px 41px;
  box-sizing: border-box;
  gap: 45px 0px;
  text-align: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .header-wrap .nav-text-parent {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .header-wrap .nav-text {
  position: relative;
  text-transform: capitalize;
  font-weight: 600;
  font-family: "Inter-500";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .header-wrap .icon {
  width: 20px;
  position: relative;
  max-height: 100%;
  object-fit: cover;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap {
  margin-top: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .each-other-matches-wrapper {
  padding: 18px 34px 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .each-other-summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .matchup-label {
  margin: 0;
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .scope-label {
  margin: 4px 0 0;
  font-family: "Inter-200";
  font-size: 13px;
  color: rgba(76, 76, 77, 0.72);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .scope-note {
  margin: 0;
  max-width: 400px;
  font-family: "Inter-200";
  font-size: 13px;
  color: #db540b;
  text-align: right;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .each-other-status {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 90px;
  border-radius: 12px;
  background: rgba(238, 238, 255, 0.45);
  padding: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .each-other-status p {
  margin: 0;
  font-family: "Inter-200";
  color: rgba(76, 76, 77, 0.86);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .match-comparison-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .match-comparison {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .title {
  flex: 1;
  margin: 0;
  text-align: center;
  font-family: "Inter-200";
  font-size: 14px;
  color: #4c4c4d;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .left-number-wrapper,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .right-number-wrapper {
  width: 54px;
  min-width: 54px;
  height: 31px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .left-number-wrapper {
  background-color: #7d79e3;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .right-number-wrapper {
  background-color: #201e52;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .left-number-wrapper.stat-highlight,
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .right-number-wrapper.stat-highlight {
  background-color: #db540b;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .analysis-wrapper .each-other-wrapper .score-wrap .number {
  margin: 0;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container {
  background-color: white;
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-header {
  background-color: #EEEEFF;
  padding: 3px 20px;
  height: 37px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-header p {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content {
  width: 100%;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table {
  border-collapse: collapse;
  table-layout: fixed;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table thead .upcoming-points-table-th {
  background-color: rgba(76, 76, 77, 0.04);
  height: 46px;
  text-align: center;
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  font-weight: 600;
  vertical-align: middle;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table thead .upcoming-points-table-th.teams-col {
  width: 395px;
  text-align: left;
  padding-left: 16px;
  padding-right: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table thead .upcoming-points-table-th.stat-col {
  width: 80px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-tr:last-child .upcoming-points-table-td {
  border-bottom: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td {
  vertical-align: middle;
  border-bottom: 1px solid rgba(76, 76, 77, 0.25);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col {
  padding-left: 16px;
  padding-right: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell {
  display: flex;
  align-items: center;
  gap: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell .upcoming-points-table-rank {
  display: block;
  list-style: decimal;
  margin: 0;
  padding: 0;
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
  width: 35px;
  line-height: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell .upcoming-points-table-rank li {
  margin-left: 27px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell .upcoming-points-table-rank li .upcoming-points-table-rank-text {
  line-height: normal;
  font-size: 18px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell .upcoming-points-table-team-info {
  display: flex;
  align-items: center;
  gap: 8px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell .upcoming-points-table-team-info .upcoming-points-table-team-logo {
  width: 21.716px;
  height: 21.716px;
  flex-shrink: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.teams-col .upcoming-points-table-team-cell .upcoming-points-table-team-info .upcoming-points-table-team-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  text-transform: uppercase;
  margin: 0;
  font-weight: 600;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.stat-col {
  text-align: center;
  padding: 12px 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-content .upcoming-points-table tbody .upcoming-points-table-td.stat-col p {
  font-family: "Inter-500";
  font-size: 13px;
  color: #000000;
  margin: 0;
  font-weight: 500;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-footer {
  border-top: 1px solid rgba(76, 76, 77, 0.15);
  padding: 15px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-points-table-tab-container .upcoming-points-table-tab-footer p {
  font-family: "Inter-500";
  font-size: 16px;
  color: #433fac;
  text-decoration: underline;
  text-transform: uppercase;
  margin: 0;
  cursor: pointer;
  text-underline-position: from-font;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 1px;
  padding: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column {
  flex: 1;
  width: 692px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-header {
  background-color: #EEEEFF;
  padding: 3px 20px;
  height: 59px;
  display: flex;
  align-items: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-header p {
  font-family: "Inter-500";
  font-size: 16px;
  color: rgba(0, 0, 0, 0.9);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item {
  background-color: white;
  border-bottom: 1px solid rgba(76, 76, 77, 0.15);
  display: flex;
  align-items: center;
  padding: 0px 10px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item:last-child {
  border-bottom: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 72px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info .upcoming-squad-player-image-wrapper {
  width: 54px;
  height: 54px;
  border-radius: 27px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  overflow: hidden;
  flex-shrink: 0;
  position: relative;
  background-color: white;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info .upcoming-squad-player-image-wrapper.no-border {
  border: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info .upcoming-squad-player-image-wrapper img {
  width: 49px;
  height: 55px;
  object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info .upcoming-squad-player-details {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 42px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info .upcoming-squad-player-details .upcoming-squad-player-name {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column .upcoming-squad-list .upcoming-squad-player-item .upcoming-squad-player-info .upcoming-squad-player-details .upcoming-squad-player-role {
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(76, 76, 77, 0.6);
  margin: 0;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column:first-child .upcoming-squad-list .upcoming-squad-player-item {
  border-right: 1px solid rgba(76, 76, 77, 0.15);
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .upcoming-squads-wrapper .upcoming-squad-column:last-child .upcoming-squad-list .upcoming-squad-player-item {
  border-right: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper {
  padding: 0px 20px 20px 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .team-name {
  font-family: "Inter-500";
  font-size: 16px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams p {
  font-family: "Inter-100";
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams .players-cards {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
}
@media (max-width: 1100px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams .players-cards {
    --cols: 3;
  }
}
@media (max-width: 780px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams .players-cards {
    --cols: 2;
  }
}
@media (max-width: 520px) {
  .matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams .players-cards {
    --cols: 1;
  }
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams .players-cards .ti-merge-btn {
  display: none;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .players-wrapper .team-one .playing-teams .players-cards .ti-player {
  height: 190px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper {
  padding: 20px 0px;
  margin-right: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .streamer-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
  padding: 0px 15px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .streamer-wrapper .streamer-wrap {
  width: 13%;
  position: relative;
  border-radius: 8px;
  background-color: rgba(67, 63, 172, 0.07);
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 10px;
  box-sizing: border-box;
  gap: 8px;
  text-align: left;
  font-family: "Inter-100";
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .streamer-wrapper .streamer-wrap .streamer-icon {
  object-fit: cover;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .streamer-wrapper .streamer-wrap .streamer-text {
  position: relative;
  font-family: "Inter-500";
  color: #433fac;
  font-size: 13px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  font-size: 16px;
  color: #201E52;
  justify-content: end;
  margin-top: 20px;
  padding-right: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .cancel-button-wrap {
  width: 99px;
  border-radius: 8px;
  border: 1px solid #201E52;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  gap: 8px;
  background-color: #ffffff;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .cancel-button-wrap .cancel-icon {
  width: 20px;
  position: relative;
  height: 20px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .cancel-button-wrap .copy-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .cancel-button-wrap .copy-wrapper .copy-text {
  position: relative;
  line-height: 24px;
  font-family: "Inter-500";
  font-size: 14px;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .clear-ticker-wrap {
  width: 148px;
  border-radius: 8px;
  background-color: #201E52;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  box-sizing: border-box;
  gap: 8px;
  color: #fff;
  cursor: pointer;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .clear-ticker-wrap .clear-ticker-icon {
  width: 20px;
  position: relative;
  height: 20px;
  object-fit: cover;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .clear-ticker-wrap .copy-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .matches-detail-wrap .matches-detail-data-wrapper .streamer-main-wrapper .button-wrap .clear-ticker-wrap .copy-wrapper .copy-text {
  position: relative;
  line-height: 24px;
  font-family: "Inter-500";
  font-size: 14px;
}
.matches-details-wrapper .live-match-header {
  padding: 15px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.matches-details-wrapper .live-match-header .live-match-header-top {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  max-width: 1293px;
}
.matches-details-wrapper .live-match-header .live-match-header-top .live-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  background-color: #e51a4b;
  border-radius: 50px;
  padding: 5px 8px;
}
.matches-details-wrapper .live-match-header .live-match-header-top .live-badge .live-dot {
  width: 5px;
  height: 5px;
  background-color: #ffffff;
  border-radius: 50%;
  display: block;
}
.matches-details-wrapper .live-match-header .live-match-header-top .live-badge .live-text {
  font-family: "Inter-700";
  font-size: 12px;
  color: #ffffff;
  font-weight: bold;
}
.matches-details-wrapper .live-match-header .live-match-header-top .match-date-time {
  font-family: "Inter-700";
  font-size: 16px;
  color: #ffffff;
  font-weight: bold;
}
.matches-details-wrapper .live-match-header .live-match-header-top .header-dot {
  width: 5px;
  height: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .live-match-header .live-match-header-top .header-dot img {
  width: 100%;
  height: 100%;
}
.matches-details-wrapper .live-match-header .live-match-header-top .match-venue {
  font-family: "Inter-700";
  font-size: 16px;
  color: rgba(255, 255, 255, 0.93);
  text-align: center;
}
.matches-details-wrapper .live-match-header .live-match-teams-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 1293px;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .innings-info {
  font-family: "Inter-200";
  font-size: 16px;
  color: rgba(255, 255, 255, 0.86);
  text-align: center;
  margin: 0;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper {
  display: flex;
  align-items: center;
  gap: 86px;
  justify-content: center;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-team-info,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-team-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-team-info .live-team-logo-wrapper,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-team-info .live-team-logo-wrapper {
  width: 98px;
  height: 98px;
  background-color: #ffffff;
  border-radius: 142px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-team-info .live-team-logo-wrapper img,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-team-info .live-team-logo-wrapper img {
  width: 67px;
  height: 67px;
  object-fit: contain;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-team-info .live-team-name,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-team-info .live-team-name {
  font-family: "Inter-700";
  font-style: italic;
  font-size: 18px;
  color: #ffffff;
  text-align: center;
  text-transform: uppercase;
  margin: 0;
  white-space: pre-wrap;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-score-info,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-score-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-score-info .live-score,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-score-info .live-score {
  font-family: "Inter-700";
  font-size: 24px;
  color: #ffffff;
  font-weight: bold;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-score-info .live-over,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-score-info .live-over {
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-left .live-score-info .yet-to-bat,
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right .live-score-info .yet-to-bat {
  font-family: "Inter-700";
  font-size: 24px;
  color: #ffffff;
  font-weight: bold;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-team-right {
  flex-direction: row-reverse;
  gap: 20px;
}
.matches-details-wrapper .live-match-header .live-match-teams-section .live-teams-wrapper .live-divider-vertical {
  width: 1px;
  height: 88px;
  background-color: rgba(255, 255, 255, 0.4);
}
.matches-details-wrapper .live-match-header .current-over-section {
  width: 100%;
  max-width: 884px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  position: relative;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .over-label {
  font-family: "Inter-700";
  font-size: 16px;
  color: #ffffff;
  font-weight: 800;
  line-height: normal;
  margin-top: 7px;
  flex-shrink: 0;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row {
  display: flex;
  align-items: flex-start;
  gap: 4px;
  margin-left: 99px;
  margin-top: 0;
  position: relative;
  width: 262px;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator {
  width: 33px;
  height: 33px;
  border-radius: 39px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator span {
  font-family: "Inter-700";
  font-size: 14px;
  font-weight: 800;
  line-height: normal;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.wicket-ball {
  background-color: #d8252d !important;
  border: none;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.wicket-ball span {
  color: #ffffff !important;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.boundary-ball {
  background-color: #19d1ff !important;
  border: none;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.boundary-ball span {
  color: #000000 !important;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.runs-ball {
  background-color: rgba(255, 255, 255, 0.88) !important;
  border: none;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.runs-ball span {
  color: #000000 !important;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.dot-ball {
  background-color: rgba(0, 0, 0, 0.21) !important;
  border: 1px solid #ffffff !important;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .ball-indicator.dot-ball span {
  color: #ffffff !important;
}
.matches-details-wrapper .live-match-header .current-over-section .over-display .balls-row .ball-indicator-wrapper .extra-indicator {
  font-family: "Inter-700";
  font-size: 14px;
  color: #ffffff;
  font-weight: 800;
  text-align: center;
  margin-top: 37px;
  width: 100%;
  white-space: pre-wrap;
  line-height: normal;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.matches-details-wrapper .live-match-header .current-over-section .over-section-divider {
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.4);
  margin: 0;
}
.matches-details-wrapper .live-match-header .current-over-section .match-status-equation {
  color: #ffffff;
  font-size: 16px;
  font-family: "Inter-500";
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section {
  width: 100%;
  max-width: 884px;
  display: flex;
  align-items: flex-start;
  gap: 32px;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live {
  display: flex;
  flex-direction: column;
  gap: 21px;
  flex: 1;
  max-width: 555px;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .section-title {
  font-family: "Inter-700";
  font-size: 16px;
  color: #ffffff;
  font-weight: 800;
  margin: 0;
  line-height: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list {
  display: flex;
  flex-direction: row;
  gap: 25px;
  width: 100%;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card {
  flex: 1;
  min-width: 234px;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(2px);
  border-bottom: 1px solid rgba(167, 167, 167, 0.25);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 15px;
  position: relative;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-info {
  display: flex;
  align-items: center;
  gap: 14px;
  position: relative;
  flex: 1;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-info .batsman-image {
  width: 34px;
  height: 35px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-info .batsman-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  text-transform: uppercase;
  width: 75px;
  white-space: pre-wrap;
  line-height: normal;
  flex-shrink: 0;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-info .bat-icon {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 138px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("../../assets/images/bat_icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-score {
  font-family: "Inter-700";
  font-size: 16px;
  color: #ffffff;
  line-height: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-score strong {
  font-family: "Inter-700";
  font-weight: 800;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .batting-section-live .batsmen-list .batsman-card .batsman-score span {
  font-family: "Inter-200";
  font-weight: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live {
  display: flex;
  flex-direction: column;
  gap: 21px;
  flex: 0 0 265px;
  width: 265px;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .section-title {
  font-family: "Inter-700";
  font-size: 16px;
  color: #ffffff;
  font-weight: 800;
  margin: 0;
  line-height: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card {
  width: 100%;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(2px);
  border-bottom: 1px solid rgba(167, 167, 167, 0.25);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 15px;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card .bowler-info {
  display: flex;
  align-items: center;
  gap: 14px;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card .bowler-info .bowler-image {
  width: 34px;
  height: 35px;
  border-radius: 50%;
  object-fit: cover;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card .bowler-info .bowler-name {
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  text-transform: uppercase;
  width: 75px;
  white-space: pre-wrap;
  line-height: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card .bowler-figures {
  font-family: "Inter-700";
  font-size: 16px;
  color: #ffffff;
  line-height: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card .bowler-figures strong {
  font-family: "Inter-700";
  font-weight: 800;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .bowling-section-live .bowler-card .bowler-figures span {
  font-family: "Inter-200";
  font-weight: normal;
}
.matches-details-wrapper .live-match-header .live-batting-bowling-section .live-divider-horizontal {
  width: 1px;
  height: 96px;
  background-color: rgba(255, 255, 255, 0.4);
  align-self: center;
  flex-shrink: 0;
}
.matches-details-wrapper .upcoming-match-header {
  padding: 32px 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.matches-details-wrapper .upcoming-match-header .back-button-upcoming {
  position: absolute;
  left: 37px;
  top: 26px;
  width: 38px;
  height: 20px;
  cursor: pointer;
}
.matches-details-wrapper .upcoming-match-header .upcoming-match-header-top {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  max-width: 893px;
  margin-top: 6px;
}
.matches-details-wrapper .upcoming-match-header .upcoming-match-header-top .upcoming-status {
  font-family: "Inter-700";
  font-size: 16px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 600;
}
.matches-details-wrapper .upcoming-match-header .upcoming-match-header-top .match-date-time {
  font-family: "Inter-700";
  font-size: 16px;
  color: rgba(255, 255, 255, 0.86);
  font-weight: 600;
}
.matches-details-wrapper .upcoming-match-header .upcoming-match-header-top .header-dot {
  width: 5px;
  height: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.matches-details-wrapper .upcoming-match-header .upcoming-match-header-top .header-dot img {
  width: 100%;
  height: 100%;
}
.matches-details-wrapper .upcoming-match-header .upcoming-match-header-top .match-venue {
  font-family: "Inter-700";
  font-size: 16px;
  color: rgba(255, 255, 255, 0.86);
  text-align: center;
  font-weight: 600;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 76px;
  margin-top: 40px;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-left,
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  width: 205px;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-left .upcoming-team-logo-wrapper,
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-right .upcoming-team-logo-wrapper {
  width: 80px;
  height: 80px;
  background-color: #ffffff;
  border: 3px solid #ff751f;
  border-radius: 142px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-left .upcoming-team-logo-wrapper img,
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-right .upcoming-team-logo-wrapper img {
  width: 66px;
  height: 66px;
  object-fit: contain;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-left .upcoming-team-name,
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-team-right .upcoming-team-name {
  font-family: "Inter-700";
  font-style: italic;
  font-size: 20px;
  color: #ff751f;
  text-align: center;
  text-transform: uppercase;
  margin: 0;
  white-space: pre-wrap;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-countdown {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
  width: 203px;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-countdown .countdown-label {
  font-family: "Inter-500";
  font-style: italic;
  font-size: 14px;
  color: #ffffff;
  text-transform: uppercase;
  margin: 0;
  line-height: 36px;
}
.matches-details-wrapper .upcoming-match-header .upcoming-teams-wrapper .upcoming-countdown .countdown-time {
  font-family: "Inter-700";
  font-style: italic;
  font-size: 24px;
  color: #ffffff;
  text-transform: uppercase;
  font-weight: bold;
  margin: 0;
  line-height: 36px;
}
.matches-details-wrapper .video-highlights-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.matches-details-wrapper .video-highlights-section .video-highlights-header {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 10px;
  box-sizing: border-box;
}
.matches-details-wrapper .video-highlights-section .video-highlights-header .camera-icon-wrapper {
  background: rgba(117, 113, 203, 0.18);
  border-radius: 18.354px;
  padding: 8.81px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.matches-details-wrapper .video-highlights-section .video-highlights-header .camera-icon-wrapper .camera-icon {
  width: 20.91px;
  height: 20.91px;
  object-fit: contain;
}
.matches-details-wrapper .video-highlights-section .video-highlights-header .video-highlights-title {
  font-family: "Inter-500";
  font-size: 20px;
  color: #000000;
  text-decoration: underline;
  text-underline-position: from-font;
  text-transform: capitalize;
  margin: 0;
  line-height: normal;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-height: calc(100vh - 200px);
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 8px;
  box-sizing: border-box;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list::-webkit-scrollbar {
  width: 6px;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 10px;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.3);
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-thumbnail-wrapper {
  position: relative;
  width: 92%;
  height: 174px;
  background-color: #ffd0d0;
  border-radius: 9px;
  overflow: hidden;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-thumbnail-wrapper .video-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-thumbnail-wrapper .video-duration-overlay {
  position: absolute;
  left: 9px;
  bottom: 9px;
  background-color: #000000;
  border-radius: 200px;
  height: 24px;
  padding: 0 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-thumbnail-wrapper .video-duration-overlay .play-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  position: relative;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-thumbnail-wrapper .video-duration-overlay .play-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-40%, -50%);
  width: 0;
  height: 0;
  border-left: 6px solid #ffffff;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-thumbnail-wrapper .video-duration-overlay .duration-text {
  font-family: "Inter-500";
  font-size: 12px;
  color: #ffffff;
  text-transform: capitalize;
  line-height: normal;
}
.matches-details-wrapper .video-highlights-section .video-highlights-list .video-highlight-item .video-description {
  font-family: "Inter-500";
  font-size: 12px;
  color: #000000;
  text-transform: capitalize;
  margin: 0;
  margin-top: 0;
  line-height: normal;
  min-height: 30px;
  white-space: pre-wrap;
  word-wrap: break-word;
  overflow-wrap: break-word;
  word-break: break-word;
  width: 92%;
  max-width: 92%;
  box-sizing: border-box;
}
.matches-details-wrapper .video-highlights-section .video-highlight-item {
  cursor: pointer;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.matches-details-wrapper .video-highlights-section .video-highlight-item:hover {
  transform: translateY(-2px);
  opacity: 0.9;
}
.matches-details-wrapper .video-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  padding: 0;
  box-sizing: border-box;
  animation: fadeIn 0.3s ease;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
  }
  to {
    opacity: 1;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
}
.matches-details-wrapper .video-modal-overlay .video-modal-content {
  position: relative;
  width: 90%;
  max-width: 1200px;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: none;
  border-radius: 0;
  overflow: visible;
  animation: zoomIn 0.3s ease;
  margin: 0 auto;
  padding: 20px;
  box-sizing: border-box;
  box-shadow: none;
  filter: none;
}
@keyframes zoomIn {
  from {
    transform: scale(0.9);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
.matches-details-wrapper .video-modal-overlay .video-modal-content .video-modal-close {
  position: fixed;
  top: 65px;
  right: 20px;
  width: 40px;
  height: 40px;
  background-color: rgba(0, 0, 0, 0.8);
  border: 2px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  color: #ffffff;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10001;
  transition: all 0.3s ease;
  line-height: 1;
  padding: 0;
  box-shadow: none;
  filter: none;
}
.matches-details-wrapper .video-modal-overlay .video-modal-content .video-modal-close:hover {
  background-color: rgba(0, 0, 0, 0.8);
  border-color: rgb(255, 255, 255);
  transform: rotate(90deg);
}
.matches-details-wrapper .video-modal-overlay .video-modal-content .video-modal-close:active {
  transform: rotate(90deg) scale(0.95);
}
.matches-details-wrapper .video-modal-overlay .video-modal-content .video-player-wrapper {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 80vh;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  overflow: visible;
  aspect-ratio: 16/9;
  box-shadow: none;
  filter: none;
}
.matches-details-wrapper .video-modal-overlay .video-modal-content .video-player-wrapper .video-player {
  height: 100%;
  max-width: 100%;
  max-height: 80vh;
  object-fit: contain;
  display: block;
  outline: none;
  border-radius: 0;
  background: none;
  box-shadow: none;
  filter: none;
}
.matches-details-wrapper .video-modal-overlay .video-modal-content .video-modal-title {
  display: none;
}

.main-match-wrapper.tournament-details-page .main-middle-content-wrap {
  padding-top: 72px;
}

@media (max-width: 768px) {
  .main-match-wrapper.tournament-details-page {
    /* Breadcrumb — allow wrap so long names flow to a second line on narrow screens */
  }
  .main-match-wrapper.tournament-details-page .main-middle-content-wrap {
    padding-top: 70px;
  }
  .main-match-wrapper.tournament-details-page .breadcrumb-container {
    padding: 10px 0 8px;
    gap: 5px;
    flex-wrap: wrap;
    row-gap: 3px;
  }
  .main-match-wrapper.tournament-details-page .breadcrumb-container .breadcrumb-item,
  .main-match-wrapper.tournament-details-page .breadcrumb-container .breadcrumb-item-active {
    font-size: 12px;
    line-height: 1.4;
    white-space: normal;
  }
  .main-match-wrapper.tournament-details-page .breadcrumb-container .breadcrumb-separator {
    flex-shrink: 0;
  }
  .main-match-wrapper.tournament-details-page .match-bg-wrapper {
    margin-top: 6px;
  }
  .main-match-wrapper.tournament-details-page .match-bg-wrapper .images-name-wrapper {
    padding: 14px 14px 30px;
    border-radius: 10px 10px 0 0;
    background-position: center;
    background-size: cover;
  }
  .main-match-wrapper.tournament-details-page .match-bg-wrapper .images-name-wrapper .match-name {
    max-width: 100%;
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: 0.6px;
  }
  .main-match-wrapper.tournament-details-page .match-bg-wrapper .matches-wrapper-container {
    top: -35px;
    border-radius: 12px 12px 0 0;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    box-shadow: none;
    /* clip keeps the rounded corners without creating a scroll blocker */
    overflow: clip;
  }
}
.tournament-details .header-tabs {
  display: flex;
  gap: 16px;
  padding-bottom: 16px;
  margin-top: 5px;
  position: relative;
}
.tournament-details .header-tabs::after {
  content: "";
  position: absolute;
  left: -24px;
  right: -24px;
  bottom: 8px;
  height: 1px;
  background: rgba(76, 76, 77, 0.25);
}
.tournament-details .header-tabs a {
  text-decoration: none;
  color: #7a7a7a;
  font-family: "Inter-200";
  position: relative;
  white-space: nowrap;
}
.tournament-details .header-tabs a.active {
  color: #2C2970;
  font-family: "Inter-500";
}
.tournament-details .header-tabs a.active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 26px;
  height: 2px;
  background: #2C2970;
  z-index: 1;
}
@media (max-width: 768px) {
  .tournament-details .header-tabs {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex-wrap: nowrap;
    align-items: center;
    gap: 22px;
    padding: 7px 14px 19px;
    margin: 0;
  }
  .tournament-details .header-tabs::-webkit-scrollbar {
    display: none;
  }
  .tournament-details .header-tabs::after {
    left: 0;
    right: 0;
    bottom: 7px;
  }
  .tournament-details .header-tabs a {
    font-size: 14px;
    line-height: 20px;
    flex-shrink: 0;
  }
  .tournament-details .header-tabs a.active::after {
    top: auto;
    bottom: -14px;
  }
}
@media (max-width: 768px) {
  .tournament-details .tab-content {
    min-height: auto;
    padding: 0 12px 12px;
  }
}
.tournament-details .tab-content {
  min-height: 200px;
}
.tournament-details .tournament-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 0;
}
.tournament-details .tournament-placeholder img {
  width: 220px;
  height: auto;
  margin-bottom: 12px;
  user-select: none;
}
.tournament-details .tournament-placeholder p {
  color: #7a7a7a;
  margin: 0;
}
.tournament-details .gallery-wrapper {
  padding-top: 20px;
  /* responsiveness */
}
.tournament-details .gallery-wrapper .gallery-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.tournament-details .gallery-wrapper .gallery-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.tournament-details .gallery-wrapper .gallery-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 8px;
  border: 1px solid transparent;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tournament-details .gallery-wrapper .gallery-btn:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.tournament-details .gallery-wrapper .gallery-btn--primary {
  background: linear-gradient(180deg, #2c2970 0%, #201e52 100%);
  color: #ffffff;
}
.tournament-details .gallery-wrapper .gallery-btn--danger {
  background: #ffffff;
  color: #ef4444;
  border-color: #fca5a5;
}
.tournament-details .gallery-wrapper .gallery-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 17px;
  align-items: center;
}
.tournament-details .gallery-wrapper .gallery-card {
  position: relative;
  height: 247px;
  flex: 0 0 calc((100% - 51px) / 4);
  min-width: 0;
  border-radius: 2px;
  overflow: hidden;
  background: #000000;
  box-shadow: 0px 0px 3.7px 0px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}
.tournament-details .gallery-wrapper .gallery-card.is-selected {
  box-shadow: 0 0 0 3px rgba(44, 41, 112, 0.24);
}
.tournament-details .gallery-wrapper .gallery-card .gallery-select {
  position: absolute;
  left: 12px;
  top: 12px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid #ffffff;
  background: rgba(255, 255, 255, 0.16);
  z-index: 3;
  cursor: pointer;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-select.is-selected {
  background: #ffffff;
  box-shadow: inset 0 0 0 4px #2c2970;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-img-wrapper {
  position: absolute;
  height: 276px;
  left: -21px;
  top: -18px;
  width: 414px;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-img-wrapper .gallery-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-overlay {
  position: absolute;
  background: linear-gradient(to top, #000000 0%, rgba(0, 0, 0, 0) 90.643%);
  height: 144px;
  left: -7px;
  top: 103px;
  width: 395px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25), 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
.tournament-details .gallery-wrapper .gallery-card .gallery-content {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  left: 19px;
  bottom: 19px;
  width: calc(100% - 38px);
  max-width: 174px;
  z-index: 1;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-content .gallery-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-content .gallery-info .gallery-match {
  font-family: "Inter-700";
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  margin: 0;
  line-height: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  max-width: 100%;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-content .gallery-info .gallery-date {
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.68);
  letter-spacing: 1.96px;
  margin: 0;
  line-height: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-badge {
  position: absolute;
  backdrop-filter: blur(1.05px);
  -webkit-backdrop-filter: blur(1.05px);
  background: rgba(0, 0, 0, 0.62);
  display: flex;
  height: 24px;
  align-items: center;
  justify-content: space-between;
  right: 0;
  top: 0;
  padding: 3px 6px;
  width: 50px;
  z-index: 2;
  box-sizing: border-box;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-badge .gallery-count {
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: 1.96px;
  margin: 0;
  line-height: normal;
  flex-shrink: 0;
}
.tournament-details .gallery-wrapper .gallery-card .gallery-badge .gallery-icon {
  width: 13px;
  height: 13px;
  flex-shrink: 0;
  display: block;
}
.tournament-details .gallery-wrapper .gallery-card:hover .gallery-img {
  transform: scale(1.02);
}
@media (max-width: 1200px) {
  .tournament-details .gallery-wrapper .gallery-card {
    flex: 0 0 calc((100% - 34px) / 3);
  }
}
@media (max-width: 900px) {
  .tournament-details .gallery-wrapper .gallery-card {
    flex: 0 0 calc((100% - 17px) / 2);
  }
}
@media (max-width: 520px) {
  .tournament-details .gallery-wrapper .gallery-card {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .tournament-details .gallery-wrapper .gallery-header {
    flex-direction: column;
    align-items: stretch;
  }
  .tournament-details .gallery-wrapper .gallery-actions {
    width: 100%;
  }
  .tournament-details .gallery-wrapper .gallery-btn {
    flex: 1 1 160px;
  }
}
.tournament-details .gallery-details-wrapper {
  /* responsiveness */
}
.tournament-details .gallery-details-wrapper .gallery-details-post {
  margin-bottom: 24px;
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 2px 12px rgba(20, 20, 43, 0.08);
  border: 1px solid rgba(44, 41, 112, 0.08);
}
.tournament-details .gallery-details-wrapper .gallery-details-post .gallery-details-post-cover {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  cursor: pointer;
  background: #000000;
  line-height: 0;
}
.tournament-details .gallery-details-wrapper .gallery-details-post .gallery-details-post-cover:focus-visible {
  outline: 2px solid #2c2970;
  outline-offset: 2px;
}
.tournament-details .gallery-details-wrapper .gallery-details-post .gallery-details-post-cover-img {
  width: 100%;
  max-height: min(420px, 56vh);
  object-fit: cover;
  object-position: center;
  display: block;
}
.tournament-details .gallery-details-wrapper .gallery-details-post .gallery-details-post-body {
  padding: 16px 20px 20px;
}
.tournament-details .gallery-details-wrapper .gallery-details-post .gallery-details-post-title {
  font-family: "Inter-700";
  font-size: 18px;
  color: #1a1a2e;
  margin: 0 0 8px;
  line-height: 1.3;
  word-break: break-word;
}
.tournament-details .gallery-details-wrapper .gallery-details-post .gallery-details-post-meta {
  font-family: "Inter-500";
  font-size: 14px;
  color: #5c5c6f;
  margin: 0;
  letter-spacing: 0.02em;
}
.tournament-details .gallery-details-wrapper .gallery-details-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 17px;
  padding-top: 10px;
  align-items: flex-start;
  justify-content: space-between;
}
.tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item {
  position: relative;
  height: 247px;
  flex: 0 0 calc((100% - 51px) / 4);
  min-width: 0;
  border-radius: 2px;
  overflow: hidden;
  cursor: pointer;
  background: #000000;
  box-shadow: 0px 0px 3.7px 0px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item:hover {
  transform: scale(1.02);
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2);
}
.tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item .gallery-details-img-wrapper {
  position: absolute;
  height: 276px;
  left: -21px;
  top: -18px;
  width: 414px;
}
.tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item .gallery-details-img-wrapper .gallery-details-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  pointer-events: none;
}
@media (max-width: 1200px) {
  .tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item {
    flex: 0 0 calc((100% - 34px) / 3);
  }
}
@media (max-width: 900px) {
  .tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item {
    flex: 0 0 calc((100% - 17px) / 2);
  }
}
@media (max-width: 520px) {
  .tournament-details .gallery-details-wrapper .gallery-details-grid .gallery-details-item {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

.image-zoom-overlay {
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  z-index: 9998 !important;
  position: fixed !important;
  inset: 0 !important;
  opacity: 1 !important;
  animation: none !important;
}

.app-dialog-content.image-zoom-modal {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  max-height: 100vh !important;
  width: 100vw !important;
  height: 100vh !important;
  left: 0 !important;
  top: 0 !important;
  transform: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0 !important;
  border: none !important;
  outline: none !important;
  position: fixed !important;
  animation: none !important;
  opacity: 1 !important;
  flex-direction: row !important;
  z-index: 9999 !important;
}
.app-dialog-content.image-zoom-modal .app-dialog-header {
  display: none !important;
}
.app-dialog-content.image-zoom-modal .app-dialog-body {
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  background: transparent !important;
  overflow: visible !important;
  flex: none !important;
}
.app-dialog-content.image-zoom-modal .image-zoom-content {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  background: transparent;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper {
  position: relative;
  display: inline-block;
  max-width: 90vw;
  max-height: 90vh;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-close {
  position: absolute;
  top: -25px;
  right: -45px;
  background: rgba(0, 0, 0, 0.6);
  border: none;
  color: #ffffff;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
  z-index: 10000;
  padding: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-close:hover {
  background: rgba(0, 0, 0, 0.8);
  transform: scale(1.1);
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-close svg {
  width: 18px;
  height: 18px;
  stroke: #ffffff;
  stroke-width: 2.5;
  pointer-events: none;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-close-button {
  top: -35px;
  right: 20px;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .swiper {
  width: 100%;
  height: 100%;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.6);
  border: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
  z-index: 10001;
  padding: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-nav:hover:not(.disabled) {
  background: rgba(0, 0, 0, 0.8);
  transform: translateY(-50%) scale(1.1);
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-nav.disabled {
  opacity: 0.3;
  cursor: not-allowed;
  pointer-events: none;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-nav img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  pointer-events: none;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-prev {
  left: 20px;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-next {
  right: 20px;
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-carousel .image-zoom-next img {
  transform: scaleX(-1);
}
.app-dialog-content.image-zoom-modal .image-zoom-content .image-zoom-wrapper .image-zoom-img {
  max-width: 90vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  object-fit: contain;
  object-position: center;
  margin: 0;
  padding: 0;
  display: block;
  background: transparent;
}

.bowling-score-card-modal {
  display: flex;
  align-items: center;
  justify-content: center;
}
.bowling-score-card-modal .modal-content {
  background: #ffffff;
  border-radius: 14px;
  padding: 20px;
  max-width: 640px;
  width: 100%;
}
.bowling-score-card-modal .inning-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  /* stack on small screens */
}
@media (max-width: 540px) {
  .bowling-score-card-modal .inning-options {
    grid-template-columns: 1fr;
  }
}
.bowling-score-card-modal .inning-card {
  appearance: none;
  outline: none;
  border: 2px solid #201E52;
  background: #ffffff;
  border-radius: 12px;
  padding: 10px 15px;
  cursor: pointer;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: box-shadow 140ms ease, transform 120ms ease, background-color 120ms ease;
}
.bowling-score-card-modal .inning-card:hover {
  box-shadow: 0 8px 22px rgba(75, 71, 181, 0.18);
  transform: translateY(-1px);
  background-color: #faf9ff;
}
.bowling-score-card-modal .inning-card:active {
  transform: translateY(0);
}
.bowling-score-card-modal .inning-card .inning-title {
  font-size: 20px;
  font-weight: 700;
  color: #111315;
  line-height: 1.2;
  margin-bottom: 6px;
}
.bowling-score-card-modal .inning-card .inning-subtitle {
  font-size: 14px;
  font-weight: 500;
  color: #7a8699; /* muted grey like the screenshot */
  line-height: 1.2;
}

/* Parent block */
.teams-modal {
  background: #ffffff;
  border-radius: 12px;
  padding: 0;
  max-width: 1024px;
  width: 100%;
  overflow: hidden;
}
.teams-modal .tabs {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: #ffffff;
  border-bottom: 1px solid #e9e9ee;
  /* Purple underline indicator that moves under active tab */
}
.teams-modal .tabs .tab {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 14px 16px;
  font-size: 13px;
  font-family: "Inter-700";
  letter-spacing: 0.2px;
  color: #2b2f33;
  cursor: pointer;
  text-align: center;
}
.teams-modal .tabs .tab.is-active {
  color: #201E52;
}
.teams-modal .tabs .tab:hover {
  background: #f8f8ff;
}
.teams-modal .tabs .tab-indicator {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  width: 50%;
  background: #201E52; /* purple-ish */
  transition: transform 160ms ease;
}
.teams-modal .tabs .tab-indicator.bowling {
  transform: translateX(100%);
}
.teams-modal .tabs .tab-indicator.batting {
  transform: translateX(0%);
}
.teams-modal .panels .panel {
  /* give content height and scrolling like screenshot */
  max-height: 420px;
  overflow: auto;
  padding: 6px 0 8px; /* tight top spacing like the image */
}
.teams-modal .panels .player-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.teams-modal .panels .player-list .player-row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1.5px solid rgba(76, 76, 77, 0.2);
}
.teams-modal .panels .player-list .player-row .player-index {
  color: #000000;
  font-size: 14px;
  font-family: "Inter-200";
}
.teams-modal .panels .player-list .player-row .player-name {
  color: #000000;
  font-size: 14px;
  font-family: "Inter-200";
}
.teams-modal .panels .player-list .player-row:last-child {
  border-bottom: 0;
}
.teams-modal .panels .player-list .empty {
  padding: 20px 16px;
  color: #8a8fa0;
  font-size: 14px;
}

.points-modal {
  font-family: "Inter-500";
  /* responsive */
}
.points-modal .points-modal-panel {
  position: relative;
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.points-modal .points-modal-header {
  color: #000000;
  font-family: "Inter-500";
}
.points-modal .points-modal-header .points-modal-tabs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2px solid rgba(76, 76, 77, 0.1490196078);
}
.points-modal .points-modal-header .points-modal-tabs .points-modal-tab {
  position: relative;
  background: transparent;
  border: 0;
  color: #000000;
  font-family: "Inter-500";
  font-weight: 700;
  letter-spacing: 0.4px;
  padding: 14px 16px;
  width: 50%;
  cursor: pointer;
}
.points-modal .points-modal-header .points-modal-tabs .points-modal-tab.is-active {
  color: #000000;
}
.points-modal .points-modal-header .points-modal-tabs .points-modal-tab.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  background: linear-gradient(90deg, #201E52);
}
.points-modal .points-modal-body {
  background: #f7f8fb;
}
.points-modal .points-modal-body .fixture-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.points-modal .points-modal-body .fixture-list .fixture {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  background: #ffffff;
}
.points-modal .points-modal-body .fixture-list .fixture:not(:last-child) {
  border-bottom: 1.5px solid rgba(76, 76, 77, 0.2);
}
.points-modal .points-modal-body .fixture-list .fixture .fixture-teams {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}
.points-modal .points-modal-body .fixture-list .fixture .fixture-team,
.points-modal .points-modal-body .fixture-list .fixture .fixture-team-away {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
}
.points-modal .points-modal-body .fixture-list .fixture .fixture-flag {
  font-size: 18px;
  line-height: 1;
  display: inline-flex;
}
.points-modal .points-modal-body .fixture-list .fixture .fixture-name {
  font-size: 14px;
  color: #243043;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
  text-transform: uppercase;
  font-family: "Inter-200";
}
.points-modal .points-modal-body .fixture-list .fixture .fixture-vs {
  color: #7f8a9a;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.points-modal .points-modal-body .fixture-list .fixture .fixture-time {
  color: #000000;
  font-size: 14px;
  text-align: right;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: "Inter-200";
}
.points-modal .points-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 16px;
  background: #ffffff;
  border-top: 1px solid #e6e9ef;
}
.points-modal .points-modal-footer .btn {
  border: 0;
  border-radius: 8px;
  padding: 10px 14px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease;
}
.points-modal .points-modal-footer .btn.btn-ghost {
  background: #f2f4f8;
  color: #1c2433;
}
.points-modal .points-modal-footer .btn.btn-ghost:hover {
  background: #e7ebf3;
}
.points-modal .points-modal-footer .btn.btn-primary {
  background: #201E52;
  color: #ffffff;
}
@media (max-width: 640px) {
  .points-modal .points-modal-panel {
    margin: 3vh auto;
  }
  .points-modal .points-modal-body .fixture-list .fixture {
    align-items: flex-start;
    flex-direction: column;
  }
  .points-modal .points-modal-body .fixture-list .fixture .fixture-time {
    text-align: left;
  }
  .points-modal .points-modal-body .fixture-list .fixture .fixture-name {
    max-width: 160px;
  }
}

.figma-login-container {
  position: fixed;
  inset: 0;
  z-index: 1000;
  box-sizing: border-box;
}
.figma-login-container .login-background-image {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100dvh;
  padding: clamp(16px, 3vh, 32px) 16px;
  background: url("/assets/auth_bgImage-DHGdZzs4.svg") center/cover no-repeat;
  z-index: 0;
}
.figma-login-container .login-background-image .login-modal-container {
  position: relative;
  width: 100%;
  max-width: 500px;
  margin: 0;
  padding: 20px;
  padding-top: 28px;
  max-height: 90vh;
  overflow-y: auto;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.25);
  z-index: 1;
}
.figma-login-container .login-background-image .login-modal-container .auth-screen-back {
  position: absolute;
  top: 14px;
  left: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
  z-index: 2;
}
.figma-login-container .login-background-image .login-modal-container .auth-screen-back img {
  width: 20px;
  height: 20px;
  display: block;
}
.figma-login-container .login-background-image .login-modal-container .auth-screen-back:hover {
  background: rgba(0, 0, 0, 0.06);
}
.figma-login-container .login-background-image .login-modal-container .auth-screen-back:focus-visible {
  outline: 2px solid #2C2970;
  outline-offset: 2px;
}
.figma-login-container .login-background-image .login-modal-container .login-header {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.figma-login-container .login-background-image .login-modal-container .login-header .logo-container {
  margin-bottom: 0;
}
.figma-login-container .login-background-image .login-modal-container .login-header .logo-container .logo {
  width: 70px;
  height: 74px;
  object-fit: cover;
  border-radius: 0;
  box-shadow: none;
}
.figma-login-container .login-background-image .login-modal-container .login-header .app-name {
  font-family: "Inter-500";
  font-size: 18px;
  color: #000000;
  margin: 0;
}
.figma-login-container .login-background-image .login-modal-container .signin-title {
  font-family: "Inter-500";
  font-size: 24px;
  color: #000000;
  text-align: center;
  line-height: normal;
  margin: 10px;
}
.figma-login-container .login-background-image .login-modal-container .login-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0px 20px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
  justify-content: space-between;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .form-label {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  line-height: normal;
  margin: 0;
  display: flex;
  gap: 4px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .form-label .label-text {
  color: #4C4C4D;
  font-size: 14px;
  font-family: "Inter-200";
  text-align: center;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .form-label .email-text {
  color: #000000;
  font-family: "Inter-500";
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .otp-inputs-container {
  display: flex;
  gap: 20px;
  justify-content: space-between;
  margin-top: 10px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .otp-inputs-container .otp-input {
  width: 55px;
  height: 45px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 14px;
  background: #ffffff;
  font-size: 24px;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  color: rgba(76, 76, 77, 0.6);
  text-align: center;
  outline: none;
  transition: all 0.2s ease;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .otp-inputs-container .otp-input:focus {
  border-color: #7571CB;
  border-width: 1.5px;
  color: #7571CB;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .otp-inputs-container .otp-input.filled {
  color: rgba(76, 76, 77, 0.6);
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .otp-inputs-container .otp-input.active {
  border-color: #7571CB;
  border-width: 1.5px;
  color: #7571CB;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .otp-inputs-container .otp-input::placeholder {
  color: transparent;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper {
  border-radius: 4px;
  position: relative;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .form-input {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 16px;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  background: #ffffff;
  font-size: 14px;
  font-family: "Inter-500";
  color: #000000;
  outline: none;
  transition: border-color 0.2s ease;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .form-input::placeholder {
  color: rgba(76, 76, 77, 0.45);
  font-family: "Inter", sans-serif;
  font-weight: 400;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .form-input:focus {
  border-color: #201E52;
  background-color: #ffffff;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .form-input.error {
  border-color: #D71D0C;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper select.form-input {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%234C4C4D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 40px;
  cursor: pointer;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper select.form-input:hover {
  border-color: rgba(76, 76, 77, 0.4);
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper select.form-input option {
  padding: 10px;
  font-family: "Inter-500";
  color: #000000;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .phone-input-field {
  padding: 10px 45px;
  width: 100% !important;
  height: 45px;
  box-sizing: border-box;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .phone-input-field:focus {
  border-color: #201E52 !important;
  outline: none !important;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .phone-input-container {
  width: 100% !important;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .phone-input-container .flag-dropdown {
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-right: none;
  background: #ffffff;
  border-radius: 6px 0 0 6px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .password-toggle {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  color: rgba(76, 76, 77, 0.6);
  padding: 0;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .password-toggle:hover {
  color: #201E52;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .input-wrapper .password-toggle svg {
  width: 18px;
  height: 18px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .form-group .error-message {
  font-family: "Inter", sans-serif;
  font-size: 11px;
  color: #EF4444;
  line-height: normal;
  margin-top: 4px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 10px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container input[type=checkbox] {
  display: none;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container .checkmark {
  width: 16px;
  height: 16px;
  border: 1px solid #d0d5dd;
  border-radius: 4px;
  position: relative;
  background: #ffffff;
  transition: all 0.2s ease;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container .checkmark::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 8px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.2s ease;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container input[type=checkbox]:checked + .checkmark {
  background: #201E52;
  border-color: #201E52;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container input[type=checkbox]:checked + .checkmark::after {
  opacity: 1;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container .checkbox-label {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #000000;
  line-height: normal;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .checkbox-container:hover .checkmark {
  border-color: #201E52;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .forgot-links {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 272px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .forgot-links .forgot-link {
  background: none;
  border: none;
  font-family: "Inter", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #5753c0;
  cursor: pointer;
  padding: 0;
  text-decoration: none;
  line-height: normal;
}
.figma-login-container .login-background-image .login-modal-container .login-form .options-row .forgot-links .forgot-link:hover {
  color: #201E52;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
  text-align: center;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary,
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-secondary {
  height: 40px;
  border-radius: 6px;
  font-family: "Inter-500";
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  outline: none;
  font-size: 18px;
  line-height: normal;
  font-weight: 600;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary:focus,
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-secondary:focus {
  box-shadow: 0 0 0 3px rgba(67, 63, 172, 0.2);
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary:active,
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-secondary:active {
  transform: translateY(1px);
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary {
  background: #201E52;
  color: #ffffff;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary:hover {
  filter: brightness(0.9);
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-primary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-secondary {
  background: #FFFFFF;
  color: #201E52;
  border: 1px solid #201E52;
  font-weight: 600;
  font-size: 16px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-secondary:hover {
  background: rgba(32, 30, 82, 0.05);
}
.figma-login-container .login-background-image .login-modal-container .login-form .action-buttons .btn-secondary:active {
  background: rgba(32, 30, 82, 0.1);
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section .resend-timer {
  font-family: "Inter", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: rgba(76, 76, 77, 0.6);
  text-align: center;
  margin: 0;
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section .resend-timer .timer-text {
  color: rgba(76, 76, 77, 0.6);
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section .resend-timer .timer-count {
  font-family: "Inter", sans-serif;
  font-weight: 600;
  color: #7571CB;
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section .resend-button {
  background: none;
  border: none;
  font-family: "Inter", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #7571CB;
  cursor: pointer;
  text-decoration: underline;
  transition: color 0.2s ease;
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section .resend-button:hover {
  color: rgb(80.7216494845, 75.6701030928, 189.3298969072);
}
.figma-login-container .login-background-image .login-modal-container .login-form .resend-section .resend-button:focus {
  outline: 2px solid #7571CB;
  outline-offset: 2px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .enter-another-email-section {
  display: flex;
  justify-content: center;
  margin-top: 10px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .enter-another-email-section .enter-another-email-button {
  background: none;
  border: none;
  font-family: "Inter", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #000000;
  cursor: pointer;
  transition: color 0.2s ease;
  text-align: center;
}
.figma-login-container .login-background-image .login-modal-container .login-form .enter-another-email-section .enter-another-email-button:hover {
  color: #7571CB;
}
.figma-login-container .login-background-image .login-modal-container .login-form .enter-another-email-section .enter-another-email-button:focus {
  outline: 2px solid #7571CB;
  outline-offset: 2px;
}
.figma-login-container .login-background-image .login-modal-container .login-form .signup-section {
  text-align: center;
}
.figma-login-container .login-background-image .login-modal-container .login-form .signup-section .signup-text {
  font-family: "Inter-200";
  font-size: 14px;
  color: #000000;
  line-height: normal;
}
.figma-login-container .login-background-image .login-modal-container .login-form .signup-section .signup-text .signup-link {
  background: none;
  border: none;
  font-family: "Inter-200";
  font-size: 14px;
  color: #201E52;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
  transition: color 0.2s ease;
}
.figma-login-container .login-background-image .login-modal-container .login-form .signup-section .signup-text .signup-link:hover {
  color: #201E52;
}

@media (max-width: 768px) {
  .figma-login-container {
    padding: 15px;
  }
  .figma-login-container .login-modal-container {
    max-width: 450px;
    padding: 15px;
  }
  .figma-login-container .login-modal-container .login-form {
    padding: 0;
  }
  .figma-login-container .login-modal-container .login-form .action-buttons,
  .figma-login-container .login-modal-container .login-form .signup-section,
  .figma-login-container .login-modal-container .login-form .resend-section,
  .figma-login-container .login-modal-container .login-form .enter-another-email-section {
    width: 100%;
  }
  .figma-login-container .login-modal-container .login-form .options-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .figma-login-container .login-modal-container .login-form .options-row .forgot-links {
    width: 100%;
    justify-content: flex-start;
    gap: 20px;
  }
  .figma-login-container .login-modal-container .signin-title {
    font-size: 24px;
    margin-top: 15px;
  }
  .figma-login-container .login-modal-container .login-header .app-name {
    font-size: 18px;
  }
  .figma-login-container .login-modal-container .login-header .logo-container .logo {
    width: 60px;
    height: 64px;
  }
}
@media (max-width: 480px) {
  .figma-login-container {
    padding: 10px;
  }
  .figma-login-container .login-modal-container {
    max-width: 400px;
    padding: 10px;
  }
  .figma-login-container .login-modal-container .login-form {
    padding: 0;
  }
  .figma-login-container .login-modal-container .login-form .form-group {
    gap: 8px;
  }
  .figma-login-container .login-modal-container .login-form .form-group .form-label {
    font-size: 14px;
  }
  .figma-login-container .login-modal-container .login-form .form-group .otp-inputs-container {
    gap: 6px;
  }
  .figma-login-container .login-modal-container .login-form .form-group .otp-inputs-container .otp-input {
    width: 45px;
    height: 45px;
    font-size: 18px;
  }
  .figma-login-container .login-modal-container .login-form .form-group .input-wrapper .form-input {
    height: 42px;
    font-size: 13px;
  }
  .figma-login-container .login-modal-container .login-form .action-buttons {
    gap: 8px;
  }
  .figma-login-container .login-modal-container .login-form .action-buttons .btn-primary,
  .figma-login-container .login-modal-container .login-form .action-buttons .btn-secondary {
    height: 44px;
    font-size: 16px;
  }
  .figma-login-container .login-modal-container .login-form .action-buttons .btn-secondary {
    font-size: 14px;
  }
  .figma-login-container .login-modal-container .signin-title {
    font-size: 24px;
    margin-top: 10px;
  }
  .figma-login-container .login-modal-container .login-header .app-name {
    font-size: 16px;
  }
  .figma-login-container .login-modal-container .login-header .logo-container .logo {
    width: 50px;
    height: 54px;
  }
}
@media (max-width: 320px) {
  .figma-login-container {
    padding: 5px;
  }
  .figma-login-container .login-modal-container {
    max-width: 350px;
    padding: 8px;
  }
  .figma-login-container .login-modal-container .login-form .form-group .otp-inputs-container {
    gap: 4px;
  }
  .figma-login-container .login-modal-container .login-form .form-group .otp-inputs-container .otp-input {
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
  .figma-login-container .login-modal-container .login-form .action-buttons .btn-primary,
  .figma-login-container .login-modal-container .login-form .action-buttons .btn-secondary {
    height: 40px;
    font-size: 14px;
  }
  .figma-login-container .login-modal-container .signin-title {
    font-size: 20px;
    margin-top: 8px;
  }
  .figma-login-container .login-modal-container .login-header .app-name {
    font-size: 14px;
  }
  .figma-login-container .login-modal-container .login-header .logo-container .logo {
    width: 45px;
    height: 49px;
  }
}
.figma-login-container *:focus {
  outline: 2px solid #201E52;
  outline-offset: 2px;
}
.figma-login-container .form-input:focus,
.figma-login-container .btn-primary:focus,
.figma-login-container .btn-secondary:focus,
.figma-login-container .forgot-link:focus,
.figma-login-container .signup-link:focus,
.figma-login-container .password-toggle:focus {
  outline: none;
}

@keyframes loginModalSlideIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
.figma-login-container .login-modal-container {
  animation: loginModalSlideIn 0.3s ease-out;
}

.required-asterisk {
  color: #D71D0C;
  margin-left: 2px;
}

.checkbox-section {
  margin: 20px 0;
}
.checkbox-section .checkbox-container {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}
.checkbox-section .checkbox-container input[type=checkbox] {
  display: none;
}
.checkbox-section .checkbox-container .checkmark {
  width: 16px;
  height: 16px;
  border: 1px solid #d0d5dd;
  border-radius: 4px;
  position: relative;
  background: #ffffff;
  transition: all 0.2s ease;
  flex-shrink: 0;
  margin-top: 2px;
}
.checkbox-section .checkbox-container .checkmark::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 8px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.2s ease;
}
.checkbox-section .checkbox-container input[type=checkbox]:checked + .checkmark {
  background: #201E52;
  border-color: #201E52;
}
.checkbox-section .checkbox-container input[type=checkbox]:checked + .checkmark::after {
  opacity: 1;
}
.checkbox-section .checkbox-container .checkbox-label {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 14px;
  color: #000000;
  line-height: normal;
}
.checkbox-section .checkbox-container:hover .checkmark {
  border-color: #201E52;
}

.signin-link-section {
  text-align: center;
  margin-top: 10px;
}
.signin-link-section .signin-text {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  color: #000000;
  line-height: normal;
  margin: 0;
}
.signin-link-section .signin-text .signin-link {
  background: none;
  border: none;
  font-family: "Inter", sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #201E52;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
  margin-left: 4px;
  transition: color 0.2s ease;
}
.signin-link-section .signin-text .signin-link:hover {
  color: #201E52;
}

.main-statgpt-wrap {
  margin-top: 55px;
}

.statgpt-navbar {
  background: #ffffff;
  box-shadow: 0px 1px 4.2px 0px rgba(0, 0, 0, 0.12);
  width: 100%;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  position: fixed;
  top: 55px;
  left: 0;
  right: 0;
  z-index: 98;
}
.statgpt-navbar .statgpt-navbar-left {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  margin-left: 37px;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-back-button {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  transition: opacity 0.2s ease;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-back-button:hover {
  opacity: 0.7;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-back-button:focus {
  outline: 2px solid #201E52;
  outline-offset: 2px;
  border-radius: 4px;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-back-button img {
  width: 24px;
  height: 24px;
  display: block;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper .statgpt-icon-frame {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  position: relative;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper .statgpt-icon-frame::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000000;
  border-radius: 4px;
  opacity: 0.1;
}
.statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper .statgpt-title {
  font-family: "Inter-500";
  font-size: 20px;
  font-weight: 600;
  color: #000000;
  margin: 0;
  line-height: normal;
  text-align: center;
  white-space: nowrap;
}
.statgpt-navbar .statgpt-search-button {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 100px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 10px;
  margin-right: 10px;
  box-sizing: border-box;
  transition: background-color 0.2s ease, opacity 0.2s ease;
}
.statgpt-navbar .statgpt-search-button:hover {
  background: rgba(0, 0, 0, 0.05);
}
.statgpt-navbar .statgpt-search-button:active {
  opacity: 0.7;
}
.statgpt-navbar .statgpt-search-button:focus {
  outline: 2px solid #201E52;
  outline-offset: 2px;
}
.statgpt-navbar .statgpt-search-button img {
  width: 20px;
  height: 20px;
  display: block;
}

@media (max-width: 768px) {
  .statgpt-navbar {
    height: 48px;
    top: 55px;
  }
  .statgpt-navbar .statgpt-navbar-left {
    margin-left: 15px;
    gap: 8px;
    padding: 8px;
  }
  .statgpt-navbar .statgpt-navbar-left .statgpt-back-button {
    width: 20px;
    height: 20px;
  }
  .statgpt-navbar .statgpt-navbar-left .statgpt-back-button img {
    width: 20px;
    height: 20px;
  }
  .statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper {
    gap: 8px;
    padding: 8px;
  }
  .statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper .statgpt-icon-frame {
    width: 20px;
    height: 20px;
  }
  .statgpt-navbar .statgpt-navbar-left .statgpt-logo-wrapper .statgpt-title {
    font-size: 18px;
  }
  .statgpt-navbar .statgpt-search-button {
    width: 36px;
    height: 36px;
    padding: 8px;
    margin-right: 8px;
  }
  .statgpt-navbar .statgpt-search-button img {
    width: 18px;
    height: 18px;
  }
}
.statgpt-wrapper {
  width: 100%;
  height: calc(100vh - 111px);
  background: #ffffff;
  position: relative;
  overflow: hidden;
  margin-top: 111px;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.statgpt-wrapper::-webkit-scrollbar {
  display: none;
}
.statgpt-wrapper .statgpt-layout {
  display: flex;
  width: 100%;
  height: 100%;
  position: relative;
}
.statgpt-wrapper .statgpt-sidebar {
  position: fixed;
  left: 0;
  top: 111px;
  width: 94px;
  height: calc(100vh - 111px);
  background: rgba(67, 63, 172, 0.07);
  overflow: hidden;
  z-index: 1;
  transition: width 0.3s ease;
}
.statgpt-wrapper .statgpt-sidebar.open {
  width: 247px;
}
.statgpt-wrapper .statgpt-sidebar.closed {
  width: 94px;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-fab {
  position: absolute;
  left: 14px;
  top: 19px;
  background: rgba(67, 63, 172, 0.15);
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  overflow: hidden;
  z-index: 2;
  width: 219px;
  transition: width 0.3s ease;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-fab .statgpt-fab-state-layer {
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  width: 100%;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-fab .statgpt-fab-state-layer .statgpt-fab-icon {
  width: 20px;
  height: 20px;
  position: relative;
  flex-shrink: 0;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-fab .statgpt-fab-state-layer .statgpt-fab-icon img {
  width: 100%;
  height: 100%;
  display: block;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-fab .statgpt-fab-state-layer .statgpt-fab-text {
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.87);
  line-height: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}
.statgpt-wrapper .statgpt-sidebar.closed .statgpt-fab {
  width: 66px;
  justify-content: center;
}
.statgpt-wrapper .statgpt-sidebar.closed .statgpt-fab .statgpt-fab-state-layer {
  justify-content: center;
  gap: 0;
}
.statgpt-wrapper .statgpt-sidebar.closed .statgpt-fab .statgpt-fab-state-layer .statgpt-fab-text {
  display: none;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list {
  margin-top: 81px;
  padding: 0 14px;
  height: calc(100% - 81px);
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list::-webkit-scrollbar {
  width: 4px;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list::-webkit-scrollbar-track {
  background: transparent;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list::-webkit-scrollbar-thumb {
  background: rgba(67, 63, 172, 0.2);
  border-radius: 2px;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list::-webkit-scrollbar-thumb:hover {
  background: rgba(67, 63, 172, 0.3);
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list .statgpt-chat-item {
  background: rgba(67, 63, 172, 0.15);
  border-radius: 13px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
  border: none;
  min-height: auto;
  display: flex;
  align-items: center;
  margin-bottom: 0;
  width: 185px;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list .statgpt-chat-item:hover {
  background: rgba(67, 63, 172, 0.2);
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list .statgpt-chat-item.active {
  background: rgba(67, 63, 172, 0.25);
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list .statgpt-chat-item .statgpt-chat-item-content {
  width: 100%;
  overflow: hidden;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list .statgpt-chat-item .statgpt-chat-item-content .statgpt-chat-item-text {
  font-family: "Inter-500";
  font-size: 12px;
  font-weight: 500;
  color: #000000;
  margin: 0;
  line-height: 16px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}
.statgpt-wrapper .statgpt-sidebar .statgpt-chat-list .statgpt-chat-loading {
  padding: 12px;
  text-align: center;
  font-family: "Inter-500";
  font-size: 12px;
  color: rgba(76, 76, 77, 0.6);
}
.statgpt-wrapper .statgpt-sidebar-arrow {
  position: fixed;
  left: 237px;
  top: 146px;
  width: 20px;
  height: 21.252px;
  background: #ffffff;
  border: 1px solid #000000;
  border-radius: 12px;
  overflow: hidden;
  z-index: 3;
  transition: left 0.3s ease;
  cursor: pointer;
}
.statgpt-wrapper .statgpt-sidebar-arrow.closed {
  left: 84px;
}
.statgpt-wrapper .statgpt-sidebar-arrow .statgpt-arrow-container {
  position: absolute;
  left: 50%;
  top: calc(50% + 0.37px);
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.statgpt-wrapper .statgpt-sidebar-arrow .statgpt-arrow-container .statgpt-arrow-icon {
  width: 12px;
  height: 12px;
  flex: none;
  transition: transform 0.3s ease;
}
.statgpt-wrapper .statgpt-sidebar-arrow .statgpt-arrow-container .statgpt-arrow-icon img {
  width: 100%;
  height: 100%;
  display: block;
}
.statgpt-wrapper .statgpt-sidebar-arrow.closed .statgpt-arrow-container .statgpt-arrow-icon {
  transform: rotate(180deg);
}
.statgpt-wrapper .statgpt-content-section {
  flex: 1;
  width: 100%;
  height: 100%;
  background: #ffffff;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-left: 247px;
  overflow: hidden;
  justify-content: flex-start;
  padding-top: 0;
  height: calc(100vh - 111px);
  transition: padding-left 0.3s ease;
}
.statgpt-wrapper .statgpt-content-section.sidebar-closed {
  padding-left: 94px;
}
.statgpt-wrapper .statgpt-content-section.sidebar-open {
  padding-left: 247px;
}
.statgpt-wrapper .statgpt-welcome-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  width: 722px;
  margin-top: 15px;
  position: relative;
  z-index: 2;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-welcome-header {
  display: flex;
  flex-direction: column;
  gap: 11px;
  align-items: center;
  width: 357px;
  line-height: 0;
  white-space: nowrap;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-welcome-header .statgpt-welcome-title {
  font-family: "Inter-500";
  font-size: 24px;
  text-align: center;
  margin: 0;
  line-height: normal;
  background: linear-gradient(90deg, #433FAC 0%, #FF6B9D 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-welcome-header .statgpt-welcome-subtitle {
  font-family: "Inter-500";
  font-size: 26px;
  font-weight: 500;
  color: rgba(76, 76, 77, 0.4);
  margin: 0;
  line-height: 36.16px;
  text-align: center;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  margin-bottom: 50px;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card {
  background: #ffffff;
  border: 1px solid rgba(67, 63, 172, 0.17);
  border-radius: 21px;
  padding: 20px 10px;
  display: flex;
  gap: 16px;
  align-items: center;
  width: 355px;
  height: 66px;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.2s ease;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card:hover {
  border-color: rgba(67, 63, 172, 0.3);
  box-shadow: 0px 2px 8px rgba(67, 63, 172, 0.1);
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card .statgpt-question-icon-wrapper {
  background: rgba(67, 63, 172, 0.07);
  border-radius: 14px;
  padding: 9px;
  width: 45px;
  height: 45px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card .statgpt-question-icon-wrapper .statgpt-question-icon-mask {
  width: 100%;
  height: 100%;
  position: relative;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card .statgpt-question-icon-wrapper .statgpt-question-icon-mask .statgpt-question-icon {
  width: 100%;
  height: 100%;
  background: #201E52;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
}
.statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card .statgpt-question-text {
  font-family: "Inter-500";
  font-size: 16px;
  font-weight: 500;
  color: #4C4C4D;
  margin: 0;
  line-height: 20px;
  flex: 1;
}
.statgpt-wrapper .statgpt-background-batman {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}
.statgpt-wrapper .statgpt-background-batman img {
  width: 600px;
  height: 800px;
  max-width: 90vw;
  max-height: 90vh;
  opacity: 0.15;
  object-fit: contain;
  filter: grayscale(100%) brightness(1.2);
  display: block;
}
.statgpt-wrapper .statgpt-messages-container {
  width: 100%;
  max-width: 880px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0;
  margin-top: 20px;
  margin-bottom: 20px;
  box-sizing: border-box;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  max-height: calc(100vh - 300px);
  position: relative;
  z-index: 2;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.statgpt-wrapper .statgpt-messages-container::-webkit-scrollbar {
  display: none;
}
.statgpt-wrapper .statgpt-messages-container.show-scroll {
  -ms-overflow-style: scrollbar;
  scrollbar-width: auto;
}
.statgpt-wrapper .statgpt-messages-container.show-scroll::-webkit-scrollbar {
  display: block;
  width: auto;
}
.statgpt-wrapper .statgpt-messages-container .statgpt-messages-loading {
  padding: 12px;
  text-align: center;
  font-family: "Inter-500";
  font-size: 14px;
  color: rgba(76, 76, 77, 0.6);
}
.statgpt-wrapper .statgpt-loading-container {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
  width: 100%;
  max-width: 844px;
}
.statgpt-wrapper .statgpt-loading-container .statgpt-loading-text {
  font-family: "Inter-500";
  font-size: 16px;
  color: rgba(76, 76, 77, 0.6);
}
.statgpt-wrapper .statgpt-message-wrapper {
  max-width: 509px;
  width: fit-content;
  align-self: flex-end;
  margin-right: 0;
}
.statgpt-wrapper .statgpt-ai-message-wrapper {
  align-self: flex-start;
  max-width: calc(100% - 29px);
  width: fit-content;
  margin-left: 0;
}
.statgpt-wrapper .statgpt-ai-message-content {
  display: flex;
  flex-direction: column;
  gap: 9px;
  align-items: flex-start;
}
.statgpt-wrapper .statgpt-ai-message-bubble {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 0;
}
.statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-logo {
  width: 45px;
  height: 48px;
  flex-shrink: 0;
}
.statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-message-card {
  background: rgba(138, 163, 255, 0.04);
  border: 1px solid #8aa3ff;
  border-radius: 14px;
  padding: 18px;
  flex: 1;
  min-width: 0;
}
.statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-message-text {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  font-style: normal;
  color: #000000;
  margin: 0;
  line-height: 1.2;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.statgpt-wrapper .statgpt-ai-message-actions {
  margin-left: 53px;
}
.statgpt-wrapper .statgpt-copy-icon-button {
  background: none;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease;
}
.statgpt-wrapper .statgpt-copy-icon-button:hover {
  background-color: none;
}
.statgpt-wrapper .statgpt-copy-icon-button:active {
  opacity: 0.7;
}
.statgpt-wrapper .statgpt-copy-icon-button img {
  object-fit: contain;
}
.statgpt-wrapper .statgpt-message-card {
  background: rgba(138, 163, 255, 0.04);
  border: 1px solid #8aa3ff;
  border-radius: 16px;
  padding: 0;
  position: relative;
  min-height: 60px;
  display: flex;
  align-items: flex-start;
  box-sizing: border-box;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-avatar {
  width: 38px;
  height: 38px;
  border-radius: 26.583px;
  overflow: hidden;
  flex-shrink: 0;
  background: #201E52;
  position: absolute;
  left: 11px;
  top: 14px;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content {
  flex: 1;
  min-width: 0;
  padding: 20px 15px 10px 60px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 4px;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 8px;
  border: 1px solid rgba(138, 163, 255, 0.2);
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-icon {
  font-size: 24px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-info .statgpt-message-file-name {
  font-family: "Inter-200";
  font-size: 16px;
  font-weight: 600;
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-info .statgpt-message-file-type {
  font-family: "Inter-200";
  font-size: 12px;
  color: rgba(76, 76, 77, 0.6);
}
.statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-text {
  font-family: "Inter-200";
  font-size: 18px;
  font-style: normal;
  color: #000000;
  margin: 0;
  padding: 0;
  line-height: normal;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.statgpt-wrapper .statgpt-search-bar {
  position: sticky;
  bottom: 20px;
  align-self: center;
  width: 844px;
  max-width: calc(100% - 120px);
  min-height: 70px;
  background: #ffffff;
  border: 1px solid #201E52;
  border-radius: 24px;
  display: flex;
  flex-direction: column;
  padding: 11px 20px;
  box-sizing: border-box;
  z-index: 10;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
  margin-top: auto;
  margin-bottom: 20px;
  flex-shrink: 0;
  gap: 8px;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  max-height: 120px;
  overflow-y: auto;
  margin-bottom: 4px;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(67, 63, 172, 0.05);
  border: 1px solid rgba(67, 63, 172, 0.17);
  border-radius: 8px;
  max-width: 200px;
  position: relative;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card.statgpt-file-card-image {
  padding: 4px;
  max-width: 100px;
  max-height: 100px;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card.statgpt-file-card-uploading {
  opacity: 0.7;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-icon {
  font-size: 18px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  position: relative;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-image-preview {
  width: 100%;
  height: 100%;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.05);
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-image-preview .statgpt-file-card-loader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(67, 63, 172, 0.2);
  border-top-color: rgba(67, 63, 172, 0.8);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-name {
  flex: 1;
  font-size: 12px;
  color: rgba(67, 63, 172, 0.8);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-remove {
  width: 18px;
  height: 18px;
  border: none;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
  position: absolute;
  top: 4px;
  right: 4px;
  transition: opacity 0.2s ease, background 0.2s ease;
  z-index: 10;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-remove:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.8);
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-remove:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-remove img {
  width: 10px;
  height: 10px;
  display: block;
  filter: brightness(0) invert(1);
}
.statgpt-wrapper .statgpt-search-input-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 12px;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.statgpt-wrapper .statgpt-search-input-wrapper {
  display: flex;
  gap: 16px;
  align-items: center;
  flex: 1;
  min-width: 0;
  position: relative;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-button {
  width: 24px;
  height: 24px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
  transition: opacity 0.2s ease;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-button:hover {
  opacity: 0.7;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-button:active {
  opacity: 0.5;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-button img {
  width: 100%;
  height: 100%;
  display: block;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 0;
  background: #ffffff;
  border: 0.5px solid rgba(87, 83, 192, 0.19);
  border-radius: 8px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  min-width: 140px;
  z-index: 10;
  overflow: hidden;
  padding: 0;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option {
  padding: 10px 7px;
  border: none;
  background: transparent;
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 400;
  color: #181818;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.2s ease;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
  height: 40px;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option:hover {
  background: #F5F5F5;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option:active {
  background: rgba(67, 63, 172, 0.1);
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option.statgpt-media-option-active {
  background: #F5F5F5;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option .statgpt-media-option-icon {
  width: 27px;
  height: 27px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  flex-shrink: 0;
  box-sizing: border-box;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option .statgpt-media-option-icon img {
  width: 13px;
  height: 13px;
  display: block;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-media-options .statgpt-media-option .statgpt-media-option-text {
  font-family: "Inter-500";
  font-size: 14px;
  font-weight: 400;
  color: #181818;
  line-height: normal;
  flex: 1;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-search-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-family: "Inter-200";
  font-size: 18px;
  color: #000000;
  line-height: 0;
  min-width: 0;
}
.statgpt-wrapper .statgpt-search-input-wrapper .statgpt-search-input::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.statgpt-wrapper .statgpt-search-trailing {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
}
.statgpt-wrapper .statgpt-search-trailing .statgpt-mic-button {
  width: 48px;
  height: 48px;
  border: none;
  background: transparent;
  border-radius: 100px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  box-sizing: border-box;
  transition: background-color 0.2s ease;
}
.statgpt-wrapper .statgpt-search-trailing .statgpt-mic-button:hover {
  background: rgba(0, 0, 0, 0.05);
}
.statgpt-wrapper .statgpt-search-trailing .statgpt-mic-button:active {
  opacity: 0.7;
}
.statgpt-wrapper .statgpt-search-trailing .statgpt-mic-button .statgpt-mic-icon {
  position: relative;
  flex-shrink: 0;
}
.statgpt-wrapper .statgpt-search-trailing .statgpt-mic-button .statgpt-mic-icon img {
  display: block;
}
@media (max-width: 768px) {
  .statgpt-wrapper {
    min-height: calc(100vh - 48px);
  }
  .statgpt-wrapper .statgpt-sidebar {
    width: 60px;
    height: calc(100vh - 48px);
    top: 48px;
  }
  .statgpt-wrapper .statgpt-sidebar .statgpt-fab {
    left: 8px;
    top: 70px;
  }
  .statgpt-wrapper .statgpt-sidebar .statgpt-fab .statgpt-fab-state-layer {
    padding: 12px;
  }
  .statgpt-wrapper .statgpt-sidebar .statgpt-fab .statgpt-fab-state-layer .statgpt-fab-icon {
    width: 20px;
    height: 20px;
  }
  .statgpt-wrapper .statgpt-sidebar .statgpt-sidebar-arrow {
    left: 52px;
    top: 138px;
    width: 16px;
    height: 18px;
    z-index: 3;
  }
  .statgpt-wrapper .statgpt-sidebar .statgpt-sidebar-arrow .statgpt-arrow-container {
    width: 10px;
    height: 10px;
  }
  .statgpt-wrapper .statgpt-content-section {
    padding-left: 60px;
  }
  .statgpt-wrapper .statgpt-background-batman img {
    width: 400px;
    height: 600px;
    max-width: 80vw;
    max-height: 80vh;
    opacity: 0.12;
  }
  .statgpt-wrapper .statgpt-welcome-section {
    width: calc(100% - 80px);
    margin-top: 15px;
    gap: 24px;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-welcome-header {
    width: 100%;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-welcome-header .statgpt-welcome-title {
    font-size: 32px;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-welcome-header .statgpt-welcome-subtitle {
    font-size: 28px;
    line-height: 28px;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid {
    gap: 10px;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card {
    width: 100%;
    padding: 16px 8px;
    height: auto;
    min-height: 60px;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card .statgpt-question-icon-wrapper {
    width: 40px;
    height: 40px;
    padding: 8px;
  }
  .statgpt-wrapper .statgpt-welcome-section .statgpt-questions-grid .statgpt-question-card .statgpt-question-text {
    font-size: 14px;
    line-height: 18px;
  }
  .statgpt-wrapper .statgpt-messages-container {
    padding: 0;
    gap: 12px;
  }
  .statgpt-wrapper .statgpt-message-wrapper {
    max-width: calc(100% - 20px);
    margin-right: 0;
  }
  .statgpt-wrapper .statgpt-ai-message-wrapper {
    max-width: calc(100% - 20px);
    margin-left: 0;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-avatar {
    width: 32px;
    height: 32px;
    left: 10px;
    top: 10px;
    border-radius: 20px;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-content {
    padding: 10px 14px 14px 50px;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item {
    padding: 6px 10px;
    gap: 10px;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-icon {
    font-size: 20px;
    width: 28px;
    height: 28px;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-info .statgpt-message-file-name {
    font-size: 14px;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-files .statgpt-message-file-item .statgpt-message-file-info .statgpt-message-file-type {
    font-size: 11px;
  }
  .statgpt-wrapper .statgpt-message-card .statgpt-message-content .statgpt-message-text {
    font-size: 16px;
  }
  .statgpt-wrapper .statgpt-ai-message-content {
    gap: 8px;
  }
  .statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-logo {
    width: 36px;
    height: 38px;
  }
  .statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-message-card {
    padding: 14px;
  }
  .statgpt-wrapper .statgpt-ai-message-bubble .statgpt-ai-message-text {
    font-size: 14px;
  }
  .statgpt-wrapper .statgpt-ai-message-actions {
    margin-left: 48px;
  }
  .statgpt-wrapper .statgpt-copy-icon-button {
    width: 28px;
    height: 28px;
    padding: 8px;
  }
  .statgpt-wrapper .statgpt-copy-icon-button img {
    width: 16px;
    height: 16px;
  }
  .statgpt-wrapper .statgpt-search-bar {
    width: calc(100% - 40px);
    min-height: 60px;
    padding: 10px 16px;
    bottom: 15px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container {
    margin-bottom: 6px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card {
    padding: 5px 8px;
    max-width: 150px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-icon {
    font-size: 16px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-name {
    font-size: 11px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-file-cards-container .statgpt-file-card .statgpt-file-card-remove {
    width: 12px;
    height: 12px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-search-input-wrapper {
    gap: 12px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-search-input-wrapper .statgpt-media-button {
    width: 20px;
    height: 20px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-search-input-wrapper .statgpt-search-input {
    font-size: 16px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-search-trailing .statgpt-mic-button {
    width: 40px;
    height: 40px;
    padding: 6px;
  }
  .statgpt-wrapper .statgpt-search-bar .statgpt-search-trailing .statgpt-mic-button .statgpt-mic-icon {
    width: 20px;
    height: 20px;
  }
  .statgpt-wrapper .statgpt-background-silhouette {
    display: none;
  }
}

.footer {
  position: relative;
  background: url("/assets/footer_background-DjG1_m0b.svg") center center/cover no-repeat;
  padding: 20px 77px;
  overflow-x: hidden;
  overflow-y: hidden;
}
.footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(42, 39, 121) 0%, rgb(19, 17, 51) 100%);
  z-index: 1;
  pointer-events: none;
}
.footer .footer-content {
  max-width: 1600px;
  margin: 0 auto;
  width: 100%;
  position: relative;
  z-index: 2;
}
.footer .footer-top-divider {
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.29);
  flex-shrink: 0;
  margin: 20px 0;
  position: relative;
  z-index: 2;
}
.footer .footer-bg-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 446px;
  height: 473.5px;
  opacity: 0.025;
  pointer-events: none;
  z-index: 2;
}
.footer .footer-bg-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.footer .footer-top-section {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-bottom: 0;
}
.footer .footer-top-section .footer-brand {
  display: flex;
  gap: 7px;
  align-items: center;
}
.footer .footer-top-section .footer-brand .footer-logo {
  width: 86px;
  height: 93px;
  object-fit: contain;
}
.footer .footer-top-section .footer-brand .footer-brand-name {
  font-family: "Inter-800";
  font-weight: 800;
  font-style: italic;
  font-size: 48px;
  line-height: normal;
  text-align: center;
  color: #FFFFFF;
  margin: 0;
  letter-spacing: 0px;
}
.footer .footer-top-section .footer-description {
  max-width: 1190px;
  font-family: "Inter-500";
  font-weight: 400;
  font-style: italic;
  font-size: 16px;
  line-height: 120%;
  text-align: center;
  color: #E4E4E7;
  margin: 0;
}
.footer .footer-middle-section {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 77px;
  padding: 20px 0;
}
.footer .footer-middle-section .footer-left-content {
  display: flex;
  gap: 80px;
  align-items: flex-start;
  justify-content: center;
}
.footer .footer-middle-section .footer-left-content .footer-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 16px;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-section-title {
  font-family: "Inter-800";
  font-weight: 800;
  font-size: 18px;
  line-height: 24px;
  text-align: left;
  letter-spacing: -0.31px;
  color: #ffffff;
  text-transform: uppercase;
  margin: 0;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-title-underline {
  width: 60px;
  height: 3px;
  background-color: #ff2222;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-links {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-links .footer-link {
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  letter-spacing: 0px;
  color: #FFFFFF;
  text-decoration: none;
  text-transform: capitalize;
  transition: opacity 0.2s ease;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-links .footer-link:hover {
  opacity: 0.8;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info .footer-contact-item {
  font-family: "Inter-400";
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.15px;
  color: #FFFFFF;
  text-transform: uppercase;
  margin: 0;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info .footer-contact-email {
  font-family: "Inter-400";
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.15px;
  color: #FFFFFF;
  margin: 0;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info .footer-social-icons {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-top: 5px;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info .footer-social-icons .social-icon {
  width: 12px;
  height: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s ease;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info .footer-social-icons .social-icon img {
  object-fit: contain;
}
.footer .footer-middle-section .footer-left-content .footer-section .footer-contact-info .footer-social-icons .social-icon:hover {
  opacity: 0.8;
}
.footer .footer-middle-section .footer-left-content .footer-vertical-separator {
  width: 0;
  height: 25.5px;
  position: relative;
  flex-shrink: 0;
}
.footer .footer-middle-section .footer-left-content .footer-vertical-separator::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(90deg);
  width: 25.5px;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.3);
}
.footer .footer-middle-section .footer-app-stores {
  display: flex;
  flex-direction: row;
  gap: 20px;
  flex-shrink: 0;
}
.footer .footer-middle-section .footer-app-stores .app-store-button {
  display: block;
  height: 56px;
  cursor: pointer;
  transition: opacity 0.2s ease;
  border-radius: 10px;
  overflow: hidden;
}
.footer .footer-middle-section .footer-app-stores .app-store-button:hover {
  opacity: 0.8;
}
.footer .footer-middle-section .footer-app-stores .app-store-button .app-store-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.footer .footer-bottom-section-wrapper {
  position: relative;
  z-index: 2;
  width: 100%;
  margin: 20px 0 0;
  padding: 0;
}
.footer .footer-bottom-divider {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.16);
  margin: 0;
  border: none;
  top: 0;
}
.footer .footer-bottom-section {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0 0;
}
.footer .footer-bottom-section .footer-copyright {
  font-family: "Inter-400";
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.15px;
  color: #6A7282;
  margin: 0;
}
.footer .footer-bottom-section .footer-legal-separator {
  width: 1px;
  height: 20px;
  background-color: #aaaaaa;
  flex-shrink: 0;
}
.footer .footer-bottom-section .footer-legal-links {
  display: flex;
  gap: 16px;
  align-items: center;
  font-family: "Inter-400";
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.15px;
  color: #6A7282;
  margin: 0;
}
.footer .footer-bottom-section .footer-legal-links .footer-legal-link {
  color: #AAAAAA;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.footer .footer-bottom-section .footer-legal-links .footer-legal-link:hover {
  opacity: 0.8;
}
@media (max-width: 1200px) {
  .footer {
    padding: 20px 40px;
  }
  .footer .footer-middle-section {
    flex-direction: column;
    gap: 30px;
  }
  .footer .footer-middle-section .footer-left-content {
    width: 100%;
    justify-content: space-between;
  }
  .footer .footer-middle-section .footer-app-stores {
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px;
  }
}
@media (max-width: 768px) {
  .footer {
    padding: 20px 24px;
  }
  .footer .footer-top-section .footer-brand .footer-logo {
    width: 35px;
    height: 38px;
  }
  .footer .footer-top-section .footer-brand .footer-brand-name {
    font-size: 20px;
  }
  .footer .footer-top-section .footer-description {
    font-size: 9px;
    padding: 0 10px;
  }
  .footer .footer-middle-section .footer-left-content {
    flex-direction: column;
    gap: 30px;
  }
  .footer .footer-middle-section .footer-left-content .footer-vertical-separator {
    display: none;
  }
  .footer .footer-middle-section .footer-app-stores {
    width: 100%;
    max-width: 180px;
  }
  .footer .footer-bottom-section {
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }
  .footer .footer-bottom-section .footer-legal-links {
    flex-direction: column;
    gap: 8px;
  }
}

.my-team {
  height: 100vh;
  width: 100%;
  min-height: calc(100vh - 120px);
  background-repeat: repeat;
  background-size: auto;
  background-position: center;
  background-color: #F5F5F5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.myteam-container {
  top: 30px;
  display: flex;
  flex-direction: column;
  position: relative;
  height: 98vh;
  width: 100%;
  background-color: #FFFFFF;
  border-radius: 9px;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  max-width: 1512px;
  margin: 54px auto;
  padding: 28px 38px;
  box-sizing: border-box;
}
.myteam-container--with-list {
  justify-content: flex-start;
  align-items: stretch;
}

.myteam-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  font-size: 16px;
  color: rgba(76, 76, 77, 0.8980392157);
}

.myteam-empty-state {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 416px;
}

.myteam-empty-illustration .myteam-empty-logo {
  width: 100%;
  height: 100%;
  opacity: 1;
}

.myteam-empty-message {
  font-size: 20px;
  color: rgba(76, 76, 77, 0.8980392157);
  margin: 0;
  line-height: 100%;
  font-weight: 500;
  font-family: "Inter-500";
  max-width: 400px;
}

.myteam-empty-cta {
  border: 1px solid #7571CB;
  background: rgba(117, 113, 203, 0.0705882353);
  color: #7571CB;
  padding: 10px 32px;
  border-radius: 9px;
  font-size: 20px;
  width: 100%;
  line-height: 100%;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myteam-empty-cta:hover {
  opacity: 0.9;
}

.myteam-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.myteam-list-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
}

.myteam-list-title {
  font-size: 24px;
  font-family: "Inter-500";
  color: #000000;
  line-height: 100%;
  letter-spacing: 0px;
  margin: 0;
}

.myteam-create-btn {
  background: #201E52;
  color: #ffffff;
  border: none;
  padding: 15px 22px;
  border-radius: 7px;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myteam-create-btn:hover {
  opacity: 0.9;
}

.myteam-team-grid-wrap {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.myteam-team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  border-top-left-radius: 14px;
}

.myteam-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 16px 0;
}

.myteam-pagination-info {
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: 0px;
  color: #6b7280;
  margin-right: 8px;
}

.myteam-pagination-btn {
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.myteam-pagination-btn:hover:not(:disabled) {
  background: #f9fafb;
  border-color: #9ca3af;
}
.myteam-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.myteam-pagination-pages {
  display: flex;
  align-items: center;
  gap: 4px;
}

.myteam-pagination-page {
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.myteam-pagination-page:hover {
  background: #f9fafb;
  border-color: #9ca3af;
}
.myteam-pagination-page.active {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}

.myteam-pagination-ellipsis {
  padding: 0 8px;
  font-size: 14px;
  color: #6b7280;
}

.myteam-team-card {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 44px 32px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.1411764706);
  cursor: pointer;
  transition: box-shadow 0.2s;
}
.myteam-team-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.myteam-team-card-logo {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: contain;
  background: #f3f4f6;
}

.myteam-team-card-info {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.myteam-team-card-name {
  font-size: 20px;
  font-weight: 500;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-700";
  color: rgba(0, 0, 0, 0.8196078431);
}

.myteam-team-card-id {
  font-size: 14px;
  color: #4C4C4D;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  font-weight: 500;
}

.myteam-team-card-id-value {
  font-size: 14px;
  color: rgba(76, 76, 77, 0.6);
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  font-weight: 500;
  font-style: italic;
}

.myteam-team-detail-id-value {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-500";
  font-weight: 500;
  font-style: italic;
}

.create-team-shell-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(2px);
  opacity: 0;
  animation: create-team-modal-fade-in 160ms ease forwards;
}

.create-team-shell-content {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(92vw, 1150px);
  max-height: 86vh;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  outline: none;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 44px;
  opacity: 0;
  animation: create-team-modal-zoom-in 180ms ease forwards;
  padding: 44px 34px 37px;
}

.create-team-shell-header {
  display: flex;
  justify-content: center;
}

.create-team-shell-title {
  font-size: 18px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  color: #000000;
  text-align: center;
}

.create-team-shell-body {
  overflow: visible;
}

.create-team-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.create-team-row {
  display: flex;
  align-items: flex-end;
  gap: 14px;
  width: 100%;
  flex-wrap: wrap;
}

.create-team-field {
  --create-team-control-height: 41px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.create-team-field label {
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  line-height: 100%;
  color: #000000;
}
.create-team-field label .required {
  color: #D8252D;
  font-family: "Inter-500";
  font-size: 16px;
  font-weight: 500;
  line-height: 100%;
}
.create-team-field input, .create-team-field textarea {
  width: 100%;
  border: 1px solid #d9d9d9;
  font-size: 14px;
  line-height: 100%;
  color: #000000;
  background: #ffffff;
  box-sizing: border-box;
}
.create-team-field input::placeholder, .create-team-field textarea::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-family: "Inter-400";
  font-size: 14px;
  font-weight: 400;
  line-height: 100%;
}
.create-team-field input {
  height: var(--create-team-control-height);
  padding: 0 16px;
  border-radius: 9px;
}
.create-team-field textarea {
  padding: 7px 10px;
  border-radius: 3px;
  resize: none;
  min-height: 84px;
  padding-top: 7px;
}

.create-team-field-image,
.create-team-field-compact {
  flex: 1 1 0;
}

.create-team-image-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: var(--create-team-control-height);
  padding: 0 16px;
  border: 1px solid #cfcfcf;
  border-radius: 9px;
  background: #fdfdfd;
  box-sizing: border-box;
}
.create-team-image-input input {
  flex: 1;
  border: none;
  border-radius: 0;
  padding: 0;
  background: transparent;
  font-size: 14px;
  font-family: "Inter-400";
  color: rgba(76, 76, 77, 0.6);
}
.create-team-image-input input::placeholder {
  color: rgba(76, 76, 77, 0.6);
  font-style: italic;
}
.create-team-image-input input:focus {
  outline: none;
  box-shadow: none;
}

.create-team-file-input {
  border: none;
  outline: none;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
  margin: 0;
  display: none;
}

.create-team-upload-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 7.5px 8px;
  background: #ececec;
  border: 1px solid #d6d6d6;
  border-radius: 7px;
  font-size: 14px;
  font-weight: 400;
  font-family: "Inter-400";
  line-height: 100%;
  color: rgba(0, 0, 0, 0.6117647059);
  cursor: pointer;
}
.create-team-upload-btn .create-team-upload-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(0, 0, 0, 0.6117647059);
}
.create-team-upload-btn svg {
  width: 16px;
  height: 16px;
  display: block;
}

.create-team-toggle {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 0;
}
.create-team-toggle .create-team-toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.create-team-toggle .create-team-toggle-desc {
  font-size: 10px;
  line-height: 1.2;
  color: #8e8e8e;
  margin: 0;
}

.create-team-switch {
  width: 48px;
  height: 24px;
  background: #CCCCCC;
  border: none;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  transition: background 0.2s ease;
}
.create-team-switch.on {
  background: #201E52;
}
.create-team-switch .create-team-switch-slider {
  position: absolute;
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  top: 2px;
  left: 0px;
  transition: transform 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.create-team-switch.on .create-team-switch-slider {
  transform: translateX(20px);
}

.create-team-footer {
  padding-top: 4px;
}

.create-team-submit {
  width: 100%;
  padding: 16px 16px;
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  cursor: pointer;
}
.create-team-submit:hover {
  opacity: 0.95;
}

@keyframes create-team-modal-fade-in {
  to {
    opacity: 1;
  }
}
@keyframes create-team-modal-zoom-in {
  from {
    transform: translate(-50%, -50%) scale(0.96);
    opacity: 0;
  }
  to {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
}
@media (max-width: 768px) {
  .create-team-shell-header {
    padding: 18px 16px 12px;
  }
  .create-team-shell-title {
    font-size: 22px;
  }
  .create-team-shell-body {
    padding: 0 16px 16px;
  }
  .create-team-row {
    flex-direction: column;
    align-items: stretch;
  }
  .create-team-field-image,
  .create-team-field-compact {
    flex: 1 1 auto;
    width: 100%;
  }
  .create-team-toggle {
    align-items: flex-start;
  }
}
.app-dialog-content.team-created-success-dialog .app-dialog-body {
  padding: 0 32px 32px;
}

.team-created-success {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 0 0;
  max-width: 100%;
  font-family: "Inter-200", Inter, sans-serif;
}

.team-created-success-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  background: #f5f0e6;
  border-radius: 50%;
  margin-bottom: 20px;
  flex-shrink: 0;
}

.team-created-success-icon {
  width: 36px;
  height: 36px;
}

.team-created-success-title {
  font-family: "Inter-700", Inter, sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 8px;
}

.team-created-success-message {
  font-family: "Inter-200", Inter, sans-serif;
  font-size: 14px;
  color: #6b7280;
  margin: 0 0 28px;
  line-height: 1.5;
  text-align: center;
}
.team-created-success-message strong {
  font-family: "Inter-700", Inter, sans-serif;
  font-weight: 700;
  color: #111827;
}

.team-created-invite {
  display: flex;
  flex-direction: column;
  margin-bottom: 28px;
  width: 100%;
  text-align: left;
}
.team-created-invite h3 {
  font-family: "Inter-700", Inter, sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #111827;
  margin: 0 0 12px;
  text-align: center;
}

.team-created-invite-qr {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
}
.team-created-invite-qr h3 {
  align-self: stretch;
}

.team-created-qr-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 120px;
  background: #f3f4f6;
  border-radius: 8px;
  color: #9ca3af;
  font-size: 12px;
  font-family: "Inter-200", Inter, sans-serif;
  margin-bottom: 8px;
}

.team-created-qr-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  background: #ffffff;
  border-radius: 8px;
  margin-bottom: 16px;
}
.team-created-qr-wrapper svg {
  display: block;
}

.team-created-share-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  align-self: stretch;
  width: 100%;
  padding: 14px 24px;
  border: none;
  border-radius: 8px;
  font-family: "Inter-500", Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
  cursor: pointer;
  transition: background 0.15s;
}
.team-created-share-btn img {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.team-created-link-field {
  display: flex;
  align-items: center;
  width: 100%;
  border: none;
  border-radius: 8px;
  overflow: hidden;
}
.team-created-link-field .team-created-link-input {
  flex: 1;
  min-width: 0;
  padding: 14px 16px;
  border: none;
  background: transparent;
  font-family: "Inter-200", Inter, sans-serif;
  font-size: 13px;
  color: #4b5563;
}
.team-created-link-field .team-created-link-input:focus {
  outline: none;
}
.team-created-link-field .team-created-copy-btn {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 16px;
  background: transparent;
  border: none;
  cursor: pointer;
}
.team-created-link-field .team-created-copy-btn img {
  width: 20px;
  height: 20px;
  display: block;
  opacity: 0.8;
}
.team-created-link-field .team-created-copy-btn:hover img {
  opacity: 1;
}

.team-created-copied {
  font-family: "Inter-200", Inter, sans-serif;
  font-size: 12px;
  color: #107E0C;
  display: block;
  margin-top: 8px;
}

.team-created-footer {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin-top: 28px;
  width: 100%;
}

.team-created-done-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 16px;
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-family: "Inter-700", Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: opacity 0.15s;
}
.team-created-done-btn:hover {
  opacity: 0.95;
}

.my-team-detail {
  min-height: calc(100vh - 120px);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px;
  background-color: #f5f5f5;
  background-image: url("/assets/my_team_bg-CBLTPqZ5.png");
  background-repeat: repeat;
  background-size: auto;
  box-sizing: border-box;
}

.myteam-detail-card {
  width: 100%;
  max-width: 1512px;
  border-radius: 9px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 60px;
}

.myteam-container-body {
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 16px 24px !important;
  background-color: #ffffff !important;
  border-radius: 9px !important;
  flex: 1;
  min-height: 400px;
  top: auto;
  height: auto;
}

.myteam-detail-header {
  border-radius: 20px 20px 0px 0px !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #201E52;
  color: #ffffff;
  padding: 24px 18px;
  flex-shrink: 0;
}

.myteam-detail-header-left {
  display: flex;
  align-items: center;
  gap: 16px;
}

.myteam-detail-header-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.myteam-detail-back {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  display: flex;
}
.myteam-detail-back img {
  width: 24px;
  height: 24px;
  filter: brightness(0) invert(1);
}

.myteam-detail-name {
  font-size: 24px;
  font-family: "Inter-500";
  font-weight: 500;
  margin: 0;
  color: #FFFFFF;
  line-height: 100%;
}

.myteam-detail-id {
  font-size: 14px;
  color: #FFFFFF;
  line-height: 100%;
  font-family: "Inter-500";
  font-weight: 500;
}

.myteam-detail-header-right {
  display: flex;
  gap: 10px;
  align-items: center;
}

.myteam-detail-share,
.myteam-detail-edit {
  padding: 8px 16px;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 8px;
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
}
.myteam-detail-share img,
.myteam-detail-edit img {
  width: 16px;
  height: 16px;
  filter: brightness(0) invert(1);
}

.myteam-detail-tabs-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e5e7eb;
}

.myteam-detail-tabs {
  display: flex;
  gap: 32px;
}

.myteam-detail-tab {
  background: none;
  border: none;
  font-size: 16px;
  font-weight: 500;
  font-family: "Inter-600";
  color: rgba(76, 76, 77, 0.6);
  cursor: pointer;
  padding: 0;
  padding-bottom: 9px;
}
.myteam-detail-tab.active {
  color: #2C2970;
  border-bottom: 2.5px solid #2C2970;
}

.myteam-tab-empty {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.myteam-add-player-top,
.myteam-join-tournament-top {
  position: absolute;
  top: 35px;
  right: 0;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 18px;
  font-family: "Inter-500";
  line-height: 100%;
  letter-spacing: 0px;
  color: #FFFFFF;
  font-weight: 500;
  cursor: pointer;
  border: none;
  display: flex;
  align-items: center;
  gap: 6px;
}

.myteam-add-player-top {
  background: #201E52;
  color: #ffffff;
}
.myteam-add-player-top:hover {
  opacity: 0.95;
}

.myteam-join-tournament-top {
  background: #201E52;
  color: #ffffff;
}
.myteam-join-tournament-top:hover {
  opacity: 0.95;
}

.myteam-empty-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 32px;
  text-align: center;
  padding: 120px 24px;
}

.myteam-empty-illu {
  max-width: 415px;
  height: auto;
  object-fit: contain;
}

.myteam-empty-title {
  font-family: "Inter-500";
  font-size: 20px;
  font-weight: 500;
  color: rgba(76, 76, 77, 0.8980392157);
  margin: 0;
}

.myteam-empty-cta-primary {
  width: 100%;
  max-width: 415px;
  padding: 10px 32px;
  background: rgba(117, 113, 203, 0.0705882353);
  color: #7571CB;
  border: 1px solid #7571CB;
  border-radius: 9px;
  font-size: 20px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myteam-empty-cta-primary:hover {
  opacity: 0.95;
}

.myteam-empty-cta-secondary {
  padding: 10px 24px;
  border: 2px solid #9b7ede;
  background: #ffffff;
  color: #9b7ede;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myteam-empty-cta-secondary:hover {
  opacity: 0.9;
}

.myteam-tab-with-content {
  position: relative;
}

.myteam-tournament-context-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 12px;
}

.myteam-tournament-context-title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: inherit;
}

.myteam-view-all-members {
  padding: 9px 12px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #201E52;
  background: transparent;
  color: #201E52;
  border-radius: 6px;
  cursor: pointer;
}
.myteam-view-all-members:hover {
  background: #201E52;
  color: #ffffff;
}

.myteam-members-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(208px, 1fr));
  gap: 16px;
  margin-top: 110px;
}

.myteam-member-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  padding-bottom: 12px;
}

.myteam-member-card-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 8px 10px;
  z-index: 1;
  pointer-events: none;
}
.myteam-member-card-top > * {
  pointer-events: auto;
}

.myteam-member-badges {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}

.myteam-member-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #583b8d;
}
.myteam-member-badge .myteam-badge-img {
  width: 14px;
  height: 14px;
  filter: brightness(0) invert(1);
}

.myteam-member-role-icons {
  display: flex;
  gap: 4px;
  align-items: center;
}

.myteam-member-role-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  object-fit: contain;
  display: block;
}

.myteam-member-menu-wrap {
  position: relative;
}

.myteam-member-menu {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 16px;
  color: #6b7280;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.myteam-member-menu:hover {
  color: #374151;
}

.myteam-member-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 4px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  padding: 4px;
  min-width: 120px;
  z-index: 10;
}

.myteam-member-dropdown-remove {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 12px;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 14px;
  color: #dc2626;
  font-family: "Inter-500";
}
.myteam-member-dropdown-remove:hover {
  background: #fef2f2;
}
.myteam-member-dropdown-remove svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.myteam-member-avatar-wrap {
  width: 100%;
  aspect-ratio: 1;
  min-height: 120px;
  background: #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
}

.myteam-member-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.myteam-member-info {
  padding: 12px 10px 0;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.myteam-member-name {
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #111827;
  line-height: 1.3;
}

.myteam-member-role {
  font-size: 12px;
  color: #6b7280;
  font-family: "Inter-500";
}

.myteam-tournaments-grid {
  width: 100%;
  margin-top: 110px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(256px, 1fr));
  gap: 8px;
}

.myteam-tournament-card {
  position: relative;
  border-radius: 1px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}
.myteam-tournament-card--clickable {
  cursor: pointer;
  transition: box-shadow 0.2s;
}
.myteam-tournament-card--clickable:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.myteam-tournament-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  font-size: 14px;
  font-weight: 500;
  font-style: italic;
  padding: 10px 20px;
  border-radius: 24px;
  letter-spacing: 0.02em;
}
.myteam-tournament-badge.pending {
  background: #F77D01;
  color: #ffffff;
}

.myteam-tournament-card-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  position: relative;
  background: linear-gradient(90deg, #5753C0 0%, #201E52 100%);
  padding: 10px;
  text-align: center;
  min-height: 120px;
}

.myteam-tournament-name {
  position: relative;
  z-index: 1;
  font-size: 16px;
  font-weight: 700;
  font-family: "Inter-700";
  font-style: italic;
  margin: 0;
  line-height: 1.25;
  color: #ffffff;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.myteam-tournament-dates {
  position: relative;
  z-index: 1;
  display: block;
  font-size: 20px;
  font-family: "Inter-400";
  font-weight: 400;
  color: #ffffff;
  margin: 0;
  line-height: 100%;
  letter-spacing: 0px;
}

.myteam-tournament-card-footer {
  background: #ffffff;
  padding: 5px;
  display: flex;
  justify-content: center;
  background: #F0F0F0;
  align-items: center;
}

.myteam-tournament-location {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 500;
  font-family: "Inter-500";
  line-height: 100%;
  letter-spacing: 0px;
  color: #000;
}
.myteam-tournament-location img {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  filter: none;
  opacity: 1;
}

.myteam-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  padding: 24px 40px;
  box-sizing: border-box;
  animation: myteam-modal-fade-in 160ms ease forwards;
}

.myteam-modal-content {
  padding: 24px 40px;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  max-width: 890px;
  width: 100%;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  gap: 16px;
  animation: myteam-modal-zoom-in 180ms ease forwards;
}

.myteam-modal-content {
  padding-left: 24px;
  padding-right: 24px;
}

.search-tournament-dialog {
  padding: 36px 40px 12px;
}

.myteam-modal-title {
  font-size: 24px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #000000;
  margin: 0;
}

.myteam-modal-body {
  flex: 1 1 auto;
  overflow: auto;
}

.myteam-modal-footer {
  padding: 16px 24px 20px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

@keyframes myteam-modal-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes myteam-modal-zoom-in {
  from {
    transform: scale(0.96);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
.search-player-modal {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.search-player-input-row {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.search-player-input {
  width: 100%;
  padding: 14.5px 16px;
  border: 1px solid #D9D5D5;
  border-radius: 4px;
  font-size: 16px;
  font-family: "Inter-500";
  color: #000000;
  box-sizing: border-box;
  line-height: 100%;
}
.search-player-input::placeholder {
  color: #000000;
}

.search-player-footer {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.search-player-add-btn {
  padding: 15.5px 37px;
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  cursor: pointer;
}
.search-player-add-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.search-player-add-btn:hover:not(:disabled) {
  opacity: 0.95;
}

.search-player-results {
  max-height: 260px;
  overflow-y: auto;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
}

.search-player-result-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 16px;
  cursor: pointer;
  border-bottom: 1px solid rgba(76, 76, 77, 0.2509803922);
}
.search-player-result-row:last-child {
  border-bottom: none;
}
.search-player-result-row:hover {
  background: #f9fafb;
}

.search-player-result-name {
  font-size: 16px;
  font-family: "Inter-600";
  color: #000000;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0px;
}

.search-player-checkbox {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.search-player-checkbox input {
  width: 18px;
  height: 18px;
  min-width: 18px;
  cursor: pointer;
  accent-color: #201E52;
}

.search-player-loading,
.search-player-no-results {
  padding: 16px;
  font-size: 14px;
  color: rgba(76, 76, 77, 0.8980392157);
}

.search-tournament-modal {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.search-tournament-input-row {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.search-tournament-input {
  width: 100%;
  padding: 14.5px 16px;
  background: #ffffff;
  border: 1px solid #D9D5D5;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 500;
  line-height: 100%;
  letter-spacing: 0px;
  font-style: italic;
  font-family: "Inter-500";
  color: #000000;
  box-sizing: border-box;
}
.search-tournament-input::placeholder {
  color: #4c4c4d;
}

.search-tournament-footer {
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.search-tournament-join-btn {
  padding: 10px 24px;
  background: #201e52;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  font-family: "Inter-500";
  cursor: pointer;
}
.search-tournament-join-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.search-tournament-join-btn:hover:not(:disabled) {
  opacity: 0.95;
}

.search-tournament-results {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 280px;
  overflow-y: auto;
  width: 100%;
}

.search-tournament-result-card {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  min-width: 0;
  padding: 14px 30px;
  background-color: #201e52;
  border-radius: 8px;
  cursor: pointer;
  box-sizing: border-box;
  transition: filter 0.15s ease, box-shadow 0.15s ease;
}
.search-tournament-result-card:hover {
  filter: brightness(1.08);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.search-tournament-result-card.selected {
  outline: 2px solid rgba(255, 255, 255, 0.6);
  outline-offset: 2px;
}
.search-tournament-result-card .search-tournament-card-name {
  font-size: 16px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #ffffff;
  line-height: 20px;
  letter-spacing: 0.15px;
}
.search-tournament-result-card .search-tournament-card-organizer {
  font-size: 13px;
  font-style: italic;
  font-weight: 500;
  font-family: "Inter-500";
  letter-spacing: 0px;
  color: rgba(255, 255, 255, 0.8588235294);
  line-height: 100%;
}

.search-tournament-loading,
.search-tournament-no-results {
  font-size: 14px;
  color: #6b7280;
  margin: 0;
}

.app-dialog-content.select-division-dialog {
  max-width: 500px;
  padding: 36px 40px 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.app-dialog-content.select-division-dialog .app-dialog-header {
  justify-content: center;
}
.app-dialog-content.select-division-dialog .app-dialog-title {
  text-align: center;
  color: #000000;
  font-family: "Inter-600";
  font-weight: 600;
  font-size: 24px;
  line-height: 100%;
  letter-spacing: 0px;
  margin: 0;
}
.app-dialog-content.select-division-dialog .app-dialog-body {
  overflow: visible;
}

.select-division-group-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin: 0 auto;
  overflow: visible;
}

.select-division-loading,
.select-division-no-divisions {
  padding: 16px 0;
  font-size: 14px;
  color: rgba(76, 76, 77, 0.8980392157);
}

.select-division-field {
  width: 100%;
}

.division-select {
  position: relative;
  width: 100%;
}
.division-select .division-select-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 14px 12px 14px;
  background: #F0F0F0;
  border: 1px solid #D0D0D0;
  border-radius: 8px;
  font-family: "Inter-500", Inter, sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0;
  color: #333;
  text-align: center;
  text-transform: capitalize;
  cursor: pointer;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.division-select .division-select-trigger.placeholder .division-select-value {
  color: #AAAAAA;
}
.division-select .division-select-trigger.open {
  border-color: #aaa;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06);
}
.division-select .division-select-trigger:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.division-select .division-select-trigger .division-select-value {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
}
.division-select .division-select-trigger .division-select-chevron {
  flex-shrink: 0;
  color: #555;
  transform: rotate(0deg);
  transition: transform 0.2s;
}
.division-select .division-select-trigger.open .division-select-chevron {
  transform: rotate(180deg);
}
.division-select .division-select-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  z-index: 100;
  margin: 0;
  padding: 6px 0;
  list-style: none;
  background: #fff;
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  max-height: 240px;
  overflow-y: auto;
}
.division-select .division-select-option {
  padding: 12px 16px;
  font-family: "Inter-200", Inter, sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: -0.4px;
  color: #333;
  cursor: pointer;
  transition: background 0.1s, color 0.1s;
}
.division-select .division-select-option:hover {
  background: #201E52;
  color: #fff;
}
.division-select .division-select-option:first-child {
  color: #AAAAAA;
}
.division-select .division-select-option:first-child:hover {
  color: #fff;
}

.select-division-footer {
  width: 100%;
  margin-top: 8px;
}

.select-division-submit {
  width: 100%;
  padding: 16px;
  background: #808080;
  color: #ffffff;
  margin-top: 10px;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  font-weight: 700;
  cursor: not-allowed;
  transition: background 0.2s;
}
.select-division-submit.active {
  background: #201E52;
  cursor: pointer;
}

.my-leagues {
  width: 100%;
  min-height: calc(100vh - 120px);
  background-color: #f5f5f5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-bottom: 48px;
}

.myleagues-container {
  top: 30px;
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 400px;
  width: 100%;
  background-color: #ffffff;
  border-radius: 9px;
  max-width: 1512px;
  margin: 54px auto;
  padding: 28px 38px;
  box-sizing: border-box;
}

.myleagues-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 21px;
}

.myleagues-header-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.myleagues-title {
  font-size: 28px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(0, 0, 0, 0.8980392157);
  line-height: 120%;
  letter-spacing: 0px;
  margin: 0;
}

.myleagues-subtitle {
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.6);
  line-height: 120%;
  letter-spacing: 1%;
  margin: 0;
}

.myleagues-create-btn {
  display: flex;
  align-items: center;
  gap: 13px;
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
  border: none;
  padding: 15px 11.5px;
  border-radius: 7px;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myleagues-create-btn img {
  width: 24px;
  height: 24px;
  filter: brightness(0) invert(1);
}
.myleagues-create-btn:hover {
  opacity: 0.9;
}

.myleagues-tabs {
  display: flex;
  gap: 12px;
}

.myleagues-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11.5px 21px;
  background: #f0f0f0;
  border: 1px solid rgba(44, 41, 112, 0.2);
  border-radius: 6px;
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.6);
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.myleagues-tab.active {
  background: linear-gradient(180deg, #2C2970 0%, #201E52 100%);
  color: #ffffff;
}
.myleagues-tab:hover:not(.active) {
  background: #e5e5e5;
}
.myleagues-tab .myleagues-tab-icon {
  flex-shrink: 0;
}

.myleagues-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  min-height: 300px;
  width: 100%;
}
.myleagues-content.myleagues-content-empty {
  margin-top: 98.5px;
  justify-content: center;
  align-items: center;
}

.myleagues-empty-state {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 416px;
}

.myleagues-empty-illustration {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 784px;
}

.myleagues-empty-image {
  width: 100%;
  max-width: 784px;
  height: auto;
  object-fit: contain;
}

.myleagues-empty-message {
  font-size: 20px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.8980392157);
  margin: 8px 0 0 0;
  line-height: 120%;
}

.myleagues-empty-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #201e52;
  color: #ffffff;
  border: none;
  padding: 12px 24px;
  border-radius: 7px;
  font-size: 16px;
  font-family: "Inter-500";
  font-weight: 500;
  cursor: pointer;
  transition: opacity 0.2s;
}
.myleagues-empty-cta:hover {
  opacity: 0.9;
}

.myleagues-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  font-size: 16px;
  color: rgba(76, 76, 77, 0.8980392157);
}

.myleagues-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 16px 0;
  margin-top: 24px;
}

.myleagues-pagination-info {
  font-family: "Inter-500";
  font-weight: 500;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: 0px;
  color: #6b7280;
  margin-right: 8px;
}

.myleagues-pagination-btn {
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.myleagues-pagination-btn:hover:not(:disabled) {
  background: #f9fafb;
  border-color: #9ca3af;
}
.myleagues-pagination-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.myleagues-pagination-pages {
  display: flex;
  align-items: center;
  gap: 4px;
}

.myleagues-pagination-page {
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.myleagues-pagination-page:hover {
  background: #f9fafb;
  border-color: #9ca3af;
}
.myleagues-pagination-page.active {
  background: #201E52;
  border-color: #201E52;
  color: #ffffff;
}

.myleagues-pagination-ellipsis {
  padding: 0 8px;
  font-size: 14px;
  color: #6b7280;
}

.myleagues-list {
  margin-top: 28px;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
  gap: 28px;
}

.myleagues-league-card {
  display: flex;
  align-items: stretch;
  background: #ffffff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
  border-radius: 28px;
  cursor: pointer;
  transition: box-shadow 0.2s;
  text-align: left;
  width: 100%;
  padding: 0px;
  box-sizing: border-box;
  border: none;
  height: 100%;
  outline: none;
}
.myleagues-league-card:focus-visible {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2), 0 0 0 2px #201e52;
}

.myleagues-league-card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px 28px;
  min-width: 0;
}

.myleagues-league-card-badge {
  display: inline-block;
  align-self: flex-start;
  font-size: 12px;
  font-weight: 600;
  line-height: 125%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  color: #ffffff;
  background: #515151;
  padding: 3px 10px;
  border-radius: 20px;
}

.myleagues-league-card-name {
  font-size: 24px;
  font-weight: 600;
  font-family: "Inter-600";
  color: #3B3B3B;
  margin: 0;
  line-height: 120%;
  letter-spacing: 0px;
}

.myleagues-league-card-details {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.myleagues-league-card-detail {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-family: "Inter-500";
  font-weight: 500;
  color: rgba(76, 76, 77, 0.6);
  line-height: 100%;
}
.myleagues-league-card-detail img {
  width: 18px;
  height: 20px;
  flex-shrink: 0;
  opacity: 0.85;
}

.myleagues-league-card-image-wrap {
  position: relative;
  flex-shrink: 0;
  width: 298px;
  border-radius: 28px;
}

.myleagues-league-card-menu {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
}

.myleagues-league-card-menu-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.92);
  color: #3b3b3b;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  transition: background 0.15s, color 0.15s;
}
.myleagues-league-card-menu-trigger:hover {
  background: #ffffff;
  color: #201e52;
}

.myleagues-league-card-dropdown {
  position: absolute;
  top: 44px;
  right: 0;
  min-width: 168px;
  padding: 6px 0;
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
  border: 1px solid #e5e7eb;
}

.myleagues-league-card-dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 14px;
  border: none;
  background: transparent;
  font-size: 15px;
  font-family: "Inter-500";
  font-weight: 500;
  color: #4c4c4d;
  cursor: pointer;
  text-align: left;
  transition: background 0.12s, color 0.12s;
}
.myleagues-league-card-dropdown-item:hover {
  background: #f3f4f6;
  color: #201e52;
}

.myleagues-league-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 28px 28px 0;
}

.myleagues-league-card-image-placeholder {
  width: 100%;
  height: 100%;
  min-height: 140px;
  background: linear-gradient(135deg, #e8e8ec 0%, #d8d8e0 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  font-weight: 700;
  font-family: "Inter-700";
  color: #9ca3af;
}

.myleagues-league-card-join-btn {
  width: 100%;
  margin-top: 36px;
  padding: 14.5px 24px;
  font-size: 20px;
  line-height: 100%;
  letter-spacing: 0px;
  font-family: "Inter-600";
  font-weight: 600;
  background: rgba(87, 83, 192, 0.0705882353);
  color: #201E52;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  align-self: center;
}
.myleagues-league-card-join-btn:hover {
  opacity: 0.95;
}

.myleagues-league-card--with-join {
  cursor: default;
}

.create-league-shell-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(2px);
  opacity: 0;
  animation: create-league-modal-fade-in 160ms ease forwards;
}

.create-league-shell-content {
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(92vw, 560px);
  max-height: 90vh;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  outline: none;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 0;
  opacity: 0;
  animation: create-league-modal-zoom-in 180ms ease forwards;
  padding: 28px 32px 24px;
  overflow-y: auto;
}

.create-league-shell-header {
  margin-bottom: 20px;
}

.create-league-shell-title {
  font-size: 22px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  color: #000000;
  text-align: center;
  margin: 0;
}

.create-league-shell-body {
  overflow: visible;
}

.create-league-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.create-league-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.create-league-field label {
  font-size: 16px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  color: #000000;
}
.create-league-field label .required {
  color: #D8252D;
}
.create-league-field input,
.create-league-field select,
.create-league-field textarea {
  width: 100%;
  border: 1px solid rgba(76, 76, 77, 0.2509803922);
  font-size: 14px;
  line-height: 100%;
  color: #000000;
  background: #ffffff;
  box-sizing: border-box;
  padding: 10px 16px 14px;
  border-radius: 4px;
}
.create-league-field input::placeholder,
.create-league-field select::placeholder,
.create-league-field textarea::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.create-league-field select {
  cursor: pointer;
}

.create-league-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.create-league-field-compact {
  flex: 1 1 140px;
}

.create-league-field-flex {
  flex: 1 1 180px;
}

.create-league-toggle {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 8px;
}
.create-league-toggle .create-league-toggle-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.create-league-toggle .create-league-toggle-desc {
  font-size: 12px;
  line-height: 1.3;
  color: #8e8e8e;
  margin: 0;
}

.create-league-switch {
  width: 48px;
  height: 24px;
  background: #cccccc;
  border: none;
  border-radius: 999px;
  position: relative;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
  transition: background 0.2s ease;
}
.create-league-switch.on {
  background: #201e52;
}
.create-league-switch .create-league-switch-slider {
  position: absolute;
  width: 20px;
  height: 20px;
  background: #ffffff;
  border-radius: 50%;
  top: 2px;
  left: 2px;
  transition: transform 0.2s;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.create-league-switch.on .create-league-switch-slider {
  transform: translateX(22px);
}

.create-league-footer {
  padding-top: 8px;
}

.create-league-submit {
  width: 100%;
  padding: 14px 16px;
  background: #201e52;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-family: "Inter-600";
  font-weight: 600;
  line-height: 100%;
  cursor: pointer;
  transition: opacity 0.2s;
}
.create-league-submit:hover:not(:disabled) {
  opacity: 0.95;
}
.create-league-submit:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

@keyframes create-league-modal-fade-in {
  to {
    opacity: 1;
  }
}
@keyframes create-league-modal-zoom-in {
  from {
    transform: translate(-50%, -50%) scale(0.96);
    opacity: 0;
  }
  to {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
}
.streamer-dashboard {
  background: #fafafa;
  min-height: 100vh;
  padding: 80px 24px 24px 48px;
}

.sd-filter-bar {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.15);
  padding: 22px 34px;
  margin-bottom: 24px;
}

.sd-filter-bar__options {
  display: flex;
  align-items: center;
  gap: 16px;
}
.sd-filter-bar__options > .sd-dropdown {
  flex: 1;
  min-width: 0;
}

.sd-dropdown {
  position: relative;
}

.sd-dropdown__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 11px;
  padding: 10px 12px;
  width: 100%;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  transition: border-color 0.2s;
}
.sd-dropdown__trigger svg {
  flex-shrink: 0;
  font-size: 20px;
  color: #4C4C4D;
}
.sd-dropdown__trigger:hover:not(.sd-dropdown__trigger--disabled) {
  border-color: #201E52;
}
.sd-dropdown__trigger--disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.sd-dropdown__placeholder {
  color: rgba(76, 76, 77, 0.6);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sd-dropdown__value {
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sd-dropdown__menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 1000;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.2);
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  width: 100%;
  min-width: 220px;
  overflow: hidden;
}

.sd-dropdown__search-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(76, 76, 77, 0.12);
}

.sd-dropdown__search-icon {
  font-size: 18px;
  color: #71717A;
  flex-shrink: 0;
}

.sd-dropdown__search-input {
  flex: 1;
  border: none;
  outline: none;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  background: transparent;
}
.sd-dropdown__search-input::placeholder {
  color: rgba(76, 76, 77, 0.5);
}

.sd-dropdown__list {
  max-height: 220px;
  overflow-y: auto;
}

.sd-dropdown__hint {
  padding: 12px 14px;
  font-family: "Inter-400";
  font-size: 13px;
  color: #71717A;
  text-align: center;
}

.sd-dropdown__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px 14px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  text-align: left;
  transition: background 0.15s;
}
.sd-dropdown__item:hover {
  background: #F0F0FF;
}

.sd-dropdown__item--match {
  align-items: flex-start;
  gap: 8px;
}

.sd-dropdown__match-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.sd-dropdown__match-teams {
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sd-dropdown__match-date {
  font-family: "Inter-400";
  font-size: 12px;
  color: #71717A;
}

.sd-dropdown__item-badge {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 4px;
  background: #F0F0F0;
  color: #71717A;
  white-space: nowrap;
  flex-shrink: 0;
}

.sd-direct-input {
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 11px;
  padding: 5px 5px 5px 12px;
  flex: 1;
  min-width: 300px;
  max-width: 493px;
  height: 46px;
}

.sd-direct-input__field {
  flex: 1;
  border: none;
  outline: none;
  font-family: "Inter-400";
  font-size: 16px;
  font-style: italic;
  color: rgba(76, 76, 77, 0.6);
  background: transparent;
  min-width: 0;
}
.sd-direct-input__field::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.sd-direct-input__field:not(:placeholder-shown) {
  font-style: normal;
  color: #000000;
}

.sd-direct-input__btn {
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 0 16px;
  height: 36px;
  font-family: "Inter-500";
  font-size: 16px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
  text-transform: capitalize;
}
.sd-direct-input__btn:hover {
  background: #2C2970;
}

.sd-content {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.sd-panel {
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 0 15.7px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}
.sd-panel--left {
  flex: 1;
  min-width: 0;
}
.sd-panel--right {
  width: 38%;
  flex-shrink: 0;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: sticky;
  top: 90px;
  align-self: flex-start;
}

.sd-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  background: linear-gradient(179.99deg, #2c2970 0%, #201e52 99.94%);
  height: 74px;
}

.sd-section-header__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #ffffff;
  text-transform: capitalize;
}

.sd-theme-selector {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 0 10px;
  height: 33px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #000000;
  cursor: pointer;
}
.sd-theme-selector svg {
  font-size: 18px;
}

.sd-dropdown--theme .sd-dropdown__menu {
  left: auto;
  right: 0;
  width: auto;
  min-width: 200px;
}

.sd-ticker-preview {
  background: #1a1a1a;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  padding: 0 14px;
}

.sd-ticker-preview__placeholder {
  font-family: "Inter-400";
  font-size: 12px;
  color: rgba(255, 255, 255, 0.4);
  font-style: italic;
}

.sd-overlays-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  background: linear-gradient(179.99deg, #2c2970 0%, #201e52 99.94%);
}

.sd-overlays-header__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #ffffff;
  text-transform: capitalize;
}

.sd-overlays-body {
  padding: 14px 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.sd-overlay-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sd-overlay-group__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #000000;
  text-transform: capitalize;
  margin: 0;
}

.sd-overlay-group__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 8px;
}

.sd-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 12px;
  border: 1px solid #201E52;
  border-radius: 4px;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 16px;
  color: #201E52;
  text-transform: uppercase;
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
.sd-chip:hover {
  background: #201E52;
  color: #ffffff;
}

.sd-divider {
  width: 100%;
  height: 1px;
  background: rgba(76, 76, 77, 0.15);
  margin: 4px 0;
}

.sd-panel__title {
  font-family: "Inter-500";
  font-size: 16px;
  color: #000000;
  text-transform: capitalize;
  margin: 0;
}

.sd-preview-area {
  background: #000000;
  border-radius: 10px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.sd-preview-area:not(:has(.sd-preview-area__iframe-wrapper)) {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 16/9;
}

.sd-preview-area__iframe-wrapper {
  width: 100%;
  aspect-ratio: 16/9;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.sd-preview-area__iframe-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
}

.sd-preview-area__label {
  font-family: "Inter-500";
  font-size: 16px;
  color: #ffffff;
  text-transform: capitalize;
}

.sd-preview-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.sd-preview-actions__btns {
  display: flex;
  gap: 12px;
}

.sd-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 14px;
  border-radius: 5px;
  border: none;
  cursor: pointer;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  transition: opacity 0.2s;
}
.sd-btn:hover {
  opacity: 0.85;
}
.sd-btn--preview {
  background: #a4a3a9;
}
.sd-btn--live {
  background: #a4a3a9;
}
.sd-btn--clear {
  background: #c0392b;
}
.sd-btn--clear:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.sd-btn--copy {
  background: #2980b9;
}
.sd-btn--copy:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.sd-btn--active {
  background: #201E52;
}

.sd-preview-actions__theme {
  font-size: 14px;
  color: #000000;
  margin: 0;
}
.sd-preview-actions__theme strong {
  font-family: "Inter-600";
  color: #383838;
}
.sd-preview-actions__theme span {
  color: #767474;
}

.sd-youtube-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sd-youtube-row__input {
  flex: 1;
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 4px;
  padding: 10px 12px;
  font-family: "Inter-500";
  font-size: 16px;
  color: rgba(76, 76, 77, 0.6);
  outline: none;
  min-width: 0;
  background: #ffffff;
}
.sd-youtube-row__input::placeholder {
  color: rgba(76, 76, 77, 0.6);
}
.sd-youtube-row__input:focus {
  border-color: #201E52;
}

.sd-youtube-row__btn {
  background: linear-gradient(179.96deg, #2c2970 0%, #201e52 99.94%);
  color: #ffffff;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  height: 39px;
  font-family: "Inter-500";
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.2s;
}
.sd-youtube-row__btn:hover {
  opacity: 0.85;
}

.sd-chip--disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

.sd-dialog-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1100;
}

.sd-dialog {
  background: #ffffff;
  border-radius: 12px;
  padding: 24px;
  min-width: 340px;
  max-width: 480px;
  width: 90%;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.sd-dialog__title {
  font-family: "Inter-600";
  font-size: 18px;
  color: #000000;
  margin: 0;
}

.sd-dialog__tabs {
  display: flex;
  border-bottom: 1px solid rgba(76, 76, 77, 0.15);
}

.sd-dialog__tab {
  flex: 1;
  padding: 8px 12px;
  border: none;
  background: transparent;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  color: #71717A;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}
.sd-dialog__tab--active {
  color: #201E52;
  border-bottom-color: #201E52;
}

.sd-dialog__list {
  overflow-y: auto;
  flex: 1;
  max-height: 320px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sd-dialog__empty {
  text-align: center;
  color: rgba(76, 76, 77, 0.5);
  font-family: "Inter-400";
  font-size: 14px;
  padding: 16px 0;
}

.sd-dialog__list-item {
  display: block;
  width: 100%;
  padding: 10px 12px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  text-align: left;
  border-radius: 6px;
  transition: background 0.15s;
}
.sd-dialog__list-item:hover {
  background: #F0F0FF;
}

.sd-dialog__list-item-sub {
  font-size: 12px;
  color: #71717A;
  margin-top: 2px;
}

.sd-dialog__inning-options {
  display: flex;
  gap: 12px;
}

.sd-dialog__inning-card {
  flex: 1;
  border: 2px solid rgba(76, 76, 77, 0.2);
  border-radius: 10px;
  padding: 16px;
  cursor: pointer;
  background: transparent;
  text-align: center;
  transition: border-color 0.2s;
}
.sd-dialog__inning-card:hover:not(.sd-dialog__inning-card--current) {
  border-color: #201E52;
}
.sd-dialog__inning-card--current {
  border-color: #201E52;
  background: #201E52;
  color: #ffffff;
}

.sd-dialog__inning-label {
  display: block;
  font-family: "Inter-600";
  font-size: 14px;
}

.sd-dialog__inning-team {
  display: block;
  font-family: "Inter-400";
  font-size: 12px;
  margin-top: 4px;
  opacity: 0.8;
}

.sd-dialog__textarea {
  border: 1px solid rgba(76, 76, 77, 0.25);
  border-radius: 6px;
  padding: 10px 12px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
  outline: none;
  resize: vertical;
  min-height: 80px;
  background: #ffffff;
}
.sd-dialog__textarea:focus {
  border-color: #201E52;
}
.sd-dialog__textarea::placeholder {
  color: rgba(76, 76, 77, 0.5);
}

.sd-dialog__actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.sd-dialog__btn-cancel {
  border: 1px solid rgba(76, 76, 77, 0.25);
  background: transparent;
  border-radius: 6px;
  padding: 8px 16px;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  color: #000000;
  transition: background 0.15s;
}
.sd-dialog__btn-cancel:hover {
  background: #F0F0F0;
}

.sd-dialog--wide {
  max-width: 560px;
}

.sd-dialog__pt-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 6px;
}
.sd-dialog__pt-row:hover {
  background: #F0F0FF;
}

.sd-dialog__pt-rank {
  font-family: "Inter-600";
  font-size: 14px;
  color: #71717A;
  width: 20px;
  flex-shrink: 0;
}

.sd-dialog__pt-team {
  font-family: "Inter-400";
  font-size: 14px;
  color: #000000;
}

.sd-dialog__btn-confirm {
  background: #201E52;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: background 0.2s;
}
.sd-dialog__btn-confirm:hover {
  background: #2C2970;
}

@media (max-width: 992px) {
  .sd-content {
    flex-direction: column;
  }
  .sd-panel--right {
    width: 100%;
  }
  .sd-filter-bar__options {
    flex-wrap: wrap;
  }
  .sd-filter-bar__options > .sd-dropdown {
    flex-basis: 100%;
  }
  .sd-panel--right {
    position: static;
  }
  .sd-direct-input {
    max-width: 100%;
    width: 100%;
  }
}
.streamer-dashboard--unauthorized {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 24px;
  background: radial-gradient(circle at 20% 0%, rgba(87, 83, 192, 0.08), transparent 55%), radial-gradient(circle at 80% 100%, rgba(32, 30, 82, 0.08), transparent 55%), #fafafa;
}

.sd-unauthorized {
  width: 100%;
  max-width: 520px;
  background: #ffffff;
  border: 1px solid rgba(76, 76, 77, 0.12);
  border-radius: 16px;
  box-shadow: 0 12px 40px rgba(32, 30, 82, 0.08);
  padding: 48px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.sd-unauthorized__logo {
  width: 120px;
  height: auto;
  object-fit: contain;
  margin-bottom: 24px;
}

.sd-unauthorized__divider {
  width: 56px;
  height: 3px;
  background: #201E52;
  border-radius: 2px;
  margin-bottom: 24px;
}

.sd-unauthorized__title {
  font-family: "Inter-700";
  font-size: 28px;
  color: #201E52;
  margin: 0 0 12px;
  letter-spacing: 0.2px;
}

.sd-unauthorized__message {
  font-family: "Inter-500";
  font-size: 16px;
  color: #18181B;
  margin: 0 0 16px;
  line-height: 1.5;
}

.sd-unauthorized__hint {
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  margin: 0;
  line-height: 1.6;
  max-width: 420px;
}

@media (max-width: 640px) {
  .sd-unauthorized {
    padding: 36px 24px;
  }
  .sd-unauthorized__logo {
    width: 96px;
  }
  .sd-unauthorized__title {
    font-size: 24px;
  }
}
.user-profile-page-container {
  background: #F3F3F3;
  min-height: 100vh;
  padding: 20px 16px 40px;
  margin-top: 70px;
}

.user-profile-page-wrapper {
  max-width: 1400px;
  margin: 0 auto;
  padding: 24px 16px 40px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.user-profile-page-wrapper .player-info-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #D71D0C;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 13px;
  padding: 4px 12px;
  border-radius: 4px;
  margin-bottom: 16px;
}
.user-profile-page-wrapper .player-info-badge .badge-icon {
  font-weight: 700;
}
.user-profile-page-wrapper .profile-hero-card {
  background: #201E52;
  border-radius: 12px 12px 0 0;
  padding: 32px;
  margin: 0 -16px 24px;
  margin-top: -24px;
  position: relative;
  overflow: hidden;
}
.user-profile-page-wrapper .profile-hero-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  background: linear-gradient(135deg, transparent 0%, rgba(255, 255, 255, 0.03) 100%);
  pointer-events: none;
}
.user-profile-page-wrapper .profile-hero-card .profile-hero-content {
  display: flex;
  align-items: center;
  gap: 24px;
  position: relative;
  z-index: 1;
}
.user-profile-page-wrapper .profile-avatar-section {
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-avatar {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  overflow: visible;
  position: relative;
  background: #ffffff;
  border: 3px solid #ffffff;
}
.user-profile-page-wrapper .profile-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.user-profile-page-wrapper .profile-avatar .avatar-camera-btn {
  position: absolute;
  bottom: -6px;
  right: -6px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #5753C0;
  color: #ffffff;
  border: 2px solid #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .profile-avatar .avatar-camera-btn:hover {
  background: #201E52;
}
.user-profile-page-wrapper .profile-info-section {
  flex: 1;
  min-width: 0;
}
.user-profile-page-wrapper .profile-info-section .player-name {
  color: #ffffff;
  font-family: "Inter-700";
  font-size: 26px;
  margin: 0 0 8px;
  line-height: 1.2;
}
.user-profile-page-wrapper .profile-info-section .player-code {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.7);
  font-family: "Inter-400";
  font-size: 13px;
  margin-bottom: 8px;
}
.user-profile-page-wrapper .profile-info-section .player-code .code-value {
  color: #ffffff;
  font-family: "Inter-500";
}
.user-profile-page-wrapper .profile-info-section .player-code .copy-btn {
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  padding: 2px;
  font-size: 14px;
  display: flex;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .profile-info-section .player-code .copy-btn:hover {
  color: #ffffff;
}
.user-profile-page-wrapper .profile-info-section .player-description {
  color: rgba(255, 255, 255, 0.6);
  font-family: "Inter-400";
  font-size: 14px;
  margin: 0;
}
.user-profile-page-wrapper .profile-actions-section {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-actions-section .action-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  white-space: nowrap;
}
.user-profile-page-wrapper .profile-actions-section .action-btn svg {
  font-size: 18px;
}
.user-profile-page-wrapper .profile-actions-section .action-btn:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.4);
}
.user-profile-page-wrapper .profile-tabs-section {
  background: none;
  padding: 0;
}
.user-profile-page-wrapper .main-tabs {
  display: flex;
  gap: 32px;
  padding-top: 4px;
  border-bottom: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .main-tabs .main-tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 16px 0;
  font-family: "Inter-500";
  font-size: 15px;
  color: rgb(69, 70, 82);
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .main-tabs .main-tab.active {
  color: #18181B;
  border-bottom-color: #201E52;
}
.user-profile-page-wrapper .main-tabs .main-tab:hover:not(.active) {
  color: #18181B;
}
.user-profile-page-wrapper .tab-divider {
  margin: 0;
  border: none;
  border-top: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .sub-tabs {
  display: flex;
  gap: 12px;
  padding: 16px 0;
}
.user-profile-page-wrapper .sub-tabs .sub-tab {
  padding: 8px 16px;
  border-radius: 20px;
  border: none;
  background: rgba(76, 76, 77, 0.06);
  font-family: "Inter-500";
  font-size: 13px;
  color: #18181B;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .sub-tabs .sub-tab.active {
  background: #201E52;
  color: #ffffff;
}
.user-profile-page-wrapper .sub-tabs .sub-tab:hover:not(.active) {
  background: rgba(76, 76, 77, 0.12);
}
.user-profile-page-wrapper .profile-tab-content {
  min-height: 300px;
  padding: 24px 0;
}
.user-profile-page-wrapper .player-profile-card {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.user-profile-page-wrapper .player-profile-card .player-profile-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #201E52;
  padding: 16px 24px;
}
.user-profile-page-wrapper .player-profile-card .player-profile-header h2 {
  margin: 0;
  color: #ffffff;
  font-family: "Inter-600";
  font-size: 16px;
}
.user-profile-page-wrapper .player-profile-card .player-profile-header .edit-btn {
  background: none;
  border: none;
  color: #ffffff;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  padding: 4px;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .player-profile-card .player-profile-header .edit-btn:hover {
  opacity: 0.8;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details {
  background: #ffffff;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  border-bottom: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row:last-child {
  border-bottom: none;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row .detail-label {
  font-family: "Inter-600";
  font-size: 14px;
  color: #18181B;
}
.user-profile-page-wrapper .player-profile-card .player-profile-details .detail-row .detail-value {
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header p {
  margin: 0;
  font-family: "Inter-500";
  font-size: 20px;
  color: #000000;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .edit-roles-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  border-radius: 8px;
  border: none;
  background: #201E52;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 15px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .edit-roles-btn svg {
  font-size: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .edit-roles-btn:hover {
  background: #2C2970;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .roles-header-actions {
  display: flex;
  gap: 8px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn,
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 8px;
  font-family: "Inter-500";
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn svg,
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn svg {
  font-size: 14px;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn {
  border: 1px solid #DBDBDB;
  background: #ffffff;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .cancel-roles-btn:hover {
  border-color: #D71D0C;
  color: #D71D0C;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn {
  border: 1px solid #201E52;
  background: #201E52;
  color: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-header .save-roles-btn:hover {
  background: #2C2970;
  border-color: #2C2970;
}
.user-profile-page-wrapper .roles-capabilities-section .roles-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card {
  border: 1px solid #F0F0F0;
  border-radius: 12px;
  background: #ffffff;
  overflow: visible;
  transition: all 0.2s ease-in-out;
  position: relative;
  border-left: 4px solid transparent;
  border-left-color: #201E52;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.enabled {
  border-color: #DBDBDB;
  border-left-color: #201E52;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.disabled {
  border-color: #F0F0F0;
  border-left-color: #DBDBDB;
  background: #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.disabled .role-label {
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.disabled .role-icon {
  background: #DBDBDB;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card.editing .field-value,
.user-profile-page-wrapper .roles-capabilities-section .role-card.editing .field-input,
.user-profile-page-wrapper .roles-capabilities-section .role-card.editing .multiselect-trigger {
  background: #ffffff;
  border-color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-main {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 24px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  background: #201E52;
  color: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-label {
  flex: 1;
  font-family: "Inter-500";
  font-size: 15px;
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle {
  width: 44px;
  height: 24px;
  border-radius: 12px;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  border: none;
  padding: 0;
  outline: none;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle .toggle-thumb {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ffffff;
  position: absolute;
  top: 2px;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.on {
  background: #1AA915;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.on .toggle-thumb {
  left: 22px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.off {
  background: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-toggle.off .toggle-thumb {
  left: 2px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-expand-btn {
  background: none;
  border: none;
  color: #71717A;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  padding: 4px;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-expand-btn:hover {
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded {
  padding: 0 24px 18px 80px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded p {
  margin: 0;
  font-family: "Inter-400";
  font-size: 13px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field label {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-value,
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input {
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  background: #F6F6F6;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  padding: 10px 14px;
  min-height: 20px;
  width: 100%;
  box-sizing: border-box;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input {
  outline: none;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input:focus {
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-input::placeholder {
  color: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-select {
  appearance: none;
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2371717A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-field-wrapper {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsules {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsule {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #5753C0;
  color: #ffffff;
  font-family: "Inter-500";
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsule .capsule-remove-btn {
  display: flex;
  align-items: center;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-capsule .capsule-remove-btn:hover {
  color: #D71D0C;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row .field-input {
  flex: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row .location-add-btn {
  flex-shrink: 0;
  padding: 10px 16px;
  background: #5753C0;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  font-family: "Inter-500";
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .location-add-row .location-add-btn:hover {
  opacity: 0.85;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-value-select {
  position: relative;
  padding-right: 32px;
}
.user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid .umpire-field .field-value-select::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #71717A;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .roles-capabilities-section .role-card .role-card-expanded .umpire-details-grid {
    grid-template-columns: 1fr;
  }
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(-n+6) {
  grid-column: span 3;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(n+7) {
  grid-column: span 2;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field label {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-value,
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input {
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  background: #F6F6F6;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  padding: 10px 14px;
  min-height: 20px;
  width: 100%;
  box-sizing: border-box;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input {
  outline: none;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input:focus {
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-input::placeholder {
  color: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-select {
  appearance: none;
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2371717A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload {
  display: flex;
  align-items: center;
  gap: 0;
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload .field-input {
  padding-right: 80px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload .upload-btn {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  padding: 6px 16px;
  border-radius: 6px;
  border: 1px solid #DBDBDB;
  background: #ffffff;
  font-family: "Inter-500";
  font-size: 12px;
  color: #18181B;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-upload .upload-btn:hover {
  border-color: #5753C0;
  color: #5753C0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix {
  display: flex;
  align-items: center;
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix .field-prefix {
  position: absolute;
  left: 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  z-index: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix .field-input {
  padding-left: 28px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .field-with-prefix .field-select {
  padding-left: 28px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper {
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-trigger {
  width: 100%;
  text-align: left;
  cursor: pointer;
  background-color: #F6F6F6;
  color: #18181B;
  border: 1px solid #F0F0F0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-trigger:focus {
  outline: none;
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 100;
  overflow: hidden;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  cursor: pointer;
  user-select: none;
  border-bottom: 1px solid #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option.selected {
  background: #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option:hover {
  background: #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: #5753C0;
  cursor: pointer;
  flex-shrink: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear {
  background: none;
  border: none;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  cursor: pointer;
  padding: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear:hover {
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply {
  background: #2d2f6e;
  border: none;
  border-radius: 4px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  cursor: pointer;
  padding: 6px 20px;
}
.user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply:hover {
  opacity: 0.9;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid {
    grid-template-columns: 1fr;
  }
  .user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(-n+6),
  .user-profile-page-wrapper .roles-capabilities-section .scorer-details-grid .scorer-field:nth-child(n+7) {
    grid-column: span 1;
  }
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field label {
  font-family: "Inter-500";
  font-size: 12px;
  color: #71717A;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-value,
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input {
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  background: #F6F6F6;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  padding: 10px 14px;
  min-height: 20px;
  width: 100%;
  box-sizing: border-box;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input {
  outline: none;
  transition: all 0.2s ease-in-out;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input:focus {
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-input::placeholder {
  color: #DBDBDB;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-select {
  appearance: none;
  cursor: pointer;
  padding-right: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2371717A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-with-prefix {
  display: flex;
  align-items: center;
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-with-prefix .field-prefix {
  position: absolute;
  left: 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  z-index: 1;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .field-with-prefix .field-input {
  padding-left: 28px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .role-toggle {
  width: 44px;
  height: 24px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper {
  position: relative;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-trigger {
  width: 100%;
  text-align: left;
  cursor: pointer;
  background-color: #F6F6F6;
  color: #18181B;
  border: 1px solid #F0F0F0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-trigger:focus {
  outline: none;
  border-color: #5753C0;
  background: #ffffff;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid #F0F0F0;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 100;
  overflow: hidden;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  font-family: "Inter-400";
  font-size: 14px;
  color: #18181B;
  cursor: pointer;
  user-select: none;
  border-bottom: 1px solid #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option.selected {
  background: #F6F6F6;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option:hover {
  background: #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-option input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: #5753C0;
  cursor: pointer;
  flex-shrink: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid #F0F0F0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear {
  background: none;
  border: none;
  font-family: "Inter-400";
  font-size: 14px;
  color: #71717A;
  cursor: pointer;
  padding: 0;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-clear:hover {
  color: #18181B;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply {
  background: #2d2f6e;
  border: none;
  border-radius: 4px;
  font-family: "Inter-500";
  font-size: 14px;
  color: #ffffff;
  cursor: pointer;
  padding: 6px 20px;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field .multiselect-wrapper .multiselect-dropdown .multiselect-actions .multiselect-apply:hover {
  opacity: 0.9;
}
.user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field.streamer-field-full {
  grid-column: span 2;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid {
    grid-template-columns: 1fr;
  }
  .user-profile-page-wrapper .roles-capabilities-section .streamer-details-grid .streamer-field.streamer-field-full {
    grid-column: span 1;
  }
}
@keyframes shimmer {
  0% {
    background-position: -400px 0;
  }
  100% {
    background-position: 400px 0;
  }
}
.user-profile-page-wrapper .shimmer {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.05) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite ease-in-out;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-badge {
  width: 110px;
  height: 28px;
  border-radius: 4px;
  background-color: rgba(216, 37, 45, 0.2);
  margin-bottom: 16px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-hero {
  display: flex;
  align-items: center;
  gap: 24px;
  background: #201E52;
  border-radius: 12px;
  padding: 32px;
  margin-bottom: 24px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-hero .shimmer {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.06) 25%, rgba(255, 255, 255, 0.18) 50%, rgba(255, 255, 255, 0.06) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite ease-in-out;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-avatar {
  width: 100px;
  height: 100px;
  border-radius: 8px;
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-line {
  border-radius: 4px;
  height: 16px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-name {
  width: 220px;
  height: 28px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-code {
  width: 180px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-desc {
  width: 280px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-actions {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-btn {
  width: 130px;
  height: 42px;
  border-radius: 8px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tabs {
  background: #ffffff;
  border-radius: 12px;
  padding: 0 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tabs .shimmer {
  background: linear-gradient(90deg, #F0F0F0 25%, #DBDBDB 50%, #F0F0F0 75%);
  background-size: 800px 100%;
  animation: shimmer 1.5s infinite ease-in-out;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tab-row {
  display: flex;
  gap: 32px;
  padding: 18px 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-tab {
  width: 100px;
  height: 18px;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-divider {
  height: 1px;
  background: #F0F0F0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-chip-row {
  display: flex;
  gap: 12px;
  padding: 16px 0;
}
.user-profile-page-wrapper .profile-skeleton .skeleton-chip {
  width: 80px;
  height: 34px;
  border-radius: 20px;
}
@media (max-width: 768px) {
  .user-profile-page-wrapper .profile-hero-card {
    padding: 20px;
  }
  .user-profile-page-wrapper .profile-hero-card .profile-hero-content {
    flex-direction: column;
    text-align: center;
  }
  .user-profile-page-wrapper .profile-actions-section {
    width: 100%;
    justify-content: center;
  }
  .user-profile-page-wrapper .profile-info-section .player-code {
    justify-content: center;
  }
  .user-profile-page-wrapper .main-tabs {
    gap: 20px;
  }
  .user-profile-page-wrapper .sub-tabs {
    flex-wrap: wrap;
  }
  .user-profile-page-wrapper .skeleton-hero {
    flex-direction: column;
    text-align: center;
  }
  .user-profile-page-wrapper .skeleton-actions {
    width: 100%;
    justify-content: center;
  }
  .user-profile-page-wrapper .skeleton-chip-row {
    flex-wrap: wrap;
  }
}body.react-confirm-alert-body-element {
  overflow: hidden;
}

.react-confirm-alert-blur {
  filter: url(#gaussian-blur);
  filter: blur(2px);
  -webkit-filter: blur(2px);
}

.react-confirm-alert-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  background: rgba(255, 255, 255, 0.9);
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: center;
  -ms-align-items: center;
  align-items: center;
  opacity: 0;
  -webkit-animation: react-confirm-alert-fadeIn 0.5s 0.2s forwards;
  -moz-animation: react-confirm-alert-fadeIn 0.5s 0.2s forwards;
  -o-animation: react-confirm-alert-fadeIn 0.5s 0.2s forwards;
  animation: react-confirm-alert-fadeIn 0.5s 0.2s forwards;
}

.react-confirm-alert-body {
  font-family: Arial, Helvetica, sans-serif;
  width: 400px;
  padding: 30px;
  text-align: left;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 20px 75px rgba(0, 0, 0, 0.13);
  color: #666;
}

.react-confirm-alert-svg {
  position: absolute;
  top: 0;
  left: 0;
}

.react-confirm-alert-body > h1 {
  margin-top: 0;
}

.react-confirm-alert-body > h3 {
  margin: 0;
  font-size: 16px;
}

.react-confirm-alert-button-group {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  justify-content: flex-start;
  margin-top: 20px;
}

.react-confirm-alert-button-group > button {
  outline: none;
  background: #333;
  border: none;
  display: inline-block;
  padding: 6px 18px;
  color: #eee;
  margin-right: 10px;
  border-radius: 5px;
  font-size: 12px;
  cursor: pointer;
}

@-webkit-keyframes react-confirm-alert-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-moz-keyframes react-confirm-alert-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-o-keyframes react-confirm-alert-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes react-confirm-alert-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}