:root {
  /* Common */
  --font-family: "Nunito", sans-serif;
  --font-size: 13px;
  --header-height: 50px;
  --footer-height: 50px;

  /* Base Colors */
  --accent-blue: #109cf1;
  --blue: #1a73e8;
  --green: #56b623;
  --red: #eb5757;
  --yellow: #ffb946;
  --orange: #f98b29;
  --gray-5: #e0e0e0;
  --white: #fff;

  --hover-color: #8cbdfd;

  /* spacing */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 40px;
  --spacing-xxxl: 48px;

  /* radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-xxl: 32px;
  --radius-xxxl: 40px;

  /* font size */
  --font-size-xxs: 10px;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-xxl: 22px;

  --table-mobile-column-min-size: 80px;

  --font-size-headings-xxl: 32px;
  --font-size-headings-xl: 28px;
  --font-size-headings-lg: 24px;
  --font-size-headings-md: 20px;
  --font-size-headings-sm: 18px;
  --font-size-headings-xs: 16px;
  --font-size-headings-xxs: 14px;
}

html[theme="light"] {
  --font-color: #334d6e;
  --font-color-secondary: #666666;
  --bg-fill: #fff;
  --bg-main: #f5f6f8;
  --icon-grey: #c2cfe0;
  --dark-blue: #334d6e;
  --gradient-bg-1: linear-gradient(#ffffff, #e3efff, #c1d7f3);

  /* Optional */
  --input-bg: #f5f6f8;
  --input-border: #929499;
  --table-border: #e0e0e0;
  --hover-row-color: #e1f2fd;
  --frame-border: var(--gray-5);

  /* Table */
  --table-head: #f6f6f6;

  /* Skeleton */
  --skeleton-base: #eaecef;
  --skeleton-shimmer: rgba(255, 255, 255, 0.85);
}

html[theme="dark"] {
  --font-color: #f5f6f8;
  --font-color-secondary: #666666;
  --bg-fill: #243142;
  --bg-main: #27374a;
  --dark-blue: #f5f6f8;
  --icon-grey: #5b84b7;
  --frame-border: #334d6e;
  --gradient-bg-1: linear-gradient(#2c3e50, #34495e, #3a506b);

  /* Optional */
  --input-bg: #334d6e;
  --input-border: #929499;
  --table-border: #5b84b7;
  --card-border: #4d545f;
  --hover-row-color: #1a73e8;
  --framer-border: var(--gray-5);

  /* Table */
  --table-head: #424e5d;

  /* Skeleton */
  --skeleton-base: #2d3f52;
  --skeleton-shimmer: rgba(255, 255, 255, 0.07);
}

/* Global Zoom Support for Modal Portals */

.ReactModalPortal,
[data-table-context-menu] {
  zoom: var(--app-zoom, 1);
}

:root {
  font-family: var(--font-family);
  line-height: 1.5;
  font-weight: 500;

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

html {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  display: flex;
  letter-spacing: 0.5px;
}

body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  width: 100%;
  background-color: #f2f2f2;
  display: flex;
  color: var(--font-color);
  background-color: var(--bg-main);
}

#root {
  width: 100%;
  height: 100%;

  background-color: var(--bg-main);
}

* {
  box-sizing: border-box;
}

fieldset {
  border: none;
  padding: 0;
  margin: 0;
  min-width: 0;
}

/* TODO: Remove this style after completed Reusable SignatureTableComponent */

.overflow-hidden {
  overflow: hidden;
}

.overflow-x-auto {
  overflow-x: auto;
}
._2ZuB7dbBD6k- {
  font-size: var(--font-size-lg);
  font-weight: 700;
  outline: none;
  border: none;
  font-family: var(--font-family);
  color: #ffffff;
  background-color: #1a73e8;
  border-radius: var(--radius-sm);
  padding: 8px 48px;
  transition: 0.3s ease all;
  cursor: pointer;

  @media (max-width: 900px) {
    font-size: var(--font-size-xxs);
    padding: 8px 16px;
  }
}

._2ZuB7dbBD6k-[data-hover]:not([data-disabled]) {
  opacity: 0.8;
}

._2ZuB7dbBD6k-[data-active]:not([data-disabled]) {
  box-shadow: 4px 4px 8px 0px rgba(34, 60, 80, 0.2) inset;
}

._2ZuB7dbBD6k-[data-disabled] {
  cursor: auto;
  opacity: 0.5;
}

.ZLNUp9k33aU- {
  background-color: #56b623;
}
.o8MpLHYaPKs- {
  background-color: var(--red);
}

.AmlP4wVaP6I- {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
  width: 32px;
  padding: 0;
  font-weight: 700;
  font-size: var(--font-size-xl);
}

.MR-CM5BsPOk- {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 32px;
  width: 32px;
  padding: 0;
  font-weight: 700;
  font-size: var(--font-size-xl);
}

.lNbES07WKHI- {
  width: auto;
  height: auto;
  padding: 0;
  color: inherit;
  text-align: start;
  background-color: transparent;
  border: none;
}

.G5uV7etcUSA- {
  background-color: var(--red);
  width: 24px;
  height: 24px;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--font-size-xl);
  font-weight: 700;
}
.Fqx9BFT6nPY- {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 20px;
  text-align: center;
  background-color: var(--background);
}

.uOWcp7BVW-0- {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: var(--bg-fill);
  border-radius: var(--radius-lg);
  min-width: 40vw;
  min-height: 40vh;
}

.uNjiqawgYv4- {
  font-size: var(--font-size-xl);
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 16px;
}

._0tkPlnYQeL0- {
  color: var(--text-secondary);
  margin-bottom: 24px;
  max-width: 80%;
}

.GZ--pW5KszQ- {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

._75GbswiCbLY- {
  padding: 12px 24px;
  background-color: var(--primary);
  color: white;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-weight: 500;
  transition: background-color 0.2s;
}

._75GbswiCbLY-:hover {
  background-color: var(--primary-dark);
}
._4O1D4R47AP8- {
  min-width: 493px;
  max-width: 493px;
  height: 100%;
  margin: auto;
  border-radius: var(--radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;

  @media (max-width: 900px) {
    min-width: auto;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    align-items: flex-start;
    padding: var(--spacing-md);
    box-sizing: border-box;
  }
}

.gaLVfoHMoSY- {
  width: 100%;
  padding: 17px 58px 10px;
  background-image: var(--gradient-bg-1);
  border-radius: var(--radius-lg);

  @media (max-width: 900px) {
    padding: 17px var(--spacing-md) var(--spacing-md);
  }
}
.JV7BrP11UnE- {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  user-select: none;

  &:not(.mWgb9iy5Uz8-) {
    background: var(--bg-main);
  }

  &.TYKOJjLywEs- {
    zoom: var(--app-zoom, 1);
  }
}
.JV7BrP11UnE- img {
  width: 100%;
  height: 100%;
  object-fit: scale-down;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation-name: _8wiLf-ic33c-;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

.TVrqqVmzOo8- {
  display: flex;
  width: 190px;
  height: 190px;
  animation-name: TVrqqVmzOo8-;
  animation-duration: 1s;
  animation-delay: 0ms;
  animation-iteration-count: infinite;
  position: relative;
}

.TVrqqVmzOo8- svg {
  width: 100%;
  height: 100%;
}

@keyframes TVrqqVmzOo8- {
  0% {
    transform: rotate(0deg);
  }
  50% {
  }
  100% {
    transform: rotate(360deg);
  }
}

@media (max-width: 900px) {
  .JV7BrP11UnE- img {
    width: 50px;
    height: 50px;
  }
}
.m2V0gXz3Ydo- {
  position: relative;
  height: 100%;
}
.c7uqzvcEX2E- {
  font-weight: 700;
  font-size: var(--font-size-sm);
  text-decoration: none;
  color: var(--font-color);

  &:hover {
    opacity: 0.8;
  }

  @media (max-width: 900px) {
    font-size: var(--font-size-xs);
  }
}
.Rd3yOMI3iKk- {
  height: var(--footer-height);
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10;
  background-color: var(--bg-fill);
  /* fix #5: sync with sidebar transition */
  transition:
    left 0.05s linear,
    width 0.05s linear;

  &:not(.dkgSuNP-Sh0-) {
    left: var(--sidebar-width);
    width: calc(100% - var(--sidebar-width));
  }

  @media (max-width: 900px) {
    transition: none;

    &:not(.dkgSuNP-Sh0-) {
      left: 0;
      width: 100%;
    }
  }
}

._-61f3Hjvek8- {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  gap: var(--spacing-md);
}

.gZM4ql-4ioQ- {
  text-decoration: underline;

  @media (max-width: 900px) {
    font-size: 8px;
  }
}
.FIVsA-CFUkM- {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.WjT81SzoY2w- {
  width: 100%;
  font-size: var(--font-size-lg);
  line-height: 1.4;
  outline: none;
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  color: var(--dark-blue);

  @media (max-width: 900px) {
    font-size: var(--font-size-md);
  }
}

.g7SQh--n6tg- {
  padding: 15px 32px;
}

._2NgfzKulF6k- {
  padding: 6px 10px;
  font-size: 14px;
  min-height: 36px;
}

._64a4FVq9-R4- {
  padding: 5px 10px;
}
.WjT81SzoY2w-::placeholder {
  color: var(--dark-blue);
}

.nzcnQHzvQeo- {
  opacity: 0.8;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

.XAjMDXByBeI- {
  border-color: var(--red);
}

.VLISaPedD7M-,
.CTss-0Qmb2M- {
  color: var(--red);
}

.xz4xSAd-ihY- {
  color: var(--red);
  font-size: var(--font-size-xs);
  margin-top: var(--spacing-xs);
}

.nzQoK8r8eQ4- {
  display: flex;

  > * {
    flex: 0;
  }

  label {
    white-space: nowrap;
  }
}
.toast-unstyled {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.toast-unstyled .Toastify__toast-body {
  padding: 0 !important;
  margin: 0 !important;
}
._6pWcU2R3czM- {
  text-align: left;
  width: 100%;
  padding: 5px;
}
/* Container */
.aAxwDjSE-9U- {
  width: 100%;
}

/* Control (Input button) */
.i9fC83pPHHg- {
  position: relative;
  display: flex;
  align-items: center;
  background-color: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  min-height: 36px;
  cursor: pointer;
  transition: border-color 0.2s;
  width: 100%;
}

.i9fC83pPHHg-:hover:not(.GLASRBCOKdI-) {
  border-color: var(--accent-blue);
}

.vNXR7hmdZ94- {
  border-color: var(--accent-blue);
  box-shadow: 0 0 0 1px var(--accent-blue);
}

.GLASRBCOKdI- {
  opacity: 0.8;
  cursor: not-allowed;
  background-color: var(--input-bg);
}

/* Input */
.laAF3GVE3G4- {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  color: var(--dark-blue);
  font-size: 14px;
  padding: 6px 36px 6px 10px;
  margin: 0;
  line-height: 1.4;
}

.laAF3GVE3G4-::placeholder {
  color: var(--dark-blue);
  opacity: 0.6;
}

.r9VgFAVGkSM- {
  cursor: pointer;
  caret-color: transparent;
}

/* Value display */
.gURFNaK3yRA- {
  width: 100%;
  color: var(--dark-blue);
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 6px 36px 6px 10px;
  line-height: 1.4;
}

.kQIeCzdovHY- {
  color: var(--dark-blue);
  opacity: 0.6;
}

/* Indicators */
.DHLIoeL62y0- {
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  pointer-events: none;
}

.qCPbMMsowyc- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  cursor: pointer;
  color: var(--dark-blue);
  opacity: 0.5;
  transition: opacity 0.2s;
  pointer-events: all;
  background: none;
  border: none;
  padding: 0;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.qCPbMMsowyc- svg {
  width: 16px;
  height: 16px;
}

.qCPbMMsowyc-:hover {
  opacity: 1;
}

.Ist81Ba8JC8- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: var(--dark-blue);
  opacity: 0.6;
  transition:
    transform 0.2s,
    opacity 0.2s;
  pointer-events: none; /* Иконка не кликабельна, клик проходит к родителю */
  flex-shrink: 0;
}

.Ist81Ba8JC8- svg {
  width: 16px;
  height: 16px;
}

.i9fC83pPHHg-:hover .Ist81Ba8JC8- {
  opacity: 0.9;
}

.e52A9AhMCh4- {
  transform: rotate(180deg);
  opacity: 1;
}

.JeRqurl23r8- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: var(--accent-blue);
  opacity: 0.8;
  pointer-events: none;
  flex-shrink: 0;
}

.JeRqurl23r8- svg {
  width: 16px;
  height: 16px;
  animation: Tlu2p94XWvY- 1s linear infinite;
}

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

/* Menu — positioned by Headless UI anchor (portaled to body) */
._3RbJ-OWeyMs- {
  --anchor-gap: 4px;
  z-index: 99999;
  pointer-events: auto;
  background-color: var(--input-bg);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  max-height: 300px;
  border: 1px solid var(--input-border);
  width: max-content;
  min-width: calc(var(--button-width) / var(--app-zoom, 1));
  max-width: 90vw !important;
  /* zoom: var(--app-zoom, 1); */
  transition: none !important;
  /* Hide for 1 frame so floating-ui can apply position before paint */
  animation: IfIRiSSPXec- 0s 0.016s backwards;
}

@keyframes IfIRiSSPXec- {
  from {
    opacity: 0;
  }
}

/* Menu list */
.hTIWDU-Nl4M- {
  max-height: 300px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--icon-grey) transparent;
}

/* Scrollbar styling for Webkit browsers */
.hTIWDU-Nl4M-::-webkit-scrollbar {
  width: 8px;
}

.hTIWDU-Nl4M-::-webkit-scrollbar-track {
  background: transparent;
  border-radius: var(--radius-sm);
}

.hTIWDU-Nl4M-::-webkit-scrollbar-thumb {
  background: var(--icon-grey);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s ease;
}

.hTIWDU-Nl4M-::-webkit-scrollbar-thumb:hover {
  background: var(--accent-blue);
}

/* Option */
.wtFnem80nHw- {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  cursor: pointer;
  color: var(--dark-blue);
  transition: background-color 0.15s;
  user-select: none;
  white-space: nowrap;
}

.wtFnem80nHw-:hover,
.QniZp84vVNo- {
  background-color: var(--accent-blue);
}

.PDPD7Vw4dpE- {
  background-color: var(--accent-blue);
  font-weight: 500;
}

._5Fzjaf8MSbg- {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Checkbox for multi-select */
.fM2xxZXsoOI- {
  margin-right: 8px;
  cursor: pointer;
}

/* Multi-value chips */
._4Hscx3SlQu4- {
  display: inline-flex;
  align-items: center;
  background-color: var(--accent-blue);
  border-radius: 4px;
  padding: 2px 8px;
  margin: 2px;
  font-size: 13px;
  color: var(--dark-blue);
}

.ZvdiVt8sQtU- {
  padding-right: 4px;
}

._6EDCwO2nh4E- {
  display: flex;
  align-items: center;
  cursor: pointer;
  padding: 0 4px;
  opacity: 0.6;
  transition: opacity 0.2s;
}

._6EDCwO2nh4E-:hover {
  opacity: 1;
}

/* No options message */
.f9-zWhIuiaE- {
  padding: 12px;
  text-align: center;
  color: var(--dark-blue);
  opacity: 0.6;
}

/* Loading state in menu */
.HEHk9DBi9ts- {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 12px;
  gap: var(--spacing-sm);
}

.brzsn-au0jo- {
  color: var(--accent-blue);
  animation: Tlu2p94XWvY- 1s linear infinite;
}

._3IsJ0TK0-iI- {
  color: var(--dark-blue);
  opacity: 0.7;
  font-size: 14px;
}

/* Async select with label */
.p3TUsN-eyGc- {
  display: grid;
  grid-template-columns: minmax(auto, max-content) 1fr;
  gap: var(--spacing-sm);
  align-items: center;
}

.RCzaCJNBbYc- {
  display: flex;
  align-items: center;
  color: var(--dark-blue);
  white-space: nowrap;
  min-width: fit-content;
}
.HS6SBM1uGtk- {
  display: flex;
  background-color: var(--bg-fill);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-right: var(--spacing-sm);
}

.vwHq4fI91oo- {
  padding: var(--spacing-xs) var(--spacing-sm);
  background-color: transparent;
  border: none;
  border-right: 1px solid var(--table-border);
  color: var(--font-color);
  cursor: pointer;
  font-size: var(--font-size-sm);
  transition: all 0.2s ease;
  white-space: nowrap;
  position: relative;
}

.vwHq4fI91oo-:last-child {
  border-right: none;
}

.vwHq4fI91oo-:hover {
  background-color: var(--hover-row-color);
  color: var(--accent-blue);
}

.vwHq4fI91oo-.aLEcEdOEwh4- {
  background-color: var(--accent-blue);
  color: white;
}

.vwHq4fI91oo-.aLEcEdOEwh4-:hover {
  background-color: var(--dark-blue);
  color: white;
}

@media screen and (max-width: 900px) {
  .vwHq4fI91oo- {
    padding: var(--spacing-xs) 8px;
    font-size: var(--font-size-xs);
  }
}
.gwXR-NK-8O0- {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background-color: var(--orange);
  color: var(--white);
  padding: var(--spacing-xs) var(--spacing-md);
  text-align: center;
  z-index: 11;
  font-size: var(--font-size-sm);
  font-weight: 600;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
}

.hzAvIlwixBU- {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.Ftj9KigLOFM- {
  background-color: var(--white);
  color: var(--orange);
  border: none;
  border-radius: var(--radius-sm);
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-xs);
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity 0.2s ease;
}

.Ftj9KigLOFM-:hover {
  opacity: 0.9;
}

@media screen and (max-width: 900px) {
  .gwXR-NK-8O0- {
    font-size: var(--font-size-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    min-height: 28px;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
  }

  .hzAvIlwixBU- {
    white-space: normal;
    word-break: break-word;
  }

  .Ftj9KigLOFM- {
    font-size: 10px;
    padding: 2px var(--spacing-xs);
  }
}

.cuqsAantWaY- {
  position: fixed;
  top: 0;
  width: 100%;
  height: var(--header-height);
  /* Desktop: content starts after the logo slot (196px) or sidebar width, whichever is wider */
  padding-left: max(196px, calc(var(--sidebar-width) + 10px));
  padding-right: 10px;

  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  background-color: var(--bg-fill);
  /* Above sidebar (1001) so the logo slot is always visible */
  z-index: 1002;
  transition:
    top 0.2s ease,
    padding-left 0.2s ease;

  @media screen and (max-width: 900px) {
    padding-left: 10px;
    transition: top 0.2s ease;
  }
}

/* Desktop logo: absolutely positioned at left, always full logo+text, no animation */
._4TL3Zjsyxb8- {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 196px; /* fixed: img(43) + gap(8) + text(~105) + padding(16×2) + buffer */
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding-inline: var(--spacing-md);
  text-decoration: none;
  color: inherit;
  white-space: nowrap;
  background-color: var(--bg-fill);
  transition: opacity 0.15s ease;
}

._4TL3Zjsyxb8-:hover {
  opacity: 0.8;
}

._93RFZI0efkA- {
  width: 43px;
  height: 35px;
  flex-shrink: 0;
}

.KwsMl6C-NQg- {
  font-size: var(--font-size-lg);
  white-space: nowrap;
}

.dtHgJ6DnXdI- {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--font-color);
  padding: 4px;
  border-radius: var(--radius-sm);
  transition:
    color 0.15s ease,
    background-color 0.15s ease;
}

.dtHgJ6DnXdI-:hover {
  color: var(--accent-blue);
  background-color: var(--bg-main);
}

.xWmwMly9f2k- {
  top: 32px;

  @media screen and (max-width: 900px) {
    top: 28px;
  }
}

.j8598aQkYls- {
  width: 100%;
  height: 100%;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
}
.NoyJsRSmHWw- {
  margin-right: auto;
  display: flex;
  align-items: center;
}
.NoyJsRSmHWw- svg {
  margin-right: 10px;
}
.Z2R2D8UF-Ys- {
  color: #90a0b7;
  border: none;
  outline: none;
  height: 34px;
  background-color: inherit;
  font-size: var(--font-size-lg);
}

.W4bOWgOJ3bE- {
  display: flex;
  color: #90a0b7;
}
.W4bOWgOJ3bE- svg {
  margin-right: 10px;
}

.k2V-IECPUtU- {
  margin-right: 10px;
  display: flex;
  align-items: center;
}

.DjOIN580Jdo- {
  white-space: nowrap;

  @media screen and (max-width: 900px) {
    display: none;
  }
}

.DHmiQGi5g9g- {
  color: inherit;
  border: none;
  cursor: pointer;
  font-size: var(--font-size-lg);
  text-decoration: none;
  background-color: inherit;
  white-space: nowrap;
}

.DHmiQGi5g9g-:hover {
  color: var(--accent-blue);
}

.DHmiQGi5g9g-:hover svg {
  stroke: var(--accent-blue);
}
.fhFAEEfTNRk- {
  --padding: var(--spacing-md);

  width: calc(100% - var(--padding));
  padding-top: calc(var(--header-height) + var(--emulation-banner-height, 0px));
  padding-left: calc(var(--sidebar-width) + var(--padding));
  padding-bottom: calc(var(--footer-height) + var(--padding));
  background-color: var(--bg-main);
  height: 100%;
  /* fix #5: sync with sidebar width transition */
  transition: padding-left 0.05s linear;

  @media (max-width: 900px) {
    --padding: var(--spacing-xs);
    transition: none;
  }
}

._0Jy6NayRZLE- {
  width: 100%;
  height: 100%;
  padding-top: 12px;
  overflow-y: auto;
  scrollbar-gutter: stable;

  /* Стилизация скроллбара для Webkit браузеров */
  scrollbar-width: thin;
  scrollbar-color: var(--icon-grey) transparent;
}

/* Стилизация скроллбара для Webkit браузеров (Chrome, Safari, Edge) */
._0Jy6NayRZLE-::-webkit-scrollbar {
  width: 8px;
}

._0Jy6NayRZLE-::-webkit-scrollbar-track {
  background: transparent;
  border-radius: var(--radius-sm);
}

._0Jy6NayRZLE-::-webkit-scrollbar-thumb {
  background: var(--icon-grey);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s ease;
}

._0Jy6NayRZLE-::-webkit-scrollbar-thumb:hover {
  background: var(--accent-blue);
}

/* Стилизация скроллбара для Firefox */
._0Jy6NayRZLE- {
  scrollbar-width: thin;
  scrollbar-color: var(--icon-grey) transparent;
}
.M2xi8of-wUY- {
  display: flex;
  flex-direction: column;
  /* Desktop: starts below the topbar (topbar has z-index: 1002 and contains the logo) */
  top: calc(var(--header-height) + var(--emulation-banner-height, 0px));
  height: calc(100% - var(--header-height) - var(--emulation-banner-height, 0px));
  position: fixed;
  width: var(--sidebar-width);
  overflow: hidden;
  padding: 0 var(--spacing-xs);
  background-color: var(--bg-fill);
  z-index: 1001;
  transition: width 0.05s linear;

  &:not(._2wNicmL6h-8-) {
    ._7an-Uov3mT8- {
      /* center 16px icon: (sidebar_inner - icon) / 2 = (52px - 16px) / 2 = 18px */
      padding-inline: calc(var(--sidebar-width) / 2 - var(--spacing-sm) - var(--spacing-xs));
      gap: 0;
    }

    .NXBb6MzNqjY- {
      padding-inline: calc(var(--sidebar-width) / 2 - var(--spacing-sm) - var(--spacing-xs));
      gap: 0;
    }

    @media (max-width: 900px) {
      ._7an-Uov3mT8- {
        padding-inline: var(--spacing-sm);
        gap: var(--spacing-md);
      }
      .NXBb6MzNqjY- {
        padding-inline: var(--spacing-sm);
        gap: var(--spacing-md);
      }
    }
  }

  /* Mobile: full-height sidebar, logo is inside */
  @media (max-width: 900px) {
    top: 0;
    height: 100%;
    width: 250px;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    box-shadow: none;
  }
}

/* Desktop auto-hide overlay (visual expand via inline style, layout stays at 60px) */
.GLuvX6HOlTI- {
  box-shadow: 4px 0 20px rgba(0, 0, 0, 0.12);
}

/* Mobile open state */
._3pEGHbetqxs- {
  transform: translateX(0);
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.2);
}

._2wNicmL6h-8- {
  .mqzXe4gRPoU- {
    justify-content: initial;
  }

  /* Text slides in after sidebar width starts expanding */
  .avFzq6vgnPQ-,
  .eS9EoDW9Yr0-,
  .curOBLzLtfo-,
  .gBAtMANf9-Y- {
    max-width: 200px;
    opacity: 1;
    transform: translateX(0);
    transition:
      opacity 0.18s ease 0.08s,
      max-width 0.2s ease 0.05s,
      transform 0.2s ease 0.05s;
    pointer-events: auto;
  }

  /* Chevron fades in */
  ._0QBDowmh9FQ- {
    max-width: 20px;
    opacity: 0.5;
    transition:
      max-width 0.2s ease 0.05s,
      opacity 0.15s ease 0.1s;
    pointer-events: auto;
  }

  .K4XU8ljOPfw-:hover ._0QBDowmh9FQ- {
    opacity: 1;
    color: var(--accent-blue);
  }
}

/* Mobile backdrop */
.NXMZWOX6VDw- {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 1000;
}

/* ── Header ────────────────────────────────────────────────── */

.mqzXe4gRPoU- {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  padding: 12px 0;
}

._2g7FxTG9JMY- {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  text-decoration: none;
  color: inherit;
  transition:
    opacity 0.2s ease,
    gap 0.2s ease;
}

._2g7FxTG9JMY-:hover {
  opacity: 0.8;
}

._80tcacb5YjE- {
  width: 43px;
  height: 35px;
}

/* Text takes no space when hidden — slides in on open */
.avFzq6vgnPQ- {
  font-size: var(--font-size-lg);
  white-space: nowrap;
  overflow: hidden;
  max-width: 0;
  opacity: 0;
  transform: translateX(-6px);
  transition:
    opacity 0.1s ease,
    max-width 0.15s ease,
    transform 0.1s ease;
  pointer-events: none;
}

/* ── Body ──────────────────────────────────────────────────── */

.z-5FRogjUlQ- {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;

  &::-webkit-scrollbar {
    display: none;
  }
}

.z-5FRogjUlQ- svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

/* ── Footer ────────────────────────────────────────────────── */

.lEi7s89anUU- {
  flex-shrink: 0;
  display: flex;
  border-top: 1px solid var(--table-border);
}

.NXBb6MzNqjY- {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  width: 100%;
  padding: 8px var(--spacing-sm);
  border-radius: var(--radius-md);
  color: var(--font-color);
  font-size: var(--font-size-sm);
  background: none;
  border: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    color 0.15s ease,
    padding-inline 0.2s ease,
    gap 0.2s ease;
  text-align: left;
}

.NXBb6MzNqjY-:hover {
  background-color: var(--bg-main);
  color: var(--accent-blue);
}

.NXBb6MzNqjY-:hover svg path {
  stroke: var(--accent-blue);
}

.k-Ed0vpjcJM- {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Text takes no space when hidden */
.gBAtMANf9-Y- {
  color: inherit;
  white-space: nowrap;
  overflow: hidden;
  max-width: 0;
  opacity: 0;
  transform: translateX(-6px);
  transition:
    opacity 0.1s ease,
    max-width 0.15s ease,
    transform 0.1s ease;
  pointer-events: none;
}

/* ── Menu items ────────────────────────────────────────────── */

.cObJ73LTLnk- {
  position: relative;
  display: none;
}

.G-FPnSK4asE- {
  display: block;
}

._7an-Uov3mT8- {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  border-radius: var(--radius-md);
  text-decoration: none;
  color: var(--dark-blue);
  min-height: 36px;
  padding-inline: var(--spacing-sm);
  cursor: pointer;
  user-select: none;
}

._7an-Uov3mT8-:hover {
  color: var(--accent-blue);
  background-color: var(--bg-main);
}

._7an-Uov3mT8-:hover svg path {
  stroke: var(--accent-blue);
}

.q38V2pc-l-s- {
  color: var(--accent-blue);
  background-color: var(--bg-main);
}

.q38V2pc-l-s- svg path {
  stroke: var(--accent-blue);
}

.nFT5c8tggo8- {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Text takes no space when hidden */
.eS9EoDW9Yr0- {
  color: inherit;
  font-size: var(--font-size-sm);
  line-height: 20px;
  white-space: nowrap;
  overflow: hidden;
  max-width: 0;
  opacity: 0;
  transform: translateX(-6px);
  transition:
    opacity 0.1s ease,
    max-width 0.15s ease,
    transform 0.1s ease;
  pointer-events: none;
}

/* ── Section headers (items with submenu) ──────────────────── */

.K4XU8ljOPfw- {
  color: var(--font-color);
}

.K4XU8ljOPfw-:hover {
  color: var(--accent-blue);
  background-color: var(--bg-main);
}

.n4Jg-hGXpXg- {
  color: var(--accent-blue);
}

.n4Jg-hGXpXg- svg path {
  stroke: var(--accent-blue);
}

/* Text takes no space when hidden */
.curOBLzLtfo- {
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: inherit;
  line-height: 20px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 0;
  opacity: 0;
  transform: translateX(-6px);
  transition:
    opacity 0.1s ease,
    max-width 0.15s ease,
    transform 0.1s ease;
  pointer-events: none;
}

/* Chevron takes no space when hidden */
._0QBDowmh9FQ- {
  display: flex;
  align-items: center;
  color: var(--font-color);
  overflow: hidden;
  max-width: 0;
  opacity: 0;
  transition:
    transform 0.2s ease,
    max-width 0.15s ease,
    opacity 0.1s ease;
  pointer-events: none;
}

.K4XU8ljOPfw-:hover ._0QBDowmh9FQ- {
  color: var(--accent-blue);
}

.wcFHqDRmP84- {
  transform: rotate(180deg);
}

/* ── Inline accordion submenu ──────────────────────────────── */

.YK8anwdmX4Q- {
  overflow: hidden;
  max-height: 0;
}

.vJS-8y6z6TQ- {
  max-height: 600px;
}

._4Ba-J-Gysyo- {
  position: relative;
  padding: 6px var(--spacing-sm) 6px 40px;
  border-radius: var(--radius-sm);

  &::before {
    content: "";
    position: absolute;
    left: 26px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: currentColor;
    opacity: 0;
    transition: opacity 0.15s ease 0.08s;
  }

  & a {
    display: block;
    color: var(--dark-blue);
    text-decoration: none;
    font-size: var(--font-size-sm);
    line-height: 20px;
    white-space: nowrap;
    /* Fade in with sidebar — hidden by default */
    opacity: 0;
    transform: translateX(-6px);
  }
}

._4Ba-J-Gysyo-:hover {
  background-color: var(--bg-main);

  &::before {
    opacity: 1;
  }

  & a {
    color: var(--accent-blue);
  }
}

.q7yDppIzjnM- {
  &::before {
    opacity: 1;
    background-color: var(--accent-blue);
  }

  & a {
    color: var(--accent-blue);
    font-weight: 500;
  }
}

/* When sidebar is open — reveal submenu text and bullet */
._2wNicmL6h-8- ._4Ba-J-Gysyo- {
  &::before {
    opacity: 0.4;
  }

  & a {
    opacity: 1;
    transform: translateX(0);
  }
}

._2wNicmL6h-8- .q7yDppIzjnM- {
  &::before {
    opacity: 1;
  }
}

/* ── Utility ───────────────────────────────────────────────── */

.conSiZ3y-EE- {
  text-decoration: none;
  width: 100%;
}

/* ── Width measurement (hidden, for auto-sizing open width) ── */

/* 1×1 px reference element: getBoundingClientRect().width == page zoom factor */
._5rYYZ5MiYDE- {
  position: fixed;
  left: -9999px;
  top: 0;
  width: 1px;
  height: 1px;
  visibility: hidden;
  pointer-events: none;
}

/* position: fixed escapes parent overflow:hidden and clips */
.xFzS-dj5g7Y- {
  position: fixed;
  left: -9999px;
  top: 0;
  visibility: hidden;
  pointer-events: none;
  width: max-content;
  display: flex;
  flex-direction: column;
  padding: 0 var(--spacing-xs);
}

/* Items render at natural width — no centering, no collapsed-state overrides */
._3edGlgCKU6I- {
  padding-inline: var(--spacing-sm) !important;
  gap: var(--spacing-md) !important;
  justify-content: flex-start !important;
}

/* Make text/chevron/submenu links fully visible inside the probe */
.xFzS-dj5g7Y- .eS9EoDW9Yr0-,
.xFzS-dj5g7Y- ._0QBDowmh9FQ-,
.xFzS-dj5g7Y- ._4Ba-J-Gysyo- a {
  max-width: none;
  overflow: visible;
  opacity: 1;
  transform: none;
  transition: none;
  pointer-events: none;
}

.xFzS-dj5g7Y- ._4Ba-J-Gysyo-::before {
  display: none;
}
.r1leFDXImig- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  overflow-x: hidden;
}
.trmKVqnf9tw- {
  background-color: var(--bg-fill);
  border-radius: 15px;
  padding: 12px 24px;
  overflow-x: auto;

  @media (max-width: 900px) {
    padding: 6px 12px;
  }
}

.fG06thpUWaA- {
  display: flex;
  align-items: center;
  column-gap: var(--spacing-md);
  margin-bottom: 15px;

  a {
    flex-shrink: 0;
  }

  @media (max-width: 900px) {
    flex-direction: column;
    gap: var(--spacing-md);
  }
}

/* UserWithAvatar */
.Q2J93R-XnbE- {
  width: 100%;
  display: grid;
  grid-template-columns: 70px 1fr;
}

.nEDZWQo3Fgo- {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: fill;
}

.W50umlalRbo- {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  white-space: nowrap;
}

.uYwDm65FI-g- {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.sTTCVDcZ3V8- {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;

  color: #90a0b7;
}
@keyframes oQpjuNkV7Bo- {
  0%,
  100% {
    opacity: 0.6;
  }
  50% {
    opacity: 0.25;
  }
}

/* ── UserProjects skeleton ─────────────────────────── */

.AP8Fh56N6sI- {
  display: flex;
  gap: 10px;

  @media (max-width: 900px) {
    flex-direction: column;
  }
}

.w-MC99IbzWw- {
  display: flex;
  align-items: center;
  margin-right: 10px;
}

.vjlxTGGEz9E- {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--bg-main);
  animation: oQpjuNkV7Bo- 1.5s ease-in-out infinite;
  margin-right: 10px;
  flex-shrink: 0;

  @media (max-width: 900px) {
    width: 30px;
    height: 30px;
  }
}

.lcMMy4RsIvE- {
  width: 90px;
  height: 14px;
  border-radius: var(--radius-sm);
  background-color: var(--bg-main);
  animation: oQpjuNkV7Bo- 1.5s ease-in-out infinite;
}

/* ── DashboardWidgets skeleton ─────────────────────── */

.mdKbYwPTMCM- {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  width: 100%;

  @media (max-width: 900px) {
    grid-template-columns: 1fr;
  }
}

.oC9ZSxqza6Q- {
  height: 336px;
  border-radius: var(--radius-lg);
  background-color: var(--bg-fill);
  animation: oQpjuNkV7Bo- 1.5s ease-in-out infinite;
}
.lyMVblvb-ig- {
  display: flex;

  @media (max-width: 900px) {
    flex-direction: column;
    gap: var(--spacing-sm);
  }
}

.I3tvnlfqCdc- {
  display: flex;
  align-items: center;
  margin-right: 10px;
}

.I3tvnlfqCdc-:last-child {
  margin-right: 0;
}

.m0XRnzqj76k- {
  width: 50px;
  height: 50px;
  border-radius: 50%;

  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--font-size-xxl);

  margin-right: 10px;

  color: #fff;

  &:hover {
    box-shadow: 0 0 18px 0 #06080b;
  }

  @media (max-width: 900px) {
    width: 30px;
    height: 30px;
    font-size: var(--font-size-xs);
  }
}

.oaqVOkx-1Zg- {
  text-wrap: nowrap;
}
.Kne2Mu9MDJ8- {
  width: 100%;
  position: relative;
}

/* Fade in the grid after layout is positioned to avoid flash */
.Kne2Mu9MDJ8-:not([data-layout-ready="true"]) .zfxgqfW8kGs- {
  opacity: 0;
  pointer-events: none;
}

.Kne2Mu9MDJ8-[data-layout-ready="true"] .zfxgqfW8kGs- {
  opacity: 1;
  transition: opacity 0.2s ease-out;
}

.zfxgqfW8kGs- {
  width: 100%;
}

/* Disable all transitions during initial mount */
.Kne2Mu9MDJ8-:not([data-layout-ready="true"]) .sCqV3RLvvDc-,
.Kne2Mu9MDJ8-:not([data-layout-ready="true"]) .react-grid-item {
  transition: none !important;
}

.sCqV3RLvvDc- {
  display: flex;
  flex-direction: column;
  background-color: var(--bg-fill);
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--card-border);
  transition: box-shadow 0.15s ease-out;
}

.sCqV3RLvvDc-:hover {
  box-shadow: 0 0 14px 0 #06080b;
}

.sCqV3RLvvDc-[data-dragging="true"] {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  z-index: 100;
}

.eY7y7Vi69NI- {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 8px 12px;
  cursor: grab;
  background-color: var(--bg-fill);
  min-height: 32px;
}

.eY7y7Vi69NI-:active {
  cursor: grabbing;
}

.z15m8phENJU- {
  display: flex;
  width: 24px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='0 0 24 16'%3E%3Ccircle cx='4' cy='4' r='2' fill='%239ca3af'/%3E%3Ccircle cx='12' cy='4' r='2' fill='%239ca3af'/%3E%3Ccircle cx='20' cy='4' r='2' fill='%239ca3af'/%3E%3Ccircle cx='4' cy='12' r='2' fill='%239ca3af'/%3E%3Ccircle cx='12' cy='12' r='2' fill='%239ca3af'/%3E%3Ccircle cx='20' cy='12' r='2' fill='%239ca3af'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.4;
  transition: opacity 0.1s ease-out;
}

.sCqV3RLvvDc-:hover .z15m8phENJU- {
  opacity: 1;
}

._7n09cQqX-Hg- {
  flex: 1;
  padding: 20px;
  overflow: auto;
  min-height: 0;
}

/* Override default react-grid-layout placeholder */
.react-grid-placeholder {
  background-color: var(--accent-blue) !important;
  opacity: 0.15 !important;
  border-radius: var(--radius-lg);
  transition: none !important;
}

/* Faster transitions for grid items during interaction */
.react-grid-item {
  transition: transform 0.1s ease-out !important;
}

.react-grid-item.react-draggable-dragging {
  transition: none !important;
  z-index: 100;
}

.react-grid-item.resizing {
  transition: none !important;
}

/* Resize handle styling */
.react-resizable-handle {
  position: absolute;
  width: 20px;
  height: 20px;
  bottom: 0;
  right: 0;
  cursor: se-resize;
  opacity: 0;
  transition: opacity 0.1s ease-out;
}

.sCqV3RLvvDc-:hover .react-resizable-handle {
  opacity: 1;
}

.react-resizable-handle::after {
  content: "";
  position: absolute;
  right: 3px;
  bottom: 3px;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--icon-grey);
  border-bottom: 2px solid var(--icon-grey);
}

/* Widget specific table adjustments */
._7n09cQqX-Hg- [data-table-min-width] {
  height: 100%;
  max-height: none;
}
.qL1w4gPedpY- {
  position: fixed;
  z-index: 9999;
  background-color: var(--bg-fill);
  padding: 20px;
  border: 1px solid var(--table-border);
  border-radius: var(--radius-lg);
}
.R1M1Sd5VU0Y- {
  display: flex;
  flex-direction: column;
}

.R1M1Sd5VU0Y- > div:first-child {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.OJBiLdLAD1E- {
  position: relative;
}

.qQksb-06EqM- {
  position: absolute;
  top: var(--spacing-xs);
  right: 0;
  opacity: 0;
  cursor: grab;
  background-color: inherit;
  border: none;
}

.ANWKovYSGEY- {
  opacity: 1;
}

.Ztqgvd22WZw- {
  position: absolute;
  right: 0;
  top: var(--spacing-xs);
  background: blue;
  opacity: 0;
  width: 10px;
  height: 100%;
  cursor: col-resize;
}

.RlaqvIwSunQ- {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-xs);
  width: 100%;
}

.g2qOZbXDZPo- {
  flex: 1;
  min-width: 0;
  cursor: pointer;

  > div {
    height: 100%;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
  }
}

.rtKVm8mXgQg- {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: var(--spacing-xs);
  top: var(--spacing-xs);
  flex-shrink: 0;
  width: 16px;
  height: 20px;
  color: var(--font-color);
  opacity: 0.5;
  transition: opacity 0.15s ease;
}

.LhU7h2pWsgI- {
  color: var(--accent-blue);
  opacity: 1;
}
.icb-v1JHoto- {
  display: flex;
  list-style: none;
}

.icb-v1JHoto- li {
  background-color: none;
  display: flex;
  margin-right: 5px;
  cursor: pointer;
}

.icb-v1JHoto- a {
  height: 100%;
  width: 100%;
  padding: 5px 10px;

  display: flex;
  align-items: center;
}
._6UWpCIs-8kw- {
  border: 2px solid var(--icon-grey);
  border-radius: var(--radius-md);
}

.tfInLXtsDvI- {
  border-color: var(--accent-blue);
}
.g9uyuQ6yTbA- {
  display: flex;
  align-items: center;
  min-height: 70px;

  @media (max-width: 900px) {
    min-height: unset;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-sm);
  }
}

.RhXoyzhQMR4- {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
}
.M9JeKjzO0yQ- {
  display: flex;
  flex-direction: column;
  min-height: 0;

  &.sTXGk5-KtbY- {
    display: flex;
    flex-direction: column;
  }

  &.CJgGgrWX0rk- {
    position: relative;
    flex: 1;
    width: fit-content;
    max-width: 100%;
  }

  &.SRUkkl0mc4c- {
    .Dkosn-mUiuM- thead tr:first-child {
      border-radius: 0px;
    }

    .Dkosn-mUiuM- thead tr th:first-child {
      border-top-left-radius: 0;
    }

    .Dkosn-mUiuM- thead tr th:last-child {
      border-top-right-radius: 0;
    }
  }
}

.QfMRuZgNiWU- {
  overflow: auto;
  flex: 1;
  min-height: 0;
}

.H4TL6kuk2ck- {
  overflow: hidden;
}

.RrJlkKB-Ojk- {
  display: flex;
  flex-direction: column;
}

._22tJZ8BMQIs- {
  min-width: 100%;
  display: inline-block;
}

.Dkosn-mUiuM- {
  --border: 1px solid var(--table-border);
  border-radius: var(--radius-md);

  border-spacing: 0;
  border-collapse: separate;
  border: var(--border);
  width: fit-content;
  border-width: 0 1px 1px 1px;
}

.Dkosn-mUiuM- th:not(:last-child),
.Dkosn-mUiuM- td:not(:last-child) {
  border-right: var(--border);
}

.Dkosn-mUiuM- > thead > tr:not(:last-child) > th,
.Dkosn-mUiuM- > thead > tr:not(:last-child) > td,
.Dkosn-mUiuM- > tbody > tr:not(:last-child) > th,
.Dkosn-mUiuM- > tbody > tr:not(:last-child) > td,
.Dkosn-mUiuM- > tfoot > tr:not(:last-child) > th,
.Dkosn-mUiuM- > tfoot > tr:not(:last-child) > td,
.Dkosn-mUiuM- > tr:not(:last-child) > td,
.Dkosn-mUiuM- > tr:not(:last-child) > th,
.Dkosn-mUiuM- > thead:not(:last-child),
.Dkosn-mUiuM- > tbody:not(:last-child),
.Dkosn-mUiuM- > tfoot:not(:last-child) {
  border-bottom: var(--border);
}
.Dkosn-mUiuM- thead tr th {
  border-bottom: var(--border);
  background: var(--table-head);
}

.Dkosn-mUiuM- thead tr:first-child {
  border-top: var(--border);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
}

.Dkosn-mUiuM- thead tr th:first-child {
  border-top-left-radius: var(--radius-md);
}

.Dkosn-mUiuM- thead tr th:last-child {
  border-top-right-radius: var(--radius-md);
}

.-Y6gfqhQmYQ- {
  position: sticky;
  top: 0;
  z-index: 2;
}

.bAcUwnvpERc- {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.bAcUwnvpERc- tr:first-child {
  border-top: none;
}

.Dkosn-mUiuM- tr {
  display: flex;
}
.Dkosn-mUiuM- tbody tr:hover {
  background-color: var(--hover-row-color);
}
.Dkosn-mUiuM- tr th {
  padding: var(--spacing-lg) var(--spacing-xs);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.Dkosn-mUiuM- tr td {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.Dkosn-mUiuM- > tfoot th {
  border-top: var(--border);
}

.Dkosn-mUiuM- thead tr th {
  white-space: nowrap;
}

.Dkosn-mUiuM- tbody tr td {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.jv9tAhaSTko-,
.PNuExy-pheA- {
  box-shadow: inset 0 0 0 1px var(--table-border);
  padding: 0.25rem;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.jv9tAhaSTko- {
  height: 30px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.GPfDvABOokw- td {
  height: 40px;
}

.GPfDvABOokw-:hover {
  background-color: unset;
}

.GPfDvABOokw-:nth-child(3n + 2) .wUl-hoca2yY- {
  animation-delay: -0.5s;
}

.GPfDvABOokw-:nth-child(3n + 3) .wUl-hoca2yY- {
  animation-delay: -1s;
}

.GPfDvABOokw- td:nth-child(3n + 1) .wUl-hoca2yY- {
  width: 75%;
}

.GPfDvABOokw- td:nth-child(3n + 2) .wUl-hoca2yY- {
  width: 55%;
}

.GPfDvABOokw- td:nth-child(3n + 3) .wUl-hoca2yY- {
  width: 65%;
}

.wUl-hoca2yY- {
  height: 14px;
  border-radius: var(--radius-sm);
  background-color: var(--skeleton-base);
  position: relative;
  overflow: hidden;
  width: 65%;
  margin: 0 auto;
}

.wUl-hoca2yY-::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(
    90deg,
    transparent 0%,
    var(--skeleton-shimmer) 50%,
    transparent 100%
  );
  transform: translateX(-100%);
  animation: ULXXWm9vMSk- 1.6s ease-in-out infinite;
  will-change: transform;
}

@keyframes ULXXWm9vMSk- {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(100%);
  }
}

._7QAYJlnsAaM- {
  flex-shrink: 0;
  padding-top: var(--spacing-md);
}

._0z5Ho8nuqWw- {
  border-top: var(--border);
  font-weight: 800;
  color: var(--font-color);
}

@media (max-width: 900px) {
  .QfMRuZgNiWU- {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  ._22tJZ8BMQIs- {
    display: inline-block;
  }

  .Dkosn-mUiuM- {
    font-size: var(--font-size-xs);
    width: fit-content;
    min-width: 100%;
  }

  .Dkosn-mUiuM- thead tr th,
  .Dkosn-mUiuM- tbody tr td {
    min-width: var(--table-mobile-column-min-size);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .Dkosn-mUiuM- thead tr th {
    padding: 12px 4px;
    font-size: var(--font-size-xs);
    font-weight: 600;
  }

  .Dkosn-mUiuM- tbody tr td {
    font-size: var(--font-size-xs);
    height: 40px;
  }

  .M9JeKjzO0yQ- {
    height: 100%;
    max-height: 100vh;
  }
}
.SuAStr8ZBBw- {
  margin: 0;
  margin-bottom: 10px;
}

.DXlkbRZRebE- {
  h3 {
    margin: 0;
  }
}
._3agbKflJGVw- {
  margin: 0;
  margin-bottom: 10px;
}

.Vb9g16Br8zM- {
  color: inherit;
  text-decoration: none;
}
.cG9Zh905NTo- {
  width: 100%;
}

.Z3nTFaGqEjo- {
  text-align: left;
}
.ajPA51aAhjw- {
  color: var(--red);
}
/* ── Shared overlay ──────────────────────────────────────────────────────── */

.dd9h1Er0dNI- {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 1500;
  animation: bRlH23Vs9rc- 0.15s ease;
}

@keyframes bRlH23Vs9rc- {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* ── Desktop (Radix Dialog) ──────────────────────────────────────────────── */

._32-EkLbjgNM- {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 300px;
  max-height: 90vh;
  background-color: var(--input-bg);
  border-radius: var(--radius-md);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.24);
  z-index: 1501;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  /* transform is set inline for drag support */
  outline: none;
}

.wRb0El8sSGA- {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* ── Mobile bottom sheet (vaul) ──────────────────────────────────────────── */

.D1rGR1nxBG0- {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  max-height: 90dvh;
  background-color: var(--input-bg);
  border-radius: 16px 16px 0 0;
  z-index: 1501;
  display: flex;
  flex-direction: column;
  outline: none;
  /* vaul adds its own transform for animation */
}

.PAvqglIK4U8- {
  background: var(--bg-fill);
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}

.pQWYkGrNGvU- {
  width: 40px !important;
  height: 4px !important;
  background-color: var(--text-secondary) !important;
  border-radius: 2px !important;
  opacity: 0.4;
  margin: 12px auto 8px;
  flex-shrink: 0;
}

.LX4UQa1yyLg- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 4px 16px 12px;
  box-sizing: border-box;
  border-bottom: 1px solid var(--table-border);
}

.uv3gr0qlfJY- {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

/* ── Header (desktop) ────────────────────────────────────────────────────── */

._7yI7-AiL0Oc- {
  background: var(--bg-fill);
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  user-select: none;
  color: var(--dark-blue);
  padding: 10px;
  font-size: var(--font-size-sm);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  flex-shrink: 0;
}

.v1ROQfzrFCk- {
  cursor: grab;
  touch-action: none;
}

.v1ROQfzrFCk-:active {
  cursor: grabbing;
}

._0yaVy4uA0hs- {
  flex: 1;
  margin: 0;
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--font-color);
}

/* ── Close button ────────────────────────────────────────────────────────── */

._3LpSfpxd49I- {
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-sm);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--dark-blue);
  transition: background-color 0.2s ease;
  flex-shrink: 0;
}

._3LpSfpxd49I-:hover {
  background-color: var(--input-bg);
}

._3LpSfpxd49I- svg {
  width: 16px;
  height: 16px;
}

/* ── Content area ────────────────────────────────────────────────────────── */

.QNpBmfQPmeo- {
  padding: var(--spacing-md);
  flex: 1;
  overflow-y: auto;
  width: 100%;
  box-sizing: border-box;
}

/* Inside sheet: reduce padding, prevent horizontal overflow, pass height to children */
.D1rGR1nxBG0- .QNpBmfQPmeo- {
  padding: var(--spacing-sm);
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}
.zrrX60LPmTQ- {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  cursor: pointer;
}

.oi8QGBR75s8- {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  width: 44px;
  height: 24px;
  border: none;
  padding: 0;
  border-radius: 12px;
  background-color: var(--icon-grey);
  cursor: pointer;
  transition:
    background-color 0.25s ease,
    box-shadow 0.2s ease;
  outline: none;
}

.oi8QGBR75s8-:focus-visible {
  box-shadow: 0 0 0 2px var(--accent-blue);
}

.oi8QGBR75s8-:hover:not([data-disabled]) {
  background-color: color-mix(in srgb, var(--icon-grey) 80%, var(--accent-blue));
}

.oi8QGBR75s8-[data-checked] {
  background-color: var(--green);
}

.oi8QGBR75s8-[data-checked]:hover:not([data-disabled]) {
  background-color: color-mix(in srgb, var(--green) 85%, #000);
}

._-2KQDw8NAiQ- {
  position: absolute;
  left: 3px;
  width: 18px;
  height: 18px;
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.25s ease;
}

.oi8QGBR75s8-[data-checked] ._-2KQDw8NAiQ- {
  transform: translateX(20px);
}

.Yxp-nDp806A- {
  opacity: 0.5;
  cursor: not-allowed;

  .oi8QGBR75s8- {
    cursor: not-allowed;
  }
}

.MIXjRpez5gI- {
  margin-left: 8px;
  color: var(--dark-blue);
  font-size: var(--font-size-sm);
  user-select: none;
}
.AOdO1f9LV7k- {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  cursor: pointer;
}

.qAGS-uLUmwQ- {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 5px;
  border: 2px solid var(--icon-grey);
  background: transparent;
  cursor: pointer;
  outline: none;
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}

._4OOFaJlmu2g- {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: scale(0.6);
  transition:
    opacity 0.15s ease,
    transform 0.15s ease;
}

.qAGS-uLUmwQ-:hover:not([data-disabled]) {
  border-color: var(--accent-blue);
  background-color: color-mix(in srgb, var(--accent-blue) 6%, transparent);
}

.qAGS-uLUmwQ-:focus-visible {
  border-color: var(--accent-blue);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-blue) 25%, transparent);
}

.qAGS-uLUmwQ-[data-checked] {
  background-color: var(--accent-blue);
  border-color: var(--accent-blue);
}

.qAGS-uLUmwQ-[data-checked] ._4OOFaJlmu2g- {
  opacity: 1;
  transform: scale(1);
}

.qAGS-uLUmwQ-[data-checked]:hover:not([data-disabled]) {
  background-color: color-mix(in srgb, var(--accent-blue) 82%, #000);
  border-color: color-mix(in srgb, var(--accent-blue) 82%, #000);
}

._2NMvjnxPNz4- {
  color: var(--dark-blue);
  font-size: var(--font-size-sm);
  user-select: none;
  cursor: pointer;
  line-height: 1.4;
}

.fwp5rpNFhGQ- {
  color: var(--red);
  font-size: var(--font-size-xs);
}

.bTmRr6AHW1U- {
  opacity: 0.45;
  cursor: not-allowed;

  .qAGS-uLUmwQ-,
  ._2NMvjnxPNz4- {
    cursor: not-allowed;
  }
}
/* ── Trigger button (DatePicker input) ───────────────────────────── */
.En4PObvFfZI- {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding: 8px 12px;
  min-width: 150px;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  color: var(--dark-blue);
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition: border-color 0.15s ease;
  white-space: nowrap;

  &:hover:not(:disabled) {
    border-color: var(--accent-blue);
  }

  &:focus-visible {
    outline: 2px solid var(--accent-blue);
    outline-offset: 2px;
  }
}

.VcKvciGqG98- {
  flex-shrink: 0;
  color: var(--accent-blue);
}

.xmPj5fypTMI- {
  color: var(--dark-blue);
}

.LlamkZfIC8g- {
  opacity: 0.5;
}

.JVN67CwGevM- {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 2px;
  border-radius: var(--radius-sm);
  color: var(--icon-grey);
  transition: color 0.15s ease;

  &:hover {
    color: var(--dark-blue);
  }
}

._0CdvTFmE-X0- {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ── MonthYearPicker custom trigger ──────────────────────────────── */
._5Ia776ufvns- {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding: 8px 16px;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  color: var(--font-color);
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition: border-color 0.15s ease;
  user-select: none;

  svg {
    color: var(--accent-blue);
    flex-shrink: 0;
  }

  &:hover:not(._0CdvTFmE-X0-) {
    border-color: var(--accent-blue);
  }

  &._0CdvTFmE-X0- {
    opacity: 0.6;
    cursor: not-allowed;
  }
}

/* ── Popover content card ─────────────────────────────────────────── */
.TfKfMgKCYiQ- {
  background: var(--input-bg);
  border-radius: var(--radius-md);
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.1),
    0 2px 4px -1px rgba(0, 0, 0, 0.06);
  padding: 12px;
  z-index: 9999;
  animation: Sd9ZTLkxylY- 0.12s ease;
}

@keyframes Sd9ZTLkxylY- {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── react-day-picker calendar ───────────────────────────────────── */
.BPlWWq9sIqE- {
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  color: var(--dark-blue);
  position: relative;
}

.zoS-cT-AyVI- {
  display: flex;
  gap: var(--spacing-md);
}

._-2MPsQF9wCM- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.LTlhKRL5zLk- {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 36px 4px;
}

/* Clickable month/year label in caption */
._3DHD4MHw17w- {
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--dark-blue);
  text-transform: capitalize;
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: var(--radius-sm);
  font-family: var(--font-family);
  transition: background-color 0.15s ease;

  &:hover {
    background-color: color-mix(in srgb, var(--accent-blue) 12%, transparent);
  }
}

.OOj0-AuffPA- {
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--dark-blue);
  text-transform: capitalize;
}

/* Nav spans the full width, prev on left — next on right */
.JM-zUROKyIA- {
  display: flex;
  justify-content: space-between;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  pointer-events: none;
}

.N-lunGpAaFA-,
.-LiH7iJCLlw-,
.vGyuPel1SY8- {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: var(--radius-sm);
  border: none;
  background: transparent;
  color: var(--dark-blue);
  cursor: pointer;
  font-size: 16px;
  transition: background-color 0.15s ease;
  pointer-events: all;

  &:hover {
    background-color: color-mix(in srgb, var(--accent-blue) 12%, transparent);
  }
}

._7FD6AcrjZ4w- {
  border-collapse: collapse;
  width: 100%;
}

.G3WeJTTge3g- {
  display: flex;
  margin-bottom: 2px;
}

._68XlAVckoyk- {
  width: 40px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-xs);
  color: var(--dark-blue);
  opacity: 0.6;
  font-weight: 500;
  text-transform: capitalize;
}

.X1xT2fiajVU- {
  display: flex;
}

._4UD1PN1NjQ4- {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.uaGtzDLZgxU- {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--dark-blue);
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    color 0.15s ease;

  &:hover:not(:disabled) {
    background-color: color-mix(in srgb, var(--accent-blue) 15%, transparent);
  }
}

.qiBtp4RZeU0- .uaGtzDLZgxU- {
  background-color: var(--accent-blue);
  color: #fff;

  &:hover {
    background-color: var(--accent-blue);
    opacity: 0.9;
  }
}

.wvh6L4BwFXc- .uaGtzDLZgxU- {
  border: 1.5px solid var(--accent-blue);
  font-weight: 600;
}

.daXfjw5Ihs8- .uaGtzDLZgxU- {
  opacity: 0.35;
}

.vl-30BhiLGc- .uaGtzDLZgxU-,
.vl-30BhiLGc- {
  opacity: 0.35;
  cursor: not-allowed;
}

.gDuXdCcNFx4- .uaGtzDLZgxU-,
.xjf4Zk0kiWs- .uaGtzDLZgxU- {
  background-color: var(--accent-blue);
  color: #fff;
}

.UoFNn719ka4- .uaGtzDLZgxU- {
  border-radius: 0;
  background-color: color-mix(in srgb, var(--accent-blue) 15%, transparent);
}

/* ── Range hover preview (while selecting the second date) ──────── */
.H-WNurLhyTM- .uaGtzDLZgxU-,
.D9DYaTrODvE- .uaGtzDLZgxU- {
  background-color: var(--accent-blue);
  color: #fff;
  opacity: 0.55;
}

.XDYFBhcW61I- .uaGtzDLZgxU- {
  border-radius: 0;
  background-color: color-mix(in srgb, var(--accent-blue) 10%, transparent);
}

/* ── Inline month picker (inside DatePicker popover) ─────────────── */
.ZLmt-sZsbEI- {
  min-width: 280px;
}

/* ── MonthYearPicker grid ─────────────────────────────────────────── */
.b9L-LXhfSzk- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4px 8px;
}

.Y-wHWSKzYm8- {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--spacing-xs);
  min-width: 280px;
}

.p0AZSV8AdnY- {
  padding: 10px 8px;
  border-radius: var(--radius-sm);
  border: none;
  background: transparent;
  color: var(--dark-blue);
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  cursor: pointer;
  text-align: center;
  transition: background-color 0.15s ease;

  &:hover:not(:disabled) {
    background-color: color-mix(in srgb, var(--accent-blue) 15%, transparent);
  }

  &.qiBtp4RZeU0- {
    background-color: var(--accent-blue);
    color: #fff;
  }

  &.vl-30BhiLGc-,
  &:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    text-decoration: line-through;
  }
}
.pTihP4qYwnE- {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  justify-content: space-between;
}

.kY81R27N1jE- {
  justify-content: flex-start;
}

.MGMnwjOqrjc- {
  white-space: nowrap;
  flex-shrink: 0;
}

.T7fvhpZbqkk- {
  color: var(--red);
}

/* Input base styles */
.t-uqxV6u-dU- {
  flex: 1;
  max-width: max(300px, 50%);
  font-size: var(--font-size-lg);
  line-height: 1.4;
  outline: none;
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  color: var(--dark-blue);
}

.t-uqxV6u-dU-::placeholder {
  color: var(--dark-blue);
}

.t-uqxV6u-dU-:disabled {
  opacity: 0.8;
}

.MiwpfJ1epy4- {
  flex: 0;
  max-width: none;
  width: auto;
}

/* Sizes */
.rkbRE7j6I-k- {
  padding: 15px 32px;
}

.ZWT5q7lu5ig- {
  padding: 6px 10px;
  font-size: 14px;
  min-height: 36px;
}

.fltJztfXlO0- {
  padding: 5px 10px;
}

/* Error state */
.yXy6kY2cFwk- {
  border-color: var(--red);
}

/* Remove number spinners */
.t-uqxV6u-dU-::-webkit-outer-spin-button,
.t-uqxV6u-dU-::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.t-uqxV6u-dU-[type="number"] {
  -moz-appearance: textfield;
}

._9gF9uHn4Olg- {
  flex-basis: 100%;
  color: var(--red);
  font-size: var(--font-size-xs);
}

/* Responsive: stack vertically on mobile */
@media (max-width: 900px) {
  .pTihP4qYwnE-:not(.kY81R27N1jE-) {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-xs);
  }

  .pTihP4qYwnE-:not(.kY81R27N1jE-) .MGMnwjOqrjc- {
    font-size: var(--font-size-sm);
  }

  .pTihP4qYwnE-:not(.kY81R27N1jE-) .t-uqxV6u-dU- {
    max-width: 100%;
    width: 100%;
    font-size: var(--font-size-md);
  }
}
.gGUO3AXRNPk- {
  color: var(--red);
}

.dSclbCE5CiU- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.lImeDwflUu4- {
  color: var(--red);
  font-size: var(--font-size-xs);
}

.agYygFvyF6A- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  justify-content: space-between;

  > div {
    max-width: Max(300px, 50%);
    width: 100%;

    @media (max-width: 900px) {
      max-width: 250px;
    }
  }

  label {
    white-space: nowrap;
  }

  @media (max-width: 900px) {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-xs);

    label {
      font-size: var(--font-size-sm);
    }
  }
}
.YXfa2EpClP4-,
.Xg0zpK68sEM- {
  color: var(--red);
}

.jxXsrZpLBhQ- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.n-1rc1JOZJo- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.Y4lxFH9lmBU- {
  color: var(--red);
  font-size: var(--font-size-xs);
}
.xWveHRKPwYw- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.ioFwMtkV6Fw- {
  display: none;
}

.U-UVm0X6jTY- {
  width: 24px;
  height: 24px;
}
.cM7nYg4-kZw-,
._4KM8N2XmN2Q- {
  color: var(--red);
}

.EOdOn9aN4hI- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.U8h01PFgrvE- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.gjWk0xHIiXU- {
  color: var(--red);
  font-size: var(--font-size-xs);
}
.LVgiBdVcQEk- {
  width: 100%;
}

.X7MW5KBeFd0- {
  padding: 10px 0;
  margin: 0;
}

.NZ3ErhZL7pQ- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

._7VpPGg3X0fo- {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  align-items: flex-start;
}

._05WRD-OrD-g- {
  background: var(--bg-main);
  border: 1px solid var(--frame-border);
  border-radius: var(--radius-md);
  padding: 10px 14px;
}

._0x9bVOih4hg- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.V8xvSyDlD9o- {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
  align-items: center;
}

.dRJ49CC3i4A- {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: var(--spacing-sm);
  row-gap: var(--spacing-sm);
  align-items: center;
}

.RtAYZhxTfMQ- {
  display: contents;
}

.OJ6Ku1ZxLo0- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

/* ── Mobile toggle button ─────────────────────────────────────────── */
.MjI0mk7uJjQ- {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: 8px 12px;
  background: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  color: var(--dark-blue);
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition: border-color 0.15s ease;

  &:hover {
    border-color: var(--accent-blue);
  }
}

.EYIeRg4HTQE- {
  transition: transform 0.2s ease;
  flex-shrink: 0;
  color: var(--accent-blue);
}

.aa1kdVN--LQ- .EYIeRg4HTQE- {
  transform: rotate(180deg);
}

@media (max-width: 900px) {
  .X7MW5KBeFd0- {
    font-size: var(--font-size-md);
    padding: 8px 0;
  }

  .NZ3ErhZL7pQ- {
    gap: var(--spacing-sm);
  }

  ._7VpPGg3X0fo- {
    flex-direction: column;
    flex-wrap: nowrap;
    width: 100%;
    gap: var(--spacing-sm);
  }

  ._05WRD-OrD-g- {
    width: 100%;
    box-sizing: border-box;
  }

  .V8xvSyDlD9o- {
    gap: var(--spacing-xs);
  }

  .V8xvSyDlD9o- button,
  .V8xvSyDlD9o- a {
    flex: 1 1 auto;
    min-height: 44px;
  }

  .MjI0mk7uJjQ- {
    flex: 1 1 auto;
    justify-content: center;
    min-height: 44px;
  }

  .dRJ49CC3i4A- {
    gap: var(--spacing-xs);
  }

  .RtAYZhxTfMQ- {
    flex-direction: column;
    align-items: stretch;
    gap: var(--spacing-xs);
  }

  .OJ6Ku1ZxLo0- {
    width: 100%;
    min-width: 0;
  }
}
.GUYEbja1Zy8- {
  width: 100%;
  min-height: 180px;
  font-size: var(--font-size-lg);
  outline: none;
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  color: var(--dark-blue);

  @media (max-width: 900px) {
    font-size: var(--font-size-md);
  }
}

.EWemTgdUNCM- {
  padding: 15px 32px;
}

.teGdbabJIWM- {
  padding: 8px 10px;
}

.XP1U8IjS1N8- {
  padding: 5px 10px;
}
.GUYEbja1Zy8-::placeholder {
  color: var(--dark-blue);
}
.RNRcCsn-4lg- {
  opacity: 0.8;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

.ru6ZHs4Z45k- {
  border-color: var(--red);
}

.jNLbD5L93l0-,
.FZakijMHqMk- {
  color: var(--red);
}

.r3ek-7oo3u0- {
  color: var(--red);
  font-size: var(--font-size-xs);
  margin-top: var(--spacing-xs);
}

.sah52aXGBWM- {
  display: flex;

  > * {
    flex: 0;
  }

  label {
    white-space: nowrap;
  }
}
.kDn0HI-jc-s- {
  width: 95px;
  padding: 8px 10px;
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  color: var(--dark-blue);
  font-family: var(--font-family);
  font-size: var(--font-size-sm);
  outline: none;
  transition: border-color 0.15s ease;
  cursor: pointer;

  &:hover:not(:disabled) {
    border-color: var(--accent-blue);
  }

  &:focus {
    border-color: var(--accent-blue);
    outline: 2px solid color-mix(in srgb, var(--accent-blue) 30%, transparent);
    outline-offset: 1px;
  }

  &::-webkit-calendar-picker-indicator {
    filter: opacity(0.5);
    cursor: pointer;
  }
}

.Y18-EDTCigc- {
  opacity: 0.6;
  cursor: not-allowed;
}
.yZxamKQzWzw- {
  margin: 0 0 var(--spacing-md) 0;
  font-size: var(--font-size-lg);
  font-weight: 600;
  color: var(--text-primary);
  padding-bottom: var(--spacing-sm);
  border-bottom: 1px solid var(--border-subtle);
}

.zk3ndGT8VZg- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.zTByfFbmTNM- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.zTByfFbmTNM- label {
  font-weight: 500;
  color: var(--text-primary);
}

._53L74cuuMz4- {
  margin-top: var(--spacing-sm);
}

.mrpqu0JLeu0- {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-md);
}

._24LxqqU9yaw- {
  display: flex;
  gap: var(--spacing-sm);
  align-items: center;
}

._24LxqqU9yaw- > div {
  flex: 1;
}

@media (max-width: 900px) {
  .zk3ndGT8VZg- {
    gap: var(--spacing-md);
  }

  .mrpqu0JLeu0- {
    grid-template-columns: 1fr;
  }
}
.mH3h8TeJ-qA- {
  margin-bottom: 24px;
}

._5DeNZZcnGWE- {
  font-size: var(--font-size-lg);
  font-weight: 600;
  color: var(--text-primary);
  padding-block: var(--spacing-sm);
  border-bottom: 1px solid var(--border-subtle);
}

/* Notifications section */
.Bf4OJd-03Cw- {
  display: flex;
  gap: var(--spacing-lg);
  margin-top: var(--spacing-md);
}

.fJ4sQH83v00- {
  flex: 1;
  display: flex;
  flex-direction: column;
}

._3Ful3dGvKl4- {
  font-size: var(--font-size-md);
  font-weight: 600;
  color: var(--text-primary);
  margin: 0 0 var(--spacing-md) 0;
}

.BIDMoM3ek-E- {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  overflow: hidden;
  background: var(--background-subtle);
}

.PIiv9SQssew- {
  display: grid;
  grid-template-columns: 1fr 60px 60px;
  align-items: center;
  padding-block: var(--spacing-xs);
  padding-inline: var(--spacing-sm);
  background: var(--background-muted);
  border-bottom: 2px solid var(--border-subtle);
  font-weight: 600;
  color: var(--text-primary);
}

.u0FynjXKaBQ- {
  font-size: var(--font-size-sm);
}

.rMBYqdmSsQ8- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-lg);
  height: var(--spacing-lg);
  color: var(--text-secondary);
}

.-nMg4tXTn48- {
  display: grid;
  grid-template-columns: 1fr 60px 60px;
  align-items: center;
  padding-block: var(--spacing-xs);
  padding-inline: var(--spacing-sm);
  background: var(--background-primary);
  border-bottom: 1px solid var(--border-subtle);
  transition: background-color 0.2s ease;
}

.-nMg4tXTn48-:hover {
  background: var(--background-subtle);
}

.-nMg4tXTn48-:last-child {
  border-bottom: none;
}

.BOcrjXs3jZE- {
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
  line-height: 1.4;
}

.FU7FF9duFhA- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-lg);
  height: var(--spacing-lg);
}

.TpmX8KvRrxk- {
  display: none;
}

@media (max-width: 900px) {
  .Bf4OJd-03Cw- {
    flex-direction: column;
    gap: var(--spacing-lg);
  }

  .fJ4sQH83v00- {
    width: 100%;
  }
}

@media (max-width: 900px) {
  .Bf4OJd-03Cw- {
    flex-direction: column;
    gap: var(--spacing-lg);
  }

  .TpmX8KvRrxk- {
    display: block;
  }

  .PIiv9SQssew-,
  .-nMg4tXTn48- {
    grid-template-columns: 1fr;
    gap: var(--spacing-xs);
    text-align: center;
  }

  .BOcrjXs3jZE- {
    text-align: left;
    margin-bottom: var(--spacing-xs);
  }

  .rMBYqdmSsQ8- {
    justify-content: space-around;
    width: 100%;
    height: auto;
    padding-inline: var(--spacing-sm);
  }

  .FU7FF9duFhA- {
    width: 100%;
    height: auto;
    gap: var(--spacing-md);
    justify-content: center;
  }

  .PIiv9SQssew- {
    display: none;
  }

  .-nMg4tXTn48- {
    padding-block: var(--spacing-sm);
    border-radius: var(--radius-sm);
    margin-bottom: var(--spacing-xs);
    border: 1px solid var(--border-subtle);
  }

  .-nMg4tXTn48-:last-child {
    margin-bottom: 0;
  }
}
._6lPhLsiDrPo- {
  font-size: var(--font-size-lg);
  font-weight: 600;
  color: var(--text-primary);
  padding-block: var(--spacing-sm);
  border-bottom: 1px solid var(--border-subtle);
}

/* Settings container */
.CU-srCgRCsE- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
}

/* Checkbox group */
.IhSA-By1J0Q- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  background: var(--background-subtle);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: var(--spacing-sm);
}

.OdbKOVDqHhc- {
  display: flex;
  align-items: flex-start;
}

/* Time settings grid */
.NFpJOyIj-qo- {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: var(--spacing-md);
}

/* Time card */
.bEimowJpHe0- {
  background: var(--background-subtle);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}

.bEimowJpHe0-:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.thCaVRDnDBc- {
  background: var(--background-muted);
  border-bottom: 1px solid var(--border-subtle);
}

.q3130dys5oM- {
  margin: 0;
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--text-primary);
}

.GNM-UuBFDCs- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

/* Main input group */
.IBA6cDqonUU- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.B-2ctJo0Y1Q- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.VTdjRWs2hv4- {
  min-width: 100px;
  max-width: 140px;
}

.JOIQ57cQAZs- {
  font-size: var(--font-size-xs);
  color: var(--text-secondary);
  font-weight: 500;
  white-space: nowrap;
}

/* Range section */
.fXkr7KxpX-8- {
  display: flex;
  flex-direction: column;
  background: var(--background-primary);
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-subtle);
  overflow: hidden;
}

.uQSrrQJT5qs- {
  margin: 0;
  font-size: var(--font-size-xs);
  font-weight: 600;
  color: var(--text-primary);
  padding: var(--spacing-sm);
  background: var(--background-muted);
  border-bottom: 1px solid var(--border-subtle);
}

.StBbrYZhAto- {
  display: flex;
  gap: var(--spacing-sm);
  align-items: flex-start;
}

.-CxXEZ9pZXc- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  flex: 1;
  align-items: flex-start;
}

.s84W35iTSpg- {
  font-size: var(--font-size-xxs);
  color: var(--text-secondary);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Адаптивность для экранов меньше 900px */
@media (max-width: 900px) {
  .CU-srCgRCsE- {
    gap: var(--spacing-md);
  }

  .NFpJOyIj-qo- {
    grid-template-columns: 1fr;
    gap: var(--spacing-md);
  }

  .IhSA-By1J0Q- {
    padding: var(--spacing-sm);
  }

  .GNM-UuBFDCs- {
    padding-block: var(--spacing-sm);
  }

  .StBbrYZhAto- {
    flex-direction: column;
    gap: var(--spacing-sm);
    align-items: stretch;
  }

  .-CxXEZ9pZXc- {
    width: 100%;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: var(--spacing-sm);
  }

  .s84W35iTSpg- {
    min-width: 24px;
    text-align: left;
    margin-bottom: 0;
    font-size: var(--font-size-xxs);
  }
}

/* Дополнительная адаптивность для очень маленьких экранов */
@media (max-width: 600px) {
  ._6lPhLsiDrPo- {
    font-size: var(--font-size-sm);
  }

  .q3130dys5oM- {
    font-size: var(--font-size-xs);
  }

  .B-2ctJo0Y1Q- {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-xs);
  }

  .VTdjRWs2hv4- {
    max-width: none;
    width: 100%;
  }

  .JOIQ57cQAZs- {
    font-size: var(--font-size-xxs);
    align-self: flex-start;
  }

  .-CxXEZ9pZXc- {
    flex-direction: column;
    gap: var(--spacing-xs);
    align-items: flex-start;
  }

  .s84W35iTSpg- {
    text-align: left;
    align-self: flex-start;
  }

  .uQSrrQJT5qs- {
    font-size: var(--font-size-xxs);
    padding: var(--spacing-xs);
  }
}
.EANx-auU8qc- {
  margin: 0 0 var(--spacing-md) 0;
  font-size: var(--font-size-lg);
  font-weight: 600;
  color: var(--text-primary);
  padding-block: var(--spacing-sm);
  border-bottom: 1px solid var(--border-subtle);
}

/* Permission table */
.LwBUKfbIsFo- {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--background-subtle);
}

.fXU1NSHOE-g- {
  display: grid;
  grid-template-columns: 1fr 200px 200px;
  align-items: center;
  padding-block: var(--spacing-xs);
  padding-inline: var(--spacing-sm);
  background: var(--background-muted);
  border-bottom: 2px solid var(--border-subtle);
  font-weight: 600;
  color: var(--text-primary);
}

.jfzjVuFFqLM- {
  font-size: var(--font-size-sm);
}

.fbIiNppGhks- {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--text-primary);
}

.TWRh-hX4vDY- {
  display: grid;
  grid-template-columns: 1fr 200px 200px;
  align-items: center;
  padding-block: var(--spacing-xs);
  padding-inline: var(--spacing-sm);
  background: var(--background-primary);
  border-bottom: 1px solid var(--border-subtle);
  transition: background-color 0.2s ease;
}

.TWRh-hX4vDY-:hover {
  background: var(--background-subtle);
}

.TWRh-hX4vDY-:last-child {
  border-bottom: none;
}

.xwXa7JPmQUs- {
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
  line-height: 1.4;
  font-weight: 500;
}

.GkBGn9G-tcU- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--spacing-xl);
}

.gGjoup8rTHs- {
  display: none;
}

/* Адаптивность для экранов меньше 900px */
@media (max-width: 900px) {
  .fXU1NSHOE-g-,
  .TWRh-hX4vDY- {
    grid-template-columns: 1fr;
    gap: var(--spacing-xs);
    text-align: center;
  }

  .xwXa7JPmQUs- {
    text-align: left;
    margin-bottom: var(--spacing-xs);
  }

  .fbIiNppGhks- {
    width: 100%;
    justify-content: space-around;
    padding-inline: var(--spacing-xs);
  }

  .GkBGn9G-tcU- {
    width: 100%;
    justify-content: space-between;
  }

  .fXU1NSHOE-g- {
    display: none;
  }

  .TWRh-hX4vDY- {
    border-radius: var(--radius-sm);
    margin-bottom: var(--spacing-xs);
    border: 1px solid var(--border-subtle);
  }

  .TWRh-hX4vDY-:last-child {
    margin-bottom: 0;
  }

  .gGjoup8rTHs- {
    display: block;
  }
}
.CevzycKku8o- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.rxU1alnIG8I- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);

  > * {
    align-self: flex-start;
  }
}

.pd5EbrdyP4Y- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

._0qWrMqeoHQw- {
  font-size: var(--font-size-lg);
  font-weight: 600;
}

.EuL7-HtysiE- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.F-GQOqkrKDM- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.YuO4rKQcr9o- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
  flex-wrap: wrap;
}

.o6ad3C9yHig- {
  display: flex;
  gap: var(--spacing-sm);
  align-items: center;
  flex-wrap: wrap;
}

.xRemjJyY9AM- {
  position: relative;
}

.gIGpx0g7W50- {
  position: absolute;
  top: -6px;
  right: -6px;
  background-color: var(--accent-blue);
  color: white;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-xs);
  font-weight: 600;
  line-height: 1;
  border: 2px solid var(--bg-main);
}

.KG7DVwnJ2zo- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  min-width: 400px;
}

.KG7DVwnJ2zo- label {
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--text-secondary);
  white-space: nowrap;
}

.CtfrZTJN5tE- {
  background-color: var(--bg-surface);
  border: 1px solid var(--border-primary);
  color: var(--text-secondary);
}

.CtfrZTJN5tE-:hover {
  background-color: var(--bg-surface-hover);
}

._8ML4leXmTPU- {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: 800;
  color: var(--text-primary);
}

.Wm3rYLK3aOM- {
  flex: 1;
  min-height: 500px;
  overflow-x: auto;
}

.P9R6lRM4NKg- {
  overflow-x: auto;
}

.grcN4lqx9t8- {
  font-weight: 500;
  color: var(--text-primary);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.t4YWuP1Gzxs- {
  padding: var(--spacing-xs) var(--spacing-xs);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  font-weight: 500;
  text-align: center;
  min-width: var(--spacing-lg);
  display: inline-block;
}

.t4YWuP1Gzxs-.-TRSnvwb0x0- {
  background-color: var(--bg-warning-subtle);
  color: var(--text-warning);
}

.t4YWuP1Gzxs-.jPLPh-taNVM- {
  background-color: var(--bg-info-subtle);
  color: var(--text-info);
}

.t4YWuP1Gzxs-.gAdTLJDlacI- {
  background-color: var(--bg-success-subtle);
  color: var(--text-success);
}

.t4YWuP1Gzxs-.YfMWqEVM3aw- {
  background-color: var(--bg-danger-subtle);
  color: var(--text-danger);
}

.p2Yn8wKX5RQ- {
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
}

.VjE3vBMG-24- {
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.h3osCCvEO-c- {
  display: flex;
  padding: var(--spacing-md);
  gap: var(--spacing-md);

  button {
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--spacing-xs);
    border-radius: var(--radius-sm);
  }
}

.AvJotFrzzxM- {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  font-weight: 500;
  transition: background-color 0.2s ease;
}

.AvJotFrzzxM-:hover {
  background-color: var(--bg-surface-hover);
}

.nESfvHwHG9g- {
  color: var(--green);
}

.ftp0VQJm5Vw- {
  color: var(--red);
}

.w2or4odBVy0- {
  margin-bottom: 24px;
}

.f7LgCec0oUo- {
  margin-top: 16px;
}

.IP9Xd0dclTM- {
  display: flex;
  gap: var(--spacing-md);
  align-items: flex-start;
  flex-wrap: wrap;
}

.A6-FHhm4TLg- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  min-width: 240px;
  max-width: 300px;
}

.A6-FHhm4TLg- label {
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  margin-bottom: 4px;
}

@media (max-width: 900px) {
  .rxU1alnIG8I- {
    flex-direction: column;
    gap: var(--spacing-xs);
    align-items: stretch;
  }

  ._8ML4leXmTPU- {
    text-align: center;
  }

  .F-GQOqkrKDM- {
    align-items: stretch;
    gap: var(--spacing-sm);
  }

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

  .o6ad3C9yHig- {
    justify-content: center;
    flex-wrap: wrap;
  }

  .KG7DVwnJ2zo- {
    min-width: auto;
    width: 100%;
  }
}

@media (max-width: 1365px) {
  .IP9Xd0dclTM- {
    flex-direction: column;
    align-items: stretch;
    gap: var(--spacing-md);
  }

  .A6-FHhm4TLg- {
    min-width: auto;
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 768px) {
  .f7LgCec0oUo- {
    margin-top: 12px;
  }

  .IP9Xd0dclTM- {
    gap: var(--spacing-md);
  }

  .A6-FHhm4TLg- {
    min-width: auto;
    max-width: none;
    width: 100%;
  }

  .A6-FHhm4TLg- label {
    font-size: var(--font-size-xs);
  }
}

@media (max-width: 900px) {
  .w2or4odBVy0- {
    margin-bottom: 16px;
  }

  .f7LgCec0oUo- {
    margin-top: 8px;
  }

  .IP9Xd0dclTM- {
    gap: var(--spacing-sm);
  }

  .A6-FHhm4TLg- {
    gap: var(--spacing-xs);
    width: 20vh;
  }

  .A6-FHhm4TLg- label {
    font-size: var(--font-size-xs);
    margin-bottom: 2px;
  }
}

.Crpj0o2Wal8-,
.bYpLNNBzPzU-,
.DB9pUwZCFHk- {
  > div {
    width: 100%;
    padding: 0 var(--spacing-sm);
  }
}

.Crpj0o2Wal8- {
  min-width: 200px;
}

.DB9pUwZCFHk- {
  min-width: 300px;
}

.rjTOHrbxSp0- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  max-height: 70vh;
  overflow-y: auto;
  padding-right: var(--spacing-sm);
}

.h5m7VNYIM2Q- {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.-yW7uEnSzeE- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
}

.X0tOK-5BxhA- {
  margin: 0;
  font-size: var(--font-size-md);
  font-weight: 600;
  color: var(--text-primary);
}

.x0eJz2XDMLc- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.asYwSmF-39M- {
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
  white-space: nowrap;
}

._86IPQ-jQ7cY- {
  display: flex;
  gap: var(--spacing-sm);
  justify-content: flex-end;
  padding: var(--spacing-md);
  border-top: 1px solid var(--border-primary);
  position: sticky;
  bottom: 0;
  border: 1px solid var(--bg-fill);
  border-radius: var(--radius-md);
}

.mYxEkJN2O9g- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  padding: var(--spacing-md);
}

.U-E2akGKBHM- {
  font-weight: 800;
}

.PUhH3zuTh7E- {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
}

._7-Bulw7VIOw- {
  display: flex;
  flex-direction: column;
  min-width: 160px;
}

.vf-hxNjPedM- {
  padding: var(--spacing-xs) var(--spacing-sm);
  border-radius: var(--radius-sm);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-size: 14px;
  color: var(--font-color);
}

.vf-hxNjPedM-:hover {
  background-color: var(--hover-row-color);
}
.trg8VLPEBhI- {
  background: var(--color-background);
  border-radius: var(--radius-md);
  padding: var(--spacing-lg);
  width: 100%;
  max-width: 850px;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
}

._8zWlaiMlp2Q- {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--spacing-lg);
  margin-bottom: var(--spacing-lg);
  padding-bottom: var(--spacing-md);
  border-bottom: 1px solid var(--color-border);
  width: 100%;
  box-sizing: border-box;
}

.frncfWrPYJA- {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  flex: 1;
  min-width: 0;
}

.WkbIhDMXXko- {
  color: var(--color-primary);
  flex-shrink: 0;
}

.o0Q9Tes1MAY- {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  flex-shrink: 0;
}

.ZcyCyceZgI0- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.E3zWCvJAdlo- {
  color: var(--color-text-secondary);
  transition: color 0.2s ease;
}

._8zWlaiMlp2Q- h3 {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.gvM-FUcpEug- {
  display: none;
}

.hs1rq1Z7sHw- {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: 100%;
  box-sizing: border-box;
}

.TEDDjzYnvkg- {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: var(--spacing-lg) var(--spacing-md);
  text-align: center;
  background: var(--color-surface);
  border-radius: var(--radius-md);
  border: 2px dashed var(--color-border);
}

.wdwNEAezjyg- {
  color: var(--color-text-muted);
  margin-bottom: var(--spacing-md);
  opacity: 0.6;
}

.TEDDjzYnvkg- h4 {
  margin: 0 0 var(--spacing-sm) 0;
  color: var(--color-text-secondary);
  font-size: var(--font-size-lg);
  font-weight: 500;
}

.TEDDjzYnvkg- p {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.mtEJXOVBW6Q- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  overflow-y: auto;
  max-height: 400px;
  padding-right: var(--spacing-md);
  width: 100%;
  box-sizing: border-box;
}

.OOOsUayhqGw- {
  display: flex;
  align-items: center;
  padding: var(--spacing-md);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  transition: all 0.2s ease;
  width: 100%;
  box-sizing: border-box;
}

.OOOsUayhqGw-:hover {
  background: var(--color-surface-hover);
  border-color: var(--color-border-hover);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.YExv2ZXn2No- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--spacing-lg);
  height: var(--spacing-lg);
  background: var(--color-primary-subtle);
  border-radius: var(--radius-md);
  color: var(--color-primary);
  margin-right: var(--spacing-md);
  flex-shrink: 0;
}

.cmzeaZN1nSQ- {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  min-width: 0;
}

.G-O4qcqvj94- {
  font-size: var(--font-size-sm);
  font-weight: 500;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.AnD7qwuXptM- {
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
}

.XnZRbPM7tmE- {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.QN9FgRTTVS4- {
  display: flex;
  gap: var(--spacing-sm);
  flex-shrink: 0;
}

.jU21XltArg8- {
  color: var(--color-danger);
  transition: color 0.2s ease;
}

.jU21XltArg8-:hover {
  color: var(--color-danger-hover);
}

.ovMVZ1RS6RM- {
  margin-top: var(--spacing-lg);
  padding-top: var(--spacing-md);
  border-top: 1px solid var(--color-border);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

.Ol6Q3s8lA-s- {
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
}

@media (max-width: 900px) {
  .trg8VLPEBhI- {
    padding: var(--spacing-md);
    border-radius: 0;
    max-height: 90vh;
    min-height: auto;
    width: 100%;
    max-width: none;
  }

  ._8zWlaiMlp2Q- {
    flex-direction: column;
    align-items: stretch;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
    padding-bottom: var(--spacing-sm);
  }

  .frncfWrPYJA- {
    justify-content: flex-start;
    text-align: left;
  }

  ._8zWlaiMlp2Q- h3 {
    font-size: var(--font-size-md);
  }

  .o0Q9Tes1MAY- {
    justify-content: stretch;
    width: 100%;
  }

  .ZcyCyceZgI0- {
    width: 100%;
    justify-content: center;
    padding: var(--spacing-md);
  }

  .mtEJXOVBW6Q- {
    max-height: 60vh;
    padding-right: 0;
  }

  .OOOsUayhqGw- {
    padding: var(--spacing-sm);
    flex-wrap: wrap;
    gap: var(--spacing-sm);
  }

  .cmzeaZN1nSQ- {
    flex: 1;
    min-width: 200px;
  }

  .G-O4qcqvj94- {
    font-size: var(--font-size-sm);
    line-height: 1.4;
  }

  .QN9FgRTTVS4- {
    flex-direction: row;
    gap: var(--spacing-xs);
    min-width: auto;
  }

  .TEDDjzYnvkg- {
    padding: var(--spacing-lg) var(--spacing-sm);
  }

  .TEDDjzYnvkg- h4 {
    font-size: var(--font-size-md);
  }
}

@media (max-width: 900px) {
  .trg8VLPEBhI- {
    padding: var(--spacing-sm);
    max-height: 95vh;
  }

  ._8zWlaiMlp2Q- {
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
  }

  .frncfWrPYJA- {
    gap: var(--spacing-sm);
  }

  .WkbIhDMXXko- {
    width: 20px;
    height: 20px;
  }

  ._8zWlaiMlp2Q- h3 {
    font-size: var(--font-size-sm);
  }

  .ZcyCyceZgI0- {
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--font-size-sm);
  }

  .mtEJXOVBW6Q- {
    gap: var(--spacing-sm);
    max-height: 65vh;
  }

  .OOOsUayhqGw- {
    padding: var(--spacing-xs) var(--spacing-sm);
    min-height: auto;
  }

  .YExv2ZXn2No- {
    width: 32px;
    height: 32px;
    margin-right: var(--spacing-sm);
  }

  .cmzeaZN1nSQ- {
    min-width: 0;
    flex: 1;
  }

  .G-O4qcqvj94- {
    font-size: var(--font-size-xs);
    line-height: 1.3;
  }

  .AnD7qwuXptM- {
    font-size: var(--font-size-xs);
  }

  .QN9FgRTTVS4- {
    gap: var(--spacing-xs);
  }

  .QN9FgRTTVS4- button {
    padding: var(--spacing-xs);
    min-width: 32px;
    height: 32px;
  }

  .TEDDjzYnvkg- {
    padding: var(--spacing-md) var(--spacing-sm);
  }

  .wdwNEAezjyg- {
    width: 32px;
    height: 32px;
  }

  .TEDDjzYnvkg- h4 {
    font-size: var(--font-size-sm);
    margin-bottom: var(--spacing-xs);
  }

  .TEDDjzYnvkg- p {
    font-size: var(--font-size-xs);
    line-height: 1.4;
  }

  .ovMVZ1RS6RM- {
    margin-top: var(--spacing-sm);
    padding-top: var(--spacing-sm);
  }

  .Ol6Q3s8lA-s- {
    font-size: var(--font-size-xs);
  }
}

@media (max-width: 360px) {
  .OOOsUayhqGw- {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-sm);
  }

  .YExv2ZXn2No- {
    margin-right: 0;
    align-self: flex-start;
  }

  .cmzeaZN1nSQ- {
    width: 100%;
    order: 2;
  }

  .QN9FgRTTVS4- {
    width: 100%;
    justify-content: flex-end;
    order: 3;
  }
}
.U7tIxaTViK4- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
  padding: var(--spacing-lg);
  min-width: 700px;
}

.vNSg4jY61Wc- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.EKZogou3MXU- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

._6ZS-zKwCd44- {
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--text-secondary);
}

._7-4tG0cV0RQ- {
  display: flex;
  justify-content: center;
  gap: var(--spacing-md);
}

.vuVY0SisL-o- {
  display: flex;
  gap: var(--spacing-sm);
  justify-content: flex-end;
  padding-top: var(--spacing-md);
  border-top: 1px solid var(--border-primary);
}

@media (max-width: 900px) {
  .U7tIxaTViK4- {
    min-width: auto;
    max-width: none;
    width: 100%;
    padding: var(--spacing-md);
  }

  ._7-4tG0cV0RQ- {
    flex-direction: column;
    gap: var(--spacing-sm);
  }

  .vuVY0SisL-o- {
    flex-direction: column;
  }

  .vuVY0SisL-o- button {
    width: 100%;
  }
}
.lerGP-lkS5I- {
  border-top: 1px solid var(--table-border);
  background-color: var(--bg-fill);
}

.-QPvN20MtwE- {
  padding: var(--spacing-md);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

._0SiTO5vx4YY- {
  width: 100%;
}

.wXOjk-OOWUg- {
  width: 100%;
  min-height: 60px;
  padding: var(--spacing-sm);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-md);
  background-color: var(--bg-main);
  color: var(--font-color);
  font-family: inherit;
  font-size: var(--font-size-sm);
  resize: vertical;
  transition: border-color 0.2s;
}

.wXOjk-OOWUg-:focus {
  outline: none;
  border-color: var(--accent-blue);
}

.wXOjk-OOWUg-:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

._3QBUSWvwX50- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-sm);
}

.RRAZbRQIjeg- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.FnnnJ7AAR74- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.BZwljIwTaHU- {
  position: relative;
}

._8WNYvpfLcM8- {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 24px;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

._8WNYvpfLcM8-:hover {
  background-color: var(--hover-row-color);
}

.e8LhQLJ4vQg- {
  position: absolute;
  bottom: 100%;
  left: 0;
  margin-bottom: var(--spacing-xs);
  background-color: var(--bg-main);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-md);
  padding: var(--spacing-sm);
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--spacing-xs);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  z-index: 1000;
}

.vUoeWV44jZs- {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 24px;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vUoeWV44jZs-:hover {
  background-color: var(--hover-row-color);
  transform: scale(1.2);
}

.aXypzs-S1XM- {
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--icon-grey);
}

.aXypzs-S1XM-:hover:not(:disabled) {
  background-color: var(--hover-row-color);
  color: var(--accent-blue);
}

.aXypzs-S1XM-:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

._0Od-Cwc-g-Y- {
  display: none;
}

.Cq972VFZUcA- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm);
  background-color: var(--bg-main);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-md);
}

.PGOQUH5c9Do- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-xs) var(--spacing-sm);
  background-color: var(--bg-fill);
  border-radius: var(--radius-sm);
  gap: var(--spacing-sm);
}

.axxDjk1QwEs- {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  flex: 1;
  min-width: 0;
  color: var(--font-color);
}

.EZNer8ORRPA- {
  font-size: var(--font-size-sm);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.oeqfoeYbewE- {
  font-size: var(--font-size-xs);
  color: var(--icon-grey);
  flex-shrink: 0;
}

.A5moE0pv-8U- {
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--icon-grey);
  transition: all 0.2s;
  flex-shrink: 0;
}

.A5moE0pv-8U-:hover:not(:disabled) {
  background-color: var(--red);
  color: white;
}

.A5moE0pv-8U-:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.w-BzuWaZhUc- {
  width: 100%;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--spacing-md);
}

.w-BzuWaZhUc- img {
  margin-left: 10px;
}
.EU0xO1vGYes- {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  object-fit: cover;
}

.r4vJvdY8P80- {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  white-space: nowrap;
}

.UZLojpE6z9o- {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
._--SMmnnGJ4o- {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;

  color: #90a0b7;
}
.XfKF-Z-UIEE- {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: var(--spacing-lg);
}

.WNniz8cUA6Y- {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-md);
}

._6-EmVvKJ5Xs- {
  position: absolute;
  top: calc(var(--spacing-md) * -1);
  right: calc(var(--spacing-md) * -1);
  background-color: var(--bg-main);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-md);
  padding: var(--spacing-sm);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--font-color);
  transition: background-color 0.2s;
  z-index: 10000;
}

._6-EmVvKJ5Xs-:hover {
  background-color: var(--hover-row-color);
}

._7vyyVxT-vLc- {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--radius-md);
}

.FLPvX-4PlL0- {
  max-width: 100%;
  max-height: 80vh;
  object-fit: contain;
  border-radius: var(--radius-md);
}

.ce-1mVatXag- {
  background-color: var(--bg-main);
  color: var(--font-color);
  padding: var(--spacing-sm) var(--spacing-md);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 768px) {
  .XfKF-Z-UIEE- {
    padding: var(--spacing-md);
  }

  .WNniz8cUA6Y- {
    max-width: 95vw;
    max-height: 95vh;
  }

  .FLPvX-4PlL0- {
    max-height: 70vh;
  }

  ._6-EmVvKJ5Xs- {
    top: 0;
    right: 0;
  }
}
.TR5L6JGsRb0- {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-left: var(--spacing-xs);
}

.gClTgEXdfyk- {
  color: var(--icon-grey);
}

.V6soJ2rSfy0- {
  color: var(--accent-blue);
}
.se8KjimR5V0- {
  display: flex;
  gap: var(--spacing-sm);
  padding: var(--spacing-xs) 0;
  width: 100%; /* make row take full width so we can align content */
}

._9-K2x0fb1S4- {
  display: flex;
  flex-direction: column;
  max-width: 70%;
  position: relative;
}

.se8KjimR5V0-.-R9N1TNmC1w- {
  justify-content: flex-end; /* align own messages to the right */
}

.se8KjimR5V0-.-R9N1TNmC1w- ._9-K2x0fb1S4- {
  align-items: flex-end;
}

.Flaat3ZgmaM- {
  padding: var(--spacing-sm) var(--spacing-md);
  background-color: var(--bg-fill);
  border: 1px solid var(--table-border);
  position: relative;
  word-break: break-word;
}

/* Закругляем все углы кроме того, где стрелка */
.se8KjimR5V0-:not(.-R9N1TNmC1w-) .Flaat3ZgmaM- {
  border-radius: 0 var(--radius-lg) var(--radius-lg) var(--radius-lg);
}

.se8KjimR5V0-.-R9N1TNmC1w- .Flaat3ZgmaM- {
  background-color: rgba(59, 130, 246, 0.15);
  border-color: var(--accent-blue);
  border-radius: var(--radius-lg) 0 var(--radius-lg) var(--radius-lg);
}

.qNTrhdLidgs- {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  align-self: flex-start;

  img {
    margin: 0;
  }
}

.UC0vRdBkrVw- {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  margin-bottom: 2px;
}

.m00HnzuZBRI- {
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--font-color);
}

.dVi8UYXQszA- {
  font-size: var(--font-size-xs);
  color: var(--icon-grey);
  white-space: nowrap;
}

._4kqVjTiSAmY- {
  margin-bottom: 2px;
}

.tta4Dvi70aY- {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--font-color);
  word-wrap: break-word;
  white-space: pre-wrap;
}

.cSu1A3zGVzc- {
  font-size: var(--font-size-xs);
  color: var(--icon-grey);
  font-style: italic;
}

._9Ybp5oHMzwA- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

._5EVkQS4HopQ- {
  width: 100%;
  min-height: 60px;
  padding: var(--spacing-xs);
  font-size: var(--font-size-sm);
  color: var(--font-color);
  background-color: var(--bg-main);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-sm);
  resize: vertical;
  font-family: inherit;
}

._5EVkQS4HopQ-:focus {
  outline: none;
  border-color: var(--accent-blue);
}

.NmsRI77ljyU- {
  display: flex;
  gap: var(--spacing-xs);
  justify-content: flex-end;
}

.DiW5YodshxY- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-sm);
}

._88mqm88FKq4- {
  background: none;
  border: none;
  cursor: pointer;
  font-size: var(--font-size-sm);
  color: var(--font-color);
  padding: var(--spacing-xs) var(--spacing-sm);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  transition: background-color 0.2s;
}

._88mqm88FKq4-:hover {
  background-color: var(--hover-row-color);
}

._88mqm88FKq4-.cmjjugap4Oc- {
  color: var(--red);
}

.cJkG3Ubg59c- {
  display: flex;
  gap: var(--spacing-xs);
  opacity: 0;
  transition: opacity 0.2s;
}

.se8KjimR5V0-:hover .cJkG3Ubg59c- {
  opacity: 1;
}

.caaHOWbOC8Q- {
  background: none;
  border: none;
  cursor: pointer;
  font-size: var(--font-size-md);
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s;
}

.caaHOWbOC8Q-:hover {
  background-color: var(--hover-row-color);
}

.Y0-3igGHRH0- {
  margin-top: var(--spacing-sm);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

/* Image attachments */
.lSbCUcEy48g- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.lzY9sVmNlpU- {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  cursor: pointer;
  max-width: 400px;
  border: 1px solid var(--table-border);
  transition: transform 0.2s;
}

.lzY9sVmNlpU-:hover {
  transform: scale(1.02);
}

.lzY9sVmNlpU-:hover .WeRwlCEVM9Y- {
  opacity: 1;
}

.JyHFbJ-uxIY- {
  width: 100%;
  height: auto;
  display: block;
  max-height: 300px;
  object-fit: cover;
}

.WeRwlCEVM9Y- {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s;
}

.WeRwlCEVM9Y- span {
  color: white;
  font-size: var(--font-size-sm);
  font-weight: 500;
  padding: var(--spacing-xs) var(--spacing-sm);
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: var(--radius-sm);
}

.Oz603d-r9Ws- {
  font-size: var(--font-size-xs);
  color: var(--icon-grey);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 400px;
}

/* File attachments */
.bar1Dw1sjgU- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-sm);
  background-color: var(--bg-main);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-md);
  gap: var(--spacing-sm);
  transition: background-color 0.2s;
}

.bar1Dw1sjgU-:hover {
  background-color: var(--hover-row-color);
}

.F2YFgJptqIY- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  flex: 1;
  min-width: 0;
  color: var(--font-color);
}

.mcmR2V0TrL8- {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.NEo5S-aG1Vc- {
  font-size: var(--font-size-sm);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--font-color);
}

.xod49UmxUzw- {
  font-size: var(--font-size-xs);
  color: var(--icon-grey);
  font-style: italic;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.Ex9d9LdNeg8- {
  background: none;
  border: 1px solid var(--table-border);
  cursor: pointer;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--icon-grey);
  transition: all 0.2s;
  flex-shrink: 0;
}

.Ex9d9LdNeg8-:hover {
  background-color: var(--accent-blue);
  color: white;
  border-color: var(--accent-blue);
}

/* Responsive design */
@media (max-width: 768px) {
  .lzY9sVmNlpU- {
    max-width: 100%;
  }

  .Oz603d-r9Ws- {
    max-width: 100%;
  }

  .JyHFbJ-uxIY- {
    max-height: 250px;
  }
}
.jr7n0mZQbr4- {
  flex: 1;
  overflow-y: auto;
  padding: var(--spacing-md);
  background-color: var(--bg-main);
}

.l5W3xtTm3OA- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.t1nq8MtMc2E-,
.zqkuqS0Elmc-,
.XXAq0Ec1saE- {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: var(--spacing-lg);
  text-align: center;
  color: var(--icon-grey);
}

.zqkuqS0Elmc- {
  color: var(--red);
}

.sjTSfVATI7M- {
  position: absolute;
  top: var(--spacing-sm);
  left: 50%;
  transform: translateX(-50%);
  padding: var(--spacing-sm) var(--spacing-md);
  background-color: var(--bg-fill);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  color: var(--icon-grey);
  z-index: 10;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.wXgtmUNkqx8- {
  display: flex;
  align-items: center;
  margin: var(--spacing-md) 0;
  text-align: center;
}

.wXgtmUNkqx8-::before,
.wXgtmUNkqx8-::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid var(--accent-blue);
}

.wXgtmUNkqx8- span {
  padding: 0 var(--spacing-sm);
  font-size: var(--font-size-xs);
  color: var(--accent-blue);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Scrollbar styling */
.jr7n0mZQbr4-::-webkit-scrollbar {
  width: 8px;
}

.jr7n0mZQbr4-::-webkit-scrollbar-track {
  background: var(--bg-fill);
  border-radius: var(--radius-sm);
}

.jr7n0mZQbr4-::-webkit-scrollbar-thumb {
  background: var(--icon-grey);
  border-radius: var(--radius-sm);
}

.jr7n0mZQbr4-::-webkit-scrollbar-thumb:hover {
  background: var(--dark-blue);
}
._9gF7sD2GWdk- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
  padding: var(--spacing-sm) var(--spacing-md);
  background-color: var(--bg-fill);
  border-bottom: 1px solid var(--table-border);
  border-top: 2px solid var(--accent-blue);
}

.nyBOW-2Djko- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  flex: 1;
  min-width: 0;
}

.CZp6bLVTxMU- {
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--accent-blue);
  white-space: nowrap;
  flex-shrink: 0;
}

.RNjKwvCF-Ag- {
  font-size: var(--font-size-sm);
  color: var(--font-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}

.TxCCdU-4-Ac- {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  color: var(--icon-grey);
  transition:
    background-color 0.2s,
    color 0.2s;
  flex-shrink: 0;
}

.TxCCdU-4-Ac-:hover {
  background-color: var(--hover-row-color);
  color: var(--font-color);
}

.TxCCdU-4-Ac-:active {
  background-color: var(--table-border);
}
/* Tooltip стили с использованием дизайн токенов */

.ydYdIXIBJa0- {
  background-color: var(--bg-fill);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-sm);
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-sm);
  line-height: 1.4;
  color: var(--font-color);
  max-width: 300px;
  z-index: 2000;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.3),
    0 2px 4px -1px rgba(0, 0, 0, 0.2);
  /* Усиливаем контрастность */
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);

  /* Анимация появления */
  animation-duration: 200ms;
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

.ydYdIXIBJa0-[data-state="delayed-open"] {
  animation-name: VUd6tpf9NvU-;
}

.ydYdIXIBJa0-[data-state="instant-open"] {
  animation-name: VUd6tpf9NvU-;
}

.ydYdIXIBJa0-[data-side="top"] {
  animation-name: XCIvrOKnN08-;
}

.ydYdIXIBJa0-[data-side="right"] {
  animation-name: GhRvDDrP2LQ-;
}

.ydYdIXIBJa0-[data-side="bottom"] {
  animation-name: VUd6tpf9NvU-;
}

.ydYdIXIBJa0-[data-side="left"] {
  animation-name: cnGQn1wDqos-;
}

.K0L3TgbLWNw- {
  fill: var(--bg-fill);
  stroke: var(--table-border);
  stroke-width: 1px;
}

/* Анимации */
@keyframes VUd6tpf9NvU- {
  from {
    opacity: 0;
    transform: translateY(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes cnGQn1wDqos- {
  from {
    opacity: 0;
    transform: translateX(-2px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes XCIvrOKnN08- {
  from {
    opacity: 0;
    transform: translateY(-2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes GhRvDDrP2LQ- {
  from {
    opacity: 0;
    transform: translateX(2px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Темная тема */
@media (prefers-color-scheme: dark) {
  .ydYdIXIBJa0- {
    box-shadow:
      0 4px 6px -1px rgba(0, 0, 0, 0.3),
      0 2px 4px -1px rgba(0, 0, 0, 0.2);
  }
}
.H-u-rOZNPrc- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  max-height: 300px;
  overflow-y: auto;
  padding: var(--spacing-xs);
  min-width: 200px;
}

.r4kRQWdeHs4- {
  display: flex;
  align-items: center;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  transition: background-color 0.2s;
}

.r4kRQWdeHs4-:hover {
  background-color: var(--hover-row-color);
}

.KvedHXLOy3M- {
  z-index: 10000;
  max-width: unset;
}
.iejOa-bUlxc- {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.1);
  z-index: 9998;
  pointer-events: none;
}

.cUqcc0AislQ- {
  position: fixed;
  left: 0;
  top: 0;
  display: flex;
  flex-direction: column;
  background-color: var(--bg-main);
  border: 1px solid var(--table-border);
  border-radius: var(--radius-lg);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  z-index: 9999;
  overflow: hidden;
  will-change: transform;
}

.bP8xVtLk1Ko- {
  display: flex;
  flex-direction: column;
  padding: var(--spacing-md);
  background-color: var(--bg-fill);
  border-bottom: 1px solid var(--table-border);
  cursor: move;
  user-select: none;
}

.f8r-uGmfPPA- {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.C0mugExyXbw- {
  display: flex;
  align-items: center;
  margin-top: var(--spacing-sm);
  padding-top: var(--spacing-sm);
  border-top: 1px solid var(--table-border);
}

._94Nd6aLkgMQ- {
  font-size: var(--font-size-sm);
  color: var(--icon-grey);
  cursor: help;
  display: inline-block;
}

.WpJz42A7l-I-,
.-wEgPmBfu3k- {
  margin: 0;
  font-size: var(--font-size-md);
  font-weight: 600;
  color: var(--font-color);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.VG0nEakpNiE- {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

._8I0FcrjPTYg- {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  background-color: var(--accent-blue);
  color: white;
  border: none;
  border-radius: var(--radius-md);
  padding: 4px 8px;
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition: background-color 0.2s;
}

._8I0FcrjPTYg-:hover {
  background-color: var(--blue);
}

.kJ6EPKrqmME- {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--green);
  color: white;
  border: none;
  border-radius: var(--radius-md);
  padding: 6px;
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition:
    background-color 0.2s,
    opacity 0.2s;
  min-width: 32px;
  min-height: 32px;
}

.kJ6EPKrqmME-:hover:not(:disabled) {
  background-color: var(--dark-blue);
}

.kJ6EPKrqmME-:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.N4w9-Tp8MHg- {
  background-color: var(--red);
  color: white;
  border-radius: 50%;
  padding: 2px 6px;
  font-size: var(--font-size-xs);
  font-weight: 600;
  min-width: 20px;
  text-align: center;
}

.Z3TF-T-t-rg- {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.CDH92NyHU9Q- {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  pointer-events: none;
}

.qZIJOCo7-nE-,
.jt9AdDy3uEM- {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-lg);
  text-align: center;
}

.Uep18AXOGh4- {
  margin-top: var(--spacing-md);
  color: var(--icon-grey);
  font-size: var(--font-size-sm);
}

.fcZ59LLzqDA- {
  color: var(--red);
  font-size: var(--font-size-md);
  font-weight: 600;
  margin: 0 0 var(--spacing-sm) 0;
}

.dmej9rZUjVc- {
  color: var(--icon-grey);
  font-size: var(--font-size-sm);
  margin: 0;
}

._9M0L4-TwDrI- {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 20px;
  height: 20px;
  cursor: nwse-resize;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: var(--icon-grey);
  user-select: none;
  opacity: 0.5;
  transition: opacity 0.2s;
}

._9M0L4-TwDrI-:hover {
  opacity: 1;
}

/* Prevent text selection during drag */
.cUqcc0AislQ- * {
  -webkit-user-drag: none;
}

.b17qx6bGN6g- {
  background: var(--red);
}
.Vxh97ri7kt4- {
  display: flex;
  gap: var(--spacing-sm);
  border-bottom: 1.5px solid var(--table-border, #e5e7eb);
}

.TgjSAVbVVa4- {
  background: none;
  border: none;
  outline: none;
  padding: 10px 28px;
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--text-secondary, #6b7280);
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  cursor: pointer;
  transition:
    background 0.15s,
    color 0.15s;
  position: relative;
  text-transform: uppercase;
}

.TgjSAVbVVa4-[data-state="active"] {
  color: var(--accent-blue, #3498db);
  background: var(--background-primary, #fff);
  border-bottom: 2px solid var(--accent-blue, #3498db);
  font-weight: 600;
  z-index: 1;
}

.TgjSAVbVVa4-:not([data-state="active"]):hover {
  background: var(--bg-main, #f3f4f6);
  color: var(--accent-blue, #3498db);
}

.AEu4Au-Jkh4- {
  padding-top: 0;
}
.qPJsKRuASJs- {
  position: relative;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 20px;
  padding: var(--spacing-xs);
  border-radius: var(--radius-sm);
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--icon-grey);
}

.qPJsKRuASJs-:hover {
  background-color: var(--hover-row-color);
}

.qPJsKRuASJs-[data-chat-exists="true"] {
  color: var(--accent-blue);
}

.qPJsKRuASJs-[data-has-unread="true"] {
  background-color: var(--green);
  color: white;
}

.qPJsKRuASJs-[data-has-unread="true"]:hover {
  background-color: var(--green);
  opacity: 0.9;
}

.hjtPjElqrhs- {
  position: absolute;
  top: -4px;
  right: -4px;
  background-color: var(--red);
  color: white;
  border-radius: 50%;
  padding: 2px 5px;
  font-size: var(--font-size-xs);
  font-weight: 600;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.AqCqKbrKR2M- {
  display: flex;
  gap: var(--spacing-xs);
}
.DCqmJfAUQq4- {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-xs);
  cursor: pointer;
  border-radius: var(--radius-sm);
  position: relative;
  transition:
    background-color 0.2s ease,
    opacity 0.2s ease;
  min-height: 32px;
}

.DCqmJfAUQq4-:hover {
  background-color: var(--bg-surface-hover);
}

.cwAfjtTGCJU- {
  color: var(--text-primary);
  font-size: var(--font-size-sm);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.qmvHaMM1dB4- {
  position: absolute;
  right: calc(var(--spacing-lg) * -1);
  bottom: 0;
  width: 20px;
  height: 20px;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.DCqmJfAUQq4-:hover .qmvHaMM1dB4- {
  opacity: 1;
}

.g-9dPh2qiws- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.z54XQPGc6z8- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  padding: var(--spacing-md);
}

.-EUYBcRpyWU- {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.-EUYBcRpyWU- label {
  font-weight: 500;
  color: var(--text-primary);
  font-size: var(--font-size-sm);
}

._1616osKUFCU- {
  display: flex;
  gap: var(--spacing-sm);
  justify-content: flex-end;
  padding: var(--spacing-md);
  border-top: 1px solid var(--border-primary);
}

@media (max-width: 900px) {
  .z54XQPGc6z8- {
    gap: var(--spacing-sm);
  }

  ._1616osKUFCU- {
    flex-direction: column-reverse;
  }

  ._1616osKUFCU- button {
    width: 100%;
  }
}
.Xj-PnLNJUAw- {
  font-family: Nunito;
  font-weight: 500;
  font-size: var(--font-size-xl);
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  color: inherit;
  background-color: var(--input-bg);

  &.mr-AM-vQZ0k- {
    background-color: initial;
  }

  > * {
    padding: 0;
  }
}

.-GdqeA3EcY8- {
  text-align: left;
}

._-7nKa-UDhTc- {
  cursor: pointer;

  &:hover {
    background-color: var(--input-bg);
  }
}

@keyframes -hwuMdQkhfk- {
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}
.LIKAY7qmIDE- {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 5px;
  border: 2px solid var(--icon-grey);
  background: transparent;
  cursor: pointer;
  outline: none;
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease,
    box-shadow 0.15s ease;
  vertical-align: middle;
}

.LIKAY7qmIDE-:hover:not(:disabled) {
  border-color: var(--accent-blue);
  background-color: color-mix(in srgb, var(--accent-blue) 6%, transparent);
}

.LIKAY7qmIDE-:focus-visible {
  border-color: var(--accent-blue);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-blue) 25%, transparent);
}

/* Checked — SVG галочка через background-image */
.LIKAY7qmIDE-:checked {
  background-color: var(--accent-blue);
  border-color: var(--accent-blue);
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4L4.5 7.5L11 1' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

/* Indeterminate — тире */
.LIKAY7qmIDE-:indeterminate {
  background-color: var(--accent-blue);
  border-color: var(--accent-blue);
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='2' viewBox='0 0 10 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' y='0' width='10' height='2' rx='1' fill='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

.LIKAY7qmIDE-:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.Ta77QwvFPeE- {
  cursor: pointer;
  transition: transform 0.2s;
}

.Ta77QwvFPeE-:hover:not(.RtjA2wxpIF4-) {
  opacity: 0.5;
}
.c1SkQImyUvc- {
  background-color: var(--bg-fill);
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);

  @media screen and (max-width: 900px) {
    padding: var(--spacing-md);
    margin-top: var(--spacing-md);
  }

  h2 {
    padding: 0;
    margin: 0;
  }
}

.y0u2XJERU60- {
  padding: 0;
  margin: 0;
  list-style: none;
}

.AroNTzVGGF0- {
  display: flex;
  font-size: var(--font-size-xl);

  @media screen and (max-width: 900px) {
    flex-direction: column;
  }
}

.AroNTzVGGF0- div:first-child {
  margin-right: var(--spacing-sm);
  font-weight: bold;
}
.SlNb1F8muEk- {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  padding: var(--spacing-lg);
  border-radius: var(--radius-lg);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
  min-width: 320px;
  max-width: 440px;
  background: linear-gradient(135deg, var(--blue) 0%, var(--accent-blue) 60%);
  border: 1px solid rgba(255, 255, 255, 0.25);
  animation: bGnU6TGZ04E- 0.3s ease-out;
}

.MroENiyVYng- {
  display: flex;
  gap: var(--spacing-sm);
}

.qSzBFdR-t-Y- {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  color: #ffffff;
}

.qSzBFdR-t-Y- svg {
  width: 18px;
  height: 18px;
}

.V0x9DTV7phU- {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.Dl77FUThbmM- {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: 700;
  color: #ffffff;
}

._5mJzYMz5FG8- {
  margin: 0;
  font-size: var(--font-size-md);
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.4;
}

.GOkFfDg7Iwc- {
  align-self: center;
  background-color: #ffffff;
  color: var(--blue);
  border: 1px solid rgba(255, 255, 255, 0.4);
  padding: var(--spacing-sm) var(--spacing-lg);
  font-weight: 600;
  border-radius: var(--radius-md);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
  transition:
    transform 0.12s ease,
    box-shadow 0.12s ease,
    background-color 0.12s ease,
    border-color 0.12s ease;
}

.GOkFfDg7Iwc-:hover {
  color: var(--hover-color);
}

._4tUMPFblpZY- {
  position: absolute;
  top: var(--spacing-sm);
  right: var(--spacing-sm);
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s ease;
}

._4tUMPFblpZY-:hover {
  color: #ffffff;
}

@keyframes bGnU6TGZ04E- {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@media (max-width: 480px) {
  .SlNb1F8muEk- {
    min-width: auto;
    max-width: calc(100vw - var(--spacing-lg) * 2);
  }
}
