/* CGS Marketplace — Order Detail (Buyer + Seller) */

:root{
  --cgs-gap: 14px;
  --cgs-border: rgba(0,0,0,.12);
  --cgs-muted: rgba(0,0,0,.65);
}

.cgs-mp-order-detail{
  max-width: 980px;
  margin: 0 auto;
}

.cgs-mp-order-detail.cgs-card{
  border: 1px solid var(--cgs-border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 6px 24px rgba(0,0,0,.08);
}

.cgs-mp-order-detail h3{
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 1.2;
}

.cgs-mp-order-detail h4{
  margin: 18px 0 10px;
  font-size: 16px;
}

.cgs-mp-od-section{
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--cgs-border);
}

.cgs-mp-od-row{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  margin: 6px 0;
}

.cgs-mp-od-k{
  min-width: 150px;
  font-weight: 800;
}

.cgs-mp-od-v{
  color:#111;
}

.cgs-mp-od-muted{
  color: var(--cgs-muted);
}

/* Tables */
.cgs-mp-order-detail .cgs-table{
  width:100%;
  border-collapse:collapse;
  margin-top: 8px;
}

.cgs-mp-order-detail .cgs-table th,
.cgs-mp-order-detail .cgs-table td{
  padding: 10px 8px;
  border-top: 1px solid var(--cgs-border);
  vertical-align: top;
}

.cgs-mp-order-detail .cgs-table th{
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--cgs-muted);
}

.cgs-mp-od-right{ text-align:right; }

/* Mobile */
@media (max-width: 640px){
  .cgs-mp-order-detail.cgs-card{ padding: 12px; border-radius: 14px; }

  .cgs-mp-od-row{ flex-direction: column; gap: 4px; }
  .cgs-mp-od-k{
    min-width:auto;
    font-size: 12px;
    color: var(--cgs-muted);
    text-transform: uppercase;
    letter-spacing: .02em;
  }

  .cgs-mp-order-detail .cgs-table thead{ display:none; }
  .cgs-mp-order-detail .cgs-table tr{
    display:block;
    border-top: 1px solid var(--cgs-border);
    padding: 10px 0;
  }
  .cgs-mp-order-detail .cgs-table td{
    display:flex;
    justify-content:space-between;
    border:0;
    padding: 6px 0;
  }
  .cgs-mp-order-detail .cgs-table td::before{
    content: attr(data-label);
    color: var(--cgs-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .02em;
  }
}


.cgs-mp-order-detail .cgs-button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin: 4px 6px 4px 0;
}

.cgs-mp-order-detail--buyer .cgs-button{
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 999px;
  border: 1px solid #f36527;
  background: #f36527;
  color: #fff;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(243,101,39,.18);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.cgs-mp-order-detail--buyer .cgs-button:hover,
.cgs-mp-order-detail--buyer .cgs-button:focus{
  background: #6f605b;
  border-color: #6f605b;
  color: #fff;
  text-decoration: none;
}

.cgs-mp-order-detail--buyer .cgs-button.cgs-button--secondary{
  background: #fff !important;
  color: #f36527 !important;
  border-color: #f36527 !important;
  box-shadow: none;
}

.cgs-mp-order-detail--buyer .cgs-button.cgs-button--secondary:hover,
.cgs-mp-order-detail--buyer .cgs-button.cgs-button--secondary:focus{
  background: #6f605b !important;
  border-color: #6f605b !important;
  color: #fff !important;
}

@media (max-width:640px){
  .cgs-mp-order-detail .cgs-button{
    width:100%;
    justify-content:center;
  }
}


/* ========== CGS Marketplace — Shared Table 45-style actions (wpDT agnostic) ========== */

:root{
  --cgs-brown:#6f605b;
  --cgs-orange:#f36527;
  --cgs-border: rgba(0,0,0,.16);
}

/* Give any Actions cell breathing room (wpDT renders class column-actions) */
.wpdt-c .wpDataTablesWrapper td.column-actions{
  padding: 10px 12px !important;
  vertical-align: middle !important;
}

/* Wrapper for actions (Table 45 pattern) */
.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-actions-wrap{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:6px !important;
  width:100% !important;
}

/* Base pill button (Table 45 behavior, generalized) */
.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-cart-toggle-row,
.cgs-mp-modal-overlay .cgs-mp-cart-toggle-row{
  appearance:none !important;
  -webkit-appearance:none !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:100% !important;
  max-width:140px !important;
  margin-left:auto !important;
  margin-right:auto !important;

  padding:9px 14px !important;
  border-radius:999px !important;

  font-weight:900 !important;
  font-size:14px !important;
  line-height:1 !important;

  border:1px solid transparent !important;
  box-shadow:0 1px 2px rgba(0,0,0,.10) !important;

  cursor:pointer !important;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .05s ease, opacity .15s ease !important;
}

.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-cart-toggle-row:active,
.cgs-mp-modal-overlay .cgs-mp-cart-toggle-row:active{
  transform: translateY(1px) !important;
}

/* Add state (brown + white) */
.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-cart-toggle-row[data-state="add"],
.cgs-mp-modal-overlay .cgs-mp-cart-toggle-row[data-state="add"]{
  background: var(--cgs-brown) !important;
  color:#fff !important;
}
.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-cart-toggle-row[data-state="add"]:hover,
.cgs-mp-modal-overlay .cgs-mp-cart-toggle-row[data-state="add"]:hover{
  background: var(--cgs-orange) !important;
  color:#fff !important;
}

/* Focus ring */
.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-cart-toggle-row:focus{
  outline:none !important;
}
.wpdt-c .wpDataTablesWrapper td.column-actions .cgs-mp-cart-toggle-row:focus-visible,
.cgs-mp-modal-overlay .cgs-mp-cart-toggle-row:focus-visible{
  outline:3px solid rgba(243,101,39,.45) !important;
  outline-offset:3px !important;
}

/* Modal: keep buttons reasonably sized */
.cgs-mp-modal-overlay .cgs-mp-cart-toggle-row{
  min-width:110px !important;
}


/* Prevent stale iframe flash: show overlay while loading */
#pum-13994.cgs-mp-popup-loading .pum-content{
  position: relative;
}
#pum-13994.cgs-mp-popup-loading .pum-content:before{
  content: "Loading…";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.92);
  font-weight: 800;
  z-index: 10;
}