/* ===== BuddyPress Group › Orders — two-row items: Row1 Title/Qty/Total; Row2 Description | Image ===== */

/* Wrapper + page title */
.psoo-bp-wrapper { margin-top: 8px; }
.psoo-bp-title {
  margin: 10px 0 18px;
  color: #101828;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: -0.01em;
}

/* Alerts */
.psoo-bp-alert {
  background: #fff5f5;
  border: 1px solid #ffd6d6;
  color: #7a0a0a;
  padding: 12px 14px;
  border-radius: 12px;
  font-weight: 600;
}

/* Orders table (list) */
.psoo-bp-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(16,24,40,.08);
}
.psoo-bp-table thead tr { background: #f2f4f7; }
.psoo-bp-table thead th {
  text-align: left;
  color: #101828;
  padding: 14px 16px;
  font-weight: 800;
  border-bottom: 1px solid #e4e7ec;
}
.psoo-bp-table tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid #eef0f6;
  color: #182230;
}
.psoo-bp-table tbody tr:last-child td { border-bottom: 0; }

/* keep subtle hover for normal rows */
.psoo-bp-table tbody tr:hover td { background: #fafbff; }

/* Details row container */
.psoo-bp-details[aria-hidden="true"] { display: none; }
.psoo-bp-details[aria-hidden="false"] { display: table-row; }
.psoo-bp-details td { padding: 0 !important; background: #f8fafc; }

/* Inline card */
.psoo-bp-orderview.psoo-bp-orderview--light {
  margin: 12px;
  background: #ffffff;
  color: #101828;
  border: 1px solid #e4e7ec;
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 12px 28px rgba(16,24,40,.12);
}

/* Inline card header */
.psoo-bp-ov-head {
  display: flex; align-items: center; gap: 12px;
  margin: -2px 0 14px;
}
.psoo-bp-ov-badge {
  width: 44px; height: 44px; border-radius: 12px;
  background: #eef4ff;
  display: inline-flex; align-items: center; justify-content: center;
}
.psoo-bp-ov-head h4 {
  margin: 0; font-size: 20px; line-height: 24px; font-weight: 900; color: #101828;
  letter-spacing: -0.01em;
}
.psoo-bp-ov-actions { margin-left: auto; display: flex; gap: 8px; }
.psoo-bp-ov-actions .button.button-primary {
  --btn-bg: #2b59ff;
  --btn-bg-hover: #234be0;
  border-radius: 10px !important;
  background: var(--btn-bg) !important;
  border-color: var(--btn-bg) !important;
  color: #fff !important;
  padding: 10px 14px !important;
  font-weight: 900 !important;
  box-shadow: 0 8px 20px rgba(43,89,255,.22) !important;
  transition: transform .06s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
.psoo-bp-ov-actions .button.button-primary:hover {
  background: var(--btn-bg-hover) !important;
  border-color: var(--btn-bg-hover) !important;
  box-shadow: 0 10px 24px rgba(35,75,224,.26) !important;
  transform: translateY(-1px);
}

/* Items table inside inline card */
.psoo-bp-order-items {
  width: 100%;
  border-collapse: separate; border-spacing: 0;
  background: #ffffff;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
  overflow: hidden;
}
.psoo-bp-order-items thead tr { background: #f2f4f7; }
.psoo-bp-order-items thead th {
  color: #101828;
  padding: 16px 18px;
  font-weight: 800;
  border-bottom: 1px solid #e4e7ec;
}
.psoo-bp-order-items tbody td {
  padding: 18px;
  border-bottom: 1px solid #eef0f6;
  vertical-align: top;
  color: #182230;
}
.psoo-bp-order-items tbody tr:last-child td { border-bottom: 0; }

/* Default Qty/Total column widths */
.psoo-col-qty   { width: 100px; text-align: center; font-weight: 800; color: #101828; }
.psoo-col-total { width: 200px; text-align: right;  font-weight: 900; color: #101828; }

/* =========================
   ROW 1: Title | Qty | Total
   ========================= */

/* Give the entire top row a darker background */
.psoo-bp-order-items tbody tr.psoo-item-top td {
  background: #f3f4f6 !important;   /* clearly darker */
}

/* Keep a distinct hover just for the top row */
.psoo-bp-order-items tbody tr.psoo-item-top:hover td {
  background: #e9ebef !important;
}

/* Product title: header-like, and more vertical padding */
.psoo-bp-order-items tbody tr.psoo-item-top td.psoo-prod-title {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  padding-left: 24px !important;
  padding-right: 12px !important;
}
.psoo-bp-order-items tbody tr.psoo-item-top td.psoo-prod-title .psoo-item-title a {
  color: #0f172a !important;
  text-decoration: none;
  font-weight: 900 !important;
  font-size: 20px !important;
  line-height: 1.25;
  letter-spacing: -0.01em;
  display: inline-block;
}
.psoo-bp-order-items tbody tr.psoo-item-top td.psoo-prod-title .psoo-item-title a:hover {
  text-decoration: underline;
}

/* Center Qty & Total + make them larger (override right-align) */
.psoo-bp-order-items tbody tr.psoo-item-top td.psoo-col-qty,
.psoo-bp-order-items tbody tr.psoo-item-top td.psoo-col-total {
  text-align: center !important;   /* override previous right-align */
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  vertical-align: middle !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

/* =========================
   ROW 2: Description | Image
   ========================= */

.psoo-bp-order-items tbody tr.psoo-item-bottom td {
  background: #fcfdff;
  vertical-align: middle !important;  /* ensure middle baseline for both cells */
}

/* Description side (left, spans 2 cols): center vertically & add horizontal padding */
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-desc {
  padding: 0 24px !important;         /* left/right padding visible */
}
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-desc .psoo-item-desc {
  display: flex;
  align-items: center;                 /* vertical center */
  min-height: 120px;                   /* matches image min height */
  color: #344054;
  font-size: 14px;
  line-height: 1.6;
}

/* Image side — fixed visual column, centered both axes */
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-media {
  width: 240px;
  padding: 0 !important;
}
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-media .psoo-media-box {
  display: flex;
  align-items: center;                 /* vertical center */
  justify-content: center;             /* horizontal center */
  height: 100%;
  min-height: 120px;                   /* balances with text column */
  padding: 8px;
}
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-media .psoo-media-link { display: inline-flex; }
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-media .psoo-prod-thumb {
  display: block;
  max-width: 100%;
  max-height: 320px;
  border-radius: 14px;
  object-fit: cover;
}
.psoo-bp-order-items tbody tr.psoo-item-bottom td.psoo-prod-media .psoo-thumb-fallback {
  width: 100%;
  height: 120px;
  background: #eef2ff;
  border-radius: 14px;
}

/* Totals block */
.psoo-bp-totals { margin-top: 16px; display: grid; gap: 8px; }
.psoo-bp-total-row { display: flex; align-items: center; justify-content: space-between; }
.psoo-bp-total-row span { color: #475467; }
.psoo-bp-total-row strong { color: #0f172a; }

/* Customer note block */
.psoo-bp-note {
  margin-top: 16px;
  background: #fff7e6;
  border: 1px solid #ffe0b3;
  border-radius: 12px;
  padding: 12px 14px;
}
.psoo-bp-note-head { font-weight: 900; color: #7a3a00; margin-bottom: 6px; }
.psoo-bp-note-body { color: #5a2f00; }

/* Focus ring */
.psoo-bp-wrapper .button:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(17, 24, 39, .22);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .psoo-bp-table .button.psoo-bp-view,
  .psoo-bp-ov-actions .button.button-primary {
    transition: none;
  }
}