/* Unified popup window system */
#automation-rule-editor-backdrop,
.app-modal,
.video-stage {
  background:
    radial-gradient(circle at 14% 0%, rgba(87, 178, 255, 0.16), transparent 28%),
    radial-gradient(circle at 100% 100%, rgba(255, 96, 176, 0.13), transparent 24%),
    rgba(4, 8, 15, 0.82) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
}

#automation-rule-editor-backdrop {
  z-index: 110;
}

#automation-rule-editor-card,
.app-dialog,
.video-stage-card {
  position: relative;
  overflow: hidden;
  padding: 0 !important;
  border-radius: 26px !important;
  border: 1px solid rgba(146, 167, 214, 0.16) !important;
  background:
    radial-gradient(circle at top left, rgba(102, 184, 255, 0.11), transparent 26%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014) 24%, rgba(255, 255, 255, 0.006) 100%),
    rgba(12, 17, 29, 0.985) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 34px 90px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(7, 11, 20, 0.34) !important;
}

#automation-rule-editor-card::before,
.app-dialog::before,
.video-stage-card::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(107, 209, 255, 0.58),
    rgba(245, 105, 179, 0.52),
    transparent
  );
  opacity: 0.9;
  pointer-events: none;
}

#automation-rule-editor-card {
  z-index: 111;
  width: min(760px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
}

.popup-window-header,
.dialog-header,
.video-stage-header {
  position: sticky;
  top: 0;
  z-index: 4;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin: 0 !important;
  padding: 20px 22px 16px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0)),
    rgba(14, 19, 31, 0.95);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.popup-window-header .label,
.dialog-header .label,
.video-stage-header .label {
  color: #93a8c7;
}

.popup-window-header h3,
.dialog-header h2,
.video-stage-header h3 {
  margin: 0;
  font-size: 22px !important;
  line-height: 1.02;
  letter-spacing: -0.04em;
  color: #f4f7ff;
}

.popup-window-subtitle {
  margin: 8px 0 0;
  max-width: 44ch;
  color: #8ea3c5;
  font-size: 12px;
  line-height: 1.55;
}

.popup-window-close-btn {
  width: 38px;
  min-width: 38px;
  height: 38px;
  padding: 0;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0)),
    rgba(255, 255, 255, 0.03);
  color: #dde7f7;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 10px 24px rgba(0, 0, 0, 0.18);
}

.popup-window-close-btn:hover,
.popup-window-close-btn:focus-visible {
  border-color: rgba(110, 193, 255, 0.26);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0)),
    rgba(83, 164, 219, 0.08);
  color: #ffffff;
}

.popup-window-close-glyph {
  display: inline-block;
  transform: translateY(-1px);
  font-size: 22px;
  line-height: 1;
}

.popup-window-form,
.dialog-form {
  gap: 14px;
  padding: 18px 22px 22px;
}

.popup-window-form {
  max-height: calc(100vh - 154px);
  overflow: auto;
  overscroll-behavior: contain;
}

.popup-window-footer,
.dialog-footer {
  position: sticky;
  bottom: 0;
  z-index: 4;
  margin: 0 !important;
  padding: 14px 22px 20px !important;
  background:
    linear-gradient(0deg, rgba(10, 15, 24, 0.98), rgba(10, 15, 24, 0.9));
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.popup-window-footer .ghost-btn,
.popup-window-footer .primary-btn,
.popup-window-footer .danger-btn,
.dialog-footer .ghost-btn,
.dialog-footer .secondary-btn,
.dialog-footer .primary-btn {
  min-height: 40px;
  padding: 0 16px;
  border-radius: 13px;
  font-size: 12px;
}

#automation-rule-form .automation-rule-meta-card {
  padding: 16px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0)),
    rgba(255, 255, 255, 0.018);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

#automation-rule-form .automation-rule-section-copy {
  margin-top: 6px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

#automation-rule-form .gift-picker-trigger {
  min-height: 64px;
  border-radius: 16px;
}

#automation-rule-form .builder-footer-actions {
  gap: 10px;
}

#categories-dialog {
  z-index: 100;
}

.categories-dialog-window {
  width: min(720px, calc(100vw - 40px));
  max-height: calc(100vh - 44px);
}

.categories-dialog-body {
  display: grid;
  gap: 16px;
}

#categories-dialog .category-create-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.024), rgba(255, 255, 255, 0)),
    rgba(255, 255, 255, 0.02);
}

#categories-dialog #category-manager-list {
  max-height: min(54vh, 560px);
  overflow: auto;
  padding-right: 4px;
}

#categories-dialog .category-item {
  min-height: 58px;
  padding: 14px 15px;
  border-radius: 16px;
  border-color: rgba(255, 255, 255, 0.07);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0)),
    rgba(8, 12, 22, 0.74);
}

#categories-dialog .inline-actions {
  display: flex;
  gap: 8px;
}

#categories-dialog .inline-actions .ghost-btn,
#categories-dialog .inline-actions .danger-btn {
  min-height: 36px;
  padding: 0 14px;
  border-radius: 12px;
  font-size: 11.5px;
}

#ui-dialog-modal {
  z-index: 140;
}

.ui-dialog-window {
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100vh - 44px);
}

.ui-dialog-body {
  display: grid;
  gap: 12px;
}

.ui-dialog-message,
.ui-dialog-detail {
  margin: 0;
}

.ui-dialog-message {
  color: #edf3ff;
  font-size: 14px;
  line-height: 1.62;
}

.ui-dialog-detail {
  padding: 12px 14px;
  border-radius: 15px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.02);
  color: #95a9c8;
  font-size: 12px;
  line-height: 1.58;
}

.ui-dialog-footer .builder-footer-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

#ui-dialog-modal[data-tone="danger"] .ui-dialog-confirm-btn {
  background: linear-gradient(135deg, #ff5b7a 0%, #ff2d8d 100%);
  box-shadow: 0 12px 24px rgba(255, 63, 120, 0.24);
}

#ui-dialog-modal[data-tone="danger"] .dialog-header {
  background:
    linear-gradient(180deg, rgba(255, 103, 130, 0.08), rgba(255, 255, 255, 0)),
    rgba(14, 19, 31, 0.96);
}

.video-stage {
  z-index: 105;
}

.video-stage-card {
  width: min(1120px, calc(100vw - 44px));
}

.video-stage-player {
  display: block;
  width: calc(100% - 44px);
  margin: 0 22px 22px;
  max-height: calc(100vh - 190px);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 18px 40px rgba(0, 0, 0, 0.32);
  background: #04060d;
}

@media (max-width: 860px) {
  #automation-rule-editor-card,
  .categories-dialog-window,
  .ui-dialog-window,
  .video-stage-card {
    width: calc(100vw - 24px);
    max-height: calc(100vh - 24px);
    border-radius: 22px !important;
  }

  .popup-window-header,
  .dialog-header,
  .video-stage-header,
  .popup-window-form,
  .dialog-form,
  .popup-window-footer,
  .dialog-footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  #categories-dialog .category-create-row {
    grid-template-columns: 1fr;
  }

  .video-stage-player {
    width: calc(100% - 32px);
    margin: 0 16px 16px;
  }
}

/* Final pass: give the Pad Editor and its TikTok gift picker a roomier desktop layout. */
.pad-drawer {
  width: min(544px, calc(100vw - 32px));
}

.pad-general-layout {
  grid-template-columns: 138px minmax(0, 1fr);
  gap: 14px;
}

.pad-preview-card {
  gap: 10px;
}

.pad-preview-surface,
.pad-preview-image,
.pad-preview-fallback {
  min-height: 132px;
}

[data-gift-picker="pad"] .gift-picker-panel {
  left: 0;
  right: auto;
  width: min(392px, calc(100vw - 56px));
  max-height: min(436px, calc(100vh - 160px));
}

[data-gift-picker="pad"] .gift-picker-list {
  max-height: min(360px, calc(100vh - 248px));
}

[data-gift-picker="pad"] .gift-picker-item {
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 14px;
  padding: 14px 18px;
}

[data-gift-picker="pad"] .gift-picker-item-media img {
  max-width: 48px;
  max-height: 48px;
}

[data-gift-picker="pad"] .gift-picker-item-copy strong {
  font-size: 14px;
  line-height: 1.2;
}

[data-gift-picker="pad"] .gift-picker-item-copy span {
  font-size: 11px;
}

@media (max-width: 640px) {
  .pad-drawer {
    width: calc(100vw - 20px);
  }

  .pad-general-layout {
    grid-template-columns: 1fr;
  }

  [data-gift-picker="pad"] .gift-picker-panel {
    width: min(100%, calc(100vw - 40px));
  }
}

.pad-media-picker-shell {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}

.pad-media-picker-trigger {
  width: 100%;
  min-height: 48px;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background:
    linear-gradient(180deg, rgba(28, 30, 49, 0.96), rgba(18, 20, 34, 0.98)),
    rgba(14, 16, 28, 0.98);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(241, 245, 255, 0.96);
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition:
    border-color 140ms ease,
    box-shadow 140ms ease,
    transform 140ms ease,
    background 140ms ease;
}

.pad-media-picker-trigger:hover {
  border-color: rgba(255, 255, 255, 0.16);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 12px 24px rgba(0, 0, 0, 0.22);
}

.pad-media-picker-trigger.is-open {
  border-color: rgba(255, 76, 162, 0.42);
  box-shadow:
    0 0 0 1px rgba(255, 76, 162, 0.18),
    0 18px 32px rgba(0, 0, 0, 0.28);
}

.pad-media-picker-trigger.is-empty .pad-media-picker-trigger-copy strong {
  color: rgba(228, 233, 249, 0.88);
  font-weight: 700;
}

.pad-media-picker-trigger-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.pad-media-picker-trigger-copy strong,
.pad-media-picker-trigger-copy span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pad-media-picker-trigger-copy strong {
  font-size: 13px;
  line-height: 1.2;
  color: rgba(248, 250, 255, 0.97);
}

.pad-media-picker-trigger-copy span {
  font-size: 11px;
  line-height: 1.2;
  color: rgba(156, 165, 196, 0.9);
}

.pad-media-picker-trigger .gift-picker-trigger-caret {
  flex: 0 0 auto;
  color: rgba(197, 205, 232, 0.84);
}

.pad-media-picker-trigger.is-open .gift-picker-trigger-caret {
  transform: rotate(180deg);
}

.pad-media-picker-panel {
  left: 0;
  right: auto;
  width: min(520px, calc(100vw - 56px));
  max-height: min(456px, calc(100vh - 160px));
  z-index: 45;
}

.pad-media-picker-toolbar {
  gap: 10px;
}

.pad-media-picker-toolbar input[type="search"] {
  min-width: 0;
  flex: 1 1 auto;
  height: 38px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(11, 14, 24, 0.86);
  color: rgba(245, 247, 255, 0.98);
  outline: none;
}

.pad-media-picker-toolbar input[type="search"]:focus {
  border-color: rgba(255, 76, 162, 0.42);
  box-shadow: 0 0 0 1px rgba(255, 76, 162, 0.18);
}

.pad-media-picker-list {
  max-height: min(356px, calc(100vh - 252px));
}

.pad-media-picker-item {
  width: 100%;
  border: 0;
  background: transparent;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 13px 16px;
  text-align: left;
  color: inherit;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  transition:
    background 140ms ease,
    transform 140ms ease,
    box-shadow 140ms ease;
}

.pad-media-picker-item:last-child {
  border-bottom: 0;
}

.pad-media-picker-item:hover {
  background: rgba(255, 255, 255, 0.04);
}

.pad-media-picker-item.is-selected {
  background:
    linear-gradient(90deg, rgba(255, 76, 162, 0.12), rgba(255, 76, 162, 0.03)),
    rgba(255, 255, 255, 0.03);
  box-shadow: inset 0 0 0 1px rgba(255, 76, 162, 0.16);
}

.pad-media-picker-item-clear {
  background: rgba(255, 255, 255, 0.025);
}

.pad-media-picker-item-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.pad-media-picker-item-copy strong,
.pad-media-picker-item-copy span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

  .pad-media-picker-item-copy strong {
    font-size: 13px;
    line-height: 1.22;
    color: rgba(248, 250, 255, 0.97);
  }

/* Keep automation rule editor inline so the page can scroll normally. */
#automation-rule-editor-backdrop {
  display: none !important;
}

#automation-rule-editor-card {
  position: static !important;
  inset: auto !important;
  z-index: auto !important;
  width: min(100%, 920px) !important;
  max-height: none !important;
  margin: 0 !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
  transform: none !important;
  justify-self: center;
  align-self: start;
  scroll-margin-top: 14px;
  border-radius: 28px !important;
  isolation: isolate;
}

#automation-rule-editor-card .popup-window-header,
#automation-rule-editor-card .popup-window-footer {
  position: static;
}

#automation-rule-editor-card .popup-window-header {
  border-top-left-radius: 28px;
  border-top-right-radius: 28px;
  background-clip: padding-box;
}

#automation-rule-editor-card .popup-window-form {
  max-height: none;
  overflow: visible;
}

#automation-rule-editor-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px solid rgba(146, 167, 214, 0.16);
  pointer-events: none;
}

.rule-table-head,
.rule-row {
  display: grid;
  grid-template-columns: minmax(200px, 1.15fr) minmax(120px, 0.72fr) 54px minmax(120px, 0.72fr) 128px;
  gap: 14px;
  align-items: center;
}

.rule-table-head span,
.rule-row > div {
  flex: initial;
  min-width: 0;
}

.rule-table-head span:last-child,
.rule-row > div:last-child {
  flex: initial;
}

.rule-table-priority-head,
.rule-row-priority {
  display: flex;
  align-items: center;
  justify-content: center;
}

.rule-table-priority-head {
  color: #8f88aa;
}

.rule-table-priority-head svg {
  width: 15px;
  height: 15px;
}

.rule-priority-indicator {
  width: 34px;
  min-width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  border: 1px solid rgba(251, 191, 36, 0.24);
  background:
    radial-gradient(circle at 30% 25%, rgba(255, 243, 176, 0.34), transparent 45%),
    linear-gradient(180deg, rgba(251, 191, 36, 0.18), rgba(245, 158, 11, 0.08)),
    rgba(255, 255, 255, 0.03);
  color: #f9d977;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 10px 24px rgba(245, 158, 11, 0.12);
}

.rule-priority-indicator svg {
  width: 15px;
  height: 15px;
}

.rule-priority-indicator.is-empty {
  opacity: 0;
  box-shadow: none;
}

@media (max-width: 980px) {
  .rule-table-head,
  .rule-row {
    grid-template-columns: minmax(170px, 1fr) minmax(104px, 0.7fr) 46px minmax(104px, 0.7fr) 116px;
    gap: 10px;
  }

  .rule-priority-indicator {
    width: 30px;
    min-width: 30px;
    height: 30px;
    border-radius: 10px;
  }
}

.pad-media-picker-item-copy span {
  font-size: 11px;
  line-height: 1.2;
  color: rgba(156, 165, 196, 0.86);
}

.pad-media-picker-item-badges {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.pad-media-picker-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(226, 232, 248, 0.9);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pad-media-picker-badge-icon {
  font-size: 10px;
  line-height: 1;
}

.pad-media-picker-badge.is-current {
  border-color: rgba(255, 76, 162, 0.28);
  background: rgba(255, 76, 162, 0.12);
  color: rgba(255, 198, 225, 0.96);
}

.pad-media-picker-badge.is-external {
  border-color: rgba(132, 142, 173, 0.2);
  background: rgba(132, 142, 173, 0.1);
  color: rgba(203, 211, 236, 0.9);
}

.pad-media-picker-badge.is-used {
  border-color: rgba(72, 210, 138, 0.28);
  background: rgba(72, 210, 138, 0.14);
  color: rgba(146, 255, 194, 0.98);
}

@media (max-width: 640px) {
  .pad-media-picker-panel {
    width: min(100%, calc(100vw - 40px));
  }

  .pad-media-picker-item {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }

  .pad-media-picker-item-badges {
    justify-content: flex-start;
  }
}

.pad-selection-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  padding: 5px 7px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.016), rgba(255, 255, 255, 0)),
    rgba(18, 21, 35, 0.86);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 10px 20px rgba(0, 0, 0, 0.14);
}

.pad-selection-copy {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 3px 0 1px;
}

.pad-selection-dot {
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff77b5, #ff3f97);
  box-shadow:
    0 0 0 1px rgba(255, 79, 154, 0.14),
    0 0 10px rgba(255, 79, 154, 0.32);
}

.pad-selection-copy strong {
  color: #eef2ff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  white-space: nowrap;
}

.pad-selection-buttons {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.pad-selection-action-btn {
  width: 30px;
  min-width: 30px;
  padding: 0;
  border-radius: 9px;
}

.pad-selection-action-btn .btn-icon {
  width: 13px;
  height: 13px;
}

.pad-selection-action-btn svg {
  width: 100%;
  height: 100%;
}

.pad-selection-action-btn.is-active {
  color: #7dd3fc;
  border-color: rgba(125, 211, 252, 0.45);
  background: rgba(56, 189, 248, 0.12);
}

/* When pad-selection bar is active, hide the right-hand workspace title
   and the "+ Add Pad" button so the bar does not overlap them. */
body.is-pad-selection-active #toolbar-context-copy,
body.is-pad-selection-active #view-primary-action-btn {
  display: none !important;
}

.pad-selection-actions {
  position: relative;
}

.pad-selection-category-popover {
  position: fixed;
  z-index: 1000;
  min-width: 220px;
  max-height: 320px;
  overflow-y: auto;
  padding: 6px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(8, 12, 22, 0.96);
  box-shadow: 0 18px 32px rgba(2, 5, 14, 0.5);
  backdrop-filter: blur(8px);
}

.pad-selection-category-popover.hidden {
  display: none;
}

.pad-selection-category-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pad-selection-category-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #eef2ff;
  text-align: left;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  transition: background 140ms ease, color 140ms ease;
}

.pad-selection-category-item:hover {
  background: rgba(56, 189, 248, 0.12);
  color: #cfe6ff;
}

.pad-selection-category-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.35);
  flex-shrink: 0;
}

.pad-selection-category-item:hover .pad-selection-category-dot {
  background: #7dd3fc;
}

.pad-selection-category-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}

.pad-select-toggle {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
}

.pad-select-checkbox {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.pad-select-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  background: rgba(9, 12, 22, 0.48);
  color: rgba(255, 255, 255, 0);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025),
    0 6px 12px rgba(0, 0, 0, 0.16);
  transition:
    border-color 140ms ease,
    background 140ms ease,
    color 140ms ease,
    transform 140ms ease,
    box-shadow 140ms ease,
    opacity 140ms ease;
  opacity: 0.82;
}

.pad-select-indicator svg {
  width: 9px;
  height: 9px;
}

.pad-select-toggle:hover .pad-select-indicator {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(16, 20, 34, 0.72);
  transform: translateY(-1px);
  opacity: 1;
}

.pad-select-checkbox:focus-visible + .pad-select-indicator {
  border-color: rgba(129, 140, 248, 0.42);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 0 0 2px rgba(129, 140, 248, 0.16);
}

.pad-select-checkbox:checked + .pad-select-indicator {
  border-color: rgba(236, 72, 153, 0.34);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.028), rgba(255, 255, 255, 0)),
    rgba(236, 72, 153, 0.2);
  color: #fff4fb;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.05),
    0 8px 16px rgba(0, 0, 0, 0.18),
    0 0 0 1px rgba(236, 72, 153, 0.12);
  opacity: 1;
}

body[data-pad-columns="16"] .pad-select-toggle,
body[data-pad-columns="16"] .pad-select-indicator {
  width: 16px;
  height: 16px;
  border-radius: 5px;
}

.toolbar-group-filter-shell > .label {
  text-align: center;
}

.users-directory-head span:nth-child(3),
.users-directory-head span:nth-child(4) {
  text-align: center;
}

.rule-table-head span:nth-child(2),
.rule-table-head span:nth-child(4),
.rule-table-head span:nth-child(5) {
  text-align: center;
}