/* User details and scoped order history. */
.user-row-actions {
  display: grid;
  gap: 8px;
  justify-items: start;
}
.user-row-actions .button {
  white-space: nowrap;
}
.user-details-dialog {
  box-sizing: border-box;
  width: min(780px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  padding: 0;
  border: 1px solid #3b5b4c;
  border-radius: 14px;
  overflow: auto;
  background: #0c171b;
  color: #edf6ef;
  box-shadow: 0 32px 100px #0009;
}
.user-details-dialog::backdrop {
  background: #03080dcc;
  backdrop-filter: blur(6px);
}
html:has(.user-details-dialog[open]) {
  overflow: hidden;
}
.user-details-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
  padding: 24px 28px;
  border-bottom: 1px solid #2d4339;
  background: #0c171b;
  position: sticky;
  top: 0;
  z-index: 1;
}
.user-details-heading h2 {
  font: 500 25px/1.3 var(--display);
  letter-spacing: -0.7px;
  margin: 8px 0;
}
.user-details-heading p {
  margin: 0;
  color: #a8bfb1;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.user-details-heading > div {
  min-width: 0;
}
.user-details-heading h2 {
  overflow-wrap: anywhere;
}
.user-details-heading > .icon-button {
  flex-shrink: 0;
  min-width: 44px;
  min-height: 44px;
  font-size: 27px;
}
.user-details-tabs {
  display: flex;
  gap: 8px;
  padding: 18px 28px 0;
}
.user-details-tabs button {
  min-height: 44px;
  background: transparent;
  border: 1px solid #344b40;
  color: #a8bfb1;
  border-radius: 6px;
  padding: 10px 16px;
  cursor: pointer;
  font-size: 13px;
}
.user-details-tabs button[aria-current] {
  background: #b0ff6a;
  color: #14220d;
  border-color: #b0ff6a;
  font-weight: 600;
}
.user-details-tabs button span {
  font: 11px var(--mono);
  margin-left: 6px;
  opacity: 0.8;
}
.user-details-body {
  padding: 26px 28px 28px;
  min-width: 0;
}
.user-profile-details > dl {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin: 22px 0;
}
.user-profile-details dt,
.user-order-summary dt {
  font-size: 11px;
  color: #91aa9b;
  margin-bottom: 8px;
}
.user-profile-details dd {
  font-size: 16px;
  margin: 0;
  overflow-wrap: anywhere;
}
.user-profile-address {
  grid-column: 1/-1;
  padding-top: 20px;
  border-top: 1px solid #263c32;
}
.user-profile-address dd span {
  display: block;
}
.user-profile-note {
  font-size: 11px !important;
  margin-top: 20px !important;
}
.user-profile-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  font-size: 11px;
  color: #a6bcaf;
  padding-block: 20px;
  border-top: 1px solid #263c32;
  margin: 20px 0 8px;
}
.user-profile-details > .button {
  margin-top: 12px;
  gap: 12px;
}
.user-profile-details > .button > span:first-child {
  font: 12px var(--mono);
  color: #b0ff6a;
}
.user-details-empty {
  padding: 30px 8px;
  text-align: center;
}
.user-details-empty h3 {
  font-size: 20px;
  margin: 0 0 12px;
}
.user-details-empty p {
  font-size: 13px;
  color: #a5bcae;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.user-details-loading {
  padding-block: 32px;
  color: #a5bcae;
  font-size: 13px;
}
.user-orders-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
}
.user-orders-heading h3 {
  font-size: 20px;
  margin: 0;
  overflow-wrap: anywhere;
}
.user-orders-heading > span:not(.admin-pill) {
  font-size: 12px;
  color: #a5bcae;
}
.user-detail-orders {
  display: grid;
  gap: 10px;
}
.user-detail-order {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 16px;
  width: 100%;
  text-align: start;
  background: #11221d;
  border: 1px solid #2d493b;
  border-radius: 7px;
  padding: 18px;
  color: #edf6ef;
  cursor: pointer;
}
.user-detail-order:hover {
  border-color: #91c96a;
}
.user-detail-order > span:first-child {
  min-width: 0;
}
.user-detail-order strong {
  font-size: 14px;
  overflow-wrap: anywhere;
}
.user-detail-order small {
  display: block;
  font-size: 10px;
  color: #9cb1a4;
  margin-top: 6px;
}
.user-order-open {
  grid-column: 1/-1;
  display: flex;
  justify-content: space-between;
  color: #b0ff6a;
  font-size: 11px;
  padding-top: 10px;
  border-top: 1px solid #2d4339;
}
.user-order-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 20px;
  font-size: 11px;
  color: #a5bcae;
}
.user-order-pagination > div {
  display: flex;
  gap: 8px;
}
.user-order-pagination button {
  background: #12271d;
  border: 1px solid #35523f;
  border-radius: 5px;
  color: #d8e8dd;
  padding: 10px 12px;
  min-height: 44px;
  cursor: pointer;
}
.user-order-pagination button:disabled {
  opacity: 0.35;
  cursor: default;
}
.user-order-back {
  margin-bottom: 20px;
  font-size: 12px;
}
.user-order-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 30px;
  padding-block: 20px;
  border-block: 1px solid #2d4339;
  margin: 22px 0;
}
.user-order-summary dd {
  margin: 0;
  font-size: 14px;
}
.user-order-products {
  display: grid;
  gap: 14px;
}
.user-order-products article {
  border: 1px solid #2d4339;
  border-radius: 7px;
  padding: 20px;
  background: #101e1b;
  min-width: 0;
}
.user-order-product-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
}
.user-order-product-heading h4 {
  font-size: 16px;
  line-height: 1.5;
  margin: 6px 0 0;
  overflow-wrap: anywhere;
}
.user-order-product-heading small {
  font: 9px var(--mono);
  letter-spacing: 1.4px;
  color: #93ac9b;
}
.user-order-product-heading > strong {
  white-space: nowrap;
  font-size: 14px;
}
.user-order-products article > p {
  font-size: 12px;
  color: #a5bcae;
  overflow-wrap: anywhere;
}
.user-order-product-state {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 16px;
}
.user-order-product-state > span:not(.admin-pill) {
  font-size: 10px;
  color: #a5bcae;
}
.user-reveal-note {
  display: block;
  font-size: 10px;
  color: #acbdad;
  margin-top: 12px;
  line-height: 1.7;
}
.user-details-dialog button:focus-visible {
  outline: 2px solid #b0ff6a;
  outline-offset: 3px;
}
@media (max-width: 700px) {
  .user-row-actions {
    width: 100%;
  }
  .user-details-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
    border-radius: 10px;
  }
  .user-details-heading {
    padding: 20px;
    gap: 12px;
  }
  .user-details-heading h2 {
    font-size: 22px;
  }
  .user-details-heading p {
    font-size: 12px;
  }
  .user-details-tabs {
    padding: 16px 20px 0;
    gap: 8px;
  }
  .user-details-tabs button {
    flex: 1;
    padding: 10px;
  }
  .user-details-body {
    padding: 22px 20px;
  }
  .user-profile-details > dl {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .user-profile-details dd {
    font-size: 15px;
  }
  .user-profile-address {
    padding-top: 0;
    border: 0;
  }
  .user-profile-meta {
    display: grid;
    gap: 9px;
  }
  .user-profile-details > .button {
    width: 100%;
    font-size: 12px;
  }
  .user-detail-order {
    padding: 16px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
  }
  .user-detail-order > .admin-pill {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
  }
  .user-detail-order > strong {
    grid-column: 2;
    grid-row: 1;
  }
  .user-order-open {
    grid-row: 3;
  }
  .user-orders-heading h3 {
    font-size: 18px;
  }
  .user-order-products article {
    padding: 16px;
  }
  .user-order-product-heading h4 {
    font-size: 14px;
  }
  .user-order-pagination {
    flex-wrap: wrap;
    font-size: 10px;
  }
  .user-order-pagination > div {
    margin-left: auto;
  }
}
.user-refund-control {
  margin-top: 18px;
  border-top: 1px solid #2d4339;
  padding-top: 14px;
  font-size: 12px;
}
.user-refund-control > summary {
  color: #d7eea6;
  cursor: pointer;
  min-height: 34px;
  padding-block: 6px;
}
.user-refund-control form > p {
  font-size: 12px;
  line-height: 1.8;
  color: #a5bcae;
  overflow-wrap: anywhere;
}
.user-refund-control label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 12px;
  color: #d8e8dd;
  line-height: 1.8;
  margin: 16px 0;
}
.user-refund-control input[type="checkbox"] {
  margin-top: 4px;
  min-width: 17px;
  width: 17px;
  height: 17px;
  accent-color: #b0ff6a;
}
.user-refund-record {
  font-size: 11px;
  color: #d7eea6;
  line-height: 1.7;
  margin-top: 16px;
}
.user-refund-success {
  padding: 12px 14px;
  background: #172e21;
  border: 1px solid #456a4f;
  border-radius: 6px;
  color: #c4edb7;
  font-size: 12px;
}
.user-refund-feedback {
  padding: 10px;
  border: 1px solid #84514a;
  color: #f1c4bd !important;
  border-radius: 5px;
}

.user-refund-request { padding: .8rem; background: #172e21; color: #c4edb7; border: 1px solid #456a4f; border-radius: 8px; line-height: 1.6; overflow-wrap: anywhere; }
.user-session-count { display:block; margin-top:10px; font-size:11px; line-height:1.6; text-align:left; }
.user-details-tabs { flex-wrap:wrap; }
.user-sessions-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.user-sessions-summary h3 { margin:10px 0 0; color:#edf6ef; font-size:20px; line-height:1.5; }
.user-sessions-summary h3 span { display:inline-block; margin-left:6px; color:#b0ff6a; }
.user-session-list { border:1px solid #2d4339; border-radius:10px; overflow:hidden; }
.user-session-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; padding:20px; border-bottom:1px solid #2d4339; background:#0c171b; }
.user-session-row:last-child { border-bottom:0; }
.user-session-row > div { min-width:0; display:grid; justify-items:start; align-content:start; gap:10px; }
.user-session-row strong { color:#edf6ef; font-size:14px; }
.user-session-country { display:flex; flex-wrap:wrap; gap:5px 10px; align-items:baseline; font-size:11px; color:#a5bcae; line-height:1.6; }
.user-session-country b { color:#b0ff6a; font-weight:500; }
.user-session-row small, .user-sessions-updated, .user-sessions-note { color:#a5bcae; font-size:11px; line-height:1.8; overflow-wrap:anywhere; }
.user-sessions-note { margin-top:20px; }
.user-sessions-error { padding:14px; border:1px solid #84514a; border-radius:6px; color:#f1c4bd; font-size:12px; line-height:1.8; }
@media(max-width:600px) { .user-session-row { grid-template-columns:1fr; gap:16px; padding:18px; } .user-sessions-summary { align-items:start; gap:10px; } .user-sessions-summary .button { padding:10px 12px; min-width:0; } .user-sessions-summary h3 { font-size:17px; } .user-details-tabs { gap:6px; } .user-details-tabs button { display:inline-flex; align-items:center; justify-content:center; gap:4px; padding:10px 8px; font-size:11px; white-space:nowrap; } .user-details-tabs button span { margin-left:0; } .user-sessions-summary h3 span { white-space:nowrap; } }
/* Refund requests use the same owner workspace and order dialog. */
.refund-queue-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; border:1px solid #2d4339; border-radius:10px; overflow:hidden; background:#2d4339; margin:24px 0; }
.refund-queue-metrics > div { background:#0c171b; padding:20px; display:grid; gap:9px; }
.refund-queue-metrics span { color:#a5bcae; font-size:11px; }
.refund-queue-metrics strong { color:#edf6ef; font-size:30px; font-weight:500; }
.refund-queue-toolbar { display:flex; justify-content:space-between; align-items:end; gap:20px; margin:24px 0 16px; }
.refund-queue-toolbar label { display:grid; gap:8px; color:#c1d0c7; font-size:12px; }
.refund-queue-toolbar select { width:min(280px,100%); }
.refund-queue-toolbar small { color:#8da398; font-size:11px; }
.refund-request-list { border:1px solid #2d4339; border-radius:10px; overflow:hidden; }
.refund-request-row { display:grid; grid-template-columns:1fr 1.1fr 1fr auto; gap:20px; padding:22px; border-bottom:1px solid #2d4339; background:#0c171b; align-items:center; }
.refund-request-row:last-child { border-bottom:0; }
.refund-request-row > div { min-width:0; display:grid; gap:7px; overflow-wrap:anywhere; }
.refund-request-row strong { color:#edf6ef; font-size:13px; line-height:1.6; }
.refund-request-row small, .refund-request-product > span { color:#a5bcae; font-size:11px; line-height:1.7; }
.refund-request-row .admin-pill { justify-self:start; }
.refund-request-actions .button { white-space:normal; line-height:1.5; }
.refund-queue-note { margin-top:18px; line-height:1.8; font-size:12px; }
.refund-queue-feedback { color:#f1c4bd; padding:14px; border:1px solid #84514a; border-radius:6px; }
.user-order-products article.is-selected-refund { outline:1px solid #b0ff6a; outline-offset:2px; }
@media(max-width:1100px) { .refund-request-row { grid-template-columns:1fr 1fr; } .refund-request-actions { justify-self:end; } }
@media(max-width:600px) { .refund-queue-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .refund-queue-metrics > div { padding:16px; } .refund-queue-toolbar { display:grid; align-items:start; } .refund-request-list { border:0; overflow:visible; display:grid; gap:14px; } .refund-request-row { grid-template-columns:1fr; gap:16px; padding:18px; border:1px solid #2d4339; border-radius:10px; } .refund-request-row:last-child { border-bottom:1px solid #2d4339; } .refund-request-actions { justify-self:stretch; } .refund-request-actions .button { width:100%; } }
