/* screen - admin */

.admin {
  align-items: center;
  background-color: var(--ebony);
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 1076px;
  padding: 32px 0;
  width: 1440px;
}

.admin .overlap-group1 {
  height: 45px;
  position: relative;
  width: 1280px;
}

.admin .navbar {
  align-items: center;
  display: inline-flex;
  gap: 24px;
  left: 465px;
  position: absolute;
  top: 12px;
  z-index: 1;
}

.admin .div {
  border: 0px none;
  height: 28px;
  position: relative;
  width: 175.03px;
}

.admin .frame-1 {
  align-items: center;
  display: flex;
  height: 20px;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 4px;
  width: 22px;
}

.admin .frame-3 {
  border: 0px none;
  height: 20px;
  position: relative;
  width: 22.5px;
}

.admin .vector-2 {
  height: 20px;
  left: 0;
  position: absolute;
  top: 0;
  width: 21px;
}

.admin .ultra-imagesnet {
  left: 30px;
  letter-spacing: 0;
  line-height: 28px;
  position: absolute;
  top: -2px;
  white-space: nowrap;
  width: 143px;
}

.admin .frame-4-2 {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 24px;
}

.admin .frame-3-1 {
  align-items: center;
  border: none;
  border-radius: 1000px;
  display: flex;
  justify-content: space-between;
  opacity: 0;
  padding: 12px 24px;
  position: relative;
  width: 194px;
}

.admin .frame-5 {
  align-items: center;
  display: flex;
  height: 14px;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 14px;
}

.admin .frame-6 {
  background-image: url(../img/vector-134@2x.png);
  background-size: 100% 100%;
  border: 0px none;
  height: 14px;
  margin-left: -9521.00px;
  margin-top: -47.50px;
  position: relative;
  width: 14px;
}

.admin .vector-3 {
  height: 14px;
  margin-left: -18850px;
  margin-top: -28.50px;
  position: relative;
  width: 14px;
}

.admin .line-1 {
  height: 1px;
  margin-top: 31px;
  object-fit: cover;
  width: 1440px;
}

.admin .frame-95 {
  align-items: flex-start;
  align-self: flex-start;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-left: 80px;
  margin-top: 56px;
  position: relative;
  width: 348px;
}

.admin .title {
  align-self: stretch;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
}

.admin .manage-users-conten {
  align-self: stretch;
  letter-spacing: 0;
  line-height: 24px;
  opacity: 0.8;
  position: relative;
}

.admin .frame-82 {
  align-items: flex-start;
  display: flex;
  gap: 24px;
  margin-top: 24px;
  position: relative;
  width: 1280px;
}

.admin .frame-4 {
  align-items: flex-start;
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex: 1;
  flex-direction: column;
  flex-grow: 1;
  gap: 16px;
  justify-content: center;
  padding: 16px;
  position: relative;
}

.admin .frame-81 {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 16px;
  position: relative;
  width: 100%;
}

.admin .vector {
  height: 24px;
  position: relative;
  width: 30px;
}

.admin .total-users {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .frame-24 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 8px;
  position: relative;
}

.admin .x12-vs-last-month {
  align-self: stretch;
  letter-spacing: 0;
  line-height: normal;
  opacity: 0.5;
  position: relative;
}

.admin .vector-1 {
  height: 24px;
  position: relative;
  width: 24px;
}

.admin .active-workflows {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .vector-4 {
  height: 24px;
  position: relative;
  width: 14px;
}

.admin .credits-sold {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .price {
  align-self: stretch;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
}

.admin .vector-5 {
  height: 24px;
  position: relative;
  width: 18px;
}

.admin .api-calls {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .frame-container {
  align-items: flex-start;
  display: flex;
  gap: 24px;
  margin-top: 24px;
  min-width: 1280px;
}

.admin .admin-top-panels {
  align-items: stretch;
}

.admin .frame-80 {
  align-items: flex-start;
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 338px;
  overflow: hidden;
  padding: 16px;
  position: relative;
  width: 845px;
}

.admin .admin-top-panels .frame-80,
.admin .admin-top-panels .frame-83-2 {
  height: 540px;
  max-height: 540px;
}

.admin .admin-top-panels .frame-83-2.frame-83-3 {
  justify-content: flex-start;
}

.admin .admin-top-panels .frame-62 {
  flex: 1 1 auto;
  height: auto;
  max-height: none;
  min-height: 0;
  overflow-y: auto;
}

.admin .frame {
  align-items: center;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  justify-content: space-between;
  position: relative;
  width: 100%;
}

.admin .recent-users {
  letter-spacing: 0;
  line-height: 20px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.admin .frame-2 {
  align-items: center;
  background-color: var(--white);
  border-radius: 1000px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  justify-content: center;
  opacity: 0;
  padding: 12px 24px;
  position: relative;
}

.admin .frame-7 {
  background-image: url(../img/vector-134@2x.png);
  background-size: 100% 100%;
  border: 0px none;
  height: 17.81px;
  margin-left: -9176.00px;
  margin-top: -453.81px;
  position: relative;
  width: 17.81px;
}

.admin .rectangle-15 {
  display: none;
}

.admin .frame-62 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 16px;
  height: 258px;
  margin-bottom: 0;
  max-height: 258px;
  min-height: 0;
  overscroll-behavior: contain;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 6px;
  position: relative;
  scrollbar-gutter: stable;
  width: 100%;
}

.admin .frame-62::-webkit-scrollbar {
  width: 6px;
}

.admin .frame-62::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.12);
  border-radius: 999px;
}

.admin .frame-62::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.42);
  border-radius: 999px;
}

.admin .frame-4-1 {
  align-self: stretch;
  background: linear-gradient(0deg, rgba(47, 33, 76, 1) 0%, rgba(47, 33, 76, 1) 100%);
  border: 1px solid;
  border-color: var(--mulled-wine);
  border-radius: 16px;
  display: flex;
  gap: 16px;
  height: 91px;
  padding: 16px;
  width: 100%;
}

.admin .frame-24-1 {
  align-items: flex-start;
  display: flex;
  flex: 1;
  flex-direction: column;
  flex-grow: 1;
  gap: 8px;
  position: relative;
}

.admin .sarahexamplecom {
  letter-spacing: 0;
  line-height: normal;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .frame-83 {
  align-items: center;
  background-color: var(--fuchsia-pink);
  border-radius: 4px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  justify-content: center;
  padding: 4px;
  position: relative;
}

.admin .mikeexamplecom {
  letter-spacing: 0;
  line-height: normal;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .frame-45 {
  align-items: center;
  align-self: stretch;
  background: linear-gradient(0deg, rgba(47, 33, 76, 1) 0%, rgba(47, 33, 76, 1) 100%);
  border: 1px solid;
  border-color: var(--mulled-wine);
  border-radius: 16px;
  display: flex;
  flex: 0 0 auto;
  gap: 16px;
  padding: 16px;
  position: relative;
  width: 100%;
}

.admin .ellipse-10-1 {
  height: 29px;
}

.admin .emmaexamplecom {
  letter-spacing: 0;
  line-height: normal;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .frame-83-1 {
  align-items: center;
  background-color: #5af4494c;
  border-radius: 4px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  padding: 4px;
}

.admin .seller {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .ellipse-10-2 {
  height: 45px;
  margin-left: -8496.00px;
  margin-top: -807.00px;
}

.admin .alexexamplecom {
  letter-spacing: 0;
  line-height: normal;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .frame-83-2 {
  align-items: flex-start;
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 16px;
  width: 411px;
}

.admin .api-cost-settings {
  letter-spacing: 0;
  line-height: 20px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.admin .frame-10 {
  background-image: url(../img/vector-134@2x.png);
  background-size: 100% 100%;
  border: 0px none;
  height: 17.81px;
  margin-left: -9611.00px;
  margin-top: -453.81px;
  position: relative;
  width: 17.81px;
}

.admin .frame-88 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 24px;
  position: relative;
  width: 100%;
}

.admin .frame-8 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 8px;
  position: relative;
  width: 100%;
}

.admin .flux1-dev-margin {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .group-2 {
  height: 52px;
  position: relative;
  width: 379px;
}

.admin .slider-group {
  overflow: visible;
}

.admin .slider-overlap-group {
  height: 14px;
  position: relative;
}

.admin .custom-range {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  border-radius: 999px;
  cursor: pointer;
  height: 12px;
  margin: 6px 0;
  outline: none;
  width: 100%;
}

.admin .custom-range::-webkit-slider-runnable-track {
  background: linear-gradient(
    to right,
    var(--white) 0%,
    var(--white) calc(var(--value, 0) * 1%),
    #61588a calc(var(--value, 0) * 1%),
    #61588a 100%
  );
  border-radius: 999px;
  height: 12px;
}

.admin .custom-range::-moz-range-track {
  background: #61588a;
  border: none;
  border-radius: 999px;
  height: 12px;
}

.admin .custom-range::-moz-range-progress {
  background: var(--white);
  border: none;
  border-radius: 999px;
  height: 12px;
}

.admin .custom-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background: var(--white);
  border: 2px solid #625a88;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  height: 22px;
  margin-top: -5px;
  width: 22px;
}

.admin .custom-range::-moz-range-thumb {
  background: var(--white);
  border: 2px solid #625a88;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  height: 22px;
  width: 22px;
}

.admin .rectangle-10 {
  background: linear-gradient(0deg, rgba(81, 72, 114, 1) 0%, rgba(81, 72, 114, 1) 100%);
  border-radius: 16px;
  height: 6px;
  left: 0;
  position: absolute;
  top: 4px;
  width: 379px;
}

.admin .rectangle-11 {
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
  border-radius: 16px;
  height: 6px;
  left: 0;
  position: absolute;
  top: 4px;
  width: 244px;
}

.admin .ellipse-14 {
  background-color: var(--white);
  border-radius: 7px;
  box-shadow: 0px 0px 4px #100821;
  height: 14px;
  left: 237px;
  position: absolute;
  top: 0;
  width: 14px;
}

.admin .google-veo-margin {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .rectangle-11-1 {
  width: 166px;
}

.admin .ellipse-14-1 {
  left: 159px;
}

.admin .rectangle-11-2 {
  width: 196px;
}

.admin .ellipse-14-2 {
  left: 190px;
}

.admin .frame-2-1 {
  align-items: center;
  align-self: stretch;
  border: 1px solid;
  border-color: var(--white);
  border-radius: 1000px;
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  justify-content: center;
  padding: 12px 24px;
  position: relative;
  width: 100%;
}

.admin .update-settings {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .frame-45-1 {
  align-items: flex-start;
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  justify-content: center;
  padding: 16px;
  position: relative;
  width: 302px;
}

.admin .system-status {
  line-height: 20px;
  margin-top: -2.00px;
  white-space: nowrap;
}

.admin .frame-89 {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-right: -19.50px;
  position: relative;
  width: 289.5px;
}

.admin .ellipse-15 {
  background-color: var(--lightning-yellow);
  border-radius: 3px;
  height: 6px;
  position: relative;
  width: 6px;
}

.admin .falai-api {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .operational {
  letter-spacing: 0;
  line-height: normal;
  margin-left: -101.5px;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .eleven-labs-api {
  opacity: 0.8;
}

.admin .azure-storage {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .degraded {
  letter-spacing: 0;
  line-height: normal;
  margin-left: -87.5px;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .payment-gateway {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .frame-84 {
  align-items: flex-start;
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  height: 220px;
  justify-content: center;
  padding: 16px;
  position: relative;
  width: 954px;
}

.admin .frame-92 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 1;
  flex-grow: 1;
  gap: 24px;
  position: relative;
  width: 100%;
}

.admin .frame-9 {
  align-items: center;
  align-self: stretch;
  background-color: var(--white-3);
  border-radius: 16px;
  display: flex;
  flex: 1;
  flex-direction: column;
  flex-grow: 1;
  gap: 24px;
  justify-content: center;
  padding: 12px;
  position: relative;
}

.admin .new-user {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .suspend-account {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .vector-6 {
  height: 24px;
  position: relative;
  width: 23px;
}

.admin .system-config {
  line-height: normal;
}

.admin .export-user-data {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .vector-7 {
  height: 24px;
  position: relative;
  width: 28px;
}

.admin .generate-reports {
  letter-spacing: 0;
  line-height: normal;
  position: relative;
  width: fit-content;
}

.admin .address-4 {
  letter-spacing: 0;
  line-height: normal;
  opacity: 0.8;
  position: relative;
  width: fit-content;
}

.admin .creator-3 {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .eleven-labs {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .ellipse-10-3 {
  object-fit: cover;
  position: relative;
  width: 45px;
}

.admin .ellipse-14-3 {
  background-color: var(--white);
  border-radius: 7px;
  box-shadow: 0px 0px 4px #100821;
  height: 14px;
  position: absolute;
  top: 0;
  width: 14px;
}

.admin .frame-4-3 {
  align-items: center;
  position: relative;
}

.admin .frame-83-3 {
  justify-content: center;
  position: relative;
}

.admin .name-4 {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .navbar-link {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .navbar-link-inner {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    background: none;
}

.admin .percent-3 {
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
  width: fit-content;
}

.admin .rectangle-11-3 {
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
  border-radius: 16px;
  height: 6px;
  left: 0;
  position: absolute;
  top: 4px;
}

.admin .system {
  letter-spacing: 0;
  position: relative;
  width: fit-content;
}

.admin .text {
  align-self: stretch;
  letter-spacing: 0;
  line-height: normal;
  margin-top: -1.00px;
  position: relative;
}

/* Keep shared app navbar logo perfectly aligned on admin page. */
.admin .app-navbar .nav-logo-icon {
  top: -3px;
}

.admin-status-message {
  align-items: center;
  border-radius: 10px;
  display: flex;
  margin-top: 18px;
  min-height: 42px;
  padding: 10px 14px;
  width: 1280px;
}

.admin-status-success {
  background: rgba(36, 94, 60, 0.35);
  border: 1px solid rgba(125, 245, 178, 0.45);
}

.admin-status-error {
  background: rgba(96, 41, 41, 0.4);
  border: 1px solid rgba(255, 149, 149, 0.5);
}

.admin-user-avatar {
  align-items: center;
  background: #2f2550;
  color: #ffffff;
  display: flex;
  font-family: "Lufga-SemiBold", Helvetica;
  font-size: 15px;
  height: 45px;
  justify-content: center;
  width: 45px;
}

.admin-number-input {
  background: #4e4572;
  border: 1px solid #6f6792;
  border-radius: 10px;
  color: #ffffff;
  font-family: "Lufga-Regular", Helvetica;
  font-size: 16px;
  height: 42px;
  outline: none;
  padding: 8px 12px;
  width: 100%;
}

.admin-settings-btn {
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.admin-settings-btn:disabled {
  cursor: not-allowed;
  opacity: 0.7;
}

.admin-action-btn {
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.admin-action-btn:hover {
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
  transform: translateY(-2px);
}

.admin .admin-system-row {
  align-items: center;
  gap: 10px;
}

.admin .admin-system-row .frame-89 {
  flex: 1;
  margin-right: 0;
  width: auto;
}

.admin .system-status-value {
  margin-left: auto;
  opacity: 0.92;
}

.admin .dot-ok {
  background-color: #5af449;
}

.admin .dot-bad {
  background-color: #f0b429;
}

.admin .dot-pending {
  background-color: rgba(255, 255, 255, 0.45);
}

.admin-skeleton {
  animation: admin-skeleton-shimmer 1.35s ease-in-out infinite;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.08) 25%, rgba(255, 255, 255, 0.16) 50%, rgba(255, 255, 255, 0.08) 75%);
  background-size: 200% 100%;
  border-radius: 10px;
}

.admin-skeleton-stat {
  height: 38px;
  width: 84px;
}

.admin-skeleton-icon {
  border-radius: 10px;
  height: 24px;
  width: 30px;
}

.admin-skeleton-label {
  height: 20px;
  width: 120px;
}

.admin-skeleton-price {
  width: 120px;
}

.admin-skeleton-delta {
  height: 18px;
  width: 140px;
}

.admin-skeleton-avatar {
  border-radius: 12px;
  height: 45px;
  width: 45px;
}

.admin-skeleton-user-name {
  height: 26px;
  width: 180px;
}

.admin-skeleton-user-email {
  height: 18px;
  width: 240px;
}

.admin-skeleton-badge {
  height: 36px;
  width: 60px;
}

.admin-skeleton-date {
  height: 22px;
  width: 110px;
}

.admin-skeleton-setting-label {
  height: 20px;
  width: 180px;
}

.admin-skeleton-setting-value {
  height: 20px;
  width: 64px;
}

.admin-skeleton-slider {
  border-radius: 999px;
  height: 12px;
  width: 100%;
}

@keyframes admin-skeleton-shimmer {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

.admin-inline-link {
  background: transparent;
  border: 0;
  color: #ffffff;
  cursor: pointer;
  opacity: 0.85;
  padding: 0;
  text-decoration: underline;
}

.admin-inline-link:hover {
  opacity: 1;
}

.admin .admin-user-row {
  cursor: pointer;
  transition: box-shadow 0.15s ease;
}

.admin .admin-user-row:hover {
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

.admin-access-blocked {
  align-items: flex-start;
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 56px;
  padding: 24px;
  width: 1280px;
}

.admin-users-page {
  min-height: 100vh;
}

.admin-users-shell {
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-top: 24px;
  padding: 20px;
  width: 1280px;
}

.admin-users-toolbar {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.admin-users-filters {
  display: inline-flex;
  gap: 10px;
}

.admin-users-filter {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  font-family: "Lufga-Medium", Helvetica;
  font-size: 13px;
  padding: 10px 16px;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.admin-users-filter:hover {
  background: rgba(255, 255, 255, 0.06);
}

.admin-users-filter-active {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.28);
}

.admin-users-summary {
  opacity: 0.88;
}

.admin-users-grid-wrap {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  overflow: hidden;
}

.admin-users-grid {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
}

.admin-users-grid thead {
  background: rgba(255, 255, 255, 0.04);
}

.admin-users-grid th,
.admin-users-grid td {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-family: "Lufga-Regular", Helvetica;
  font-size: 14px;
  padding: 16px 14px;
  text-align: left;
  vertical-align: middle;
  word-break: break-word;
}

.admin-users-grid th {
  font-family: "Lufga-Medium", Helvetica;
  font-size: 13px;
  letter-spacing: 0.01em;
  opacity: 0.78;
  text-transform: uppercase;
}

.admin-users-grid tbody tr {
  background: rgba(255, 255, 255, 0.015);
  transition: background-color 0.15s ease;
}

.admin-users-grid tbody tr:hover {
  background: rgba(255, 255, 255, 0.05);
}

.admin-users-grid tbody tr:last-child td {
  border-bottom: 0;
}

.admin-users-id {
  color: rgba(255, 255, 255, 0.78);
  font-family: "Lufga-Medium", Helvetica;
}

.admin-users-status {
  border-radius: 999px;
  display: inline-flex;
  font-family: "Lufga-Medium", Helvetica;
  font-size: 13px;
  padding: 6px 12px;
}

.admin-users-status-active {
  background: rgba(90, 244, 73, 0.14);
  border: 1px solid rgba(90, 244, 73, 0.25);
  color: #b7ffab;
}

.admin-users-status-suspended {
  background: rgba(240, 180, 41, 0.12);
  border: 1px solid rgba(240, 180, 41, 0.24);
  color: #ffd88a;
}

.admin-users-action {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  font-family: "Lufga-Medium", Helvetica;
  font-size: 13px;
  padding: 10px 16px;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.admin-users-action:hover:not(:disabled) {
  background: rgba(255, 255, 255, 0.08);
}

.admin-users-action:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.admin-users-action-danger {
  border-color: rgba(255, 149, 149, 0.35);
  color: #ffd0d0;
}

.admin-users-action-neutral {
  border-color: rgba(125, 245, 178, 0.35);
  color: #d3ffe8;
}

.admin-users-empty {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 24px;
}

.admin-users-loading {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.admin-users-row-skeleton {
  align-items: center;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  display: grid;
  gap: 12px;
  grid-template-columns: 80px 1fr 1fr 1.2fr 1.2fr 90px 110px 110px;
  padding: 16px;
}

.admin-skeleton-user-id {
  height: 20px;
  width: 60px;
}

.admin-skeleton-action {
  height: 38px;
  width: 100px;
}

.admin-system-config-shell {
  background-color: var(--port-gore);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 24px;
  padding: 24px;
  width: 1280px;
}

.admin-system-config-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.admin-system-config-subtitle {
  opacity: 0.8;
}

.admin-system-config-grid {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-system-config-card {
  background: linear-gradient(0deg, rgba(47, 33, 76, 1) 0%, rgba(47, 33, 76, 1) 100%);
  border: 1px solid var(--mulled-wine);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px;
}

.admin-config-toggle-row,
.admin-config-field-row {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.admin-config-field-row label {
  flex: 1;
}

.admin-config-field-row .admin-number-input {
  max-width: 180px;
}

.admin-system-config-save {
  align-self: flex-end;
  min-width: 260px;
}

.admin-switch {
  display: inline-flex;
  height: 28px;
  position: relative;
  width: 52px;
}

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

.admin-switch-slider {
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: background-color 0.2s ease;
}

.admin-switch-slider::before {
  background: #ffffff;
  border-radius: 50%;
  content: "";
  height: 20px;
  left: 4px;
  position: absolute;
  top: 3px;
  transition: transform 0.2s ease;
  width: 20px;
}

.admin-switch input:checked + .admin-switch-slider {
  background: linear-gradient(90deg, rgba(196, 74, 244, 1) 0%, rgba(111, 74, 244, 1) 100%);
}

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

.admin-switch input:disabled + .admin-switch-slider {
  cursor: not-allowed;
  opacity: 0.55;
}