/**
 * Depop Selling Hub / Inbox / Disputes surfaces
 * Canvas #000 · surfaces #09090B · borders #18181B · accent #FF2300 · success #10B981
 */

:root {
  --depop-bg: #000000;
  --depop-surface: #09090b;
  --depop-border: #18181b;
  --depop-border-hover: #27272a;
  --depop-accent: #ff2300;
  --depop-accent-hover: #d91e00;
  --depop-success: #10b981;
  --depop-text: #ffffff;
  --depop-muted: #a1a1aa;
  --depop-faint: #71717a;
}

/* Page shells that should always feel like Depop dark */
body.depop-surface-page,
.depop-surface {
  background: var(--depop-bg) !important;
  color: var(--depop-text);
}

.depop-surface a:not(.depop-btn-accent):not(.depop-btn-white) {
  color: var(--depop-muted);
}

.depop-surface a:not(.depop-btn-accent):not(.depop-btn-white):hover {
  color: var(--depop-text);
}

.depop-label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--depop-accent);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.depop-card {
  background: var(--depop-surface);
  border: 1px solid var(--depop-border);
  border-radius: 1rem;
}

.depop-btn-accent {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 1.25rem;
  border-radius: 9999px;
  background: var(--depop-accent);
  color: #fff !important;
  font-size: 0.75rem;
  font-weight: 700;
  border: none;
  transition: background 0.15s ease;
}

.depop-btn-accent:hover,
.depop-btn-accent:focus-visible {
  background: var(--depop-accent-hover);
  outline: none;
}

.depop-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 1rem;
  border-radius: 9999px;
  background: var(--depop-surface);
  color: #e4e4e7 !important;
  font-size: 0.75rem;
  font-weight: 700;
  border: 1px solid #27272a;
}

.depop-btn-ghost:hover {
  background: #18181b;
  color: #fff !important;
}

.depop-btn-white {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 1.1rem;
  border-radius: 9999px;
  background: #fff;
  color: #000 !important;
  font-size: 0.75rem;
  font-weight: 700;
}

.depop-btn-white:hover {
  background: #e4e4e7;
}

.depop-pill-success {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 9999px;
  background: rgba(16, 185, 129, 0.1);
  color: #34d399;
  font-size: 0.625rem;
  font-weight: 700;
}

.depop-pill-accent {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.55rem;
  border-radius: 9999px;
  background: rgba(255, 35, 0, 0.12);
  color: var(--depop-accent);
  font-size: 0.625rem;
  font-weight: 700;
}

.depop-pill-amber {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.55rem;
  border-radius: 9999px;
  background: rgba(245, 158, 11, 0.1);
  color: #fbbf24;
  border: 1px solid rgba(245, 158, 11, 0.2);
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
}

/* —— Seller Hub —— */
.seller-hub.depop-hub {
  color: var(--depop-text);
}

.seller-hub-carousel {
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #27272a transparent;
}

.seller-hub-carousel > * {
  scroll-snap-align: start;
}

.seller-hub-card {
  min-width: 11.5rem;
  max-width: 14rem;
  flex-shrink: 0;
  border-radius: 1rem;
  border: 1px solid var(--depop-border);
  background: var(--depop-surface);
  padding: 1rem;
  color: var(--depop-text);
  transition: border-color 0.15s ease, transform 0.15s ease;
}

.seller-hub-card:hover,
.seller-hub-card:focus-visible {
  border-color: #3f3f46;
  outline: none;
}

@media (prefers-reduced-motion: no-preference) {
  .seller-hub-card:hover {
    transform: translateY(-2px);
  }
}

.seller-hub-card--draft {
  min-width: 13rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.seller-hub-card--guide {
  min-width: 15rem;
}

.seller-hub-stat {
  min-height: 6.5rem;
  background: var(--depop-surface) !important;
  border: 1px solid var(--depop-border) !important;
  color: var(--depop-text);
}

.seller-hub-stat p {
  color: inherit;
}

.seller-hub-stat .depop-stat-label {
  color: var(--depop-faint);
}

.seller-hub-stat .depop-stat-meta {
  color: var(--depop-muted);
}

.seller-hub-stat--accent .depop-stat-value {
  color: var(--depop-accent);
}

.seller-hub-stat--success {
  border-color: rgba(16, 185, 129, 0.25) !important;
}

.seller-hub-stat--success .depop-stat-value {
  color: var(--depop-success);
}

.seller-hub-thumb {
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
  object-fit: cover;
  background: #18181b;
  flex-shrink: 0;
  border: 1px solid #27272a;
}

.seller-hub-growth {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 9999px;
  background: rgba(16, 185, 129, 0.1);
  color: #34d399;
  font-size: 0.625rem;
  font-weight: 700;
}

.seller-hub-level-done {
  border-color: rgba(16, 185, 129, 0.45) !important;
  background: rgba(16, 185, 129, 0.08) !important;
  color: #fff !important;
  font-weight: 600;
}

.depop-hub-progress {
  background: #18181b;
}

.depop-hub-progress > div {
  background: var(--depop-accent);
}

/* —— Inbox messenger —— */
.inbox-hub-label {
  color: var(--depop-accent);
}

.inbox-recent-card {
  border-color: var(--depop-border);
  background: var(--depop-surface);
}

.inbox-recent-card:hover,
.inbox-recent-card:focus-visible {
  border-color: #3f3f46;
}

.inbox-recent-thumb,
.inbox-recent-thumb--empty {
  background: #18181b;
  color: var(--depop-muted);
}

.inbox-recent-name {
  color: var(--depop-text);
}

.inbox-recent-price {
  color: var(--depop-muted);
}

.inbox-messenger {
  background: var(--depop-surface);
  border-color: var(--depop-border);
}

.inbox-messenger-head {
  background: #000;
  border-bottom-color: var(--depop-border);
}

.inbox-thread {
  background: #000;
}

.inbox-bubble-mine {
  background: var(--depop-accent);
  color: #fff;
  border-radius: 1.1rem 1.1rem 0.35rem 1.1rem;
}

.inbox-bubble-theirs {
  background: #18181b;
  color: #e4e4e7;
  border: 1px solid #27272a;
  border-radius: 1.1rem 1.1rem 1.1rem 0.35rem;
}

.inbox-bargain-card {
  background: #000;
  border: 1px solid var(--depop-border);
  color: var(--depop-text);
}

.inbox-bargain-cta {
  background: var(--depop-accent);
  color: #fff;
}

.inbox-bargain-cta:hover {
  background: var(--depop-accent-hover);
}

.inbox-bargain-ghost {
  background: #18181b;
  border-color: #27272a;
  color: var(--depop-muted);
}

.inbox-bargain-ghost:hover {
  color: #fff;
}

/* —— Disputes —— */
.dispute-hub-label {
  color: var(--depop-accent);
}

.dispute-card {
  background: var(--depop-surface);
  border-color: var(--depop-border);
  color: var(--depop-text);
}

.dispute-badge--review {
  background: rgba(245, 158, 11, 0.1);
  color: #fbbf24;
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.dispute-badge--resolved {
  background: rgba(16, 185, 129, 0.1);
  color: #34d399;
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.dispute-badge--action {
  background: rgba(255, 35, 0, 0.1);
  color: var(--depop-accent);
  border: 1px solid rgba(255, 35, 0, 0.2);
}

.dispute-guide-card {
  background: var(--depop-surface);
  border-color: var(--depop-border);
  color: var(--depop-text);
}

.dispute-guide-carousel {
  scrollbar-color: #27272a transparent;
}


/* —— Full seller sell page (dashboard + withdraw + listing) —— */
body.sell-depop-page {
  background: var(--depop-bg) !important;
  color: var(--depop-text) !important;
}

/* Only the top Sell page chrome — never flatten #seller-hub-nav */
body.sell-depop-page > header.sell-page-header,
body.sell-depop-page header.sell-page-header {
  background: rgba(0, 0, 0, 0.95) !important;
  border-bottom: 1px solid var(--depop-border) !important;
  color: var(--depop-text);
}

body.sell-depop-page .sell-depop-section,
body.sell-depop-page #onboard-panel,
body.sell-depop-page #seller-shop-edit,
body.sell-depop-page #seller-profile-bar,
body.sell-depop-page #success-box,
body.sell-depop-page .sell-panel,
body.sell-depop-page #bulk-draft-studio {
  background: var(--depop-surface) !important;
  border: 1px solid var(--depop-border) !important;
  color: var(--depop-text);
  border-radius: 1.5rem;
}

body.sell-depop-page #seller-hub-overview {
  /* already depop-surface; keep flush with page */
  background: var(--depop-surface) !important;
}

body.sell-depop-page .text-brand-green,
body.sell-depop-page .hover\:text-brand-green:hover {
  color: var(--depop-accent) !important;
}

body.sell-depop-page .text-brand-purple,
body.sell-depop-page .dark\:text-white {
  color: var(--depop-text) !important;
}

body.sell-depop-page .text-brand-purple\/60,
body.sell-depop-page .text-brand-purple\/65,
body.sell-depop-page .text-brand-purple\/70,
body.sell-depop-page .text-brand-purple\/55,
body.sell-depop-page .text-brand-purple\/50,
body.sell-depop-page .text-brand-purple\/45,
body.sell-depop-page .dark\:text-white\/60,
body.sell-depop-page .dark\:text-white\/65,
body.sell-depop-page .dark\:text-white\/70,
body.sell-depop-page .dark\:text-white\/55,
body.sell-depop-page .dark\:text-white\/50 {
  color: var(--depop-muted) !important;
}

body.sell-depop-page .bg-brand-green\/5,
body.sell-depop-page .bg-brand-green\/10,
body.sell-depop-page .border-brand-green\/20,
body.sell-depop-page .border-brand-green\/25,
body.sell-depop-page .border-brand-green\/30,
body.sell-depop-page .border-brand-green\/40 {
  background: rgba(255, 35, 0, 0.06) !important;
  border-color: rgba(255, 35, 0, 0.25) !important;
}

body.sell-depop-page .bg-brand-green,
body.sell-depop-page .bg-brand-green\/20,
body.sell-depop-page button.bg-brand-green,
body.sell-depop-page .btn-whatsapp {
  background: var(--depop-accent) !important;
  color: #fff !important;
  border-color: transparent !important;
}

body.sell-depop-page .btn-whatsapp:hover {
  background: var(--depop-accent-hover) !important;
}

body.sell-depop-page .bg-white,
body.sell-depop-page .bg-white\/70,
body.sell-depop-page .dark\:bg-brand-purple,
body.sell-depop-page .dark\:bg-brand-purpleLight\/40,
body.sell-depop-page .bg-brand-cream,
body.sell-depop-page .dark\:bg-brand-purple\/30 {
  background: #000 !important;
  color: var(--depop-text) !important;
}

body.sell-depop-page .border-black\/5,
body.sell-depop-page .border-brand-purple\/10,
body.sell-depop-page .border-brand-purple\/15,
body.sell-depop-page .border-brand-purple\/20,
body.sell-depop-page .dark\:border-white\/10,
body.sell-depop-page .dark\:border-white\/15,
body.sell-depop-page .dark\:border-white\/20 {
  border-color: var(--depop-border) !important;
}

body.sell-depop-page .sell-form-input,
body.sell-depop-page .sell-form-input select,
body.sell-depop-page .sell-form-input textarea,
body.sell-depop-page textarea,
body.sell-depop-page input[type="text"],
body.sell-depop-page input[type="tel"],
body.sell-depop-page input[type="url"],
body.sell-depop-page input[type="number"],
body.sell-depop-page select {
  background: #000 !important;
  color: #fff !important;
  border-color: #27272a !important;
  caret-color: #fff !important;
}

body.sell-depop-page .sell-form-input:focus,
body.sell-depop-page textarea:focus,
body.sell-depop-page input:focus,
body.sell-depop-page select:focus {
  border-color: var(--depop-accent) !important;
  box-shadow: 0 0 0 2px rgba(255, 35, 0, 0.35) !important;
}

body.sell-depop-page .sell-form-input::placeholder,
body.sell-depop-page textarea::placeholder {
  color: #71717a !important;
}

/* Dashboard section groups — clear visual hierarchy */
body.sell-depop-page .sell-dash-group__head {
  padding: 0 0.15rem;
}

body.sell-depop-page .sell-dash-group__label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #a1a1aa;
}

body.sell-depop-page .sell-dash-group__hint {
  margin-top: 0.2rem;
  font-size: 0.8125rem;
  color: #71717a;
}

body.sell-depop-page .sell-dash-collapse > summary {
  list-style: none;
}

body.sell-depop-page .sell-dash-collapse > summary::-webkit-details-marker {
  display: none;
}

body.sell-depop-page .sell-dash-collapse[open] .sell-dash-collapse__chevron {
  color: #ff2300;
}

body.sell-depop-page .sell-view-tabs {
  background: #18181b !important;
}

body.sell-depop-page .sell-view-tab {
  color: #a1a1aa !important;
}

body.sell-depop-page .sell-view-tab.is-active {
  background: var(--depop-accent) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-tab-badge {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-order-card,
body.sell-depop-page .sell-offer-card {
  background: #000 !important;
  border-color: var(--depop-border) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-offer-card {
  border-color: rgba(255, 35, 0, 0.28) !important;
}

body.sell-depop-page .sell-order-badge--action {
  background: rgba(255, 35, 0, 0.12) !important;
  color: #ff7a66 !important;
}

body.sell-depop-page .sell-order-badge--transit {
  background: rgba(251, 191, 36, 0.12) !important;
  color: #fbbf24 !important;
}

body.sell-depop-page .sell-order-badge--done {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #34d399 !important;
}

body.sell-depop-page .sell-order-badge--reminded {
  background: rgba(16, 185, 129, 0.14) !important;
  color: #34d399 !important;
}

body.sell-depop-page .sell-order-action {
  color: #e4e4e7 !important;
}

body.sell-depop-page .sell-order-action--primary {
  background: var(--depop-accent) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-offer-quick-btn {
  background: var(--depop-accent) !important;
  border-color: var(--depop-accent) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-offer-reset-btn,
body.sell-depop-page .sell-offer-undo-btn,
body.sell-depop-page .sell-offer-undo-open-btn,
body.sell-depop-page .sell-btn-ghost {
  background: var(--depop-surface) !important;
  border-color: #27272a !important;
  color: #e4e4e7 !important;
}

body.sell-depop-page .sell-ledger-tab {
  background: #000 !important;
  border-color: var(--depop-border) !important;
  color: #e4e4e7 !important;
}

body.sell-depop-page .sell-ledger-tab.is-active {
  border-color: var(--depop-accent) !important;
  background: rgba(255, 35, 0, 0.1) !important;
}

body.sell-depop-page .sell-ledger-dot.available {
  background: var(--depop-success) !important;
}

body.sell-depop-page .sell-ledger-dot.transit {
  background: var(--depop-accent) !important;
}

body.sell-depop-page .sell-wizard-step.is-active,
body.sell-depop-page .sell-wizard-step.is-done {
  background: var(--depop-accent) !important;
}

body.sell-depop-page .sell-wizard-step {
  background: #27272a !important;
}

body.sell-depop-page .sell-media-slot {
  background: #000 !important;
  border-color: #27272a !important;
}

body.sell-depop-page .sell-media-slot-cover {
  border-color: rgba(255, 35, 0, 0.55) !important;
}

body.sell-depop-page .sell-media-slot .sell-slot-label {
  color: #71717a !important;
}

body.sell-depop-page .sell-studio-badge {
  background: var(--depop-accent) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-studio-controls {
  border-color: rgba(255, 35, 0, 0.28) !important;
  background: rgba(255, 35, 0, 0.08) !important;
}

body.sell-depop-page .sell-studio-toggle input {
  accent-color: var(--depop-accent) !important;
}

body.sell-depop-page .sell-fee-table .sell-fee-net th,
body.sell-depop-page .sell-fee-table .sell-fee-net td,
body.sell-depop-page .depop-card-total,
body.sell-depop-page .product-sheet-total {
  color: var(--depop-success) !important;
}

body.sell-depop-page .sell-fee-table th,
body.sell-depop-page .sell-fee-table td {
  border-bottom-color: var(--depop-border) !important;
}

body.sell-depop-page .sell-price-range {
  background: rgba(255, 35, 0, 0.08) !important;
  color: var(--depop-muted) !important;
}

body.sell-depop-page .sell-tag-hint {
  color: var(--depop-faint) !important;
}

body.sell-depop-page .bulk-studio-banner {
  background: rgba(255, 35, 0, 0.06) !important;
  border-color: rgba(255, 35, 0, 0.25) !important;
}

body.sell-depop-page .bulk-studio-chip {
  background: #18181b !important;
  border-color: #27272a !important;
  color: #a1a1aa !important;
}

body.sell-depop-page .bulk-studio-dropzone {
  border-color: #27272a !important;
  background: #000 !important;
}

body.sell-depop-page .bulk-studio-dropzone.is-dragover {
  border-color: var(--depop-accent) !important;
  background: rgba(255, 35, 0, 0.06) !important;
}

body.sell-depop-page .bulk-studio-help,
body.sell-depop-page .bulk-studio-grid {
  border-color: var(--depop-border) !important;
  background: #000 !important;
}

body.sell-depop-page .bulk-studio-table thead {
  background: #18181b !important;
  color: #a1a1aa !important;
}

body.sell-depop-page .bulk-studio-table th,
body.sell-depop-page .bulk-studio-table td {
  border-color: var(--depop-border) !important;
  color: #e4e4e7 !important;
}

body.sell-depop-page .bulk-studio-input,
body.sell-depop-page .bulk-studio-condition,
body.sell-depop-page .bulk-studio-vibe {
  background: #09090b !important;
  border-color: #27272a !important;
  color: #fff !important;
}

body.sell-depop-page .bulk-studio-input:focus,
body.sell-depop-page .bulk-studio-input:hover {
  border-color: var(--depop-accent) !important;
}

body.sell-depop-page .sell-offer-filter {
  background: #000 !important;
  border-color: #27272a !important;
  color: #a1a1aa !important;
}

body.sell-depop-page .sell-offer-filter.is-active {
  border-color: var(--depop-accent) !important;
  color: #fff !important;
  background: rgba(255, 35, 0, 0.1) !important;
}

body.sell-depop-page .sell-offer-filter-count {
  background: #27272a !important;
  color: #e4e4e7 !important;
}

body.sell-depop-page .sell-offer-filter.is-active .sell-offer-filter-count {
  background: rgba(255, 35, 0, 0.35) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-offer-filters {
  gap: 0.5rem;
}

body.sell-depop-page input[type="checkbox"] {
  accent-color: var(--depop-accent) !important;
}

body.sell-depop-page a:not(.depop-btn-accent):not(.depop-btn-white):not(.sell-order-action--primary):not(.btn-whatsapp) {
  color: var(--depop-muted);
}

body.sell-depop-page a:not(.depop-btn-accent):not(.depop-btn-white):not(.sell-order-action--primary):not(.btn-whatsapp):hover {
  color: #fff;
}

body.sell-depop-page .font-display {
  color: #fff;
}

body.sell-depop-page .sell-offer-action {
  background: #18181b !important;
  border-color: #27272a !important;
  color: #e4e4e7 !important;
}

body.sell-depop-page .sell-offer-action--accept,
body.sell-depop-page .sell-offer-action--primary,
body.sell-depop-page .sell-offer-action--chat,
body.sell-depop-page .sell-offer-action--remind,
body.sell-depop-page .sell-offer-action--counter {
  background: var(--depop-accent) !important;
  border-color: var(--depop-accent) !important;
  color: #fff !important;
}

body.sell-depop-page .sell-offer-action--decline {
  background: transparent !important;
  border-color: #3f3f46 !important;
  color: #a1a1aa !important;
}

body.sell-depop-page .bulk-studio-banner {
  background: rgba(255, 35, 0, 0.06) !important;
  border-color: rgba(255, 35, 0, 0.25) !important;
}

/* Shop activity feed */
body.sell-depop-page .sell-activity-row {
  border-radius: 1rem;
  border: 1px solid var(--depop-border);
  background: #000;
  padding: 0.85rem 1rem;
  color: #e4e4e7;
}

body.sell-depop-page .sell-activity-row:hover {
  border-color: #27272a;
}

body.sell-depop-page .sell-activity-pill {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 9999px;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: #18181b;
  color: #a1a1aa;
  border: 1px solid #27272a;
}

body.sell-depop-page .sell-activity-pill--follow {
  background: rgba(255, 35, 0, 0.12);
  color: #ff2300;
  border-color: rgba(255, 35, 0, 0.25);
}

body.sell-depop-page .sell-activity-pill--like {
  background: rgba(16, 185, 129, 0.12);
  color: #34d399;
  border-color: rgba(16, 185, 129, 0.25);
}


/* Activity feed rows (seller hub + buyer activity page) */
.depop-surface-page .sell-activity-row,
body.sell-depop-page .sell-activity-row {
  border-radius: 1rem;
  border: 1px solid var(--depop-border);
  background: #000;
  padding: 0.85rem 1rem;
  color: #e4e4e7;
}

.depop-surface-page .sell-activity-row:hover,
body.sell-depop-page .sell-activity-row:hover {
  border-color: #27272a;
}

.depop-surface-page .sell-activity-pill,
body.sell-depop-page .sell-activity-pill {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.5rem;
  border-radius: 9999px;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: #18181b;
  color: #a1a1aa;
  border: 1px solid #27272a;
}

.depop-surface-page .sell-activity-pill--follow,
body.sell-depop-page .sell-activity-pill--follow {
  background: rgba(255, 35, 0, 0.12);
  color: #ff2300;
  border-color: rgba(255, 35, 0, 0.25);
}

.depop-surface-page .sell-activity-pill--like,
body.sell-depop-page .sell-activity-pill--like {
  background: rgba(16, 185, 129, 0.12);
  color: #34d399;
  border-color: rgba(16, 185, 129, 0.25);
}

/* Profile quick links */
.depop-surface-page .profile-quick-link {
  display: flex;
  align-items: center;
  min-height: 44px;
  border-radius: 1rem;
  border: 1px solid var(--depop-border);
  background: #000;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #e4e4e7 !important;
  text-decoration: none;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.depop-surface-page .profile-quick-link:hover {
  border-color: #3f3f46;
  color: #fff !important;
}

/* Ask Sokoni AI chat */
.depop-surface-page .ask-chat-log {
  border-radius: 1rem;
  border: 1px solid var(--depop-border);
  background: var(--depop-surface);
}

.depop-surface-page .ask-chat-form {
  background: var(--depop-bg);
}

.depop-surface-page .ask-suggest {
  min-height: 44px;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  border: 1px solid #3f3f46;
  background: #0a0a0a;
  color: #e4e4e7;
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.depop-surface-page .ask-suggest:hover,
.depop-surface-page .ask-suggest:focus-visible {
  border-color: #ff2300;
  color: #fff;
  outline: none;
}

.depop-surface-page .ask-bubble {
  max-width: 85%;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  line-height: 1.45;
}

.depop-surface-page .ask-bubble--user {
  border-radius: 1.1rem 1.1rem 0.35rem 1.1rem;
  background: var(--depop-accent);
  color: #fff;
}

.depop-surface-page .ask-bubble--bot {
  border-radius: 1.1rem 1.1rem 1.1rem 0.35rem;
  background: #18181b;
  color: #e4e4e7;
  border: 1px solid #27272a;
  white-space: pre-wrap;
}

.depop-surface-page .ask-product-card {
  border-radius: 0.75rem;
  border: 1px solid var(--depop-border);
  background: #000;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  color: #fff;
}

.depop-surface-page .ask-product-order {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0 0.75rem;
  border-radius: 9999px;
  background: var(--depop-accent);
  color: #fff !important;
  font-size: 0.75rem;
  font-weight: 700;
  text-decoration: none;
}

/* Dispute guide cards are buttons */
.depop-surface-page .dispute-guide-card {
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  font: inherit;
  text-align: left;
  width: auto;
}

.depop-surface-page .dispute-guide-card[aria-expanded="true"] {
  border-color: #3f3f46;
}

.depop-surface-page .sell-fee-table th,
.depop-surface-page .sell-fee-table td {
  color: #e4e4e7;
  border-bottom-color: #18181b;
}

.depop-surface-page .sell-fee-table .sell-fee-total th,
.depop-surface-page .sell-fee-table .sell-fee-total td {
  color: #fff;
}