@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Outfit:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  font-family: 'Manrope', system-ui, sans-serif;
  line-height: 1.5;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.87);
  background-color: #242424;
  --font-display: 'Space Grotesk', 'Manrope', system-ui, sans-serif;
  --font-body: 'Manrope', system-ui, sans-serif;
  --sidebar-bg: #0f3f44;
  --sidebar-bg-deep: #0b2f33;
  --sidebar-accent: #66f0d2;
  --sidebar-text: #e9fbf7;
  --sidebar-muted: rgba(233, 251, 247, 0.6);
  --sidebar-hover: rgba(255, 255, 255, 0.08);
  --sidebar-active: rgba(255, 255, 255, 0.14);
  --header-bg: #0f4b55;
  --header-bg-deep: #0b3f47;
  --header-text: #f7fffd;
  --header-border: rgba(255, 255, 255, 0.08);
  --surface-0: #f4f8f7;
  --surface-1: #ffffff;
  --surface-2: #edf6f4;
  --ink-strong: #0f272b;
  --ink-muted: #5f7076;
  --accent-strong: #2d8c97;

  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;
  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;
  }
}
.role-mapping-container {
  padding: 1.5rem;
}

.role-actions-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.role-actions-box .css-1yt9akw-MuiButtonBase-root-MuiButton-root {
  padding: 0.5rem;
  display: flex;
  flex-wrap: nowrap;
  flex-grow: 1;
}

@media screen and (max-width: 480px) {
  .role-mapping-container {
    padding: var(--padding-md);
  }
}
.role-table-container {
  margin-top: var(--margin-mdl);
  box-shadow: none;
}
.header-module,
.header-task {
  text-transform: uppercase;
}

.module-cell,
.task-cell {
  text-transform: capitalize;
}
.role-table-container .table-container {
  box-shadow: none;
}.new-user-main-container {
  padding: 1.5rem;
}

.new-user-sub-heading {
  font-weight: var(--bold-font-weight);
  color: var(--primary-color);
  letter-spacing: normal;
  font-size: 1.25rem;
}

.image-container {
  margin-top: var(--margin-md);
}

.user-image-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--gap-md);
  height: 6rem;
  width: 6rem;
}

.user-image {
  border: 1px solid lightgrey;
  border-radius: 4px;
  background-color: var(--background-color);
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.add-photo {
  text-wrap: nowrap;
}

.remove-container {
  display: flex;
  align-items: center;
}

.user-info-fields-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 3rem 0;
  max-width: 1440px;
}

.user-fields-wrapper {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
}

.role-container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 0;
}
.role-heading {
  font-weight: var(--bold-font-weight);
  color: var(--primary-color);
  letter-spacing: normal;
  font-size: 1.25rem;
}

.role-profile-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin: 3rem 0;
  max-width: 1440px;
}

.create-user-button-container {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.user-button-container {
  display: flex;
  justify-content: space-between;
  padding: 0 1rem;
}

@media screen and (max-width: 900px) {
  .user-info-fields-container {
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (max-width: 758px) {
  .user-info-fields-container {
    grid-template-columns: 1fr;
  }
}
.input-text {
  padding: 0 0.65625rem;
  margin: 0;
  margin-bottom: 0.625rem;
  font-size: 0.65625rem;
}

.text-input .MuiFormHelperText-root {
  text-align: left;
  color: var(--accent-color);
}
/* src/CustomButton.css */
.btn {
  height: 2.25rem;
  display: flex;
  gap: 0.5rem;
  text-wrap: nowrap;
}

.btn-loading {
  opacity: 0.6;
}

.custom-btn-spinner {
  width: 1rem;
  height: 1rem;
  border: 0.125rem solid black;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.popup-content{margin:auto;background:#fff;width:50%;padding:5px;border:1px solid #d7d7d7}[role=tooltip].popup-content{width:200px;box-shadow:0 0 3px rgba(0,0,0,.16);border-radius:5px}.popup-overlay{background:rgba(0,0,0,.5)}[data-popup=tooltip].popup-overlay{background:transparent}.popup-arrow{-webkit-filter:drop-shadow(0 -3px 3px rgba(0,0,0,.16));filter:drop-shadow(0 -3px 3px rgba(0,0,0,.16));color:#fff;stroke-width:2px;stroke:#d7d7d7;stroke-dasharray:30px;stroke-dashoffset:-54px;left:0;right:0;top:0;bottom:0}:root {
  --toastify-color-light: #fff;
  --toastify-color-dark: #121212;
  --toastify-color-info: #3498db;
  --toastify-color-success: #07bc0c;
  --toastify-color-warning: #f1c40f;
  --toastify-color-error: hsl(6, 78%, 57%);
  --toastify-color-transparent: rgba(255, 255, 255, 0.7);

  --toastify-icon-color-info: var(--toastify-color-info);
  --toastify-icon-color-success: var(--toastify-color-success);
  --toastify-icon-color-warning: var(--toastify-color-warning);
  --toastify-icon-color-error: var(--toastify-color-error);

  --toastify-container-width: fit-content;
  --toastify-toast-width: 320px;
  --toastify-toast-offset: 16px;
  --toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top));
  --toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right));
  --toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left));
  --toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom));
  --toastify-toast-background: #fff;
  --toastify-toast-padding: 14px;
  --toastify-toast-min-height: 64px;
  --toastify-toast-max-height: 800px;
  --toastify-toast-bd-radius: 6px;
  --toastify-toast-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
  --toastify-font-family: sans-serif;
  --toastify-z-index: 9999;
  --toastify-text-color-light: #757575;
  --toastify-text-color-dark: #fff;

  /* Used only for colored theme */
  --toastify-text-color-info: #fff;
  --toastify-text-color-success: #fff;
  --toastify-text-color-warning: #fff;
  --toastify-text-color-error: #fff;

  --toastify-spinner-color: #616161;
  --toastify-spinner-color-empty-area: #e0e0e0;
  --toastify-color-progress-light: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55);
  --toastify-color-progress-dark: #bb86fc;
  --toastify-color-progress-info: var(--toastify-color-info);
  --toastify-color-progress-success: var(--toastify-color-success);
  --toastify-color-progress-warning: var(--toastify-color-warning);
  --toastify-color-progress-error: var(--toastify-color-error);
  /* used to control the opacity of the progress trail */
  --toastify-color-progress-bgo: 0.2;
}

.Toastify__toast-container {
  z-index: var(--toastify-z-index);
  -webkit-transform: translate3d(0, 0, var(--toastify-z-index));
  position: fixed;
  width: var(--toastify-container-width);
  box-sizing: border-box;
  color: #fff;
  display: flex;
  flex-direction: column;
}

.Toastify__toast-container--top-left {
  top: var(--toastify-toast-top);
  left: var(--toastify-toast-left);
}
.Toastify__toast-container--top-center {
  top: var(--toastify-toast-top);
  left: 50%;
  transform: translateX(-50%);
  align-items: center;
}
.Toastify__toast-container--top-right {
  top: var(--toastify-toast-top);
  right: var(--toastify-toast-right);
  align-items: end;
}
.Toastify__toast-container--bottom-left {
  bottom: var(--toastify-toast-bottom);
  left: var(--toastify-toast-left);
}
.Toastify__toast-container--bottom-center {
  bottom: var(--toastify-toast-bottom);
  left: 50%;
  transform: translateX(-50%);
  align-items: center;
}
.Toastify__toast-container--bottom-right {
  bottom: var(--toastify-toast-bottom);
  right: var(--toastify-toast-right);
  align-items: end;
}

.Toastify__toast {
  --y: 0;
  position: relative;
  touch-action: none;
  width: var(--toastify-toast-width);
  min-height: var(--toastify-toast-min-height);
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: var(--toastify-toast-padding);
  border-radius: var(--toastify-toast-bd-radius);
  box-shadow: var(--toastify-toast-shadow);
  max-height: var(--toastify-toast-max-height);
  font-family: var(--toastify-font-family);
  /* webkit only issue #791 */
  z-index: 0;
  /* inner swag */
  display: flex;
  flex: 1 auto;
  align-items: center;
  word-break: break-word;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast-container {
    width: 100vw;
    left: env(safe-area-inset-left);
    margin: 0;
  }
  .Toastify__toast-container--top-left,
  .Toastify__toast-container--top-center,
  .Toastify__toast-container--top-right {
    top: env(safe-area-inset-top);
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-left,
  .Toastify__toast-container--bottom-center,
  .Toastify__toast-container--bottom-right {
    bottom: env(safe-area-inset-bottom);
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: env(safe-area-inset-right);
    left: initial;
  }
  .Toastify__toast {
    --toastify-toast-width: 100%;
    margin-bottom: 0;
    border-radius: 0;
  }
}

.Toastify__toast-container[data-stacked='true'] {
  width: var(--toastify-toast-width);
}

.Toastify__toast--stacked {
  position: absolute;
  width: 100%;
  transform: translate3d(0, var(--y), 0) scale(var(--s));
  transition: transform 0.3s;
}

.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body,
.Toastify__toast--stacked[data-collapsed] .Toastify__close-button {
  transition: opacity 0.1s;
}

.Toastify__toast--stacked[data-collapsed='false'] {
  overflow: visible;
}

.Toastify__toast--stacked[data-collapsed='true']:not(:last-child) > * {
  opacity: 0;
}

.Toastify__toast--stacked:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: calc(var(--g) * 1px);
  bottom: 100%;
}

.Toastify__toast--stacked[data-pos='top'] {
  top: 0;
}

.Toastify__toast--stacked[data-pos='bot'] {
  bottom: 0;
}

.Toastify__toast--stacked[data-pos='bot'].Toastify__toast--stacked:before {
  transform-origin: top;
}

.Toastify__toast--stacked[data-pos='top'].Toastify__toast--stacked:before {
  transform-origin: bottom;
}

.Toastify__toast--stacked:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  transform: scaleY(3);
  z-index: -1;
}

.Toastify__toast--rtl {
  direction: rtl;
}

.Toastify__toast--close-on-click {
  cursor: pointer;
}

.Toastify__toast-icon {
  margin-inline-end: 10px;
  width: 22px;
  flex-shrink: 0;
  display: flex;
}

.Toastify--animate {
  animation-fill-mode: both;
  animation-duration: 0.5s;
}

.Toastify--animate-icon {
  animation-fill-mode: both;
  animation-duration: 0.3s;
}

.Toastify__toast-theme--dark {
  background: var(--toastify-color-dark);
  color: var(--toastify-text-color-dark);
}

.Toastify__toast-theme--light {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--default {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--info {
  color: var(--toastify-text-color-info);
  background: var(--toastify-color-info);
}

.Toastify__toast-theme--colored.Toastify__toast--success {
  color: var(--toastify-text-color-success);
  background: var(--toastify-color-success);
}

.Toastify__toast-theme--colored.Toastify__toast--warning {
  color: var(--toastify-text-color-warning);
  background: var(--toastify-color-warning);
}

.Toastify__toast-theme--colored.Toastify__toast--error {
  color: var(--toastify-text-color-error);
  background: var(--toastify-color-error);
}

.Toastify__progress-bar-theme--light {
  background: var(--toastify-color-progress-light);
}

.Toastify__progress-bar-theme--dark {
  background: var(--toastify-color-progress-dark);
}

.Toastify__progress-bar--info {
  background: var(--toastify-color-progress-info);
}

.Toastify__progress-bar--success {
  background: var(--toastify-color-progress-success);
}

.Toastify__progress-bar--warning {
  background: var(--toastify-color-progress-warning);
}

.Toastify__progress-bar--error {
  background: var(--toastify-color-progress-error);
}

.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--success,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning,
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error {
  background: var(--toastify-color-transparent);
}

.Toastify__close-button {
  color: #fff;
  position: absolute;
  top: 6px;
  right: 6px;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  z-index: 1;
}

.Toastify__toast--rtl .Toastify__close-button {
  left: 6px;
  right: unset;
}

.Toastify__close-button--light {
  color: #000;
  opacity: 0.3;
}

.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}

.Toastify__close-button:hover,
.Toastify__close-button:focus {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}

.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0.7;
  transform-origin: left;
}

.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}

.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}

.Toastify__progress-bar--rtl {
  right: 0;
  left: initial;
  transform-origin: right;
  border-bottom-left-radius: initial;
}

.Toastify__progress-bar--wrp {
  position: absolute;
  overflow: hidden;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  border-bottom-left-radius: var(--toastify-toast-bd-radius);
  border-bottom-right-radius: var(--toastify-toast-bd-radius);
}

.Toastify__progress-bar--wrp[data-hidden='true'] {
  opacity: 0;
}

.Toastify__progress-bar--bg {
  opacity: var(--toastify-color-progress-bgo);
  width: 100%;
  height: 100%;
}

.Toastify__spinner {
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 2px solid;
  border-radius: 100%;
  border-color: var(--toastify-spinner-color-empty-area);
  border-right-color: var(--toastify-spinner-color);
  animation: Toastify__spin 0.65s linear infinite;
}

@keyframes Toastify__bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}

@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, var(--y), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, var(--y), 0);
  }
}

@keyframes Toastify__bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}

@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, var(--y), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, var(--y), 0);
  }
}

@keyframes Toastify__bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, calc(var(--y) - 10px), 0);
  }
  40%,
  45% {
    opacity: 1;
    transform: translate3d(0, calc(var(--y) + 20px), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes Toastify__bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}

@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, calc(var(--y) - 10px), 0);
  }
  40%,
  45% {
    opacity: 1;
    transform: translate3d(0, calc(var(--y) + 20px), 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}

.Toastify__bounce-enter--top-left,
.Toastify__bounce-enter--bottom-left {
  animation-name: Toastify__bounceInLeft;
}

.Toastify__bounce-enter--top-right,
.Toastify__bounce-enter--bottom-right {
  animation-name: Toastify__bounceInRight;
}

.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}

.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--top-left,
.Toastify__bounce-exit--bottom-left {
  animation-name: Toastify__bounceOutLeft;
}

.Toastify__bounce-exit--top-right,
.Toastify__bounce-exit--bottom-right {
  animation-name: Toastify__bounceOutRight;
}

.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}

.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}

@keyframes Toastify__zoomOut {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: translate3d(0, var(--y), 0) scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}

.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
}

@keyframes Toastify__flipOut {
  from {
    transform: translate3d(0, var(--y), 0) perspective(400px);
  }
  30% {
    transform: translate3d(0, var(--y), 0) perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }
  to {
    transform: translate3d(0, var(--y), 0) perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  from {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideInLeft {
  from {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideInUp {
  from {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideInDown {
  from {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, var(--y), 0);
  }
}

@keyframes Toastify__slideOutRight {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, var(--y), 0);
  }
}

@keyframes Toastify__slideOutLeft {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, var(--y), 0);
  }
}

@keyframes Toastify__slideOutDown {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}

@keyframes Toastify__slideOutUp {
  from {
    transform: translate3d(0, var(--y), 0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}

.Toastify__slide-enter--top-left,
.Toastify__slide-enter--bottom-left {
  animation-name: Toastify__slideInLeft;
}

.Toastify__slide-enter--top-right,
.Toastify__slide-enter--bottom-right {
  animation-name: Toastify__slideInRight;
}

.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}

.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--top-left,
.Toastify__slide-exit--bottom-left {
  animation-name: Toastify__slideOutLeft;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

.Toastify__slide-exit--top-right,
.Toastify__slide-exit--bottom-right {
  animation-name: Toastify__slideOutRight;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
  animation-timing-function: ease-in;
  animation-duration: 0.3s;
}

@keyframes Toastify__spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.list-user-container {
  margin: var(--margin-lg);
  padding: 1.5rem;
}
.users-heading-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  background-color: var(--heading-bg-color);
  padding: 0.5625rem 0.75rem 0.5625rem 1.5rem;
  border-radius: 0.5rem;
  margin-bottom: 1rem;
}
.users-heading {
  font-family: var(--font-family-secondary);
  font-weight: var(--bold-font-weight);
  font-style: normal;
  font-size: clamp(1.3rem, 3vw, 1.6rem);
  line-height: 2.5rem;
  color: var(--primary-color-400);
  margin: 0;
}

.new-user-heading-container {
  background-color: var(--heading-bg-color);
  padding: var(--padding-sm);
  color: var(--primary-color);
  border-radius: 0.5rem;
  align-items: center;
  margin: 1rem;
  display: flex;
  justify-content: space-between;
  font-size: 1rem;
}

.new-user-heading {
  color: var(--primary-color);
  font-size: clamp(1.3rem, 3vw, 1.6rem);
  font-weight: 500;
  display: flex;
  justify-content: flex-start;
}

.no-users-found {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  text-align: center;
}

.no-users-found h3 {
  font-size: 16px;
}

.popup-container {
  padding: 20px;
  text-align: center;
  background-color: var(--main-background-color);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.popup-container p {
  font-size: 18px;
  margin-bottom: 20px;
  color: #333;
}

.popup-container button {
  padding: 10px 20px;
  margin: 0 10px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.3s, transform 0.2s;
}

.popup-container button:hover {
  opacity: 0.9;
  transform: translateY(-2px);
}

.popup-container button[type="button"] {
  background-color: var(--primary-color);
  color: var(--main-background-color);
}

.popup-container button[type="button"]:nth-of-type(2) {
  background-color: #f44336;
}

@media (max-width: 600px) {
  .popup-container {
    padding: 15px;
  }

  .popup-container button {
    width: 100%;
    margin: 5px 0;
  }
}

@media screen and (max-width: 768px) {
  .list-user-container {
    margin: var(--margin-md);
  }
}

.card-layout {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: flex-start;
  padding: 20px;
}

.card-container {
  background-color: #ffffff;
  border-radius: var(--border-radius-sm, 0.5rem);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  width: calc(33.333% - 20px);
  padding: 1.25rem;
  transition: transform 0.3s ease;
}

.card-header {
  font-weight: bold;
  padding: 0.5rem 0;
  font-size: 1rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  justify-content: space-between;
  width: 100%;
}

.card-data {
  font-size: 1rem;
  margin: 0;
  width: 100%;
  word-wrap: break-word;
}

.card-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  align-items: center;
}

.user--drawer-container {
  width: 450px;
  max-width: 600px;
  box-sizing: border-box;
  height: 100vh;
  overflow-y: auto;
}

@media (max-width: 900px) {
  .user--drawer-container {
    width: 70vw;
  }
}

@media (max-width: 600px) {
  .user--drawer-container {
    width: 100vw;
  }
}
.loader-circular-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40vh;
}

.loader-circular {
  z-index: 10000;
  border: 0.3125rem solid var(--primary-color);
  border-top: 0.3125rem solid var(--primary-color);
  border-right: 0.3125rem solid transparent;
  border-radius: 50%;
  width: 5rem;
  height: 5rem;
  animation: spin 0.7s cubic-bezier(0.5, 0.1, 0.5, 1) infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


.landing {
  width: 100%;
  margin: 0 auto;
  font-family: "Poppins", sans-serif;
  overflow: hidden;
  padding: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}

/* ---------- ABOUT SECTION ---------- */

#about {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  padding: 6rem 0 50px 0;
  background: linear-gradient(135deg, #ffffff, #f8fffa);
}

.about-content {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80%;
}

.home-image {
  width: 100%;
  max-width: 1200px;
  height: 400px;
}

.about-image {
  width: 100%;
  max-width: 400px;
  height: 500px;
}

.about-text-box {
  position: absolute;
  top: 50%;
  right: 10%;
  transform: translateY(-50%);
  background-color: azure;
  padding: 20px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  text-align: left;
  width: 40%;
  max-width: 350px;
}

.about-text-box .btn {
  background-color: white;
  color: black;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-weight: bold;
}

.about-text-box .btn:hover {
  background-color: black;
  color: white;
}

/* ---------- HOME SECTION ---------- */

#home {
  position: relative;
  top: 2.3rem;
  min-height: 800px;
  background-image: url(/assets/home_bg-DRjzNjFK.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  margin: 25px 10px 4rem 10px;
  border-radius: 25px;
  overflow: hidden;
}

#home::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3); /* dark overlay */
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px); /* Safari support */
  z-index: 0;
}

#home .kourtwiz-ball {
  background-image: url(/assets/landing_ball-BRxoMOxg.svg);
  background-repeat: no-repeat;
  background-size: 14rem;
  background-position: right;
  width: 20%;
  height: 14rem;
  position: absolute;
  left: -8rem;
  top: 12rem;
}

.clubs-content {
  background-size: 14rem;
  background-image: url(/assets/pickleball_player-CqrrIADx.svg);
  background-repeat: no-repeat;
  background-position: 67rem 2rem;
}

.home-content h1 {
  font-size: 62px;
  margin-bottom: 10px;
  color: #ffffff;
  text-transform: capitalize;
  position: absolute;
  left: 8rem;
  top: 12rem;
}

.home-content h1 span {
  color: #aaf40c;
}

.home-content p {
  position: absolute;
  top: 31rem;
  left: 102px;
  color: #eeeeee;
  margin: 0;
  font-size: 20px;
  width: 24%;
}

/* ---------- BUTTONS (SIDE BY SIDE) ---------- */

.button-row {
  position: absolute;
  top: 27rem;
  left: 8rem;
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.register-btn,
.player-btn {
  font-size: 16px;
  padding: 12px 20px;
  font-weight: 500;
  border-radius: 10px;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  border: none;
}

/* Club button */

.register-btn {
  color: #2C7E88;
  background-color: #ffffff;
}

/* Player button */

.player-btn {
  color: #2C7E88;
  background-color: #ffffff;
}

.player-btn:hover {
  background-color: #19565e;
  color: white;
}

.register-btn:hover {
  background-color: #19565e;
  color: white;
}

/* ---------- DECORATION ---------- */

.banner-dot-one {
  position: absolute;
  top: 150px;
  left: 80px;
  width: 25px;
  height: 25px;
  background: #aaf40c;
  border-radius: 70px;
  display: inline-block;
}

.banner-pickle-two {
  position: absolute;
  top: 620px;
  left: 40px;
}

.banner-pickle-two img {
  position: relative;
  width: 90px;
  z-index: 1;
  bottom: 20px;
  left: 35px;
}

.banner-pickle-two span {
  width: 90px;
  height: 90px;
  background: #aaf40c;
  border-radius: 70px;
  display: inline-block;
  position: absolute;
  left: 0;
}

/* ---------- UTILITIES ---------- */

.search-bar {
  width: 100%;
  max-width: 400px;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.scroll-buttons {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.scroll-btn {
  background: #007bff;
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
  border-radius: 5px;
  font-size: 18px;
}

.scroll-btn:hover {
  background: #0056b3;
}

.btn {
  padding: 10px;
  font-size: 1rem;
  display: inline-block;
  border: none;
  margin: 0.5rem;
  cursor: pointer;
  border-radius: 5px;
  transition: 0.3s;
  background: #007bff;
  color: white;
}

.btn:hover {
  background: #0056b3;
}

:link {
  text-decoration: none;
}

/* ---------- RESPONSIVE ---------- */

@media screen and (max-width: 850px) {
  .home-content {
    max-width: 80%;
  }
  .home-content h1 {
    font-size: 2rem;
  }
  .home-content p {
    font-size: 1.2rem;
  }
  .button-row {
    top: 24rem;
    left: 2rem;
    gap: 1rem;
  }
}

@media screen and (max-width: 600px) {
  .home-content h1 {
    font-size: 1.8rem;
  }
  .home-content p {
    font-size: 1rem;
    width: 80%;
    left: 2rem;
  }
  .button-row {
    position: static;
    margin-top: 2rem;
    justify-content: center;
  }
}
.header {
  position: fixed; 
  top: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  padding: 5px;
  z-index: 5;
  height: 4rem;
}

.logo img {
  height: 25px;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: 20px;
   margin-right: 155px;
}

.nav-links a {
  text-decoration: none;
  color: #000000;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 0.97rem;
  padding: 2px 8px; 
 
  
}

.nav-links a:hover{
  text-decoration: underline;
}

.contact-btn {
  border: 2px solid white;
  padding: 8px 16px;
  background: transparent;
  color: white;
  font-weight: bold;
  text-transform: uppercase;
  cursor: pointer;
}

.contact-btn:hover {
  background: white;
  color: black;
}
/* Header.css */
.login-btn {
  border: none;
  background: transparent;
  color: #2C7E88;   /* or same color as nav links */
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  margin-left: 1.5rem;
}

.footer2 {
    background-color: #2C7E88;
    color: white;
    padding: 20px;
    text-align: center;
    /* margin-top:0rem; */
}

.footer-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
}

.footer-links {
    display: flex;
    gap: 15px;
}

.footer-links a {
    color: white;
    text-decoration: none;
    font-size: 16px;
    transition: color 0.3s ease;
}

.footer-links a:hover {
    color: grey;
}

.footer-copy {
    font-size: 14px;
    margin-top: 5px;
}
.join-community {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3rem 5rem;
  background: #F2F2F2;
  border-radius: 12px;
  gap: 2rem;
  margin: 15px;
}

.join-left {
  flex: 1;
}

.join-left h2 {
  font-size: 2rem;
  font-weight: 700;
  color: #004b5a;
  margin-bottom: 1rem;
}

.join-left p {
  color: #666;
  margin-bottom: 1.5rem;
  line-height: 1.5;
}

.join-form {
  display: flex;
  gap: 0.5rem;
}

.join-form input {
  padding: 0.8rem 1rem;
  border: 1px solid #ccc;
  border-radius: 20px;
  flex: 1;
  outline: none;
  background-color: #ffffff;
  color: #000000;
}

.join-form button {
  padding: 0.8rem 1.5rem;
  border: none;
  background: #007c89;
  color: #fff;
  font-weight: 600;
  border-radius: 20px;
  cursor: pointer;
  transition: background 0.3s ease;
  /* width: 120px;
  height: 40px;
  margin-top: 10px; */
}

.join-form button:hover {
  background: #005f65;
}

.join-right {
  flex: 1;
  display: flex;
  justify-content: center;
}

.join-right img {
  max-width: 100%;
  border-radius: 12px;
}
.app-download {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3rem;
  padding: 4rem 6rem;
  background: #007c89;
  border-radius: 12px;
  color: #fff;
  margin: 45px;
}

.app-left {
  flex: 1;
  display: flex;
  justify-content: center;
}

.phones {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

.app-right {
  flex: 1;
}

.app-right h2 {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  color: #ffffff;
}

.app-right p {
  font-size: 1.1rem;
  margin-bottom: 2rem;
  line-height: 1.5;
}

.store-buttons {
  display: flex;
  justify-content: flex-start;
  margin-left: 185px;
}

.stores {
  max-width: 250px; /* adjust size */
  height: auto;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.stores:hover {
  transform: scale(1.05);
}
.footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 3rem 6rem;
  background: #fff;
  color: #333;
  font-size: 0.95rem;
  gap: 3rem;
  margin: 45px;
}

.footer-col {
  flex: 1;
}

.footer-logo {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.footer-logo img {
  height: 40px;
}

.footer-col h4 {
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #0d253f;
}

.footer-col ul {
  list-style: none;
  padding: 0;
}

.footer-col ul li {
  margin-bottom: 0.6rem;
}

.footer-col ul li a {
  text-decoration: none;
  color: #555;
  transition: color 0.3s ease;
}

.footer-col ul li a:hover {
  color: #007c89;
}

.social-icons {
  display: flex;
  gap: 0.8rem;
  margin-top: 1rem;
}

.social-icons a {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: #cde6e8;
  color: #007c89;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  transition: background 0.3s ease, color 0.3s ease;
}

.social-icons a:hover {
  background: #007c89;
  color: #fff;
}

.footer-col p {
  margin: 0.5rem 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  
}
.footer-p2{
    margin-left: 100px;
}

.footer-col p .icon {
  color: #007c89;
}
.login-container {
  background:
    url("/assets/tenniscourt-BgJ6edJw.png") no-repeat center bottom,
    linear-gradient(to bottom, #E1E4F3 0%, #F5F5F7 100%);
  background-size: 100% auto, cover;

  display: flex;
  justify-content: center;
  align-items: center;

  min-height: 90vh;
  padding: 2rem 1rem;
  position: relative;
  overflow: hidden;
}

.create-club-layout2 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90%;
  max-width: 1200px;
  position: relative;
}

.create-club-character2 {
  position: absolute;
  left: -250px;
}

.create-club-character2 img {
  max-width: 360px;
  height: auto;
}

.create-club-ball2 {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.create-club-ball2 img {
  max-width: 220px;
  height: auto;
}

.login-box {
  width: 100%;
  max-width: 420px;
  background: rgba(255, 255, 255, 0.92);
  padding: 24px;
  border-radius: 20px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  text-align: left;
}
.login-box .MuiTextField-root {
  width: 100%;
}

.login-box .MuiButton-root {
  border-radius: 20px;
  padding: 10px;
  font-size: 1rem;
  font-weight: 500;
  text-transform: none;
}

.login-box .MuiOutlinedInput-root {
  border-radius: 10px;
}

.login-box .MuiOutlinedInput-notchedOutline {
  border-radius: 10px;
}
.login-box .MuiOutlinedInput-root.Mui-focused fieldset {
  border-color: #2C7E88;
}

.login-box .MuiInputLabel-root.Mui-focused {
  color: #2C7E88;
}

.login-box .MuiInputBase-input {
  caret-color: #2C7E88;
}

.login-box .MuiButton-contained {
  background-color: #2C7E88 !important;
}

.login-box .MuiButton-contained:hover {
  background-color: #23636b !important;
}

.error-message {
  color: #d32f2f;
  font-size: 0.875rem;
}

.loading-spinner {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

@media (max-width: 768px) {
  .create-club-character2,
  .create-club-ball2 {
    display: none;
  }

  .login-box {
    padding: 20px;
  }
}

.toolbar-header .toolbar {
  background-image: none;
  box-shadow: none;
  position: relative;
  width: 100%;
  border-bottom: 1px solid var(--header-border);
  background: linear-gradient(135deg, var(--header-bg) 0%, var(--header-bg-deep) 100%);
}

.toolbar-header .toolbar .toolbar__content {
  background: transparent;
}
.toolbar-header .toolbar div h4{
  color: var(--header-text) !important;
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0.02em;
}
.toolbar-header .MuiToolbar-gutters {
  gap: 0.5rem;
}

.toolbar__content {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.toolbar___logo__container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.toolbar___logo__container > img {
  height: 2.5rem;
  object-fit: contain;
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.2));
}

.cnr-search-container {
  display: flex;
  justify-content: flex-start;
  width: 70%;
}

.cnr-search-container__hidden {
  display: none;
}

.toolbar-header .toolbar .inter-font-placeholder {
  font-family: var(--font-family-secondary);
}

.toolbar-header .toolbar-button-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.hamburger__btn__visible {
  display: none;
}

.toolbar-header .update-button {
  font-family: var(--font-family-secondary);
  border: 1px solid #1456d7;
  color: var(--primary-color-400);
  border-radius: 0.25rem;
  text-wrap: nowrap;
  padding: 0.3rem;
}

.toolbar-header .notification-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 2.313rem;
  width: 2.5rem;
  border-radius: var(--border-radius-sm);
  border: 1px solid rgba(255, 255, 255, 0.2);
  cursor: pointer;
  background: rgba(255, 255, 255, 0.08);
}

.toolbar-header .toolbar-user-profile-button {
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  padding: 0.15rem 0.35rem;
  background: rgba(255, 255, 255, 0.1);
  min-width: auto;
}

.toolbar-header .cnr-search-info {
  cursor: pointer;
}
.toolbar-header .search--info--icon {
  padding-top: 0.25rem;
}

.toolbar__content {
  font-family: var(--font-body);
}

.toolbar-header .toolbar-button-container {
  gap: 0.5rem;
}

.toolbar-mobile-responsive-btn {
  display: none;
}

@media (max-width: 380px) {
  .share-button {
    font-size: 1rem;
    line-height: 2.125rem;
  }
}

.center-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.title_card {
  font-size: var(--defaul-font-size);
  font-weight: var(--bold-font-weight);
  color: var(--text-color);
  display: flex;
  align-items: center;
}
.toolbar--button-container {
  display: flex;
  justify-content: center;
  align-items: center;
}
.toolbar__buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.toolbar__buttons .toolbar__button {
  border: none;
  width: fit-content;
  font-size: clamp(0.8rem, 2vw, 1rem);
  text-wrap: nowrap;
  font-family: var(--font-family-secondary);
  background-color: var(--primary-color-400);
  border-radius: 0.25rem;
  padding: 0.3rem 0.5rem;
}

@media screen and (max-width: 768px) {
  .toolbar__buttons {
    display: flex;
    justify-content: flex-end;
    gap: var(--gap-sm);
    width: 100%;
    font-size: 0.5rem;
  }
}

.toolbar-header .user-profile-container:hover {
  --variant-textBg: none;
}
.user-profile-main-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.user-profile-container {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-weight: bold;
  gap: 0.35rem;
  padding: 0.2rem 0.35rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
}

.user-avatar-img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.user-profile-container .user-profile__avatar {
  width: 30px;
  height: 30px;
  line-height: 1rem;
  margin-left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.expand-icon {
  margin-right: 0;
  margin-left: 0;
  cursor: pointer;
  transition: transform 0.3s ease;
  fill: lightgrey;
  color: lightgrey;
}

.expand-icon:hover {
  transform: rotate(180deg);
}

.user-profile-details {
  display: flex;
  flex-direction: column;
  background-color: var(--main-background-color);
  position: absolute;
  border-radius: var(--border-radius-sm);
  top: 3rem;
  right: -1.5rem;
  color: var(--text-color);
  padding: var(--padding-md);
  min-width: 18.8rem;
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
}

.user-profile__name,
.user-profile__email {
  display: flex;
  align-items: center;
}
.user-profile__name {
  font-weight: var(--bold-font-weight);
  font-family: var(--font-family-secondary);
  font-size: 18px;
}
.user-profile__email {
  font-weight: 400;
}
.user-profile__name [data-testid='EditIcon'] {
  position: absolute;
  right: 0;
  cursor: pointer;
  font-size: 1.25rem;
}
.user-profile__hr {
  border: 1px solid var(--primary-color-200);
  margin: 0px -1rem;
}
.user-profile-details .logout-btn {
  color: var(--accent-color);
  gap: var(--gap-sm);
  border: none;
  display: flex;
  justify-content: left;
  padding-left: 0;
}

.profile__close-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.user-profile__settings {
  cursor: pointer;
  padding: 0.8rem 0.2rem;
  font-family: var(--font-family-secondary);
  font-weight: 400;
  display: flex;
  padding-left: 0;
}
.user-profile__settings:hover {
  background: none;
}
.logout-btn {
  display: flex;
}

.logout-dialog-paper {
  width: 28.125rem;
}

.logout-dialog-paper .logout-dialog-title {
  font-size: 1.2rem;
  font-weight: var(--bold-font-weight);
  display: flex;
  text-align: center;
  justify-content: center;
  padding-top: var(--padding-lg);
}

.logout-dialog-paper .logout-dialog-content {
  font-size: var(--default-font-size);
  justify-content: center;
  text-align: center;
  color: var(--text-color);
  padding-bottom: var(--padding-md);
}

.user__profile__logout__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem;
}

.user__profile__details__container {
  padding: 0.5rem;
}
@media screen and (max-width: 768px) {
  .user-profile-details {
    right: -2.5rem;
  }
}
.switch-club-list {
  padding: 0;
}

.switch-club-item {
  border-radius: var(--border-radius-sm);
  transition: background-color 0.2s ease;
}

.switch-club-item:hover {
  background-color: var(--main-surface-hover-color);
}

.club-item-line {
  display: flex;
  justify-content: space-between;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--main-text-color);
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.club-name {
  color: var(--main-text-color);
}

.club-role {
  color: var(--secondary-text-color);
}
.app-container {
  display: flex;
  grid-template-columns: auto 1fr;
  height: 100vh;
  overflow-y: hidden;
}

.menuToggle {
  display: none;
}

.app-container .main-content {
  margin: 0;
  flex-grow: 1;
  background-color: var(--background-color);
  margin: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  color: var(--secondary-text-color);
  padding-left: var(--padding-xxxlg);
}

.app-container > .sidebar {
  transition: width 3s ease;
  overflow: visible;
  font-size: 1.25rem;
}

.sidebar-content {
  display: flex;
  flex-direction: column;
  align-items: baseline;
  justify-content: space-between;
  overflow-y: auto;
  overflow-x: hidden;
  width: 100%;
}

.sidebar-scroll-hidden::-webkit-scrollbar {
  display: none;
}

.sidebar-open .sidebar-content {
  overflow-y: auto;
}

.sidebar .MuiDrawer-paper {
  display: flex;
  flex-direction: column;
  overflow: visible;
  background: linear-gradient(165deg, var(--sidebar-bg) 0%, var(--sidebar-bg-deep) 100%);
  position: relative;
  padding: var(--padding-md);
  height: 150vh;
  transition: width 0.3s ease;
  z-index: 1000;
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}
.sidebar .MuiDrawer-paper::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(520px 520px at 15% -10%, rgba(102, 240, 210, 0.18), transparent 60%),
    radial-gradient(420px 420px at 120% 10%, rgba(102, 240, 210, 0.14), transparent 55%);
  opacity: 0.8;
  pointer-events: none;
}

.sidebar .toggle-button {
  position: absolute;
  top: 5.5rem;
  right: -0.9375rem;
  /* background-color: rgb(224, 234, 238); */
  color: var(--secondary-text-color);
  padding: 0.125rem;
  z-index: 999999;
  transform: translateY(-50%);
  transition: background-color 0.3s ease, transform 0.3s ease;
  outline: none;
  visibility: hidden;
  border-radius: 0.375rem;
}

.sidebar .toggle-button::before {
  content: "";
  position: absolute;
  top: -0.25rem;
  left: -0.25rem;
  right: -0.25rem;
  bottom: -0.25rem;
  background-color: rgba(208, 228, 238, 0.7);
  border-radius: 0.313rem;
  z-index: -1;
}

.sidebar-open .toggle-button {
  visibility: visible;
}

.toggle-button.show {
  visibility: visible;
}

.sidebar .toggle-button:hover {
  background-color: var(--hover-settings-card-color);
}

.main-content .sidebar-content-1 {
  background-color: var(--main-background-color);
  display: flex;
  flex-direction: column;
  margin-top: var(--margin-mdl);
  border-radius: 0.3125rem;
  padding: var(--padding-mdl);
}

.sidebar-list-container {
  margin-top: var(--margin-md);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  /* background: url("../../assets/sidenav_bg.svg") no-repeat center;
  background-size: 219px 100%; */
}
/* .sidebar-list-container  img {
  opacity: 0.5;
} */
.sidebar-content .list-item {
  cursor: pointer;
  padding: 0.625rem;
  display: flex;
  gap: var(--gap-sm);
  height: 3rem;
  padding: 0.75rem 1rem;
  margin-bottom: var(--margin-sm);
}

.sidebar-open .sidebar-content .list-items {
  margin-right: 0.2rem;
}

.sidebar-open .sidebar-list-container .list-items .list-item.active {
  border-left: 0.313rem solid white;
  background-color: var(--hover-settings-card-color);
  border-radius: var(--border-radius-sm);
}

.sidebar-open .sidebar-list-container .list-items .list-item.sub-item.active {
  border-left: 0.313rem solid white;
  background-color: var(--hover-settings-card-color);
  border-radius: var(--border-radius-sm);
}

.sidebar-open .sidebar-list-container .user-profile-sidebar-list-container {
  max-width: 100%;
}

.sidebar-open
  .sidebar-list-container
  .user-profile-sidebar-list-container
  .list-items
  .list-item.active {
  border-left: 0.313rem solid white;
  background-color: var(--hover-settings-card-color);
  border-radius: var(--border-radius-sm);
  color: var(--primary-color);
}

.sidebar-open
  .sidebar-list-container
  .list-items
  .list-item.active
  .list-item-icon
  img {
  filter: invert(23%) sepia(97%) saturate(2285%) hue-rotate(214deg)
    brightness(94%) contrast(88%);
}

.sidebar-closed
  .sidebar-list-container
  .list-items
  .list-item.active
  .list-item-icon
  img {
  filter: invert(23%) sepia(97%) saturate(2285%) hue-rotate(214deg)
    brightness(94%) contrast(88%);
}

.sidebar-closed
  .sidebar-list-container
  .list-items
  .list-item.sub-item.active
  .list-item-icon
  img {
  filter: invert(23%) sepia(97%) saturate(2285%) hue-rotate(214deg)
    brightness(94%) contrast(88%);
}

.sidebar-open
  .sidebar-list-container
  .list-items
  .list-item.sub-item.active
  .list-item-icon
  img {
  filter: invert(23%) sepia(97%) saturate(2285%) hue-rotate(214deg)
    brightness(94%) contrast(88%);
}

.sidebar-open
  .sidebar-list-container
  .list-items
  .list-item:hover
  .list-item-icon
  img {
  filter: invert(23%) sepia(97%) saturate(2285%) hue-rotate(214deg)
    brightness(94%) contrast(88%);
}

.sidebar-closed
  .sidebar-list-container
  .list-items
  .list-item:hover
  .list-item-icon
  img {
  filter: invert(23%) sepia(97%) saturate(2285%) hue-rotate(214deg)
    brightness(94%) contrast(88%);
}

/* .sidebar-open
  .sidebar-list-container
  .list-items
  .list-item.active
  .list-item-text {
  /* color: var(--primary-color); 
  color: white;
} */

.sidebar .MuiDrawer-paper {
  background-color: transparent;
  box-sizing: border-box;
}
.sidebar-list-container a div span{
  color: var(--sidebar-text);
  font-family: var(--font-body);
  letter-spacing: 0.01em;
}
.sidebar .MuiListItemIcon-root,
.sidebar .list-item i,
.sidebar .sub-item i {
  color: var(--sidebar-text);
}
.sidebar .MuiSvgIcon-root {
  color: var(--sidebar-text);
}
.sidebar .MuiIconButton-root {
  border: 0;
  background: transparent;
}
.sidebar-toggle-button {
  align-self: flex-end;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0.25rem;
  margin: 0.5rem 0.25rem 0.75rem auto;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.08);
}
.sidebar-toggle-button:hover {
  background: rgba(255, 255, 255, 0.12);
}
.sidebar-toggle-button:focus,
.sidebar-toggle-button:focus-visible {
  outline: none;
  box-shadow: none;
}
.sidebar-toggle-button svg {
  font-size: 1.25rem;
  color: #ffffff;
}
.sidebar-closed .sidebar-list-container .list-items .list-item.active {
  background-color: var(--sidebar-active);
  border-radius: var(--border-radius-sm);
}

.sidebar-closed .expand-icons {
  display: none;
}
.sidebar-closed .MuiDrawer-paper {
  padding-left: 0.4rem;
  padding-right: 0.4rem;
}

.list-items .list-item .list-item-icon {
  padding-top: 3px;
  color: var(--sidebar-text);
  min-width: 1.7rem;
  vertical-align: baseline;
}

.sidebar--main-content {
  background-color: var(--background-color);
  width: 100%;
  height: 100%;
  flex: 1;
  flex-direction: column;
  min-width: 0;
  height: 100vh;
  overflow: hidden;
  position: relative;
  overflow-y: auto;
  display: flex;
  grid-template-rows: auto 1fr;
  position: relative;
  z-index: 8;
  overflow: hidden;
}

.sidebar--outlet-content {
  border-radius: 0.25rem;
  color: var(--text-color);
  background-color: var(--main-background-color);
  overflow-x: auto;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

.feedback-container {
  position: absolute;
  bottom: 3rem;
  right: 1rem;
  z-index: 9999;
}

/* ── Scrollbars ── */
.sidebar-content::-webkit-scrollbar,
.sidebar .MuiList-root::-webkit-scrollbar,
.sidebar--outlet-content::-webkit-scrollbar {
  width: 5px;
  background: transparent;
  border-radius: 99px;
}

.sidebar-content::-webkit-scrollbar-track,
.sidebar .MuiList-root::-webkit-scrollbar-track,
.sidebar--outlet-content::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 99px;
}

.sidebar-content::-webkit-scrollbar-thumb,
.sidebar .MuiList-root::-webkit-scrollbar-thumb,
.sidebar--outlet-content::-webkit-scrollbar-thumb {
  background: rgba(130, 216, 216, 0.7);
  border-radius: 99px;
  cursor: pointer;
}

.sidebar-content::-webkit-scrollbar-thumb:hover,
.sidebar .MuiList-root::-webkit-scrollbar-thumb:hover,
.sidebar--outlet-content::-webkit-scrollbar-thumb:hover {
  background: rgba(102, 240, 210, 0.85);
}

/* ── Mobile sidebar ── */
.mobile-sidebar-container {
  background-color: var(--main-background-color);
  width: 100%;
  height: 100dvh;
  overflow-y: auto;
  border-radius: 0 0 0.5rem 0.5rem;
  position: absolute;
  top: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  z-index: 999999;
  transition: all 0.3s ease-in-out;
}

.mobile-sidebar-container__hidden {
  display: none;
}

.mobile__sidebar-container {
  background-color: var(--main-background-color);
  width: 100%;
  max-height: 70vh;
  overflow-y: auto;
  border-radius: 0 0 0.5rem 0.5rem;
  position: absolute;
  top: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  z-index: 999999;
  transition: all 0.3s ease-in-out;
  border-bottom: 2px solid var(--primary-color);
}

.mobile__sidebar-container::-webkit-scrollbar {
  width: 0.3rem;
  background: #f1f1f1;
  border-radius: 0.625rem;
}

.mobile__sidebar-container::-webkit-scrollbar-thumb {
  background: var(--primary-color);
  border-radius: 0.625rem;
  cursor: pointer;
}

.mobile__sidebar-container_open {
  transform: translateY(0);
}

.mobile__sidebar-container_close {
  transform: translateY(-100%);
}

.mobile-sidebar-header-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: var(--main-background-color);
  position: sticky;
  top: 0;
}

.mobile_sidebar_logo_container {
  display: flex;
  align-items: center;
  gap: var(--gap-md);
  padding: var(--padding-sm);
}

.mobile_sidebar_logo {
  height: clamp(40px, 3vw, 60px);
}

.close_icon {
  cursor: pointer;
  margin: 0 0.5rem;
}

@keyframes animate {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

@media screen and (max-width: 768px) {
  .sidebar--main-content {
    width: 100vw;
  }
  .sidebar-list-container {
    width: 100%;
  }
  .sidebar .css-1kapoqd-MuiList-root {
    margin: 0;
  }
  .sidebar .css-buyew-MuiList-root {
    margin: 0;
  }
  .sidebar {
    display: none;
  }
}

.sidebar-list-container .MuiCollapse-wrapperInner .MuiList-root {
  padding-left: 0.5rem;
  border: 1px solid var;
  border-left: 3px solid var(--primary-color);
}

.sidebar--payment-icon {
  width: 1.5rem;
  height: 1.5rem;
  color: rgba(0, 0, 0, 0.54);
}

.list-item-icon {
  height: 2rem;
}

.list-item.active,
.sub-item.active {
  background-color: var(--sidebar-active);
  border-radius: 8px;
}

/* icon highlight */
.list-item.active .MuiListItemIcon-root {
  color: var(--sidebar-accent);
}

/* text highlight */
.list-item.active .MuiListItemText-primary,
.sub-item.active .MuiListItemText-primary {
  font-weight: 700;
  color: var(--sidebar-text);
}

.list-item:hover,
.sub-item:hover {
  background-color: var(--sidebar-hover);
}

.sidebar-content .list-item {
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: 0.01em;
}

.sidebar-content .list-item .MuiListItemText-primary {
  color: var(--sidebar-text);
}

.sidebar-content .list-item .MuiListItemText-secondary {
  color: var(--sidebar-muted);
}

.sidebar-open .sidebar-list-container .list-items .list-item.active {
  border-left: 0.2rem solid var(--sidebar-accent);
  background: linear-gradient(90deg, rgba(102, 240, 210, 0.18), rgba(102, 240, 210, 0.04));
}.notfound-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
  }

  .notfound-image {
    max-width: 300px;
    margin-bottom: 20px;
  }

  .notfound-title {
    margin-top: 20px;
  }

  .notfound-subtitle {
    margin-bottom: 10px;
    color: #5960eb;
  }

  .notfound-description {
    margin-bottom: 20px;
    color: #5960eb;
  }

  .notfound-button {
    margin-top: 20px;
    color: #5f68ff;
  }.notfound-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    text-align: center;
  }

  .notfound-image {
    max-width: 300px;
    margin-bottom: 20px;
  }

  .notfound-title {
    margin-top: 20px;
  }

  .notfound-subtitle {
    margin-bottom: 10px;
    color: #5960eb;
  }

  .notfound-description {
    margin-bottom: 20px;
    color: #5960eb;
  }

  .notfound-button {
    margin-top: 20px;
    color: #5f68ff;
  }.homePage--main-container {
  padding: var(--padding-md1);
  background: linear-gradient(to bottom, #eaeeff 15%, #f8f8fa 0%);
}
.homePage--title {
  font-style: normal;
  font-weight: var(--default-font-weight);
  font-size: 2.125rem;
  line-height: 2.5rem;
  color: var(--text-color);
  display: flex;
  justify-content: space-between;
  margin-top: var(--margin-md);
}

.actions--container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media screen and (max-width: 768px) {
  .homePage--main-container {
    margin: var(--margin-md);
    padding: 0.5rem;
  }
}
/* clean up is needed */
.demo-page{
  .club-landing {
    display: flex;
    justify-content: top;
    align-items: top;
    color: white;

  }
  .demo-text {
    color: #0e1a2b;
    text-align: center;
    font-size: 10rem;
    font-weight: bold;
    height: 300px;
  }
  .login-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  .red-btn {
  background-color: #d32f2f;
  color: white;
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.3s ease;
}

.red-btn:hover:not(:disabled) {
  background-color: #b71c1c;
}

.red-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
  .login-form input {
    padding: 8px;
    font-size: 16px;
  }

  .error {
    color: red;
  }

  .membership-types{
    background-image: url('/images/light-club.jpg');
    color: #222;
    align-items: center;
  }
  .membership-types h2{
    background-image: url('/images/light-club.jpg');
    color: #222;
    margin-top: 0rem;
  }
  .membership-cards {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 50px;
    padding: 20px;
    background-image: url('/images/light-club.jpg');
    color: #222;
  }
  
  .membership-card {
    background: #f9f9f9;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s;
  }
  
  .membership-card:hover {
    transform: scale(1.05);
  }
  
  .club-container {
    width: 100%;
    background-image: url('/images/light-club.jpg');
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: white;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    padding: 20px;
}

.club-container h1 {
    color: white;
}

.club-container p {
    color: white;
    font-size: 1.5rem;
}

.club-image {
    width: 100%;
    max-width: 600px;
    border-radius: 10px;
    margin-top: 20px;
}

.button-group {
    top:0;
    display: flex;
    justify-content:center;
    gap: 10px;
    background-color: black;
}
p{
  font-size: 1.25rem;
}

.btn:disabled{
  background-color: grey;
}
.btn {
    padding: 10px 15px;
    border: none;
    cursor: pointer;
    background-color: black;
    color: white;
    border-radius: 5px;
    font-size: 16px;
    transition: background 0.3s ease;
}

.btn:hover {
    background-color: white;
    color: black;
}

}
.webcamCaptureWrapper {
  width: 400px;
  margin: 0 auto;
}.rt-dashboard {
  --bg: #f4f7f7;
  --panel: #ffffff;
  --panel-strong: #f7fbfb;
  --text: #0f2226;
  --muted: #5e7076;
  --ok: #1ea97a;
  --attention: #d94a3a;
  --idle: #8a9aa0;
  --accent: #2c7e88;
  background: radial-gradient(circle at top, #ffffff, #eef3f3 55%);
  color: var(--text);
  padding: 2rem;
  min-height: 100vh;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
}

.rt-header {
  display: flex;
  justify-content: space-between;
  gap: 2rem;
  align-items: flex-end;
  margin-bottom: 1.5rem;
}

.rt-title {
  font-size: 2.3rem;
  margin: 0 0 0.35rem;
}

.rt-subtitle {
  margin: 0;
  color: var(--muted);
  font-size: 1rem;
}

.rt-meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: flex-end;
}

.rt-clock {
  color: var(--muted);
  font-size: 0.95rem;
}

.rt-legend {
  display: flex;
  gap: 0.5rem;
}

.legend-chip {
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border: 1px solid transparent;
}

.legend-chip.ok {
  color: var(--ok);
  border-color: rgba(78, 215, 166, 0.35);
}

.legend-chip.attention {
  color: var(--attention);
  border-color: rgba(241, 107, 90, 0.45);
}

.legend-chip.idle {
  color: var(--idle);
  border-color: rgba(91, 108, 112, 0.55);
}

.rt-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1rem;
  margin-bottom: 2rem;
}

.rt-summary-card {
  background: var(--panel);
  border-radius: 16px;
  padding: 1rem 1.25rem;
  border: 1px solid rgba(15, 34, 38, 0.08);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.rt-summary-card.attention {
  border-color: rgba(217, 74, 58, 0.35);
}

.rt-summary-card.idle {
  border-color: rgba(138, 154, 160, 0.45);
}

.rt-summary-label {
  color: var(--muted);
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.rt-summary-value {
  font-size: 1.6rem;
  font-weight: 600;
}

.rt-body {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 1.5rem;
}

.rt-courts h3,
.rt-details h3 {
  margin: 0 0 0.75rem;
  font-size: 1.1rem;
  color: var(--text);
}

.rt-court-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 1rem;
}

.rt-court-tile {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
  border: 1px solid rgba(15, 34, 38, 0.08);
  border-radius: 18px;
  padding: 1.15rem 1.1rem;
  text-align: left;
  cursor: pointer;
  color: inherit;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.rt-court-tile.ok {
  border-color: rgba(30, 169, 122, 0.3);
  box-shadow: inset 0 4px 0 rgba(30, 169, 122, 0.5);
}

.rt-court-tile.attention {
  border-color: rgba(217, 74, 58, 0.32);
  box-shadow: inset 0 4px 0 rgba(217, 74, 58, 0.45);
}

.rt-court-tile.idle {
  border-color: rgba(138, 154, 160, 0.35);
  color: var(--muted);
}

.rt-court-tile.selected {
  box-shadow: 0 12px 24px rgba(15, 34, 38, 0.12);
  border-color: var(--accent);
  transform: translateY(-2px);
}

.rt-court-tile:hover {
  border-color: rgba(44, 126, 136, 0.45);
}

.rt-court-tile:focus-visible {
  outline: 2px solid rgba(99, 185, 196, 0.8);
  outline-offset: 2px;
}

.rt-court-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.rt-court-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.rt-beta {
  background: rgba(217, 74, 58, 0.12);
  color: var(--attention);
  border: 1px solid rgba(217, 74, 58, 0.35);
  font-size: 0.65rem;
  padding: 0.15rem 0.4rem;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.rt-court-name {
  font-size: 1.08rem;
  font-weight: 700;
}

.rt-court-status {
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.rt-court-status.ok {
  background: rgba(30, 169, 122, 0.12);
  color: var(--ok);
}

.rt-court-status.attention {
  background: rgba(217, 74, 58, 0.12);
  color: var(--attention);
}

.rt-court-status.idle {
  background: rgba(138, 154, 160, 0.18);
  color: var(--idle);
}

.rt-court-meta {
  display: flex;
  justify-content: space-between;
  font-size: 0.86rem;
  color: var(--muted);
}

.rt-court-flags {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: center;
}

.rt-flag {
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.72rem;
  border: 1px solid transparent;
}

.rt-flag.on {
  border-color: rgba(30, 169, 122, 0.35);
  color: var(--ok);
  background: rgba(30, 169, 122, 0.12);
  box-shadow: 0 0 12px rgba(30, 169, 122, 0.35);
  animation: glowPulse 2.4s ease-in-out infinite;
}

.rt-flag.off {
  border-color: rgba(217, 74, 58, 0.35);
  color: var(--attention);
}

.rt-flag.paid {
  border-color: rgba(30, 169, 122, 0.35);
  color: var(--ok);
}

.rt-flag.unpaid {
  border-color: rgba(217, 74, 58, 0.35);
  color: var(--attention);
}

.rt-camera-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(15, 34, 38, 0.12);
  background: #f8fbfb;
  color: var(--accent);
  border-radius: 999px;
  width: 34px;
  height: 34px;
  cursor: pointer;
}

.rt-camera-button i {
  font-size: 0.9rem;
}

.rt-camera-button:hover {
  border-color: rgba(44, 126, 136, 0.4);
  box-shadow: 0 6px 12px rgba(44, 126, 136, 0.15);
}

.rt-light-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  font-size: 0.7rem;
  border: 1px solid rgba(15, 34, 38, 0.12);
  background: #f6fbfa;
  color: var(--text);
  cursor: pointer;
}

.rt-light-toggle.on {
  border-color: rgba(30, 169, 122, 0.35);
  color: var(--ok);
  background: rgba(30, 169, 122, 0.12);
}

.rt-light-toggle.off {
  border-color: rgba(217, 74, 58, 0.3);
  color: var(--attention);
  background: rgba(217, 74, 58, 0.1);
}

.rt-light-switch {
  width: 26px;
  height: 14px;
  border-radius: 999px;
  background: rgba(15, 34, 38, 0.18);
  position: relative;
}

.rt-light-switch::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(15, 34, 38, 0.18);
  transition: transform 0.2s ease;
}

.rt-light-toggle.on .rt-light-switch {
  background: rgba(30, 169, 122, 0.55);
}

.rt-light-toggle.on .rt-light-switch::after {
  transform: translateX(12px);
}

.rt-details {
  background: var(--panel-strong);
  border-radius: 18px;
  padding: 1.25rem;
  border: 1px solid rgba(15, 34, 38, 0.08);
}

.rt-camera-url {
  margin: 0.25rem 0 0;
  font-size: 0.75rem;
  color: var(--muted);
  word-break: break-all;
}

.rt-camera-close {
  border: 1px solid rgba(15, 34, 38, 0.12);
  background: #ffffff;
  color: var(--text);
  border-radius: 10px;
  width: 34px;
  height: 34px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.rt-camera-video {
  width: 100%;
  height: 500px;
  border-radius: 12px;
  background: #0b1a1d;
}

.rt-camera-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: min(420px, 92vw);
  height: 100vh;
  background: #ffffff;
  border-left: 1px solid rgba(15, 34, 38, 0.12);
  box-shadow: -16px 0 36px rgba(15, 34, 38, 0.16);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  z-index: 9999;
}

.rt-camera-drawer__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.rt-camera-drawer__header h3 {
  margin: 0;
  font-size: 1.1rem;
}
.rt-detail-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.rt-detail-header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
}

.rt-detail-header h4 {
  margin: 0;
  font-size: 1.2rem;
}

.rt-detail-header p {
  margin: 0.35rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
}

.rt-badge {
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  font-size: 0.75rem;
  border: 1px solid transparent;
}

.rt-badge.on {
  border-color: rgba(30, 169, 122, 0.35);
  color: var(--ok);
  background: rgba(30, 169, 122, 0.12);
  box-shadow: 0 0 12px rgba(30, 169, 122, 0.3);
  animation: glowPulse 2.4s ease-in-out infinite;
}

.rt-badge.off {
  border-color: rgba(217, 74, 58, 0.35);
  color: var(--attention);
}

.rt-detail-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.rt-detail-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(44, 126, 136, 0.08);
  padding: 0.6rem 0.75rem;
  border-radius: 12px;
  border: 1px solid rgba(15, 34, 38, 0.06);
}

.rt-detail-actions-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.rt-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  color: var(--muted);
}

.rt-check input {
  accent-color: var(--accent);
}

.rt-detail-name {
  display: block;
  font-weight: 600;
}

.rt-detail-role {
  display: block;
  font-size: 0.75rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.rt-chip {
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  border: 1px solid transparent;
}

.rt-chip.paid {
  color: var(--ok);
  border-color: rgba(30, 169, 122, 0.35);
  background: linear-gradient(135deg, rgba(30, 169, 122, 0.16), rgba(30, 169, 122, 0.05));
  box-shadow: 0 6px 14px rgba(30, 169, 122, 0.18);
  font-weight: 600;
}

.rt-chip.unpaid {
  color: var(--attention);
  border-color: rgba(217, 74, 58, 0.35);
  background: linear-gradient(135deg, rgba(217, 74, 58, 0.14), rgba(217, 74, 58, 0.04));
  box-shadow: 0 6px 14px rgba(217, 74, 58, 0.16);
  font-weight: 600;
}

.rt-detail-actions {
  display: flex;
  gap: 0.75rem;
}

.rt-action {
  flex: 1;
  border-radius: 10px;
  border: 1px solid transparent;
  padding: 0.6rem 1rem;
  cursor: pointer;
  font-weight: 600;
  font-size: 0.9rem;
  font-family: inherit;
}

.rt-action.primary {
  background: var(--accent);
  color: #f5fffe;
}

.rt-action.secondary {
  background: transparent;
  border-color: rgba(15, 34, 38, 0.2);
  color: var(--text);
}

.rt-action:hover {
  filter: brightness(1.05);
}

.rt-action:disabled {
  cursor: not-allowed;
  opacity: 0.5;
  filter: none;
}

@keyframes glowPulse {
  0% {
    box-shadow: 0 0 6px rgba(30, 169, 122, 0.2);
  }
  50% {
    box-shadow: 0 0 16px rgba(30, 169, 122, 0.45);
  }
  100% {
    box-shadow: 0 0 6px rgba(30, 169, 122, 0.2);
  }
}

.rt-detail-empty {
  color: var(--muted);
  font-size: 0.95rem;
}

.loading,
.invalid-id {
  text-align: center;
  padding: 2rem;
  font-size: 1.2rem;
  color: #1c2a2f;
}

.rt-view-players{
  margin-top:6px;
  font-size:18px;
  cursor:pointer;
}

.rt-players-modal-overlay{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.5);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

.rt-players-modal{
  background:white;
  width:600px;
  border-radius:10px;
  padding:20px;
}

.rt-players-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
}

.rt-players-list {
  margin-top: 15px;
  width: 100%;
}

.rt-player-header,
.rt-player-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1.5fr 1fr 1.5fr;
  align-items: center;
  padding: 10px 16px;
  border-bottom: 1px solid #eee;
  font-size: 14px;
  column-gap: 30px;
}

.rt-player-header {
  font-weight: 600;
  background: #f7f7f7;
}

.rt-player-row:hover {
  background: #fafafa;
}

.rt-player-name {
  font-weight: 500;
}

.rt-player-role {
  color: #777;
}

.rt-player-payment.paid {
  color: #2e7d32;
  font-weight: 600;
}

.rt-player-payment.unpaid {
  color: #d32f2f;
  font-weight: 600;
}

.rt-request-pay-btn {
  padding: 5px 10px;
  border: none;
  background: #ff9800;
  color: white;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
}

.rt-request-pay-btn:hover {
  background: #f57c00;
}

@media (max-width: 1024px) {
  .rt-body {
    grid-template-columns: 1fr;
  }

  .rt-details {
    order: -1;
  }
}

@media (max-width: 720px) {
  .rt-dashboard {
    padding: 1.5rem;
  }

  .rt-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .rt-meta {
    align-items: flex-start;
  }

  .rt-summary {
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  }

  .rt-detail-actions {
    flex-direction: column;
  }
}
.container {
    text-align: center;
}

.logsContainer {
    text-align: left;
    margin: 20px auto;
    max-width: 400px;
}

.logsList {
    list-style: none;
    padding-left: 0;
}

.statusBox {
    padding: 20px;
    border-radius: 10px;
    display: inline-block;
}

.errorBox {
    border: 2px solid red;
}

.successBox {
    border: 2px solid green;
}

.retryButton {
    margin-top: 10px;
}

.webcamContainer {
    position: relative;
    display: inline-block;
}

.webcam {
    border-radius: 10px;
    border: 2px solid gray;
    width: 400px;
}.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
  }
  
  .modal-content {
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    position: relative;
    width: 90%;
    max-width: 500px;
  }
  .modal-small {
  max-width: 300px;
}

.modal-medium {
  max-width: 500px;
}

.modal-content.modal-large {
  max-width: 1200px;
  max-height: 1200px;
  width: 80%;
  padding: 2rem;
}
  .modal-close {
    position: absolute;
    top: 10px;
    right: 15px;
    border: none;
    background: transparent;
    font-size: 24px;
    cursor: pointer;
  }
  
  .modal-close:hover {
    color: red;
  }
  .lock-inline-container {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 1.5rem;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  justify-content: center;
  flex-wrap: wrap;
  background-color: #000000;
}

.lock-button {
  padding: 12px 20px;
  font-size: 16px;
  font-weight: 600;
  background-color: #1976d2;
  color: white;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.lock-button:hover {
  background-color: #0d47a1;
  transform: scale(1.05);
}

.lock-status-card {
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 12px;
  font-size: 18px;
  font-weight: bold;
  animation: fadeIn 0.5s ease;
  gap: 12px;
  border: 1px solid;
}

.lock-status-card.locked {
  background-color: #ffe5e5;
  color: #b71c1c;
  border-color: #f44336;
}

.lock-status-card.unlocked {
  background-color: #e6f4ea;
  color: #1b5e20;
  border-color: #4caf50;
}

.lock-icon {
  font-size: 32px;
  animation-duration: 0.8s;
  animation-fill-mode: both;
}

.lock-icon.locked {
  animation-name: shake-lock;
}

.lock-icon.unlocked {
  animation-name: door-swing;
}

.lock-text {
  font-size: 18px;
}

.lock-error {
  color: red;
  margin-top: 10px;
  font-weight: 500;
  width: 100%;
  text-align: center;
}

/* Animations */
@keyframes shake-lock {
  0% { transform: rotate(0); }
  25% { transform: rotate(-10deg); }
  50% { transform: rotate(10deg); }
  75% { transform: rotate(-5deg); }
  100% { transform: rotate(0); }
}

@keyframes door-swing {
  0% { transform: perspective(600px) rotateY(0deg); opacity: 1; }
  100% { transform: perspective(600px) rotateY(75deg); opacity: 0.9; }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.create-club-container {
  background: 
    url('/assets/tenniscourt-BgJ6edJw.png') no-repeat center bottom,
    linear-gradient(to bottom, #E1E4F3 0%, #F5F5F7 100%);
  background-size: 100% auto, cover;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 90vh;
  position: relative;
  overflow: hidden;
  padding: 2rem 1rem;
}
.create-club-layout {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}

.create-club-character {
  position: absolute;
  right: -200px;
  bottom: 0;
}

.create-club-character img {
  max-width: 420px;
  height: auto;
}
.create-club-ball {
 position: absolute;
  left: -80px;
  top: 80%;
  transform: translateY(-50%); 
}

.create-club-ball img {
  max-width: 220px;   /* smaller than character */
  height: auto;
  
}

.create-club-content {
  background: #ffffff;
  color: #000;
  padding: 24px;
  border-radius: 1rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  width: 50rem;
  max-height: 800px;
  /* Layout */
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /* Centering + layering */
  position: relative;
  flex: 0 0 560px;            /* fixed width, no shrink */
  margin: 0 auto;  
  margin-top: 150px;
}

.create-club-form {
  flex: 1;
  display: flex;
  flex-direction: column;
  max-height: 580px;
}

.create-club-footer {
  position: sticky;
  bottom: 0;
  background: rgba(255, 255, 255, 0.85);
  z-index: 10;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.but1{
  margin-top: 15px !important;
  width: 80% !important;
  background-color: #2C7E88 !important;
  border-radius: 20px !important;
}

.create-club-content label {
  font-weight: 200;
  font-size: 1rem;
  margin-bottom: 4px;
  display: block;
  color: #000;
}

.create-club-scrollable {
  flex: 1;
  overflow-y: auto;
  padding-right: 8px;
}

.create-club-scrollable::-webkit-scrollbar {
  width: 8px; /* scrollbar width */
}

.create-club-scrollable::-webkit-scrollbar-track {
  background: #ffffff;
  border-radius: 10px;
}

.create-club-scrollable::-webkit-scrollbar-thumb {
  background: #cfcfcf;
  border-radius: 10px;
}

.create-club-scrollable::-webkit-scrollbar-thumb:hover {
  background: #b5b5b5;
}

/* Firefox Support */
.create-club-scrollable {
  scrollbar-width: thin;
  scrollbar-color: #cfcfcf #ffffff;
}

@media screen and (max-width: 1024px) {
  img.bg {
    left: 50%;
    margin-left: -512px;
  }
}

/* OTP input boxes */
.otp-box {
  width: 3rem !important;
  height: 3rem;
  margin-left: 6px;
  font-size: 1.4rem;
  border-radius: 10px;
  border: 1px solid #2C7E88;
  background-color: #ffffff !important;
  text-align: center;
  color: #000;
}

/* OTP buttons (shared style) */
.otp-action-btn {
  background-color: #2C7E88 !important;
  color: #fff !important;
  text-transform: none;
  border-radius: 20px;
  padding: 6px 16px;
}

.otp-action-btn:hover {
  opacity: 0.8;
}

.otp-action-row {
  margin-top: 12px;
  margin-bottom: 16px;
}

/* Outlined resend button */
.otp-action-btn.outlined {
  background-color: transparent !important;
  color: #2C7E88 !important;
  border: 1px solid #2C7E88 !important;
}

.otp-action-btn.outlined:hover {
  background-color: rgba(44, 126, 136, 0.08) !important;
}

.login-link {
  color: #2C7E88;
  text-decoration: none;
  font-weight: bold;
  padding: 20px;
}

/* Rounded MUI TextFields only inside scrollable area */
.create-club-scrollable .MuiOutlinedInput-root {
  border-radius: 12px;
}

/* Optional: cleaner border */
.create-club-scrollable .MuiOutlinedInput-notchedOutline {
  border-color: rgba(0, 0, 0, 0.2);
}

/* On focus */
.create-club-scrollable .MuiOutlinedInput-root.Mui-focused
  .MuiOutlinedInput-notchedOutline {
  border-color: #2C7E88;
  border-width: 2px;
}

/* Phone input rounded & aligned with MUI */
.create-club-scrollable .react-tel-input .form-control {
  width: 100% !important;
  height: 56px;
  border-radius: 12px !important;
  border: 1px solid rgba(0, 0, 0, 0.2) !important;
  font-size: 1rem;
  background-color: #fff;
  color: #000;
}

/* Focus state */
.create-club-scrollable .react-tel-input .form-control:focus {
  border-color: #2C7E88 !important;
  box-shadow: 0 0 0 1px #2C7E88;
}

/* Hide floating label gap */
.react-tel-input .special-label {
  display: none !important;
}

.terms-link {
  color: #2C7E88;
  text-decoration: underline;
  font-weight: 500;
}

.terms-link:hover {
  opacity: 0.8;
}
.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:25px;height:20px;background-image:url(data:image/png;base64,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);background-repeat:no-repeat}.react-tel-input .ad{background-position:-48px -24px}.react-tel-input .ae{background-position:-72px -24px}.react-tel-input .af{background-position:-96px -24px}.react-tel-input .ag{background-position:-120px -24px}.react-tel-input .ai{background-position:-144px -24px}.react-tel-input .al{background-position:-168px -24px}.react-tel-input .am{background-position:-192px -24px}.react-tel-input .an{background-position:-216px -24px}.react-tel-input .ao{background-position:-240px -24px}.react-tel-input .aq{background-position:-264px -24px}.react-tel-input .ar{background-position:-288px -24px}.react-tel-input .as{background-position:-312px -24px}.react-tel-input .at{background-position:-336px -24px}.react-tel-input .au{background-position:-360px -24px}.react-tel-input .aw{background-position:-384px -24px}.react-tel-input .ax{background-position:0 -48px}.react-tel-input .az{background-position:-24px -48px}.react-tel-input .ba{background-position:-48px -48px}.react-tel-input .bb{background-position:-72px -48px}.react-tel-input .bd{background-position:-96px -48px}.react-tel-input .be{background-position:-120px -48px}.react-tel-input .bf{background-position:-144px -48px}.react-tel-input .bg{background-position:-168px -48px}.react-tel-input .bh{background-position:-192px -48px}.react-tel-input .bi{background-position:-216px -48px}.react-tel-input .bj{background-position:-240px -48px}.react-tel-input .bl{background-position:-264px -48px}.react-tel-input .bm{background-position:-288px -48px}.react-tel-input .bn{background-position:-312px -48px}.react-tel-input .bo{background-position:-336px -48px}.react-tel-input .br{background-position:-360px -48px}.react-tel-input .bs{background-position:-384px -48px}.react-tel-input .bt{background-position:0 -72px}.react-tel-input .bw{background-position:-24px -72px}.react-tel-input .by{background-position:-48px -72px}.react-tel-input .bz{background-position:-72px -72px}.react-tel-input .ca{background-position:-96px -72px}.react-tel-input .cc{background-position:-120px -72px}.react-tel-input .cd{background-position:-144px -72px}.react-tel-input .cf{background-position:-168px -72px}.react-tel-input .cg{background-position:-192px -72px}.react-tel-input .ch{background-position:-216px -72px}.react-tel-input .ci{background-position:-240px -72px}.react-tel-input .ck{background-position:-264px -72px}.react-tel-input .cl{background-position:-288px -72px}.react-tel-input .cm{background-position:-312px -72px}.react-tel-input .cn{background-position:-336px -72px}.react-tel-input .co{background-position:-360px -72px}.react-tel-input .cr{background-position:-384px -72px}.react-tel-input .cu{background-position:0 -96px}.react-tel-input .cv{background-position:-24px -96px}.react-tel-input .cw{background-position:-48px -96px}.react-tel-input .cx{background-position:-72px -96px}.react-tel-input .cy{background-position:-96px -96px}.react-tel-input .cz{background-position:-120px -96px}.react-tel-input .de{background-position:-144px -96px}.react-tel-input .dj{background-position:-168px -96px}.react-tel-input .dk{background-position:-192px -96px}.react-tel-input .dm{background-position:-216px -96px}.react-tel-input .do{background-position:-240px -96px}.react-tel-input .dz{background-position:-264px -96px}.react-tel-input .ec{background-position:-288px -96px}.react-tel-input .ee{background-position:-312px -96px}.react-tel-input .eg{background-position:-336px -96px}.react-tel-input .eh{background-position:-360px -96px}.react-tel-input .er{background-position:-384px -96px}.react-tel-input .es{background-position:0 -120px}.react-tel-input .et{background-position:-24px -120px}.react-tel-input .eu{background-position:-48px -120px}.react-tel-input .fi{background-position:-72px -120px}.react-tel-input .fj{background-position:-96px -120px}.react-tel-input .fk{background-position:-120px -120px}.react-tel-input .fm{background-position:-144px -120px}.react-tel-input .fo{background-position:-168px -120px}.react-tel-input .fr{background-position:-192px -120px}.react-tel-input .ga{background-position:-216px -120px}.react-tel-input .gb{background-position:-240px -120px}.react-tel-input .gd{background-position:-264px -120px}.react-tel-input .ge{background-position:-288px -120px}.react-tel-input .gg{background-position:-312px -120px}.react-tel-input .gh{background-position:-336px -120px}.react-tel-input .gi{background-position:-360px -120px}.react-tel-input .gl{background-position:-384px -120px}.react-tel-input .gm{background-position:0 -144px}.react-tel-input .gn{background-position:-24px -144px}.react-tel-input .gq{background-position:-48px -144px}.react-tel-input .gr{background-position:-72px -144px}.react-tel-input .gs{background-position:-96px -144px}.react-tel-input .gt{background-position:-120px -144px}.react-tel-input .gu{background-position:-144px -144px}.react-tel-input .gw{background-position:-168px -144px}.react-tel-input .gy{background-position:-192px -144px}.react-tel-input .hk{background-position:-216px -144px}.react-tel-input .hn{background-position:-240px -144px}.react-tel-input .hr{background-position:-264px -144px}.react-tel-input .ht{background-position:-288px -144px}.react-tel-input .hu{background-position:-312px -144px}.react-tel-input .ic{background-position:-336px -144px}.react-tel-input .id{background-position:-360px -144px}.react-tel-input .ie{background-position:-384px -144px}.react-tel-input .il{background-position:0 -168px}.react-tel-input .im{background-position:-24px -168px}.react-tel-input .in{background-position:-48px -168px}.react-tel-input .iq{background-position:-72px -168px}.react-tel-input .ir{background-position:-96px -168px}.react-tel-input .is{background-position:-120px -168px}.react-tel-input .it{background-position:-144px -168px}.react-tel-input .je{background-position:-168px -168px}.react-tel-input .jm{background-position:-192px -168px}.react-tel-input .jo{background-position:-216px -168px}.react-tel-input .jp{background-position:-240px -168px}.react-tel-input .ke{background-position:-264px -168px}.react-tel-input .kg{background-position:-288px -168px}.react-tel-input .kh{background-position:-312px -168px}.react-tel-input .ki{background-position:-336px -168px}.react-tel-input .xk{background-position:-144px 0}.react-tel-input .km{background-position:-360px -168px}.react-tel-input .kn{background-position:-384px -168px}.react-tel-input .kp{background-position:0 -192px}.react-tel-input .kr{background-position:-24px -192px}.react-tel-input .kw{background-position:-48px -192px}.react-tel-input .ky{background-position:-72px -192px}.react-tel-input .kz{background-position:-96px -192px}.react-tel-input .la{background-position:-120px -192px}.react-tel-input .lb{background-position:-144px -192px}.react-tel-input .lc{background-position:-168px -192px}.react-tel-input .li{background-position:-192px -192px}.react-tel-input .lk{background-position:-216px -192px}.react-tel-input .lr{background-position:-240px -192px}.react-tel-input .ls{background-position:-264px -192px}.react-tel-input .lt{background-position:-288px -192px}.react-tel-input .lu{background-position:-312px -192px}.react-tel-input .lv{background-position:-336px -192px}.react-tel-input .ly{background-position:-360px -192px}.react-tel-input .ma{background-position:-384px -192px}.react-tel-input .mc{background-position:0 -216px}.react-tel-input .md{background-position:-24px -216px}.react-tel-input .me{background-position:-48px -216px}.react-tel-input .mf{background-position:-72px -216px}.react-tel-input .mg{background-position:-96px -216px}.react-tel-input .mh{background-position:-120px -216px}.react-tel-input .mk{background-position:-144px -216px}.react-tel-input .ml{background-position:-168px -216px}.react-tel-input .mm{background-position:-192px -216px}.react-tel-input .mn{background-position:-216px -216px}.react-tel-input .mo{background-position:-240px -216px}.react-tel-input .mp{background-position:-264px -216px}.react-tel-input .mq{background-position:-288px -216px}.react-tel-input .mr{background-position:-312px -216px}.react-tel-input .ms{background-position:-336px -216px}.react-tel-input .mt{background-position:-360px -216px}.react-tel-input .mu{background-position:-384px -216px}.react-tel-input .mv{background-position:0 -240px}.react-tel-input .mw{background-position:-24px -240px}.react-tel-input .mx{background-position:-48px -240px}.react-tel-input .my{background-position:-72px -240px}.react-tel-input .mz{background-position:-96px -240px}.react-tel-input .na{background-position:-120px -240px}.react-tel-input .nc{background-position:-144px -240px}.react-tel-input .ne{background-position:-168px -240px}.react-tel-input .nf{background-position:-192px -240px}.react-tel-input .ng{background-position:-216px -240px}.react-tel-input .ni{background-position:-240px -240px}.react-tel-input .nl{background-position:-264px -240px}.react-tel-input .no{background-position:-288px -240px}.react-tel-input .np{background-position:-312px -240px}.react-tel-input .nr{background-position:-336px -240px}.react-tel-input .nu{background-position:-360px -240px}.react-tel-input .nz{background-position:-384px -240px}.react-tel-input .om{background-position:0 -264px}.react-tel-input .pa{background-position:-24px -264px}.react-tel-input .pe{background-position:-48px -264px}.react-tel-input .pf{background-position:-72px -264px}.react-tel-input .pg{background-position:-96px -264px}.react-tel-input .ph{background-position:-120px -264px}.react-tel-input .pk{background-position:-192px -264px}.react-tel-input .pl{background-position:-216px -264px}.react-tel-input .pn{background-position:-240px -264px}.react-tel-input .pr{background-position:-264px -264px}.react-tel-input .ps{background-position:-288px -264px}.react-tel-input .pt{background-position:-312px -264px}.react-tel-input .pw{background-position:-336px -264px}.react-tel-input .py{background-position:-360px -264px}.react-tel-input .qa{background-position:-384px -264px}.react-tel-input .ro{background-position:0 -288px}.react-tel-input .rs{background-position:-24px -288px}.react-tel-input .ru{background-position:-48px -288px}.react-tel-input .rw{background-position:-72px -288px}.react-tel-input .sa{background-position:-96px -288px}.react-tel-input .sb{background-position:-120px -288px}.react-tel-input .sc{background-position:-144px -288px}.react-tel-input .sd{background-position:-168px -288px}.react-tel-input .se{background-position:-192px -288px}.react-tel-input .sg{background-position:-216px -288px}.react-tel-input .sh{background-position:-240px -288px}.react-tel-input .si{background-position:-264px -288px}.react-tel-input .sk{background-position:-288px -288px}.react-tel-input .sl{background-position:-312px -288px}.react-tel-input .sm{background-position:-336px -288px}.react-tel-input .sn{background-position:-360px -288px}.react-tel-input .so{background-position:-384px -288px}.react-tel-input .sr{background-position:0 -312px}.react-tel-input .ss{background-position:-24px -312px}.react-tel-input .st{background-position:-48px -312px}.react-tel-input .sv{background-position:-72px -312px}.react-tel-input .sy{background-position:-96px -312px}.react-tel-input .sz{background-position:-120px -312px}.react-tel-input .tc{background-position:-144px -312px}.react-tel-input .td{background-position:-168px -312px}.react-tel-input .tf{background-position:-192px -312px}.react-tel-input .tg{background-position:-216px -312px}.react-tel-input .th{background-position:-240px -312px}.react-tel-input .tj{background-position:-264px -312px}.react-tel-input .tk{background-position:-288px -312px}.react-tel-input .tl{background-position:-312px -312px}.react-tel-input .tm{background-position:-336px -312px}.react-tel-input .tn{background-position:-360px -312px}.react-tel-input .to{background-position:-384px -312px}.react-tel-input .tr{background-position:0 -336px}.react-tel-input .tt{background-position:-24px -336px}.react-tel-input .tv{background-position:-48px -336px}.react-tel-input .tw{background-position:-72px -336px}.react-tel-input .tz{background-position:-96px -336px}.react-tel-input .ua{background-position:-120px -336px}.react-tel-input .ug{background-position:-144px -336px}.react-tel-input .us{background-position:-168px -336px}.react-tel-input .uy{background-position:-192px -336px}.react-tel-input .uz{background-position:-216px -336px}.react-tel-input .va{background-position:-240px -336px}.react-tel-input .vc{background-position:-264px -336px}.react-tel-input .ve{background-position:-288px -336px}.react-tel-input .vg{background-position:-312px -336px}.react-tel-input .vi{background-position:-336px -336px}.react-tel-input .vn{background-position:-360px -336px}.react-tel-input .vu{background-position:-384px -336px}.react-tel-input .wf{background-position:0 -360px}.react-tel-input .ws{background-position:-24px -360px}.react-tel-input .ye{background-position:-48px -360px}.react-tel-input .za{background-position:-96px -360px}.react-tel-input .zm{background-position:-120px -360px}.react-tel-input .zw{background-position:-144px -360px}.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{font-size:16px;background:#FFFFFF;border:1px solid #CACACA;border-radius:5px;width:300px;outline:none;padding:18.5px 14px 18.5px 58px;transition:box-shadow ease .25s,border-color ease .25s}.react-tel-input .form-control:hover{border-color:#000}.react-tel-input .form-control:focus{border-color:#1976d2;box-shadow:0 0 0 1px #1976d2}.react-tel-input .form-control:focus+div:before{color:#1976d2}.react-tel-input .form-control.invalid-number{border:1px solid #f44336}.react-tel-input .form-control.invalid-number:focus{box-shadow:0 0 0 1px #f44336}.react-tel-input .form-control.invalid-number+div:before{content:'Error';display:none;color:#f44336;width:27px}.react-tel-input .flag-dropdown{position:absolute;top:0;bottom:0;padding:0;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.open{z-index:2}.react-tel-input input[disabled]+.flag-dropdown:hover{cursor:default;border-color:#CACACA}.react-tel-input input[disabled]+.flag-dropdown:hover .selected-flag{background-color:transparent}.react-tel-input .selected-flag{outline:none;position:relative;width:52px;height:100%;padding:0 0 0 11px;border-radius:3px 0 0 3px}.react-tel-input .selected-flag:focus .arrow{border-left-width:4px;border-right-width:4px;border-top:5px solid #1976d2}.react-tel-input .selected-flag .flag{position:absolute;top:50%;margin-top:-12px}.react-tel-input .selected-flag .arrow{position:relative;top:50%;margin-top:-1px;left:29px;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 18px rgba(0,0,0,0.25);background-color:white;width:300px;max-height:220px;overflow-y:scroll;border-radius:7px}.react-tel-input .country-list .flag{display:inline-block;position:absolute;left:13px;top:8px}.react-tel-input .country-list .divider{padding-bottom:5px;margin-bottom:5px;border-bottom:1px solid #ccc}.react-tel-input .country-list .country{position:relative;padding:12px 9px 13px 46px}.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{z-index:2;position:sticky;top:0;background-color:#fff;padding:10px 0 6px 10px}.react-tel-input .country-list .search-emoji{display:none;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 .search-box:hover{border-color:#505050}.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:25px;top:-7px;background:#fff;padding:0 5px;color:#de0000}.react-tel-input .special-label{position:absolute;z-index:1;top:-7px;left:25px;display:block;background:white;padding:0 5px;font-size:13px;white-space:nowrap}.devices-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.devices-title {
  font-size: 2rem;
  font-weight: 700;
  margin: 0;
}

.add-device {
  white-space: nowrap;
  padding: 10px 24px;
  background-color: #ffffff;
  color: black;
  border-radius: 30px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s, transform 0.2s;
  display: inline-block;
  width: auto;
}

.add-device:hover {
  background-color: #1565c0;
  transform: translateY(-1px);
  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.15);
}

.chip-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  padding: 8px 0;
  max-width: 100%;
}

.table-link {
  color: #2C7E88;
  text-decoration: none;
  font-weight: 500;
  word-break: break-all;
  transition: all 0.2s ease;
}

.table-link:hover {
  text-decoration: underline;
}

.table-na {
  color: #9e9e9e;
}.club-memberships {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(102, 240, 210, 0.15), transparent 60%),
    radial-gradient(900px 480px at 90% -20%, rgba(45, 140, 151, 0.12), transparent 55%),
    var(--surface-0);
  border-radius: 24px;
}

.club-memberships__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}
.club-memberships__slot-card {
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 16px;
  margin-top: 12px;
  background: #fafafa;
}

.club-memberships__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}

.club-memberships__card {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfb 100%);
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 18px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  box-shadow: 0 16px 30px rgba(15, 34, 38, 0.08);
  position: relative;
  overflow: hidden;
}
.club-memberships__card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, rgba(45, 140, 151, 0.12), transparent 45%);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
.club-memberships__card:hover::after {
  opacity: 1;
}

.club-memberships__card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.club-memberships__card-actions {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
}

.club-memberships__empty {
  padding: 2rem;
  border: 1px dashed rgba(15, 34, 38, 0.2);
  border-radius: 16px;
  text-align: center;
  color: var(--ink-muted);
  background: var(--surface-2);
}

.club-memberships__drawer {
  width: 45vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: #fff;
  overflow: hidden;
}

.club-memberships__drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem 1.5rem 1rem 1.5rem;
  flex-shrink: 0;
  background: #fff;
}

.club-memberships__drawer-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.5rem;
  min-height: 0;
}

.club-memberships__drawer-footer {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 1.5rem 1rem 1.5rem;
  border-top: 1px solid #e6ecef;
  background: #fff;
  flex-shrink: 0;
  box-shadow: 0 -8px 18px rgba(15, 34, 38, 0.06);
  position: relative;
  z-index: 2;
}

.club-memberships__form {
  padding-bottom: 0.5rem;
}

.club-memberships__section {
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 18px;
  padding: 1.25rem;
  background: var(--surface-1);
  box-shadow: 0 12px 24px rgba(15, 34, 38, 0.06);
}

.club-memberships__section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.club-memberships__activity-card {
  border: 1px solid rgba(15, 34, 38, 0.08);
  border-radius: 16px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: rgba(45, 140, 151, 0.06);
}

.club-memberships__activity-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.club-memberships__activity-card.MuiAccordion-root {
  box-shadow: none;
  margin: 0;
}

.club-memberships__activity-card.MuiAccordion-root:before {
  display: none;
}

.club-memberships__activity-card .MuiAccordionSummary-content {
  margin: 0.25rem 0;
}

.club-memberships__activity-card .MuiAccordionDetails-root {
  padding: 0 0 1rem;
}

.club-memberships__resource-rule {
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 14px;
  padding: 0.75rem;
  background: var(--surface-1);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.club-memberships__resource-rule-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
}

.club-memberships__slot-config {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.club-memberships__slot-rows {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.club-memberships__slot-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) auto;
  align-items: center;
  padding: 0.5rem 0.75rem;
  border-radius: 12px;
  border: 1px solid rgba(15, 34, 38, 0.06);
  background: var(--surface-1);
  gap: 0.75rem;
}

.club-memberships__slot-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.club-memberships__slot-actions .MuiFormControlLabel-root {
  margin-right: 0;
}

.club-memberships__slot-actions .MuiFormControl-root {
  min-width: 160px;
}

.currency-prefix {
  margin-right: 6px;
  color: #8a98a1;
  font-size: 0.9rem;
}

.club-memberships__price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.club-memberships__price-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.club-memberships__slot-amount {
  max-width: 160px;
}

.club-memberships__collapse {
  align-self: flex-end;
}

.club-memberships__perk-row {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) minmax(240px, 360px);
  align-items: center;
  gap: 1rem;
  padding: 0.35rem 0;
}

.club-memberships__perk-row .MuiFormControlLabel-root {
  margin-right: 0;
}

.club-memberships__perk-row .MuiFormControlLabel-label {
  margin-left: 0.25rem;
}

.club-memberships__perk-fields {
  display: grid;
  grid-template-columns: 120px minmax(180px, 1fr);
  gap: 0.75rem;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
}

.club-memberships__perk-timeline {
  width: 100%;
}

.club-memberships__custom-perks {
  display: grid;
  grid-template-columns: minmax(200px, 1fr) 120px minmax(200px, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  width: 100%;
}

.club-memberships__custom-perks .MuiFormControl-root,
.club-memberships__custom-perks .MuiTextField-root {
  width: 100%;
}

.club-memberships__resource-helper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: -0.25rem;
  padding-left: 0.2rem;
}

.club-memberships__activity-card .MuiAutocomplete-root .MuiOutlinedInput-root {
  align-items: flex-start;
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
  min-height: 60px;
}

.club-memberships__activity-card .MuiAutocomplete-input {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}

.club-memberships__resource-select {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.club-memberships__two-column {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}

.club-memberships__block {
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 14px;
  padding: 0.75rem;
  background: var(--surface-1);
  overflow: hidden;
}

.club-memberships .MuiTypography-h5,
.club-memberships .MuiTypography-h6,
.club-memberships .MuiTypography-subtitle1 {
  font-family: var(--font-display);
  color: var(--ink-strong);
}

.club-memberships .MuiTypography-body2 {
  color: var(--ink-muted);
}

.club-memberships .MuiButton-contained {
  background: linear-gradient(135deg, var(--accent-strong), #2a6f76) !important;
  box-shadow: 0 10px 18px rgba(45, 140, 151, 0.25);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-memberships .MuiButton-contained:focus,
.club-memberships .MuiButton-contained:focus-visible,
.club-memberships .MuiButton-contained.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.35);
}

.club-memberships .MuiButton-outlined {
  border-color: rgba(15, 34, 38, 0.18);
  color: var(--ink-strong);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-memberships .MuiButton-outlined:focus,
.club-memberships .MuiButton-outlined:focus-visible,
.club-memberships .MuiButton-outlined.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.25);
}

@media (max-width: 900px) {
  .club-memberships {
    padding: 1.5rem;
  }
}
.membership-templates {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.membership-templates__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.membership-templates__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.membership-templates__card {
  background: #ffffff;
  border: 1px solid rgba(15, 34, 38, 0.08);
  border-radius: 16px;
  padding: 1.25rem 1.5rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: 0 10px 20px rgba(15, 34, 38, 0.04);
}

.membership-templates__actions {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.membership-templates__empty {
  padding: 2rem;
  border: 1px dashed rgba(15, 34, 38, 0.2);
  border-radius: 16px;
  text-align: center;
  color: #5e7076;
}

.membership-templates__drawer {
  width: min(460px, 92vw);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-height: 100vh;
  overflow-y: auto;
}

.membership-templates__drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.membership-templates__drawer-footer {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  position: sticky;
  bottom: 0;
  background: #ffffff;
  padding: 0.75rem 0;
  box-shadow: 0 -8px 18px rgba(15, 34, 38, 0.06);
}

@media (max-width: 900px) {
  .membership-templates {
    padding: 1.5rem;
  }

  .membership-templates__card {
    flex-direction: column;
  }
}
.clubMembersPage{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem;

    & h2{
        margin-bottom: 1rem;
        padding-left: 1rem;
    }

    .table-container{
        background-color: rgb(255, 255, 255);
        margin: 1rem;
        box-shadow: 0 0px 10px rgba(0, 0, 0, 0.2);
        border-radius: 0.5rem;
        width: 100%;

        & table{
            width: 100%;
            table-layout: fixed; 
            th, td {
                padding: 12px;
                text-align: left;
                word-wrap: break-word;
            }

            th, td:first-child {
                padding-left: 1.5rem;
            }
            
            & button{
                background-color: #578bf3;
                color: white;
            }

            & button:hover{
                background-color: black;
                color: white;
            }

        }
    }
}.club-reports {
  padding: 28px 32px 48px;
  color: #15262a;
}

.club-reports h1 {
  margin: 0;
  font-size: 32px;
  font-weight: 700;
}

.club-reports__subtext {
  margin: 6px 0 0;
  color: #5b6b70;
}

.club-reports__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.club-reports__filters {
  display: flex;
  gap: 16px;
}

.club-reports__filter {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: #5b6b70;
}

.club-reports__filter button {
  border: 1px solid #cfd7da;
  background: #fff;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 600;
  color: #1f3237;
  cursor: pointer;
}

.club-reports__metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-top: 24px;
}

.report-card {
  background: #fff;
  border-radius: 16px;
  padding: 16px 18px;
  border: 1px solid #e5ebed;
  box-shadow: 0 10px 20px rgba(21, 38, 42, 0.04);
}

.report-card__label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0;
  color: #5b6b70;
}

.report-card__value {
  font-size: 20px;
  font-weight: 700;
  margin: 8px 0 4px;
}

.report-card__note {
  margin: 0;
  font-size: 13px;
  color: #7a8a90;
}

.club-reports__grid {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  align-items: start;
}

.report-panel {
  background: #fff;
  border-radius: 20px;
  padding: 18px 20px;
  border: 1px solid #e5ebed;
  box-shadow: 0 12px 24px rgba(21, 38, 42, 0.05);
  align-self: start;
  overflow: hidden;
}

.report-panel--wide {
  grid-column: span 2;
}

.report-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.report-panel__header h2 {
  margin: 0 0 4px;
  font-size: 18px;
}

.report-panel__header p {
  margin: 0;
  color: #6d7c81;
  font-size: 13px;
}

.report-panel__badge {
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color: #006f6f;
  background: #e1f3f0;
}

.report-bars {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  height: 180px;
  padding-top: 8px;
}

.report-bars__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #5b6b70;
  height: 180px;
  justify-content: flex-end;
}

.report-bars__bar {
  width: 20px;
  border-radius: 10px 10px 6px 6px;
  background: linear-gradient(180deg, #3b8a9b 0%, #1d6d7b 100%);
}

.report-bars__bar--forecast {
  background: repeating-linear-gradient(
    135deg,
    rgba(59, 138, 155, 0.4),
    rgba(59, 138, 155, 0.4) 6px,
    rgba(59, 138, 155, 0.15) 6px,
    rgba(59, 138, 155, 0.15) 12px
  );
}

.report-stack {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 170px;
  overflow-x: auto;
  padding-bottom: 6px;
}

.report-stack__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: #5b6b70;
  min-width: 32px;
}

.report-stack__bar {
  width: 18px;
  height: 120px;
  display: flex;
  flex-direction: column-reverse;
  border-radius: 10px;
  overflow: hidden;
  background: #e9eff1;
}

.report-stack__bar span:nth-child(1) {
  background: #2d7d8c;
}

.report-stack__bar span:nth-child(2) {
  background: #5ba6a9;
}

.report-stack__bar span:nth-child(3) {
  background: #9fd0c7;
}

.report-legend {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
  font-size: 12px;
  color: #5b6b70;
}

.report-legend__item {
  display: flex;
  align-items: center;
  gap: 6px;
}

.report-legend__swatch {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.report-legend__swatch--0 { background: #2d7d8c; }
.report-legend__swatch--1 { background: #5ba6a9; }
.report-legend__swatch--2 { background: #9fd0c7; }

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

.report-forecast__chart {
  width: 100%;
  height: 180px;
}

.report-forecast__area {
  fill: rgba(59, 138, 155, 0.15);
}

.report-forecast__line {
  fill: none;
  stroke: #2d7d8c;
  stroke-width: 2.5;
}

.report-forecast__chart circle {
  fill: #2d7d8c;
}

.report-forecast__labels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
  font-size: 12px;
}

.report-forecast__labels strong {
  display: block;
  font-size: 14px;
  color: #15262a;
}

.report-courts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.report-courts__card {
  border: 1px solid #e5ebed;
  border-radius: 14px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
}

.report-courts__card strong {
  font-size: 16px;
}

.report-courts__meter {
  background: #eef2f3;
  border-radius: 999px;
  height: 6px;
  overflow: hidden;
}

.report-courts__meter div {
  background: #2d7d8c;
  height: 100%;
  border-radius: 999px;
}

.report-recommendations {
  display: grid;
  gap: 12px;
}

.report-recommendations strong {
  display: block;
  margin-bottom: 4px;
}

.report-recommendations p {
  margin: 0;
  color: #5b6b70;
  font-size: 13px;
}

@media (max-width: 1100px) {
  .report-panel--wide {
    grid-column: span 1;
  }
}

@media (max-width: 720px) {
  .club-reports {
    padding: 20px 18px 36px;
  }

  .club-reports__filters {
    width: 100%;
    justify-content: flex-start;
  }
}
.clubsListPage{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem;

    & h2{
        margin-bottom: 1rem;
        padding-left: 1rem;
    }

    .table-container{
        background-color: rgb(255, 255, 255);
        margin: 1rem;
        box-shadow: 0 0px 10px rgba(0, 0, 0, 0.2);
        border-radius: 0.5rem;
        width: 100%;

        & table{
            width: 100%;
            table-layout: fixed; 
            th, td {
                padding: 12px;
                text-align: left;
                word-wrap: break-word;
            }

            td:last-child {
                text-align: right;
            }

            th, td:first-child {
                padding-left: 1.5rem;
            }

            & button{
                background-color: #578bf3;
                color: white;
            }

            & button:hover{
                background-color: black;
                color: white;
            }

        }
    }
}.RequestsPage{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem;

    & h2{
        margin-bottom: 1rem;
        padding-left: 1rem;
    }

    .table-container{
        background-color: rgb(255, 255, 255);
        margin: 1rem;
        box-shadow: 0 0px 10px rgba(0, 0, 0, 0.2);
        border-radius: 0.5rem;
        width: 100%;

        & table{
            width: 100%;
            table-layout: fixed; 
            th, td {
                padding: 12px;
                text-align: left;
                word-wrap: break-word;
            }

            td:last-child {
                text-align: right;
            }

            th, td:first-child {
                padding-left: 1.5rem;
            }

            & button{
                background-color: #578bf3;
                color: white;
            }

            & button:hover{
                background-color: black;
                color: white;
            }
        }
    }
}.signup-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background: linear-gradient(to bottom right, #6bc1e3, #fbc02d);
}

.signup-form {
  background-color: #ffffff;
  padding: 2rem;
  border-radius: 10px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  width: 100%;
  max-width: 750px;
  height: 100%;
  overflow-y: scroll;
  z-index: 2;
}

.company-name {
  text-align: center;
  margin-bottom: 1rem;
  font-weight: bold;
}

.signup-heading {
  text-align: center;
  margin-bottom: 2.5rem;
}

.name-row {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
}

.half-width {
  flex: 1;
}

.form-field {
  margin-bottom: 1rem;
}

.submit-button {
  margin-top: 1rem;
  background-color: #1976d2;
  color: white;
  font-weight: bold;
  border-radius: 4px;
}

.submit-button:hover {
  background-color: #155a9c;
}
/* CSS variables. */
:root {
	--PhoneInput-color--focus: #03b2cb;
	--PhoneInputInternationalIconPhone-opacity: 0.8;
	--PhoneInputInternationalIconGlobe-opacity: 0.65;
	--PhoneInputCountrySelect-marginRight: 0.35em;
	--PhoneInputCountrySelectArrow-width: 0.3em;
	--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);
	--PhoneInputCountrySelectArrow-borderWidth: 1px;
	--PhoneInputCountrySelectArrow-opacity: 0.45;
	--PhoneInputCountrySelectArrow-color: currentColor;
	--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountrySelectArrow-transform: rotate(45deg);
	--PhoneInputCountryFlag-aspectRatio: 1.5;
	--PhoneInputCountryFlag-height: 1em;
	--PhoneInputCountryFlag-borderWidth: 1px;
	--PhoneInputCountryFlag-borderColor: rgba(0,0,0,0.5);
	--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);
	--PhoneInputCountryFlag-backgroundColor--loading: rgba(0,0,0,0.1);
}

.PhoneInput {
	/* This is done to stretch the contents of this component. */
	display: flex;
	align-items: center;
}

.PhoneInputInput {
	/* The phone number input stretches to fill all empty space */
	flex: 1;
	/* The phone number input should shrink
	   to make room for the extension input */
	min-width: 0;
}

.PhoneInputCountryIcon {
	width: calc(var(--PhoneInputCountryFlag-height) * var(--PhoneInputCountryFlag-aspectRatio));
	height: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--square {
	width: var(--PhoneInputCountryFlag-height);
}

.PhoneInputCountryIcon--border {
	/* Removed `background-color` because when an `<img/>` was still loading
	   it would show a dark gray rectangle. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom. */
	background-color: var(--PhoneInputCountryFlag-backgroundColor--loading);
	/* Border is added via `box-shadow` because `border` interferes with `width`/`height`. */
	/* For some reason the `<img/>` is not stretched to 100% width and height
	   and sometime there can be seen white pixels of the background at top and bottom,
	   so an additional "inset" border is added. */
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor);
}

.PhoneInputCountryIconImg {
	/* Fixes weird vertical space above the flag icon. */
	/* https://gitlab.com/catamphetamine/react-phone-number-input/-/issues/7#note_348586559 */
	display: block;
	/* 3rd party <SVG/> flag icons won't stretch if they have `width` and `height`.
	   Also, if an <SVG/> icon's aspect ratio was different, it wouldn't fit too. */
	width: 100%;
	height: 100%;
}

.PhoneInputInternationalIconPhone {
	opacity: var(--PhoneInputInternationalIconPhone-opacity);
}

.PhoneInputInternationalIconGlobe {
	opacity: var(--PhoneInputInternationalIconGlobe-opacity);
}

/* Styling native country `<select/>`. */

.PhoneInputCountry {
	position: relative;
	align-self: stretch;
	display: flex;
	align-items: center;
	margin-right: var(--PhoneInputCountrySelect-marginRight);
}

.PhoneInputCountrySelect {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	border: 0;
	opacity: 0;
	cursor: pointer;
}

.PhoneInputCountrySelect[disabled],
.PhoneInputCountrySelect[readonly] {
	cursor: default;
}

.PhoneInputCountrySelectArrow {
	display: block;
	content: '';
	width: var(--PhoneInputCountrySelectArrow-width);
	height: var(--PhoneInputCountrySelectArrow-width);
	margin-left: var(--PhoneInputCountrySelectArrow-marginLeft);
	border-style: solid;
	border-color: var(--PhoneInputCountrySelectArrow-color);
	border-top-width: 0;
	border-bottom-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	border-left-width: 0;
	border-right-width: var(--PhoneInputCountrySelectArrow-borderWidth);
	transform: var(--PhoneInputCountrySelectArrow-transform);
	opacity: var(--PhoneInputCountrySelectArrow-opacity);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon + .PhoneInputCountrySelectArrow {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon--border {
	box-shadow: 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus),
		inset 0 0 0 var(--PhoneInputCountryFlag-borderWidth) var(--PhoneInputCountryFlag-borderColor--focus);
}

.PhoneInputCountrySelect:focus + .PhoneInputCountryIcon .PhoneInputInternationalIconGlobe {
	opacity: 1;
	color: var(--PhoneInputCountrySelectArrow-color--focus);
}.RequestsPage {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 2rem;

  & h2 {
    margin-bottom: 1rem;
    padding-left: 1rem;
  }

  .table-container {
    background-color: rgb(255, 255, 255);
    margin: 1rem;
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.2);
    border-radius: 0.5rem;
    width: 100%;

    & table {
      width: 100%;
      table-layout: fixed;
      th,
      td {
        padding: 12px;
        text-align: left;
        word-wrap: break-word;
      }

      td:last-child {
        text-align: right;
      }

      & button {
        background-color: #578bf3;
      }

      & button:hover {
        background-color: black;
        color: white;
      }
    }
  }
}
/* Search bar wrapper */
.search-container {
  margin-top: 16px;
  margin-bottom: 16px;
}

/* MUI TextField root */
.search-input {
  background-color: #ffffff;
  border-radius: 14px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Input outline */
.search-input .MuiOutlinedInput-root {
  border-radius: 14px;
}

/* Default border */
.search-input .MuiOutlinedInput-notchedOutline {
  border-color: #e5e7eb;
}

/* Hover border */
.search-input:hover .MuiOutlinedInput-notchedOutline {
  border-color: #9ca3af;
}

/* Focus border */
.search-input.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: #2c7e88;
  border-width: 2px;
}

/* Search icon */
.search-icon {
  color: #9ca3af;
}

/* Clear (X) button */
.clear-icon-btn {
  padding: 4px;
  color: #9ca3af;
}

.clear-icon-btn:hover {
  color: #374151;
}

/* Role chip base style */
.role-chip {
  padding: 6px 12px;
  font-weight: 500;
  border-radius: 999px;
  background-color: #ffffff;
  color: #111827;
  border: 1px solid #2c7e88;

  /* Shadow */
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.12);

  /* Smooth animation */
  transition: all 0.25s ease;
}

/* Active chip */
.role-chip.active {
  background-color: #2c7e88;
  color: #ffffff;
  border: none;
  box-shadow: 0px 6px 14px rgba(44, 126, 136, 0.35);
}

/* Hover state */
.role-chip:hover {
  background-color: #f4f6f8;
  box-shadow: 0px 8px 18px rgba(0, 0, 0, 0.18);
  transform: translateY(-1px);
}

/* Hover when active */
.role-chip.active:hover {
  background-color: #246a72;
}

/* Click feedback */
.role-chip:active {
  transform: scale(0.97);
}
.add-user-modal-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.add-user-button-group {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 20px;
}

/* PhoneInput root */
.mui-phone-input {
  width: 100%;
  display: flex;
  align-items: center;
}

/* Flag + country code */
.mui-phone-input .PhoneInputCountry {
  margin-right: 8px;
  white-space: nowrap;
}

/* Actual phone input */
.mui-phone-input .PhoneInputInput {
  border: none;
  outline: none;
  font-size: 16px;
  width: 100%;
  background-color: transparent;
  color: #000;
}
.users-container {
  min-height: 100vh;
  padding: 32px 48px;
  background: #f8fafc;
}

.users-title {
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  margin-bottom: 24px;
  color: #111827;
}

/* 🔍 Search */
.search-wrapper {
  display: flex;
  justify-content: center;
  margin-bottom: 24px;
}

.search-input {
  width: 100%;
  max-width: 700px;
  height: 52px;
  padding: 0 18px;
  font-size: 1.1rem;
  border-radius: 12px;
  border: 1px solid #d1d5db;
  outline: none;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

.search-input:focus {
  border-color: #2c7e88;
  box-shadow: 0 0 0 4px rgba(44, 126, 136, 0.25);
}

/* 🔘 Filters */
.filter-bar {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 28px;
}

.filter-btn {
  padding: 10px 22px;
  border-radius: 999px;
  font-weight: 600;
  border: 1px solid #d1d5db;
  background: #fff;
  cursor: pointer;
  transition: all 0.25s ease;
}

.filter-btn.active {
  background: #2c7e88;
  color: white;
  border-color: #2c7e88;
  box-shadow: 0 4px 14px rgba(44, 126, 136, 0.35);
}

/* 📋 Table */
.table-wrapper {
  background: white;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.users-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1.05rem;
}

.users-table th {
  background: #eef6f7;
  padding: 16px;
  text-align: center;
  font-weight: 700;
  color: #1f2937;
}

.users-table td {
  padding: 16px;
  text-align: center;
  border-bottom: 1px solid #e5e7eb;
}

.users-table tr:hover {
  background: #f9fafb;
}

.owner-badge {
  padding: 6px 14px;
  background: #fff7ed;
  color: #9a3412;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.9rem;
  border: 1px solid #fed7aa;
}

.member-badge {
  padding: 6px 14px;
  background: #dcfce7;
  color: #166534;
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.9rem;
}

.add-btn {
  padding: 8px 18px;
  border-radius: 8px;
  border: none;
  background: #2c7e88;
  color: white;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.add-btn:hover {
  background: #256a72;
}

/* Empty table row */
.empty {
  text-align: center;
  padding: 32px;
  color: #6b7280;
  font-size: 1.1rem;
}

.loading {
  padding: 40px;
  text-align: center;
  font-size: 1.2rem;
}
/* ---------------- Main Container ---------------- */
.openplay-container {
  display: flex;
  flex-direction: column;
  height: 100vh; /* Matches Drawer height */
  background: var(--surface-1);
  overflow: hidden; 
  box-sizing: border-box;
}

/* ---------------- Header ---------------- */
.openplay-header {
  padding: 24px 24px 16px;
  border-bottom: 1px solid rgba(15, 34, 38, 0.08);
  flex-shrink: 0;
}

.openplay-header h2 {
  margin: 0;
  color: var(--ink-strong);
  font-size: 1.4rem;
  font-weight: 700;
}

.openplay-header p {
  margin: 4px 0 0;
  color: var(--ink-muted);
  font-size: 0.9rem;
}

/* ---------------- Form Scroll Logic ---------------- */
.openplay-form {
  display: flex;
  flex-direction: column;
  flex: 1; 
  overflow: hidden;
  margin: 0;
}

.form-content {
  padding: 24px;
  overflow-y: auto; 
  flex: 1; 
  box-sizing: border-box;
}

/* ---------------- Footer (Pinned to the bottom) ---------------- */
.form-actions-bar {
  background: var(--surface-1);
  padding: 16px 24px;
  border-top: 1px solid rgba(15, 34, 38, 0.08);
  display: flex;
  gap: 12px;
  flex-shrink: 0;
  margin-top: auto; /* Forces stickiness to container bottom */
}

/* ---------------- Grid Layout ---------------- */
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.full-width {
  grid-column: span 2;
}

/* ---------------- Form Groups & Labels ---------------- */
.form-group {
  display: flex;
  flex-direction: column;
  gap: 8px; /* Consistent spacing between label and input */
  align-items: flex-start;
}

.form-group label {
  font-weight: 700;
  font-size: 0.7rem;
  color: #555;
  text-transform: uppercase;
  margin-bottom: 0;
  letter-spacing: 0.5px;
}

.label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

/* ---------------- Inputs & Selects ---------------- */
.openplay-form input,
.openplay-form select {
  padding: 12px;
  border: 1px solid rgba(15, 34, 38, 0.18);
  border-radius: 8px;
  font-size: 0.95rem;
  width: 100%;
  box-sizing: border-box; /* Crucial: kills horizontal scroll */
  transition: border-color 0.2s;
}

.openplay-form input:focus {
  outline: none;
  border-color: var(--accent-strong);
}

/* ---------------- Pricing Configuration Button ---------------- */
.pricing-trigger-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.pricing-trigger-btn {
  background: var(--surface-2);
  border: 2px dashed rgba(15, 34, 38, 0.18);
  padding: 14px;
  border-radius: 8px;
  color: var(--ink-muted);
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  transition: all 0.2s ease;
}

.pricing-trigger-btn:hover {
  background: #eef6f4;
  border-color: var(--accent-strong);
  color: var(--accent-strong);
}

.pricing-trigger-btn.configured {
  background: rgba(45, 140, 151, 0.12);
  border: 2px solid rgba(45, 140, 151, 0.6);
  color: var(--accent-strong);
}

/* ---------------- UI Components ---------------- */
.badge {
  background: rgba(45, 140, 151, 0.14);
  color: var(--accent-strong);
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 800;
  font-size: 0.75rem;
}

.skill-range-input {
  accent-color: var(--accent-strong);
  width: 100%;
  margin: 8px 0;
  cursor: pointer;
}

.custom-multiselect {
  border: 1px solid #ddd;
  padding: 10px;
  border-radius: 6px;
  cursor: pointer;
  background: #fff;
}

.dropdown-panel {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-top: 4px;
  background: #fff;
  max-height: 200px;
  overflow-y: auto;
  padding: 8px;
}

.dropdown-option {
  display: flex;
  align-items: center;   
  gap: 10px;             
  padding: 8px 10px;
  cursor: pointer;
}

.dropdown-option input {
  margin: 0;           
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.dropdown-option:hover {
  background: #f5f5f5;
  border-radius: 6px;
}

/* ---------------- Action Buttons ---------------- */
.btn-primary {
  flex: 2;
  background: linear-gradient(135deg, var(--accent-strong), #2a6f76);
  color: white;
  border: none;
  padding: 14px;
  border-radius: 8px;
  font-weight: 700;
  cursor: pointer;
  font-size: 1rem;
  box-shadow: 0 10px 18px rgba(45, 140, 151, 0.25);
}
.btn-primary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.35);
}

.btn-secondary {
  flex: 1;
  background: var(--surface-1);
  color: var(--ink-strong);
  border: 1px solid rgba(15, 34, 38, 0.18);
  padding: 14px;
  border-radius: 8px;
  font-weight: 700;
  cursor: pointer;
  font-size: 1rem;
}
.btn-secondary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.25);
}

.form-actions {
  display: flex;
  gap: 12px;
  margin-top: 12px;
}

.submit-button {
  background: linear-gradient(135deg, var(--accent-strong), #2a6f76);
  color: #fff;
  border: none;
  padding: 12px 16px;
  border-radius: 10px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 10px 18px rgba(45, 140, 151, 0.25);
}
.submit-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.35);
}

.cancel-button {
  background: var(--surface-1);
  color: var(--ink-strong);
  border: 1px solid rgba(15, 34, 38, 0.18);
  padding: 12px 16px;
  border-radius: 10px;
  font-weight: 700;
  cursor: pointer;
}
.cancel-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.25);
}
.color-picker {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.color-circle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  border: 2px solid transparent;
}

.color-circle:hover {
  transform: scale(1.1);
}

.color-circle.selected {
  border: 2px solid #000;
  box-shadow: 0 0 0 2px #fff;
  transform: scale(1.1);
}

/* ---------------- Responsive ---------------- */
@media (max-width: 600px) {
  .form-grid {
    grid-template-columns: 1fr;
  }
  .full-width {
    grid-column: span 1;
  }
}
/* Backdrop */
.pricing-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

/* Modal */
.pricing-modal {
  background: #ffffff;
  width: 520px;
  max-width: 90%;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
  max-height: 90vh;        /* ← add this */
  overflow-y: auto;   
}

/* Header */
.pricing-header h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

.pricing-header p {
  margin-top: 6px;
  font-size: 14px;
  color: #6b7280;
}

/* Pricing rows */
.pricing-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  margin-top: 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}

.plan-name {
  flex: 1;
  font-weight: 500;
}

.pricing-row input[type='number'] {
  width: 100px;
  padding: 6px 8px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
}

.pricing-row input[type='number']:disabled {
  background: #f3f4f6;
}

/* Free checkbox */
.pricing-row label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
}

/* Dynamic Pricing Section */
.dynamic-pricing-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 20px;
  padding: 14px;
  background: #f9fafb;
  border-radius: 8px;
}

.dynamic-pricing-text span {
  display: block;
  font-size: 13px;
  color: #6b7280;
  margin-top: 2px;
}

/* Toggle Switch */
.switch {
  position: relative;
  width: 42px;
  height: 22px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  inset: 0;
  background-color: #d1d5db;
  border-radius: 999px;
  cursor: pointer;
  transition: 0.3s;
}

.slider::before {
  content: '';
  position: absolute;
  height: 18px;
  width: 18px;
  left: 2px;
  top: 2px;
  background: white;
  border-radius: 50%;
  transition: 0.3s;
}

.switch input:checked + .slider {
  background-color: #2C7E88 ;
}

.switch input:checked + .slider::before {
  transform: translateX(20px);
}

/* Footer */
.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
}.group-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.group-modal {
  background: #ffffff;
  width: 420px;
  max-width: 90%;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}

.group-modal-header h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

.group-modal-header p {
  margin-top: 6px;
  font-size: 14px;
  color: #6b7280;
}

.group-list {
  margin-top: 16px;
  max-height: 300px;
  overflow-y: auto;
}

.group-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  margin-bottom: 10px;
}

.group-row input {
  margin: 0;
}

.group-name {
  font-size: 14px;
  font-weight: 500;
}

.empty-text {
  font-size: 14px;
  color: #6b7280;
}
/* ══════════════════════════════════════════
   Calendar.css — Kourtwiz Club Calendar
   ══════════════════════════════════════════ */

.App {
  display: flex;
  flex-direction: column;
  width: 100%;
  background: #f0f4f6;
}

.full-calendar-wrapper {
  width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  background: #f0f4f6;
}

.full-calendar,
.full-calendar * {
  font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
  box-sizing: border-box;
}

.full-calendar .fc {
  width: 100% !important;
}

/* ══════════════════════════
   FIX: Past slot background
   FullCalendar adds .fc-past
   and .fc-today with a warm
   yellow/orange tint. Override
   ALL slot backgrounds to be
   identical — clean white.
   ══════════════════════════ */
.full-calendar .fc-timegrid-col-bg,
.full-calendar .fc-timegrid-col-bg .fc-non-business,
.full-calendar .fc-timegrid-col-bg .fc-past,
.full-calendar .fc-timegrid-col-bg .fc-today,
.full-calendar .fc-timegrid-col-bg .fc-future,
.full-calendar .fc .fc-timegrid-col.fc-day-today,
.full-calendar .fc .fc-timegrid-col.fc-day-past,
.full-calendar .fc .fc-timegrid-col.fc-day-future {
  background: transparent !important;
}

/* Also override FC's global today highlight */
.full-calendar .fc .fc-day-today {
  background: transparent !important;
}

/* Override the non-business hours tint (the yellow/orange) */
.full-calendar .fc-non-business {
  background: transparent !important;
}

/* ══════════════════════════
   SLOT HEIGHT
   ══════════════════════════ */
.full-calendar .fc-timegrid-slot {
  height: 60px !important;
}

/* Time label */
.full-calendar .fc-timegrid-slot-label {
  vertical-align: middle;
  font-size: 11px;
  font-weight: 700;
  color: #7a9aa5;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  padding-right: 12px !important;
  white-space: nowrap;
}

/* ══════════════════════════
   COLUMN HEADERS
   ══════════════════════════ */
.full-calendar .fc-col-header {
  background: #ffffff;
  border-bottom: 2px solid #dde9ed !important;
}

.full-calendar .fc-col-header-cell {
  padding: 12px 0 !important;
  background: #ffffff;
}

.full-calendar .fc-col-header-cell-cushion {
  font-size: 12px;
  font-weight: 700;
  color: #1a2e35;
  text-decoration: none !important;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.full-calendar .fc-resource-area-header {
  background: #ffffff !important;
  font-size: 11px;
  font-weight: 700;
  color: #7a9aa5;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

/* ══════════════════════════
   GRID LINES
   ══════════════════════════ */
.full-calendar .fc-timegrid-slot:not(.fc-timegrid-slot-minor) {
  border-top: 1.5px solid #dde9ed !important;
}

.full-calendar .fc-timegrid-slot-minor {
  border-top: 1px dashed #eaf0f3 !important;
}

.full-calendar .fc-timegrid-col {
  border-left: 1px solid #dde9ed !important;
  background: #fafcfc;
}

/* ══════════════════════════
   ALL-DAY ROW
   ── Override the orange/cream
      all-day background too
   ══════════════════════════ */
.full-calendar .fc-daygrid-body,
.full-calendar .fc-timegrid-axis,
.full-calendar .fc .fc-daygrid-day.fc-day-today,
.full-calendar .fc .fc-daygrid-day {
  background: #f8fafb !important;
}

/* ══════════════════════════
   NOW INDICATOR
   ══════════════════════════ */
.full-calendar .fc-timegrid-now-indicator-line {
  border-color: #e05c5c !important;
  border-width: 2px !important;
}
.full-calendar .fc-timegrid-now-indicator-arrow {
  border-top-color: #e05c5c !important;
  border-bottom-color: #e05c5c !important;
}

/* ══════════════════════════
   EVENT WRAPPER
   ══════════════════════════ */
.full-calendar .fc-event {
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 2px 3px !important;
  border-radius: 8px !important;
  overflow: hidden;
}

.full-calendar .fc-event-main {
  padding: 0 !important;
  height: 100%;
}

.full-calendar .fc-timegrid-event {
  border-radius: 8px !important;
  overflow: hidden;
}

/* ══════════════════════════
   SCROLLBAR
   ══════════════════════════ */
.full-calendar-wrapper::-webkit-scrollbar { height: 6px; }
.full-calendar-wrapper::-webkit-scrollbar-track { background: #f0f4f6; }
.full-calendar-wrapper::-webkit-scrollbar-thumb { background: #b0ccd4; border-radius: 3px; }

/* ══════════════════════════
   FC TOOLBAR BUTTONS
   ══════════════════════════ */
.fc .fc-button-primary {
  color: #1a2e35 !important;
  background-color: #ffffff !important;
  border: 1.5px solid #d4e3e7 !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  box-shadow: none !important;
}
.fc .fc-button-primary:hover {
  background-color: #e8f5f7 !important;
  border-color: #2c7e88 !important;
  color: #2c7e88 !important;
}
.fc .fc-button-primary:not(:disabled).fc-button-active {
  background-color: #2c7e88 !important;
  color: #ffffff !important;
  border-color: #2c7e88 !important;
}

/* ══════════════════════════
   BOOKING DRAWER
   ══════════════════════════ */
.booking-drawer .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline { border-color: #2c7e88; }
.booking-drawer .MuiInputLabel-root.Mui-focused { color: #2c7e88; }
.booking-drawer .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline { border-color: #2c7e88; }
.booking-drawer .MuiButton-contained { background-color: #2c7e88; color: #fff; }
.booking-drawer .MuiButton-contained:hover { background-color: #246666; }

/* ══════════════════════════
   LEGACY
   ══════════════════════════ */
.toggle-button { margin: 1rem; background-color: rgb(96, 144, 157); }
.booking-button { margin-top: 0.5rem; margin-bottom: 1rem; }
.fc-header-toolbar { position: sticky !important; left: 0 !important; z-index: 10; }.react-calendar {
  width: 350px;
  max-width: 100%;
  background: white;
  border: 1px solid #a0a096;
  font-family: 'Arial', 'Helvetica', sans-serif;
  line-height: 1.125em;
}

.react-calendar--doubleView {
  width: 700px;
}

.react-calendar--doubleView .react-calendar__viewContainer {
  display: flex;
  margin: -0.5em;
}

.react-calendar--doubleView .react-calendar__viewContainer > * {
  width: 50%;
  margin: 0.5em;
}

.react-calendar,
.react-calendar *,
.react-calendar *:before,
.react-calendar *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.react-calendar button {
  margin: 0;
  border: 0;
  outline: none;
}

.react-calendar button:enabled:hover {
  cursor: pointer;
}

.react-calendar__navigation {
  display: flex;
  height: 44px;
  margin-bottom: 1em;
}

.react-calendar__navigation button {
  min-width: 44px;
  background: none;
}

.react-calendar__navigation button:disabled {
  background-color: #f0f0f0;
}

.react-calendar__navigation button:enabled:hover,
.react-calendar__navigation button:enabled:focus {
  background-color: #e6e6e6;
}

.react-calendar__month-view__weekdays {
  text-align: center;
  text-transform: uppercase;
  font: inherit;
  font-size: 0.75em;
  font-weight: bold;
}

.react-calendar__month-view__weekdays__weekday {
  padding: 0.5em;
}

.react-calendar__month-view__weekNumbers .react-calendar__tile {
  display: flex;
  align-items: center;
  justify-content: center;
  font: inherit;
  font-size: 0.75em;
  font-weight: bold;
}

.react-calendar__month-view__days__day--weekend {
  color: #d10000;
}

.react-calendar__month-view__days__day--neighboringMonth,
.react-calendar__decade-view__years__year--neighboringDecade,
.react-calendar__century-view__decades__decade--neighboringCentury {
  color: #757575;
}

.react-calendar__year-view .react-calendar__tile,
.react-calendar__decade-view .react-calendar__tile,
.react-calendar__century-view .react-calendar__tile {
  padding: 2em 0.5em;
}

.react-calendar__tile {
  max-width: 100%;
  padding: 10px 6.6667px;
  background: none;
  text-align: center;
  font: inherit;
  font-size: 0.833em;
}

.react-calendar__tile:disabled {
  background-color: #f0f0f0;
  color: #ababab;
}

.react-calendar__month-view__days__day--neighboringMonth:disabled,
.react-calendar__decade-view__years__year--neighboringDecade:disabled,
.react-calendar__century-view__decades__decade--neighboringCentury:disabled {
  color: #cdcdcd;
}

.react-calendar__tile:enabled:hover,
.react-calendar__tile:enabled:focus {
  background-color: #e6e6e6;
}

.react-calendar__tile--now {
  background: #ffff76;
}

.react-calendar__tile--now:enabled:hover,
.react-calendar__tile--now:enabled:focus {
  background: #ffffa9;
}

.react-calendar__tile--hasActive {
  background: #76baff;
}

.react-calendar__tile--hasActive:enabled:hover,
.react-calendar__tile--hasActive:enabled:focus {
  background: #a9d4ff;
}

.react-calendar__tile--active {
  background: #006edc;
  color: white;
}

.react-calendar__tile--active:enabled:hover,
.react-calendar__tile--active:enabled:focus {
  background: #1087ff;
}

.react-calendar--selectRange .react-calendar__tile--hover {
  background-color: #e6e6e6;
}
/* ── CalendarHeader.css ─────────────────────────────────── */

.cal-header-root {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 10px 24px;
  background: #ffffff;
  border-bottom: 1px solid #e8edf2;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  position: sticky;
  top: 0;
  z-index: 100;
  flex-wrap: wrap;
  /* margin-top: 10px;
  margin-bottom: 10px; */
  padding: 25px;
}

/* ── Left ── */
.cal-header-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.cal-header-icon {
  color: #2c7e88 !important;
  font-size: 22px !important;
}
.cal-header-title {
  font-size: 17px;
  font-weight: 700;
  color: #1a2e35;
  letter-spacing: -0.3px;
  white-space: nowrap;
}

/* ── Centre ── */
.cal-header-centre {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  justify-content: center;
  flex-wrap: wrap;
}

/* Nav buttons */
.cal-nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 34px;
  padding: 0 10px;
  border: 1.5px solid #d4e3e7;
  border-radius: 8px;
  background: #f7fbfc;
  color: #2c7e88;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, transform 0.1s;
  white-space: nowrap;
}
.cal-nav-btn:hover  { background: #e8f5f7; border-color: #2c7e88; }
.cal-nav-btn:active { transform: scale(0.96); }
.cal-today-btn      { padding: 0 14px; }

/* Date pill */
.cal-date-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 16px;
  border: 1.5px solid #d4e3e7;
  border-radius: 20px;
  background: #f0f8fa;
  color: #1a2e35;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
  white-space: nowrap;
}
.cal-date-pill svg { color: #2c7e88; }
.cal-date-pill:hover,
.cal-date-pill.open {
  background: #e2f4f6;
  border-color: #2c7e88;
  box-shadow: 0 0 0 3px rgba(44, 126, 136, 0.12);
}

/* ── Portal mini calendar ── */
/* Rendered into document.body via ReactDOM.createPortal */
.mini-cal-portal {
  position: absolute;           /* anchored by JS top/left */
  transform: translateX(-50%);  /* centre under pill */
  z-index: 9999;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 0, 0, 0.06);
  padding: 16px 18px 18px;
  width: 308px;                 /* roomy — no overflow */
  user-select: none;
  animation: miniCalIn 0.15s ease;
}

@keyframes miniCalIn {
  from { opacity: 0; transform: translateX(-50%) translateY(-6px) scale(0.97); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0)    scale(1);    }
}

/* Month nav row */
.mini-cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.mini-cal-month {
  font-size: 15px;
  font-weight: 700;
  color: #1a2e35;
}
.mini-cal-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #2c7e88;
  cursor: pointer;
  transition: background 0.12s;
}
.mini-cal-nav:hover { background: #e8f5f7; }

/* 7-col grid */
.mini-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
}

.mini-cal-day-label {
  font-size: 11px;
  font-weight: 700;
  color: #9ab0b5;
  text-align: center;
  padding: 4px 0 8px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.mini-cal-cell {
  aspect-ratio: 1;
  border: none;
  border-radius: 8px;
  background: transparent;
  font-size: 13px;
  font-weight: 500;
  color: #2a3d42;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.12s, color 0.12s;
  min-width: 34px;   /* prevent cells from getting too small */
  min-height: 34px;
}
.mini-cal-cell:hover           { background: #e8f5f7; color: #2c7e88; }
.mini-cal-cell.today           { color: #2c7e88; font-weight: 700; border: 1.5px solid #2c7e88; }
.mini-cal-cell.selected        { background: #2c7e88; color: #fff; font-weight: 700; }
.mini-cal-cell.selected:hover  { background: #235f68; }

/* ── Right ── */
.cal-header-right { flex-shrink: 0; }

/* ── Responsive ── */
@media (max-width: 768px) {
  .cal-header-root  { padding: 10px 14px; gap: 8px; }
  .cal-date-pill span { display: none; }
  .cal-today-btn span { display: none; }
}/* Root */
.wl-root {
  padding: 20px;
  font-family: 'Inter', sans-serif;
}

/* Header */
.wl-header {
  margin-bottom: 20px;
}

.wl-title {
  font-size: 1.8rem;
  font-weight: 700;
}

.wl-title-accent {
  color: #2c7e88;
}

.wl-subtitle {
  font-size: 0.82rem;
  color: #8aabab;
  margin: 4px 0 0;
  font-weight: 400;
}

/* Grid */
.wl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

/* Card */
.wl-card {
  background: #fff;
  border-radius: 14px;
  padding: 16px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.wl-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
}

/* Card top */
.wl-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.wl-court {
  font-weight: 600;
  font-size: 1rem;
}

/* Badge */
.wl-badge {
  background: #fff3cd;
  color: #856404;
  font-size: 0.75rem;
  padding: 4px 8px;
  border-radius: 8px;
  font-weight: 600;
}

/* Info grid */
.wl-info-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.wl-label {
  display: block;
  font-size: 0.7rem;
  color: #888;
}

.wl-value {
  font-size: 0.9rem;
  font-weight: 500;
}

/* Empty state */
.wl-empty {
  text-align: center;
  margin-top: 40px;
  color: #777;
}

.wl-empty-icon {
  font-size: 2rem;
  margin-bottom: 8px;
}

/* Loading */
.wl-loading {
  text-align: center;
  margin-top: 40px;
}

/* ── Root ── */

.opl-root {
  min-height: 100vh;
  background: #f5f7f7;
  font-family: 'Inter', sans-serif;
  padding: 36px 32px;
}

/* ── Header ── */

.opl-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
}

.opl-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a2e2e;
  line-height: 1.2;
  margin: 0;
}

.opl-title-accent {
  color: #2c7e88;
}

.opl-subtitle {
  font-size: 0.82rem;
  color: #8aabab;
  margin: 4px 0 0;
  font-weight: 400;
}

.opl-cal-btn {
  display: flex;
  align-items: center;
  gap: 7px;
  background: #2c7e88;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-family: 'Inter', sans-serif;
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s;
}

.opl-cal-btn:hover {
  background: #236870;
}

/* ── Grid ── */

.opl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}

/* ── Card ── */

.opl-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  border: 1px solid #e4eded;
  transition: box-shadow 0.2s;
}

.opl-card:hover {
  box-shadow: 0 4px 16px rgba(44, 126, 136, 0.1);
}

/* ── Card Top ── */

.opl-card-top {
  background: #2c7e88;
  padding: 16px 18px 14px;
}

.opl-card-top.cancelled {
  background: #9e9e9e;
}

.opl-event-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  margin: 0 0 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Badges ── */

.opl-badge-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.opl-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.badge-joined {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.badge-waitlist {
  background: rgba(255, 193, 7, 0.2);
  color: #ffe082;
}

.badge-cancelled {
  background: rgba(255, 255, 255, 0.15);
  color: #fff;
}

/* ── Players progress bar ── */

.opl-players-bar-wrap {
  margin-top: 2px;
}

.opl-players-label {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 4px;
  font-weight: 400;
}

.opl-bar-bg {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 99px;
  height: 4px;
  overflow: hidden;
}

.opl-bar-fill {
  height: 100%;
  background: #fff;
  border-radius: 99px;
  transition: width 0.4s ease;
}

/* ── Card Body ── */

.opl-card-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}

.opl-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}

.opl-info-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.opl-info-full {
  grid-column: 1 / -1;
}

.opl-info-label {
  font-size: 0.65rem;
  color: #a0bcbc;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

.opl-info-value {
  font-size: 0.875rem;
  color: #1a2e2e;
  font-weight: 500;
}

.opl-divider {
  height: 1px;
  background: #f0f4f4;
}

/* ── Join Button ── */

.opl-join-btn {
  width: 100%;
  padding: 11px;
  border-radius: 8px;
  border: none;
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
}

.btn-active {
  background: #2c7e88;
  color: #fff;
}

.btn-active:hover {
  background: #236870;
}

.btn-waitlist {
  background: #fffbf0;
  color: #9a7000;
  border: 1px solid #f0d060;
}

.btn-waitlist:hover {
  background: #fff3cc;
}

.btn-disabled {
  background: #f0f4f4;
  color: #b0c4c4;
  cursor: not-allowed;
}

.btn-withdraw {
  background-color: #d32f2f;
  color: white;
}

.btn-withdraw:hover {
  background-color: #b71c1c;
}

/* ── Loading ── */

.opl-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
  gap: 14px;
}

.opl-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #e4eded;
  border-top-color: #2c7e88;
  border-radius: 50%;
  animation: opl-spin 0.7s linear infinite;
}

@keyframes opl-spin {
  to { transform: rotate(360deg); }
}

.opl-loading-text {
  font-size: 0.875rem;
  color: #8aabab;
  font-weight: 400;
  margin: 0;
}

/* ── Empty State ── */

.opl-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 80px 20px;
  color: #b0c4c4;
}

.opl-empty-icon {
  font-size: 2.5rem;
  margin-bottom: 10px;
}

.opl-empty-text {
  font-size: 0.95rem;
  font-weight: 500;
}.user-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  /* background-color: #fafafa; */
}

.title {
  font-weight: 600;
}

.update-button {
  text-transform: none;
  font-weight: 500;
  max-width: 100px;
  font-size: medium;
  background-color: #F2F3F7 !important;
  border-radius: 40px !important;
  border-width: 2px !important;
  border-color: #2C7E88 !important;
  border-style: solid !important;
  color: black !important;
}



.user-details-container {
  /* margin-top: 24px; */
  padding: 0 16px;
}

.user-card {
  padding: 16px;
}

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

.user-info-row {
  display: flex;
  justify-content: flex-start;
  gap: 12px;
  align-items: center;
  padding: 4px 0;
  flex-wrap: wrap;
}

.user-info-label {
  font-weight: 500;
  min-width: 140px;
  text-align: left;
  color: #555;
}

.user-info-value {
  flex: 1;
  text-align: left;
  color: #000;
}
.user-modal-box {
  background: #fff;
  padding: 24px;
  max-width: 700px;
  width: 90%;
  margin: auto;
  margin-top: 5%;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
  max-height: 90vh;
  overflow-y: auto;
}

.user-modal-field {
  margin-bottom: 8px;
}

.user-modal-button {
  font-weight: 500;
  text-transform: none;
}

.coach-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 400px;
    margin: 2rem auto;
  }
  
  .form-label {
    display: flex;
    flex-direction: column;
    font-weight: bold;
  }
  
  .form-input {
    padding: 8px;
    font-size: 1rem;
    margin-top: 4px;
    background-color: white;
    color: black;
  }
  
  .submit-button {
    padding: 10px;
    background-color: #1976d2;
    color: white;
    font-size: 1rem;
    border: none;
    cursor: pointer;
    border-radius: 4px;
  }
  
  .submit-button:disabled {
    background-color: gray;
    cursor: not-allowed;
  }

  .create-coach-page {
    padding: 20px;
  }
  
  .coach-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
  }
  
  .coach-table th, .coach-table td {
    border: 1px solid #ccc;
    padding: 10px;
  }
  
  .add-button,
  .submit-button,
  .cancel-button {
    margin: 10px 5px;
    padding: 8px 12px;
    cursor: pointer;
  }
  
  .button-row {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
  }
  
.create-coach-page {
  padding: 2rem;
}

.focus-highlight input {
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.focus-highlight input:focus {
  border-color: #1976d2 !important;
  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.3);
}

.dialog-scroll-content {
  max-height: 70vh;
  overflow-y: auto;
}
.App{
    display: flex;
    flex-direction: row;
}


.full-calendar, .full-calendar * {
  font-family:Arial, Helvetica, sans-serif;
}
.p {
  font-size: 10px;
}
  /* .full-calendar {
    width: 75vw;
    
  } */
  /* .calendar {
    width: 18vw;
    margin-left: 1vw;
    font-size: small;
  } */
  .booking-button{
    margin-top:0.5rem;
    margin-bottom: 1rem;;
  }
  .modal-container h3{
    margin-top: 0rem;
  }
  .modal-content{
    width:300px;
    padding: 0rem;
  }
  
ul.ordering {    
  list-style:none;   
  min-width:250px; 
}

ul.ordering li{ 
    font-size: 15px;
}
ul.ordering li span{  
  width: 12px; 
  height: 12px; background:red;  
  display:inline-block; 
  margin-right:6px
 }

 .fc .fc-button-primary { 
  color: #000000 !important; 
  background-color: #f7f7f7 !important; 
}

.fc .fc-button-primary:hover { 
  color: #f7f7f7 !important; 
  background-color: #2667f2 !important; 
}



.button-container {
  position: absolute;
  margin-top: 10px; 
  margin-left: 20px; 
}

.fc-timegrid-slot {
    height: 50px !important; 
}
.bookings-container {
    padding: 2rem;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  }
  
  /* h2 {
    margin-bottom: 1rem;
    color: #333;
  } */
  
  .bookings-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  }
  
  .bookings-table th,
  .bookings-table td {
    padding: 12px 16px;
    border: 1px solid #ddd;
    text-align: left;
  }
  
  .bookings-table th {
    background-color: #f4f4f4;
    color: #333;
    font-weight: 600;
  }
  
  .bookings-table tr:nth-child(even) {
    background-color: #f9f9f9;
  }
  
  .bookings-table tr:hover {
    background-color: #eef;
  }
  

/* ── Root ── */

.mr-root {
  min-height: 100vh;
  background: #f5f7f7;
  font-family: 'Inter', sans-serif;
  padding: 36px 32px;
}

/* ── Header ── */

.mr-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
}

.mr-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a2e2e;
  line-height: 1.2;
  margin: 0;
}

.mr-title-accent {
  color: #2c7e88;
}

.mr-subtitle {
  font-size: 0.82rem;
  color: #8aabab;
  margin: 4px 0 0;
  font-weight: 400;
}

/* ── Grid ── */

.mr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}

/* ── Card ── */

.mr-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  border: 1px solid #e4eded;
  transition: box-shadow 0.2s;
}

.mr-card:hover {
  box-shadow: 0 4px 16px rgba(44, 126, 136, 0.1);
}

/* ── Card Top ── */

.mr-card-top {
  background: #2c7e88;
  padding: 16px 18px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.mr-resource-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Badges ── */

.mr-badge-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.mr-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  width: fit-content;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.badge-paid {
  background: rgba(16, 185, 129, 0.25);
  color: #a7f3d0;
}

.badge-cancelled {
  background: rgba(239, 68, 68, 0.25);
  color: #fca5a5;
}

.badge-confirmed {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

/* ── Card Body ── */

.mr-card-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}

.mr-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}

.mr-info-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.mr-info-full {
  grid-column: 1 / -1;
}

.mr-info-label {
  font-size: 0.65rem;
  color: #a0bcbc;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

.mr-info-value {
  font-size: 0.875rem;
  color: #1a2e2e;
  font-weight: 500;
}

.mr-divider {
  height: 1px;
  background: #f0f4f4;
}

/* ── Action Buttons ── */

.mr-actions {
  display: flex;
  gap: 8px;
}

.mr-btn {
  flex: 1;
  padding: 10px;
  border-radius: 8px;
  border: none;
  font-family: 'Inter', sans-serif;
  font-size: 0.825rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
}

.btn-pay {
  background: #2c7e88;
  color: #fff;
}

.btn-pay:hover {
  background: #236870;
}

.btn-pay:disabled {
  background: #f0f4f4;
  color: #b0c4c4;
  cursor: not-allowed;
}

.btn-paid {
  background: #ecfdf5;
  color: #059669;
  border: 1px solid #d1fae5;
  cursor: not-allowed;
}

.btn-withdraw {
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

.btn-withdraw:hover {
  background: #fee2e2;
}

.btn-withdraw:disabled {
  background: #f0f4f4;
  color: #b0c4c4;
  border-color: #e4eded;
  cursor: not-allowed;
}

/* ── Loading ── */

.mr-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
  gap: 14px;
}

.mr-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #e4eded;
  border-top-color: #2c7e88;
  border-radius: 50%;
  animation: mr-spin 0.7s linear infinite;
}

@keyframes mr-spin {
  to { transform: rotate(360deg); }
}

.mr-loading-text {
  font-size: 0.875rem;
  color: #8aabab;
  font-weight: 400;
  margin: 0;
}

/* ── Empty State ── */

.mr-empty {
  text-align: center;
  padding: 80px 20px;
  color: #b0c4c4;
}

.mr-empty-icon {
  font-size: 2.5rem;
  margin-bottom: 10px;
}

.mr-empty-text {
  font-size: 0.95rem;
  font-weight: 500;
}

/* ── Guest & Modal styles (kept from original) ── */

.modal-content {
  width: 500px;
  max-width: 90%;
  padding: 2rem;
  border-radius: 12px;
  background-color: #ffffff;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.modal-content h2 {
  font-size: 20px;
  margin-bottom: 1rem;
  color: #111827;
}

.modal-content input {
  display: block;
  width: 100%;
  margin-bottom: 1rem;
  padding: 0.5rem;
  font-size: 14px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
}

.modal-content button[type="submit"] {
  background-color: #2c7e88;
  color: white;
  padding: 0.5rem 1rem;
  cursor: pointer;
  border-radius: 6px;
  border: none;
  font-weight: 500;
  margin-right: 0.75rem;
}

.modal-content button[type="submit"]:hover {
  background-color: #236870;
}

.modal-content button[type="button"] {
  background-color: #6b7280;
  color: white;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  border: none;
  font-weight: 500;
}

.modal-content button[type="button"]:hover {
  background-color: #4b5563;
}

.guest-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1rem;
}

.guest-table th,
.guest-table td {
  border-bottom: 1px solid #e5e7eb;
  padding: 10px 12px;
  text-align: left;
  font-size: 14px;
}

.guest-table th {
  background-color: #f3f4f6;
  font-weight: 600;
  color: #374151;
}

.modal-actions {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.pay-guests-button {
  padding: 10px 20px;
  background-color: #2c7e88;
  color: white;
  border: none;
  border-radius: 6px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
}

.pay-guests-button:hover {
  background-color: #236870;
}

.pay-guests-button:disabled {
  background-color: #d1d5db;
  color: #4b5563;
  cursor: not-allowed;
}

.close-button {
  padding: 10px 20px;
  background-color: #1f2937;
  color: white;
  border: none;
  border-radius: 6px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
}

.close-button:hover {
  background-color: #111827;
}

/* ── Root ── */

.opb-root {
  min-height: 100vh;
  background: #f5f7f7;
  font-family: 'Inter', sans-serif;
  padding: 36px 32px;
}

/* ── Header ── */

.opb-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
}

.opb-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a2e2e;
  line-height: 1.2;
  margin: 0;
}

.opb-title-accent {
  color: #2c7e88;
}

.opb-subtitle {
  font-size: 0.82rem;
  color: #8aabab;
  margin: 4px 0 0;
  font-weight: 400;
}

/* ── Grid ── */

.opb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}

/* ── Card ── */

.opb-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  border: 1px solid #e4eded;
  transition: box-shadow 0.2s;
}

.opb-card:hover {
  box-shadow: 0 4px 16px rgba(44, 126, 136, 0.1);
}

/* ── Card Top ── */

.opb-card-top {
  background: #2c7e88;
  padding: 16px 18px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.opb-event-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Badge ── */

.opb-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  width: fit-content;
}

.badge-booked {
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

/* ── Players progress bar ── */

.opb-players-bar-wrap {
  margin-top: 8px;
}

.opb-players-label {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 4px;
  font-weight: 400;
}

.opb-bar-bg {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 99px;
  height: 4px;
  overflow: hidden;
}

.opb-bar-fill {
  height: 100%;
  background: #fff;
  border-radius: 99px;
  transition: width 0.4s ease;
}

/* ── Card Body ── */

.opb-card-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}

.opb-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
}

.opb-info-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.opb-info-full {
  grid-column: 1 / -1;
}

.opb-info-label {
  font-size: 0.65rem;
  color: #a0bcbc;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

.opb-info-value {
  font-size: 0.875rem;
  color: #1a2e2e;
  font-weight: 500;
}

.opb-divider {
  height: 1px;
  background: #f0f4f4;
}

/* ── Withdraw Button ── */

.opb-cancel-btn {
  width: 100%;
  padding: 11px;
  border-radius: 8px;
  border: none;
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, transform 0.1s;
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

.opb-cancel-btn:hover {
  background: #fee2e2;
  transform: translateY(-1px);
}

.opb-cancel-btn:active {
  transform: translateY(0);
}

.opb-cancel-btn.btn-canceling {
  background: #e0e0e0;
  color: #9e9e9e;
  cursor: not-allowed;
}

/* ── Loading ── */

.opb-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 20px;
  gap: 14px;
}

.opb-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid #e4eded;
  border-top-color: #2c7e88;
  border-radius: 50%;
  animation: opb-spin 0.7s linear infinite;
}

@keyframes opb-spin {
  to { transform: rotate(360deg); }
}

.opb-loading-text {
  font-size: 0.875rem;
  color: #8aabab;
  font-weight: 400;
  margin: 0;
}

/* ── Empty State ── */

.opb-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 80px 20px;
  color: #b0c4c4;
}

.opb-empty-icon {
  font-size: 2.5rem;
  margin-bottom: 10px;
}

.opb-empty-text {
  font-size: 0.95rem;
  font-weight: 500;
}/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container img.leaflet-tile {
	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
	mix-blend-mode: plus-lighter;
}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAACf0lEQVR4AY1UM3gkARTePdvdoTxXKc+qTl3aU5U6b2Kbkz3Gtq3Zw6ziLGNPzrYx7946Tr6/ee/XeCQ4D3ykPtL5tHno4n0d/h3+xfuWHGLX81cn7r0iTNzjr7LrlxCqPtkbTQEHeqOrTy4Yyt3VCi/IOB0v7rVC7q45Q3Gr5K6jt+3Gl5nCoDD4MtO+j96Wu8atmhGqcNGHObuf8OM/x3AMx38+4Z2sPqzCxRFK2aF2e5Jol56XTLyggAMTL56XOMoS1W4pOyjUcGGQdZxU6qRh7B9Zp+PfpOFlqt0zyDZckPi1ttmIp03jX8gyJ8a/PG2yutpS/Vol7peZIbZcKBAEEheEIAgFbDkz5H6Zrkm2hVWGiXKiF4Ycw0RWKdtC16Q7qe3X4iOMxruonzegJzWaXFrU9utOSsLUmrc0YjeWYjCW4PDMADElpJSSQ0vQvA1Tm6/JlKnqFs1EGyZiFCqnRZTEJJJiKRYzVYzJck2Rm6P4iH+cmSY0YzimYa8l0EtTODFWhcMIMVqdsI2uiTvKmTisIDHJ3od5GILVhBCarCfVRmo4uTjkhrhzkiBV7SsaqS+TzrzM1qpGGUFt28pIySQHR6h7F6KSwGWm97ay+Z+ZqMcEjEWebE7wxCSQwpkhJqoZA5ivCdZDjJepuJ9IQjGGUmuXJdBFUygxVqVsxFsLMbDe8ZbDYVCGKxs+W080max1hFCarCfV+C1KATwcnvE9gRRuMP2prdbWGowm1KB1y+zwMMENkM755cJ2yPDtqhTI6ED1M/82yIDtC/4j4BijjeObflpO9I9MwXTCsSX8jWAFeHr05WoLTJ5G8IQVS/7vwR6ohirYM7f6HzYpogfS3R2OAAAAAElFTkSuQmCC);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAA0CAQAAABvcdNgAAAEsklEQVR4AWL4TydIhpZK1kpWOlg0w3ZXP6D2soBtG42jeI6ZmQTHzAxiTbSJsYLjO9HhP+WOmcuhciVnmHVQcJnp7DFvScowZorad/+V/fVzMdMT2g9Cv9guXGv/7pYOrXh2U+RRR3dSd9JRx6bIFc/ekqHI29JC6pJ5ZEh1yWkhkbcFeSjxgx3L2m1cb1C7bceyxA+CNjT/Ifff+/kDk2u/w/33/IeCMOSaWZ4glosqT3DNnNZQ7Cs58/3Ce5HL78iZH/vKVIaYlqzfdLu8Vi7dnvUbEza5Idt36tquZFldl6N5Z/POLof0XLK61mZCmJSWjVF9tEjUluu74IUXvgttuVIHE7YxSkaYhJZam7yiM9Pv82JYfl9nptxZaxMJE4YSPty+vF0+Y2up9d3wwijfjZbabqm/3bZ9ecKHsiGmRflnn1MW4pjHf9oLufyn2z3y1D6n8g8TZhxyzipLNPnAUpsOiuWimg52psrTZYnOWYNDTMuWBWa0tJb4rgq1UvmutpaYEbZlwU3CLJm/ayYjHW5/h7xWLn9Hh1vepDkyf7dE7MtT5LR4e7yYpHrkhOUpEfssBLq2pPhAqoSWKUkk7EDqkmK6RrCEzqDjhNDWNE+XSMvkJRDWlZTmCW0l0PHQGRZY5t1L83kT0Y3l2SItk5JAWHl2dCOBm+fPu3fo5/3v61RMCO9Jx2EEYYhb0rmNQMX/vm7gqOEJLcXTGw3CAuRNeyaPWwjR8PRqKQ1PDA/dpv+on9Shox52WFnx0KY8onHayrJzm87i5h9xGw/tfkev0jGsQizqezUKjk12hBMKJ4kbCqGPVNXudyyrShovGw5CgxsRICxF6aRmSjlBnHRzg7Gx8fKqEubI2rahQYdR1YgDIRQO7JvQyD52hoIQx0mxa0ODtW2Iozn1le2iIRdzwWewedyZzewidueOGqlsn1MvcnQpuVwLGG3/IR1hIKxCjelIDZ8ldqWz25jWAsnldEnK0Zxro19TGVb2ffIZEsIO89EIEDvKMPrzmBOQcKQ+rroye6NgRRxqR4U8EAkz0CL6uSGOm6KQCdWjvjRiSP1BPalCRS5iQYiEIvxuBMJEWgzSoHADcVMuN7IuqqTeyUPq22qFimFtxDyBBJEwNyt6TM88blFHao/6tWWhuuOM4SAK4EI4QmFHA+SEyWlp4EQoJ13cYGzMu7yszEIBOm2rVmHUNqwAIQabISNMRstmdhNWcFLsSm+0tjJH1MdRxO5Nx0WDMhCtgD6OKgZeljJqJKc9po8juskR9XN0Y1lZ3mWjLR9JCO1jRDMd0fpYC2VnvjBSEFg7wBENc0R9HFlb0xvF1+TBEpF68d+DHR6IOWVv2BECtxo46hOFUBd/APU57WIoEwJhIi2CdpyZX0m93BZicktMj1AS9dClteUFAUNUIEygRZCtik5zSxI9MubTBH1GOiHsiLJ3OCoSZkILa9PxiN0EbvhsAo8tdAf9Seepd36lGWHmtNANTv5Jd0z4QYyeo/UEJqxKRpg5LZx6btLPsOaEmdMyxYdlc8LMaJnikDlhclqmPiQnTEpLUIZEwkRagjYkEibQErwhkTAKCLQEbUgkzJQWc/0PstHHcfEdQ+UAAAAASUVORK5CYII=);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-attribution-flag {
	display: inline !important;
	vertical-align: baseline !important;
	width: 1em;
	height: 0.6669em;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	background: rgba(255, 255, 255, 0.8);
	text-shadow: 1px 1px #fff;
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */

@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
	}
/* --- src/components/BookingMap.css --- */
.custom-tooltip {
  background-color: white;
  padding: 8px 12px;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  font-size: 13px;
  color: #333;
  line-height: 1.4;
  text-align: left;
}

.custom-tooltip .club-name {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 4px;
  color: #2a4365;
}

.custom-tooltip .contact-name {
  font-size: 13px;
  margin-bottom: 2px;
}

.booking-popup {
  font-family: 'Segoe UI', sans-serif;
  font-size: 14px;
  color: #222;
}

.booking-popup .popup-club-name {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 8px;
}

.booking-popup .popup-contact {
  margin-bottom: 10px;
}

.booking-popup ul {
  padding-left: 18px;
  margin: 4px 0;
}

.map-wrapper {
  position: relative;
  width: 100%;
  height: 80vh;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.enhanced-map {
  height: 100%;
  width: 100%;
  border-radius: 12px;
}

.blurred-map {
  filter: blur(2px);
  pointer-events: none;
}

.map-error-overlay {
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  background: rgba(255, 255, 255, 0.95);
  padding: 12px 24px;
  border-radius: 8px;
  font-weight: 600;
  color: #d32f2f;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.map-loading {
  text-align: center;
  padding: 20px;
  color: #555;
}
/* AmenitiesList.css */

.amenities-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e0e0e0;
}

.amenities-title {
  margin: 0;
  font-size: 2rem;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1.2;
}

.add-amenity {
  text-transform: none !important;
  box-shadow: 0 4px 12px rgba(44, 126, 136, 0.2) !important;
  transition: all 0.2s ease-in-out;
}

.add-amenity:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(44, 126, 136, 0.3) !important;
  background-color: #f5f5f5 !important;
}

/* Table Styles */
.MuiTableContainer-root {
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  overflow: hidden;
}

.MuiTableHead-root {
  background: linear-gradient(135deg, #F2F3F7 0%, #e8eaf0 100%) !important;
}

.MuiTableCell-head {
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  color: #1a1a1a !important;
  border-bottom: 2px solid #d1d5db !important;
  padding: 16px 12px !important;
  letter-spacing: 0.5px;
}

.MuiTableRow-head:hover {
  background-color: #e3f2fd !important;
}

/* Table Body */
.MuiTableRow-root {
  transition: background-color 0.15s ease;
}

.MuiTableRow-root:hover {
  background-color: #f8fafc !important;
}

.MuiTableCell-root {
  padding: 14px 12px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  font-size: 0.9rem;
}

.MuiTableCell-root:last-child {
  padding-right: 16px !important;
}

/* Empty State */
.MuiTableCell-root[colspan="4"] {
  text-align: center !important;
  color: #64748b;
  font-style: italic;
  padding: 48px 16px !important;
}

/* Modal Styles */
.MuiDialog-paper {
  border-radius: 16px !important;
  padding: 8px !important;
}

.MuiDialogTitle-root {
  font-weight: 600 !important;
  font-size: 1.25rem !important;
  color: #1a1a1a !important;
  padding: 20px 24px 16px !important;
  border-bottom: 1px solid #e0e0e0;
}

.MuiDialogContent-root {
  padding: 24px !important;
}

.MuiTextField-root {
  margin-bottom: 20px !important;
}

.MuiTextField-root .MuiOutlinedInput-root {
  border-radius: 12px !important;
}

.MuiTextField-root .MuiInputLabel-root {
  font-weight: 500;
  color: #374151;
}

.MuiTextField-root .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: #2C7E88 !important;
  border-width: 2px !important;
}

.MuiFormHelperText-root {
  font-size: 0.8rem !important;
  margin-top: 4px !important;
}

/* Dialog Actions */
.MuiDialogActions-root {
  padding: 16px 24px 24px !important;
  border-top: 1px solid #f1f5f9;
  gap: 12px;
}

.MuiButton-contained {
  border-radius: 12px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  padding: 10px 24px !important;
  box-shadow: 0 4px 12px rgba(44, 126, 136, 0.2) !important;
  transition: all 0.2s ease !important;
}

.MuiButton-contained:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(44, 126, 136, 0.3) !important;
}

.MuiButton-outlined {
  border-radius: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  padding: 10px 24px !important;
  border-color: #d1d5db !important;
}

/* Responsive */
@media (max-width: 768px) {
  .amenities-header {
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
  }
  
  .amenities-title {
    font-size: 1.5rem;
  }
  
  .add-amenity {
    width: 100% !important;
    justify-content: center;
  }
  
  .MuiTableCell-root {
    padding: 12px 8px !important;
    font-size: 0.85rem !important;
  }
}

/* Loading & Error States */
.loading {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
  font-size: 1.1rem;
  color: #64748b;
}

.error {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
  color: #ef4444;
  font-weight: 500;
  text-align: center;
  padding: 0 24px;
}
/* Applies to all disabled TextFields inside Club Profile */
.club-profile .MuiInputBase-input.Mui-disabled {
  -webkit-text-fill-color: #333333 !important;
}

/* Rounded input borders */
.club-profile .MuiOutlinedInput-root {
  border-radius: 10px;
}

/* Optional: softer border color */
.club-profile .MuiOutlinedInput-notchedOutline {
  border-color: #dcdcdc;
}

/* Optional: label color */
.club-profile .MuiInputLabel-root {
  color: #333333;
}
.club-resources {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(102, 240, 210, 0.12), transparent 60%),
    var(--surface-0);
  border-radius: 24px;
}

.club-resources__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.club-resources__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.club-resources__header-actions {
  display: flex;
  gap: 0.75rem;
}

.club-resources__tabs {
  margin-top: 0.5rem;
  border-bottom: 1px solid rgba(15, 34, 38, 0.08);
}

.club-resources__card {
  background: var(--surface-1);
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 16px;
  padding: 1.25rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: 0 14px 26px rgba(15, 34, 38, 0.08);
}

.club-resources__actions {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.club-resources__empty {
  padding: 2rem;
  border: 1px dashed rgba(15, 34, 38, 0.2);
  border-radius: 16px;
  text-align: center;
  color: var(--ink-muted);
  background: var(--surface-2);
}

.club-resources__drawer {
  width: min(440px, 92vw);
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: #fff;
}

.club-resources_types__drawer {
  width: min(440px, 92vw);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-height: 100vh;
  overflow-y: auto;
}

.club-resources__form {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.5rem 1.25rem;
  min-height: 0;
  background: #fff;
}

.club-resources__form .MuiFormControl-root {
  margin-top: 0;
}

.club-resources__form .MuiFormControlLabel-root {
  margin-top: 0;
  margin-bottom: 0;
}

.club-resources__form-control {
  margin-top: 0;
}

.club-resources__form > .club-resources__form-control + .club-resources__form-control {
  margin-top: 1rem;
}

.club-resources__form > .club-resources__form-control + .club-resources__form-control--gap {
  margin-top: 1.35rem;
}

.club-resources__form-control--spaced {
  margin-top: 1.1rem;
}

.club-resources__form-control--gap {
  margin-top: 1.35rem;
}

.club-resources__form-checkbox {
  margin-top: -0.75rem;
  margin-bottom: -0.35rem;
}

.club-resources__switches {
  margin-top: -0.25rem;
}

.club-resources__switches .MuiFormControlLabel-root {
  margin-top: 0;
}

.club-resources__name-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
}

.club-resources__type-card {
  border: 1px solid rgba(15, 34, 38, 0.08);
  border-radius: 12px;
  padding: 0.75rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  background: #ffffff;
}

.club-resources__type-actions {
  display: flex;
  flex-direction: center;
  gap: 0.25rem;
  align-items: flex-end;
}

.club-resources__form-intro {
  margin-bottom: 0.35rem;
}

.club-resources__drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem 1.5rem 1rem;
  background: #fff;
  flex-shrink: 0;
}

.club-resources__drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.club-resources__drawer-footer {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.5rem 1.25rem;
  background: #fff;
  border-top: 1px solid rgba(22, 63, 60, 0.08);
  box-shadow: 0 -8px 18px rgba(15, 34, 38, 0.06);
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.club-resources__staged {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: 14px;
  background: rgba(45, 140, 151, 0.08);
  border: 1px dashed rgba(15, 34, 38, 0.12);
}

.club-resources__staged-card {
  background: var(--surface-1);
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 14px;
  padding: 0.7rem 0.9rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
}

.club-resources .MuiButton-contained {
  background: linear-gradient(135deg, var(--accent-strong), #2a6f76);
  box-shadow: 0 10px 18px rgba(45, 140, 151, 0.25);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-resources .MuiButton-contained:focus,
.club-resources .MuiButton-contained:focus-visible,
.club-resources .MuiButton-contained.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.35);
}

.club-resources .MuiButton-outlined {
  border-color: rgba(15, 34, 38, 0.18);
  color: var(--ink-strong);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-resources .MuiButton-outlined:focus,
.club-resources .MuiButton-outlined:focus-visible,
.club-resources .MuiButton-outlined.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.25);
}

.club-resources__staged-card .MuiTypography-body2 {
  margin-top: 0.15rem;
}

.club-resources__staged-actions {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  align-items: flex-end;
}

@media (max-width: 900px) {
  .club-resources {
    padding: 1.5rem;
  }

  .club-resources__card {
    flex-direction: column;
  }
}
.payments-page {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.payments-header {
  background: #f7fafb;
  border-radius: 16px;
  padding: 1.5rem;
  border: 1px solid #e3ecee;
}

.payments-summary {
  flex-wrap: wrap;
}

.payments-tabs {
  border-radius: 16px;
  overflow: hidden;
}

.payments-section {
  padding-bottom: 1rem;
}

.payments-card {
  border: 1px solid #e6edf0;
  border-radius: 14px;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.payments-card:hover {
  border-color: #cfe0e4;
  box-shadow: 0 10px 24px rgba(36, 76, 86, 0.08);
}

.payments-card-selected {
  border-color: #2c7e88;
  box-shadow: 0 10px 24px rgba(44, 126, 136, 0.2);
}

.payments-panel {
  padding: 1.5rem;
  border-radius: 16px;
  border: 1px solid #e6edf0;
}

.payments-table {
  border-radius: 12px;
  border: 1px solid #e6edf0;
  overflow: hidden;
}

.payments-row-muted {
  opacity: 0.7;
}

@media (max-width: 900px) {
  .payments-page {
    padding: 1.25rem;
  }

  .payments-header {
    padding: 1.25rem;
  }
}
.club-activities {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(102, 240, 210, 0.12), transparent 60%),
    var(--surface-0);
  border-radius: 24px;
}

.club-activities__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.club-activities__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.club-activities__card {
  background: var(--surface-1);
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 16px;
  padding: 1.25rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  box-shadow: 0 14px 26px rgba(15, 34, 38, 0.08);
}

.club-activities__actions {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.club-activities__empty {
  padding: 2rem;
  border: 1px dashed rgba(15, 34, 38, 0.2);
  border-radius: 16px;
  text-align: center;
  color: var(--ink-muted);
  background: var(--surface-2);
}

.club-activities__drawer {
  width: min(420px, 90vw);
  height: 100vh;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.club-activities__drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.club-activities__drawer-footer {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-shrink: 0;
}

.club-activities__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.club-activities__builder {
  display: flex;
  align-items: stretch;
  gap: 0.75rem;
}

.club-activities__builder .MuiButton-root {
  height: 60px;
  border-radius: 16px;
  padding: 0 1.6rem;
  align-self: stretch;
  font-weight: 600;
}

.club-activities .MuiButton-contained {
  background: linear-gradient(135deg, var(--accent-strong), #2a6f76);
  box-shadow: 0 10px 18px rgba(45, 140, 151, 0.25);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-activities .MuiButton-contained:focus,
.club-activities .MuiButton-contained:focus-visible,
.club-activities .MuiButton-contained.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.35);
}

.club-activities .MuiButton-outlined {
  border-color: rgba(15, 34, 38, 0.18);
  color: var(--ink-strong);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-activities .MuiButton-outlined:focus,
.club-activities .MuiButton-outlined:focus-visible,
.club-activities .MuiButton-outlined.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.25);
}

.club-activities__builder .MuiFormControl-root {
  flex: 1;
}

.club-activities__input {
  height: 60px;
  border-radius: 16px;
  padding: 0;
  display: flex;
  align-items: center;
}

.club-activities__input .MuiInputBase-input {
  padding: 0 16px;
  height: 60px;
  box-sizing: border-box;
}

.club-activities__input .MuiOutlinedInput-notchedOutline {
  border-radius: 16px;
}

.club-activities__add-button.Mui-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

@media (max-width: 900px) {
  .club-activities {
    padding: 1.5rem;
  }

  .club-activities__card {
    flex-direction: column;
  }
}
.club-events {
  padding: 24px;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(102, 240, 210, 0.12), transparent 60%),
    var(--surface-0);
  border-radius: 24px;
}

.club-events__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}

.club-events__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
}

.club-events__empty {
  padding: 40px;
  text-align: center;
  color: var(--ink-muted);
  border: 1px dashed #ccc;
  border-radius: 8px;
  background: var(--surface-2);
}

.club-events__card {
  background: var(--surface-1);
  border: 1px solid rgba(15, 34, 38, 0.06);
  border-radius: 16px;
  padding: 16px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  transition: box-shadow 0.2s ease;
}

.club-events__card:hover {
  box-shadow: 0 14px 26px rgba(15, 34, 38, 0.08);
}

.club-events__actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.club-events__drawer {
  width: 420px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.club-events__drawer-header {
  padding-bottom: 12px;
}

.club-events__drawer-footer {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.club-events .MuiButton-contained {
  background: linear-gradient(135deg, var(--accent-strong), #2a6f76);
  box-shadow: 0 10px 18px rgba(45, 140, 151, 0.25);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-events .MuiButton-contained:focus,
.club-events .MuiButton-contained:focus-visible,
.club-events .MuiButton-contained.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.35);
}

.club-events .MuiButton-outlined {
  border-color: rgba(15, 34, 38, 0.18);
  color: var(--ink-strong);
  border-radius: 999px;
  text-transform: none;
  font-weight: 600;
  outline: none;
}
.club-events .MuiButton-outlined:focus,
.club-events .MuiButton-outlined:focus-visible,
.club-events .MuiButton-outlined.Mui-focusVisible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(45, 140, 151, 0.25);
}
/* ─── AccessCodePage.css ─── */

.access-code-container {
  min-height: 100vh;
  display: flex;
  flex-direction: column;

  /* Light blue-grey — sits naturally under a white header */
  background-color: #c8dfe8;
  background-image:
    /* Subtle court lines */
    linear-gradient(rgba(255, 255, 255, 0.45) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.45) 1px, transparent 1px),
    /* Soft spotlight in the centre */
    radial-gradient(ellipse 65% 50% at 50% 52%, rgba(255, 255, 255, 0.30) 0%, transparent 75%);
  background-size: 70px 70px, 70px 70px, 100% 100%;
  position: relative;
  overflow: hidden;
}

/* Faint court baseline stripe */
.access-code-container::before {
  content: "";
  position: absolute;
  bottom: 36%;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(255, 255, 255, 0.55);
  pointer-events: none;
}

/* ─── Layout ─── */
.access-code-layout {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  padding: 2rem 1rem;
}

/* ─── Ball (left) ─── */
.access-code-ball {
  position: absolute;
  left: 4%;
  bottom: 18%;
  width: clamp(70px, 9vw, 120px);
  opacity: 0.9;
  pointer-events: none;
  animation: floatBall 4s ease-in-out infinite;
}

.access-code-ball img {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.2));
}

@keyframes floatBall {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-10px); }
}

/* ─── Character (right) ─── */
.access-code-character {
  position: absolute;
  right: 0;
  bottom: 0;
  height: clamp(300px, 58vh, 620px);
  pointer-events: none;
}

.access-code-character img {
  height: 100%;
  width: auto;
  filter: drop-shadow(-4px 0 16px rgba(0, 0, 0, 0.15));
}

/* ─── Card ─── */
.access-code-content {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(6px);
  border-radius: 18px;
  padding: 2.8rem 2.4rem 2.4rem;
  width: 100%;
  max-width: 440px;
  box-shadow:
    0 8px 36px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.6);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 2;
  text-align: center;
}

/* Lock icon */
.access-code-content::before {
  content: "🔒";
  font-size: 3.2rem;
  display: block;
  margin-bottom: 0.9rem;
  line-height: 1;
}

/* ─── Form ─── */
.access-code-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 0.5rem;
}

/* ─── Submit button ─── */
.access-code-submit {
  background-color: #2c7e88 !important;
  color: #fff !important;
  border-radius: 8px !important;
  text-transform: none !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  padding: 0.7rem 0 !important;
  transition: background-color 0.2s ease, transform 0.15s ease !important;
}

.access-code-submit:hover:not(:disabled) {
  background-color: #235f68 !important;
  transform: translateY(-1px);
}

.access-code-submit:disabled {
  opacity: 0.65 !important;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
  .access-code-character {
    height: clamp(200px, 35vh, 320px);
    opacity: 0.5;
  }

  .access-code-ball {
    width: 65px;
    left: 2%;
    bottom: 10%;
  }

  .access-code-content {
    padding: 2rem 1.4rem;
  }
}#root {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}


.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;
}