/* Slip verification settings — light, performance-safe glass UI */

#admin-container.admin-settings-nav-shell .slip-settings-header {
  flex-direction: row;
  align-items: center;
}

#admin-container.admin-settings-nav-shell .slip-settings-page {
  display: grid;
  gap: 16px;
  width: var(--admin-settings-detail-width);
  margin: 0 auto;
  padding-bottom: 30px;
  box-sizing: border-box;
}

#admin-container.admin-settings-nav-shell .slip-settings-overview,
#admin-container.admin-settings-nav-shell .slip-settings-card {
  min-width: 0;
  padding: 20px;
  border: 1px solid rgba(218, 216, 235, 0.92);
  border-radius: 19px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.97), rgba(249, 249, 255, 0.92));
  box-shadow: 0 12px 28px rgba(46, 55, 90, 0.065);
  box-sizing: border-box;
}

#admin-container.admin-settings-nav-shell .slip-settings-overview-heading,
#admin-container.admin-settings-nav-shell .slip-settings-section-heading {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: start;
  gap: 13px;
}

#admin-container.admin-settings-nav-shell .slip-settings-section-heading.is-compact {
  grid-template-columns: 42px minmax(0, 1fr);
}

#admin-container.admin-settings-nav-shell .slip-settings-overview-heading h3,
#admin-container.admin-settings-nav-shell .slip-settings-section-heading h3 {
  margin: 2px 0 4px;
  color: #172033;
  font-size: 1.05rem;
  line-height: 1.35;
}

#admin-container.admin-settings-nav-shell .slip-settings-overview-heading p,
#admin-container.admin-settings-nav-shell .slip-settings-section-heading p {
  margin: 0;
  color: #68738d;
  font-size: 0.82rem;
  line-height: 1.5;
}

#admin-container.admin-settings-nav-shell .slip-settings-section-icon,
#admin-container.admin-settings-nav-shell .slip-settings-status-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: #ede9fe;
  color: #6d5dfc;
  font-size: 1rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-section-icon.is-cyan,
#admin-container.admin-settings-nav-shell .slip-settings-status-icon.is-cyan {
  background: #e6f8ff;
  color: #0284c7;
}

#admin-container.admin-settings-nav-shell .slip-settings-section-icon.is-blue {
  background: #eaf2ff;
  color: #2563eb;
}

#admin-container.admin-settings-nav-shell .slip-settings-kicker {
  display: block;
  color: #6d5ce7;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

#admin-container.admin-settings-nav-shell .slip-settings-status-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 17px;
}

#admin-container.admin-settings-nav-shell .slip-settings-status-strip > div {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid #e6e5f1;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.82);
}

#admin-container.admin-settings-nav-shell .slip-settings-status-icon {
  width: 38px;
  height: 38px;
  border-radius: 11px;
}

#admin-container.admin-settings-nav-shell .slip-settings-status-strip span:last-child {
  display: grid;
  min-width: 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-status-strip small {
  color: #7a849c;
  font-size: 0.72rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-status-strip strong {
  color: #253047;
  font-size: 0.86rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid #e8e7f2;
  border-radius: 15px;
  background: #fff;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow > i {
  color: #bbb7d2;
  font-size: 0.72rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow-step {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow-step > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: #f0edff;
  color: #6653e8;
  font-size: 0.76rem;
  font-weight: 900;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow-step div {
  display: grid;
  min-width: 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow-step strong {
  color: #253047;
  font-size: 0.78rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-flow-step small {
  color: #7b849a;
  font-size: 0.68rem;
  line-height: 1.35;
}

#admin-container.admin-settings-nav-shell .slip-settings-safety-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 12px;
  padding: 11px 13px;
  border: 1px solid #fde5ae;
  border-radius: 13px;
  background: #fffaf0;
  color: #7c5716;
}

#admin-container.admin-settings-nav-shell .slip-settings-safety-note > i {
  margin-top: 2px;
  color: #c98516;
}

#admin-container.admin-settings-nav-shell .slip-settings-safety-note p {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.5;
}

#admin-container.admin-settings-nav-shell .slip-settings-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 286px;
  gap: 16px;
  align-items: start;
  min-width: 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-count-badge {
  align-self: center;
  min-width: 62px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #f1efff;
  color: #6253d9;
  font-size: 0.72rem;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}

#admin-container.admin-settings-nav-shell .slip-settings-add-form {
  margin-top: 18px;
}

#admin-container.admin-settings-nav-shell .slip-settings-add-form > label,
#admin-container.admin-settings-nav-shell .slip-settings-message-editor > label {
  display: block;
  margin: 0 0 7px;
  color: #38435a;
  font-size: 0.79rem;
  font-weight: 800;
}

#admin-container.admin-settings-nav-shell .slip-settings-add-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
}

#admin-container.admin-settings-nav-shell .slip-settings-add-row input,
#admin-container.admin-settings-nav-shell .slip-settings-message-editor textarea,
#admin-container.admin-settings-nav-shell .slip-settings-recipient-row.is-editing input {
  width: 100%;
  margin: 0 !important;
  border: 1px solid #dfe3ec !important;
  border-radius: 13px !important;
  background: #fff !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

#admin-container.admin-settings-nav-shell .slip-settings-add-row input {
  min-height: 44px;
  padding: 10px 12px !important;
}

#admin-container.admin-settings-nav-shell .slip-settings-add-row input:focus,
#admin-container.admin-settings-nav-shell .slip-settings-message-editor textarea:focus,
#admin-container.admin-settings-nav-shell .slip-settings-recipient-row.is-editing input:focus {
  border-color: #9e8cff !important;
  outline: 3px solid rgba(109, 93, 252, 0.11);
}

#admin-container.admin-settings-nav-shell .slip-settings-add-row .primary-btn {
  min-width: 118px;
  margin: 0 !important;
}

#admin-container.admin-settings-nav-shell .slip-settings-inline-status {
  display: block;
  min-height: 18px;
  margin-top: 7px;
  color: #7b8498;
  font-size: 0.72rem;
  line-height: 1.4;
}

#admin-container.admin-settings-nav-shell .slip-settings-inline-status.is-success {
  color: #087f5b;
}

#admin-container.admin-settings-nav-shell .slip-settings-inline-status.is-info {
  color: #2563eb;
}

#admin-container.admin-settings-nav-shell .slip-settings-inline-status.is-error {
  color: #c92a2a;
}

#admin-container.admin-settings-nav-shell .slip-settings-list-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  margin-top: 14px;
  padding: 0 2px 8px;
  border-bottom: 1px solid #ecebf3;
}

#admin-container.admin-settings-nav-shell .slip-settings-list-heading strong {
  color: #303a50;
  font-size: 0.8rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-list-heading span {
  color: #8a92a4;
  font-size: 0.69rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-list {
  display: grid;
  max-height: 380px;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  list-style: none;
  scrollbar-color: auto;
  scrollbar-width: auto;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-row {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 11px 2px;
  border-bottom: 1px solid #eeedf4;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-row:last-child {
  border-bottom: 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: #f1efff;
  color: #6655e8;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-name {
  display: grid;
  gap: 2px;
  min-width: 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-name strong {
  overflow: hidden;
  color: #253047;
  font-size: 0.82rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-name small {
  color: #8991a3;
  font-size: 0.68rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-row-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

#admin-container.admin-settings-nav-shell .slip-settings-row-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto !important;
  min-width: 0;
  min-height: 34px;
  margin: 0 !important;
  padding: 7px 9px !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 0.72rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-row.is-editing {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 10px 0;
}

#admin-container.admin-settings-nav-shell .slip-settings-recipient-row.is-editing input {
  min-height: 40px;
  padding: 9px 11px !important;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  margin-top: 10px;
  padding: 18px 14px;
  border: 1px dashed #d9d5ee;
  border-radius: 14px;
  background: #fbfaff;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #f0edff;
  color: #6d5ce7;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state div {
  display: grid;
  gap: 3px;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state strong {
  color: #364057;
  font-size: 0.82rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state small {
  color: #7c859a;
  font-size: 0.72rem;
  line-height: 1.4;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state.is-error {
  border-color: #fecaca;
  background: #fff8f8;
}

#admin-container.admin-settings-nav-shell .slip-settings-empty-state.is-error > span {
  background: #fee2e2;
  color: #dc2626;
}

#admin-container.admin-settings-nav-shell .slip-settings-list-skeleton {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  padding: 12px 2px;
  border-bottom: 1px solid #eeedf4;
}

#admin-container.admin-settings-nav-shell .slip-settings-list-skeleton span {
  min-height: 38px;
  border-radius: 11px;
  background: linear-gradient(90deg, #f1f2f6 25%, #fafafe 50%, #f1f2f6 75%);
  background-size: 200% 100%;
  animation: slip-settings-skeleton 1.1s linear infinite;
}

@keyframes slip-settings-skeleton {
  to { background-position: -200% 0; }
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-card {
  padding: 18px;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list {
  display: grid;
  gap: 9px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list li {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  padding: 11px;
  border: 1px solid #e6e8ef;
  border-radius: 13px;
  background: #fff;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list li > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list li.is-success > i {
  background: #e8fbf2;
  color: #059669;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list li.is-warning > i {
  background: #fff7df;
  color: #b7791f;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list li.is-muted > i {
  background: #f1f3f6;
  color: #7b8495;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list span {
  display: grid;
  gap: 2px;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list strong {
  color: #2e384d;
  font-size: 0.79rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-policy-list small {
  color: #7c8599;
  font-size: 0.7rem;
  line-height: 1.4;
}

#admin-container.admin-settings-nav-shell .slip-settings-message-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 15px;
  margin-top: 18px;
}

#admin-container.admin-settings-nav-shell .slip-settings-message-editor textarea {
  min-height: 130px;
  padding: 12px 13px !important;
  resize: vertical;
  color: #263148;
  line-height: 1.55;
}

#admin-container.admin-settings-nav-shell .slip-settings-token-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 9px;
}

#admin-container.admin-settings-nav-shell .slip-settings-token-row .secondary-btn {
  flex: 0 0 auto;
  width: auto !important;
  min-width: 0;
  min-height: 36px;
  margin: 0 !important;
  padding: 7px 11px !important;
  border-radius: 999px !important;
  font-size: 0.74rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-token-row > span {
  color: #7d869a;
  font-size: 0.7rem;
  line-height: 1.45;
}

#admin-container.admin-settings-nav-shell .slip-settings-message-preview {
  min-width: 0;
  padding: 14px;
  border: 1px solid #dfe6f1;
  border-radius: 15px;
  background: linear-gradient(145deg, #f7faff, #fff);
}

#admin-container.admin-settings-nav-shell .slip-settings-message-preview > span {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #66728a;
  font-size: 0.72rem;
  font-weight: 800;
}

#admin-container.admin-settings-nav-shell #slip-message-preview {
  min-height: 76px;
  margin-top: 12px;
  padding: 12px 13px;
  border: 1px solid #e3e7ef;
  border-radius: 13px;
  background: #fff;
  color: #263148;
  font-size: 0.82rem;
  line-height: 1.6;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

#admin-container.admin-settings-nav-shell .slip-settings-message-footer {
  margin-top: 17px;
}

#admin-container.admin-settings-nav-shell .slip-settings-message-actions {
  display: flex;
  align-items: center;
  gap: 9px;
}

#admin-container.admin-settings-nav-shell .slip-settings-message-actions button {
  margin: 0 !important;
}

#admin-container.admin-settings-nav-shell .slip-settings-load-error {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #fecaca;
  border-radius: 15px;
  background: #fff8f8;
  color: #991b1b;
}

#admin-container.admin-settings-nav-shell .slip-settings-load-error[hidden] {
  display: none;
}

#admin-container.admin-settings-nav-shell .slip-settings-load-error > i {
  font-size: 1.05rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-load-error > div {
  display: grid;
  gap: 2px;
}

#admin-container.admin-settings-nav-shell .slip-settings-load-error strong {
  font-size: 0.84rem;
}

#admin-container.admin-settings-nav-shell .slip-settings-load-error span {
  color: #b45353;
  font-size: 0.74rem;
}

@media (max-width: 899px) {
  #admin-container.admin-settings-nav-shell .slip-settings-main-grid,
  #admin-container.admin-settings-nav-shell .slip-settings-message-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #admin-container.admin-settings-nav-shell .slip-settings-policy-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #admin-container.admin-settings-nav-shell .slip-settings-policy-list li {
    grid-template-columns: 34px minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  #admin-container.admin-settings-nav-shell .slip-settings-page {
    gap: 12px;
    padding-bottom: max(22px, env(safe-area-inset-bottom));
  }

  #admin-container.admin-settings-nav-shell .slip-settings-overview,
  #admin-container.admin-settings-nav-shell .slip-settings-card {
    padding: 15px;
    border-radius: 17px;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-overview-heading,
  #admin-container.admin-settings-nav-shell .slip-settings-section-heading {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 10px;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-section-icon {
    width: 40px;
    height: 40px;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-count-badge {
    grid-column: 2;
    justify-self: start;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-status-strip,
  #admin-container.admin-settings-nav-shell .slip-settings-policy-list {
    grid-template-columns: minmax(0, 1fr);
  }

  #admin-container.admin-settings-nav-shell .slip-settings-flow {
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-flow > i {
    display: none;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-flow-step {
    padding: 3px 0;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-add-row {
    grid-template-columns: minmax(0, 1fr);
  }

  #admin-container.admin-settings-nav-shell .slip-settings-add-row .primary-btn {
    width: 100% !important;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-list-heading {
    align-items: start;
    flex-direction: column;
    gap: 3px;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-recipient-list {
    max-height: none;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-recipient-row {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  #admin-container.admin-settings-nav-shell .slip-settings-recipient-avatar {
    width: 36px;
    height: 36px;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-recipient-row > .slip-settings-row-actions {
    grid-column: 2;
    justify-content: flex-start;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-recipient-row.is-editing {
    grid-template-columns: minmax(0, 1fr);
  }

  #admin-container.admin-settings-nav-shell .slip-settings-recipient-row.is-editing .slip-settings-row-actions {
    grid-column: 1;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-token-row,
  #admin-container.admin-settings-nav-shell .slip-settings-message-footer,
  #admin-container.admin-settings-nav-shell .slip-settings-message-actions {
    align-items: stretch;
    flex-direction: column;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-token-row .secondary-btn,
  #admin-container.admin-settings-nav-shell .slip-settings-message-actions,
  #admin-container.admin-settings-nav-shell .slip-settings-message-actions button {
    width: 100% !important;
  }

  #admin-container.admin-settings-nav-shell .slip-settings-load-error {
    grid-template-columns: auto minmax(0, 1fr);
  }

  #admin-container.admin-settings-nav-shell .slip-settings-load-error .secondary-btn {
    grid-column: 1 / -1;
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #admin-container.admin-settings-nav-shell .slip-settings-list-skeleton span {
    animation: none;
  }
}
