/* =========================
   EDIT BUTTON
========================= */


#wcfp-customer-alphabet-table .wcfp-customer-detail,
#wcfp-customer-search-table .wcfp-customer-detail,
#wcfp-customer-history-table .wcfp-view-order{
  background-color: #007bff !important;
  color: #fff !important;
  border: none !important;
  cursor: pointer;
}

#wcfp-customer-alphabet-table .wcfp-customer-detail:hover,
#wcfp-customer-search-table .wcfp-customer-detail:hover,
#wcfp-customer-history-table .wcfp-view-order:hover{
  background-color: #0056b3 !important;
}


/* =========================
   CLASS BUTTON
========================= */

#wcfp-customer-alphabet-table .wcfp-customer-class,
#wcfp-customer-search-table .wcfp-customer-class{
  background-color: #4aaed1 !important;
  color: #fff !important;
  border: none !important;
  cursor: pointer;
}

#wcfp-customer-alphabet-table .wcfp-customer-class:hover,
#wcfp-customer-search-table .wcfp-customer-class:hover{
  background-color: #2f95b8 !important;
}


/* =========================
  CHANGE CLASS BUTTON
========================= */

#wcfp-customer-alphabet-table .wcfp-customer-change-class,
#wcfp-customer-search-table .wcfp-customer-change-class{
  background-color: #28a745 !important;
  color: #fff !important;
  border: none !important;
  cursor: pointer;
}

#wcfp-customer-alphabet-table .wcfp-customer-change-class:hover,
#wcfp-customer-search-table .wcfp-customer-change-class:hover{
  background-color: #218838 !important;
}







/* SHIPPING COUNTRY LABEL */
.wcfp-cart-shipping-row label::after{
  content: " *";
  color: #dc3545;
  font-weight: 700;
}

/* SHIPPING SELECT FIELD */
#wcfp-shipping-select{
  width: 380px !important;
  max-width: 100%;
  height: 48px !important;

  padding: 0 45px 0 14px !important;

  border: 1px solid #dcdcdc !important;
  border-radius: 4px !important;

  font-size: 16px !important;
  font-weight: 500;
  color: #000 !important;

  background-color: #fff !important;

  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  /* BLACK DROPDOWN ICON */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;

  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 18px !important;
}

/* FOCUS */
#wcfp-shipping-select:focus{
  border-color: #999 !important;
  outline: none !important;
}








/* ===============================
   Status Buttons
   =============================== */
.status-btn {
  padding: 4px 10px;
  border: none;
  border-radius: 4px;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  font-size: 13px;
  transition: background 0.2s, transform 0.1s;
}
.status-btn:hover { transform: translateY(-1px); }

.status-show { background-color: #28a745; }
.status-hide { background-color: #dc3545; }
.status-unavailable { background-color: #ffc107; color: #000; }
.status-sale-hide { background-color: #17a2b8; }

/* ===============================
   Modal Overlay
   =============================== */
.modal-overlay {
  position: fixed;
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%;
  background: rgba(0,0,0,0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

/* ===============================
   Modal Content
   =============================== */
.modal-content {
  background: #fff;
  padding: 20px;
  border-radius: 8px;
  width: 90%;
  max-width: 400px;
  box-sizing: border-box;
}

/* ===============================
   Dropdown
   =============================== */
.modal-status-dropdown,
#modal-status-select {
  width: 100%; /* full width inside modal */
  padding: 10px;
  border-radius: 6px;
  border: 1px solid #ccc;
  font-size: 14px;
  box-sizing: border-box;
  margin: 15px 0;
  display: block;
}

/* ===============================
   Modal Actions
   =============================== */
.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;  /* spacing between buttons */
}

/* Save Button */
#status-save-btn { 
  background: #0d6efd; 
  color: #fff; 
  padding: 8px 14px; 
  border-radius: 6px; 
  border: none; 
  font-weight: 600; 
  cursor: pointer; 
}
#status-save-btn:hover { 
  background: #0056b3; 
}

/* Cancel Button */
#status-cancel-btn { 
  background: #dc3545; 
  color: #fff; 
  padding: 8px 14px; 
  border-radius: 6px; 
  border: none; 
  font-weight: 600; 
  cursor: pointer; 
}
#status-cancel-btn:hover { 
  background: #c82333; 
}