
/* Narrow, additive G2U admin/customer/mobile enhancements */
.admin-orders-table { min-width: 1000px; }
.admin-orders-table td { vertical-align: middle; }
.order-needs-reply { background: rgba(52,107,199,.075); }
.buyer-cell { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.buyer-cell > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.buyer-cell small { display: block; font-size: 11px; margin-top: 2px; }
.buyer-avatar { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border: 1px solid #365b90; border-radius: 50%; background: #183865; color: #e4f1ff; font-weight: 800; overflow: hidden; }
.buyer-avatar img,.account-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.order-msg-badge { display: inline-flex; justify-content: center; min-width: 28px; padding: 4px 8px; border-radius: 7px; color: #fff; background: #305be8; text-decoration: none; font-weight: 800; box-shadow: 0 0 0 1px #658cff44; }
.order-msg-badge:hover { background: #4574fc; }
.order-eta { display: inline-flex; white-space: nowrap; font-size: 12px; font-weight: 750; border-radius: 7px; padding: 5px 8px; border: 1px solid #316b5f; background: #12312f; color: #72edb7; }
.order-eta.eta-warning { color: #ffd588; border-color: #856132; background: #322819; }
.order-eta.eta-overdue { color: #ffc5c5; border-color: #8e3941; background: #421f2a; }
.order-attention-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0 14px; }
.bulk-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 14px 0; padding: 12px; border-radius: 12px; border: 1px solid #29456b; background: #112039; }
.bulk-toolbar select { max-width: 220px; }
.product-row-actions { display: flex; gap: 8px; flex-wrap: nowrap; align-items: center; white-space: nowrap; }
.product-row-actions form { margin: 0; }
.profile-avatar-editor { display: flex; gap: 14px; align-items: center; padding: 12px 0 18px; }
.account-profile .account-avatar.profile-avatar-preview { width: 72px; height: 72px; flex-basis: 72px; border-radius: 50%; font-size: 27px; overflow: hidden; }
.mobile-buy-shortcut { display: none; }
@media (max-width: 700px) {
  .mobile-buy-shortcut.is-visible { display: flex; position: fixed; z-index: 28; bottom: max(8px,env(safe-area-inset-bottom)); left: 10px; right: 10px; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid #36598b; border-radius: 14px; color: #f4f8ff; background: #101d32ed; box-shadow: 0 10px 35px #0009; backdrop-filter: blur(14px); }
  .mobile-buy-shortcut .mobile-buy-info { min-width: 0; display: grid; gap: 2px; }
  .mobile-buy-shortcut .mobile-buy-info b { color: #9cc5ff; font-size: 14px; }
  .mobile-buy-shortcut span { font-size: 12px; font-weight: 700; line-height: 1.35; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .mobile-buy-shortcut button { flex-shrink: 0; }
  .admin-orders-table { min-width: 900px; }
}

.avatar-file-hidden { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; clip-path: inset(50%); }

/* Edit on the avatar; remove stays beside the image. */
.account-profile .profile-avatar-editor {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 4px 0 24px;
}
.account-profile .profile-avatar-details { min-width: 0; flex: 1; }
.account-profile .profile-avatar-details > b { display: block; margin-bottom: 4px; }
.account-profile .profile-avatar-details > p { margin: 0 0 14px; }
.account-profile .profile-avatar-actions {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 10px;
}
.account-profile .avatar-upload-label,
.account-profile .avatar-remove-form { margin: 0; }
.account-profile .avatar-remove-form { padding: 0; }
.account-profile .avatar-remove-form[hidden] { display: none !important; }
.account-profile .profile-avatar-control { position: relative; flex: 0 0 72px; width: 72px; height: 72px; }
.account-profile .avatar-upload-label { position: relative; display: block; width: 72px; height: 72px; border-radius: 50%; cursor: pointer; }
.account-profile .avatar-edit-overlay {
  position: absolute; inset: 0; display: grid; place-items: center;
  border-radius: 50%; background: rgba(100,105,115,.6); color: #fff;
  font-size: 12px; font-weight: 600; opacity: 0;
  transition: opacity .16s ease; pointer-events: none;
}
.account-profile .avatar-upload-label:hover .avatar-edit-overlay,
.account-profile .avatar-upload-label:focus-visible .avatar-edit-overlay,
.account-profile .avatar-upload-label:focus-within .avatar-edit-overlay { opacity: 1; }
.account-profile .avatar-upload-label[aria-disabled="true"] { cursor: wait; }
.account-profile .avatar-remove-form { position: absolute; top: -6px; right: -6px; z-index: 1; }
.account-profile .avatar-remove-button {
  display: grid; place-items: center; width: 28px; min-width: 28px; height: 28px; min-height: 28px;
  padding: 0; border: 1px solid #566379; border-radius: 50%; clip-path: none;
  background: #263246; color: #dbe4f3; font: inherit; font-size: 21px; line-height: 1; cursor: pointer;
}
.account-profile .avatar-remove-button:hover { background: #542b3b; border-color: #e38d9e; color: #fff; }
.account-profile .avatar-remove-button:disabled { opacity: .5; cursor: wait; }
.account-profile .avatar-remove-button:focus-visible { outline: 2px solid #86b5ff; outline-offset: 3px; }
@media (hover: none) { .account-profile .avatar-edit-overlay { opacity: 1; } }
.account-profile .avatar-action-button {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 156px;
  min-width: 0;
  height: 42px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid #386cbd;
  border-radius: 11px !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  background: #235ee4;
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.account-profile .avatar-action-button:hover { background: #3374f6; border-color: #75adff; }
.account-profile .avatar-action-button:focus-visible,
.account-profile .avatar-upload-label:focus-within { outline: 2px solid #86b5ff; outline-offset: 3px; }
.account-profile .avatar-feedback { display: block; margin-top: 10px; }
.account-profile .avatar-feedback:empty { display: none; }
@media (max-width: 530px) {
  .account-profile .profile-avatar-editor { align-items: flex-start; gap: 14px; }
  .account-profile .profile-avatar-actions { gap: 8px; }
  .account-profile .avatar-action-button { width: 140px; }
}
@media (max-width: 420px) {
  .account-profile .profile-avatar-editor { flex-direction: column; align-items: flex-start; }
  .account-profile .profile-avatar-actions { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .account-profile .avatar-action-button, .account-profile .avatar-edit-overlay { transition: none; }
}


/* Admin orders: maximum practical width with readable columns. */
.is-admin > .main { max-width: 1720px; width: 100%; }
.is-admin .admin { grid-template-columns: 168px minmax(0,1fr); gap: 20px; }
.admin-orders-table { min-width: 1120px; table-layout: auto; }
.admin-orders-table th, .admin-orders-table td { padding: 12px 10px; }
.admin-orders-table th:nth-child(3), .admin-orders-table td:nth-child(3) { min-width: 175px; }
.admin-orders-table th:nth-child(4), .admin-orders-table td:nth-child(4) { min-width: 155px; }
.admin-orders-table th:nth-child(6), .admin-orders-table td:nth-child(6) { min-width: 144px; }
.admin-orders-table th:nth-child(8), .admin-orders-table td:nth-child(8) { min-width: 140px; white-space: nowrap; }
.admin-orders-table .buyer-cell { display: flex; min-width: 0; }
.admin-orders-table .buyer-meta { flex: 1; min-width: 0; display: block; overflow: hidden; }
.admin-orders-table .buyer-nickname { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; }
.admin-orders-table .buyer-profile-link { display: block; width: fit-content; font-size: 12px; line-height: 1.6; white-space: nowrap; }
.admin-orders-table .order-titles { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-orders-table .order-open-row { cursor: pointer; }
.admin-orders-table .order-open-row:hover { background: rgba(58,107,205,.13); }
.admin-orders-table .order-open-row:focus-visible { outline: 2px solid #7db1ff; outline-offset: -2px; }
.admin-orders-table .order-open-row .order-msg-badge, .admin-orders-table .order-open-row .buyer-profile-link { position: relative; z-index: 1; }
.admin-user-overview { display: grid; gap: 24px; }
.admin-user-head { display: flex; align-items: center; gap: 18px; }
.admin-user-head h2 { margin: 0 0 5px; }
.admin-user-avatar { flex-basis: 72px; width: 72px; height: 72px; font-size: 24px; }
.admin-user-facts { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: 12px; }
.admin-user-facts > div { display: grid; gap: 6px; border: 1px solid #2a4160; border-radius: 9px; padding: 12px; min-width: 0; }
.admin-user-facts > div > span { color: #97b0d4; font-size: 12px; }
.admin-user-facts b { overflow-wrap: anywhere; font-size: 14px; }
.order-detail-profile { vertical-align: middle; }
@media(max-width:980px) { .is-admin .admin { grid-template-columns: minmax(0,1fr); } }

/* Consistent width across every admin section, not only orders/dashboard. */
.is-admin .admin-main { min-width: 0; }
.is-admin .admin-main > .table-wrap { max-width: 100%; overflow-x: auto; }
/* Products: keep all nine columns aligned and both actions side by side. */
.is-admin .ptable { min-width: 1080px; }
.is-admin .ptable th, .is-admin .ptable td { padding: 12px 11px; }
.is-admin .ptable th.bulk-check-col, .is-admin .ptable td.bulk-check-col { width: 50px; min-width: 50px; text-align: center; padding-left: 12px; padding-right: 6px; }
.is-admin .ptable th:last-child { min-width: 191px; }
.is-admin .product-row-actions .btn { padding: 7px 12px; }
.is-admin .product-row-actions form { flex: none; }
/* Ocean Blue custom checkboxes: accessible, keyboard focus visible. */
.is-admin .bulk-toolbar input[type="checkbox"],
.is-admin .ptable input[type="checkbox"] {
  appearance: none; -webkit-appearance: none; display: inline-grid; place-content: center;
  width: 20px; height: 20px; flex: 0 0 20px; vertical-align: middle;
  margin: 0; border-radius: 6px; border: 1.5px solid #58749d;
  background: #13233c; color: #fff; cursor: pointer;
  box-shadow: inset 0 1px 2px #0003;
  transition: background .16s, border-color .16s, box-shadow .16s;
}
.is-admin .bulk-toolbar input[type="checkbox"]:hover,
.is-admin .ptable input[type="checkbox"]:hover { border-color: #80b5ff; background: #1a3358; }
.is-admin .bulk-toolbar input[type="checkbox"]:checked,
.is-admin .ptable input[type="checkbox"]:checked { background: #2563eb; border-color: #6aa3ff; }
.is-admin .bulk-toolbar input[type="checkbox"]:checked::before,
.is-admin .ptable input[type="checkbox"]:checked::before {
  content: ""; width: 10px; height: 6px; border-left: 2px solid #fff; border-bottom: 2px solid #fff;
  transform: translateY(-2px) rotate(-45deg);
}
.is-admin .bulk-toolbar input[type="checkbox"]:indeterminate,
.is-admin .ptable input[type="checkbox"]:indeterminate { background: #1c4c9b; border-color: #80b5ff; }
.is-admin .bulk-toolbar input[type="checkbox"]:indeterminate::before,
.is-admin .ptable input[type="checkbox"]:indeterminate::before { content: ""; width: 10px; height: 2px; background: #fff; }
.is-admin .bulk-toolbar input[type="checkbox"]:focus-visible,
.is-admin .ptable input[type="checkbox"]:focus-visible { outline: 3px solid #96c3ff; outline-offset: 3px; }
.is-admin .bulk-select-label { display: inline-flex; align-items: center; gap: 11px; cursor: pointer; white-space: nowrap; }
.is-admin [data-orders-list] { min-height: 40px; }
.is-admin .order-new-arrival { animation: g2u-new-order-highlight 3s ease-out; }
@keyframes g2u-new-order-highlight { from { background: rgba(37,99,235,.29); } to { background: transparent; } }
@media (prefers-reduced-motion: reduce) { .is-admin .order-new-arrival { animation: none; } }

/* Keep a true table-cell in the visibility column; flex belongs inside it. */
.is-admin .ptable td.product-visibility-cell { display: table-cell; vertical-align: middle; }
.is-admin .ptable .product-visibility-actions { display: inline-flex; align-items: center; flex-wrap: nowrap; gap: 10px; white-space: nowrap; }
.is-admin .ptable .product-visibility-actions form { margin: 0; flex: none; }
.is-admin .order-eta { font-variant-numeric: tabular-nums; }
