.wcpec-hr-wrap { max-width: 1100px; margin: 15px auto; padding: 10px; direction: rtl; text-align: right; }
.wcpec-hr-card { background:#fff; border:1px solid #e7e7e7; border-radius:14px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.wcpec-hr-head { background:#3e95a7; color:#fff; padding:12px 18px; font-weight:800; text-align:center; }

/* ===== Stepper ===== */
.wcpec-hr-stepsbar { display:flex; align-items:center; justify-content:center; gap:10px; padding:18px 12px; flex-wrap:wrap; }
.wcpec-hr-stepsbar .step { display:flex; align-items:center; gap:8px; opacity:.55; }
.wcpec-hr-stepsbar .step.active { opacity:1; }
.wcpec-hr-stepsbar .step.done { opacity:1; }
.wcpec-hr-stepsbar .step span { width:28px; height:28px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#3e95a7; color:#fff; font-weight:800; }
.wcpec-hr-stepsbar .step.done span { background:#1dbf73; }
.wcpec-hr-stepsbar .step.active span { box-shadow:0 0 0 4px rgba(62,149,167,.15); }
.wcpec-hr-stepsbar .line { width:60px; height:2px; background:#ddd; }
.wcpec-hr-stepsbar .line.done { background:#1dbf73; }

/* تنبيه داخل شريط الخطوات */
.wcpec-steps-note{
  width:100%;
  margin:0 0 10px 0;
  padding:10px 12px;
  border:1px solid rgba(15, 118, 110, .18);
  background:rgba(16, 185, 129, .08);
  border-radius:12px;
  font-size:13px;
  color:#064e3b;
}
.wcpec-steps-note b{font-weight:800;}

/* ===== Form layout ===== */
.wcpec-hr-form { padding: 10px 18px 18px; }
.wcpec-step { display:none; }
.wcpec-step.active { display:block; }

.wcpec-field { margin:12px 0; }
.wcpec-field label { display:block; font-weight:800; margin-bottom:6px; }
.wcpec-field input,
.wcpec-field textarea,
.wcpec-field select {
  width:100%;
  border:1px solid #ddd;
  border-radius:10px;
  padding:10px;
  outline:none;
  box-sizing:border-box;
  font-size:14px;
}
.wcpec-field textarea{ resize:vertical; min-height:120px; }

.wcpec-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width: 768px){
  .wcpec-grid { grid-template-columns:1fr; }
  .wcpec-hr-stepsbar .line{display:none;}
}

.req { color:#d00; }

.hint{ color:#666; font-size:12.5px; }

/* ===== Buttons ===== */
.wcpec-actions {
  display:flex;
  gap:10px;
  justify-content:flex-start;
  margin-top:15px;
  flex-wrap:wrap;
}
.btn { border:0; border-radius:10px; padding:10px 16px; cursor:pointer; font-weight:800; }
.btn.primary { background:#3e95a7; color:#fff; }
.btn.secondary { background:#f0f2f4; color:#333; }
.btn.success { background:#1dbf73; color:#fff; }
.btn:disabled { opacity:.6; cursor:not-allowed; }
@media (max-width: 768px){
  .btn{ width:100%; }
}

/* ===== Checkboxes ===== */
.chk { display:flex; gap:10px; align-items:flex-start; font-weight:800; }
.chk input { margin-top:4px; }

/* ===== Result/Status ===== */
.wcpec-done h3 { margin:0 0 8px; }
.wcpec-result {
  margin-top:10px;
  padding:10px;
  border-radius:10px;
  border:1px solid #ddd;
  line-height:1.8;
}
.wcpec-result.ok { background:#f0fff7; border-color:#bfead3; }
.wcpec-result.danger { background:#fff5f5; border-color:#f2c2c2; }
.wcpec-result.warn { background:#fffceb; border-color:#f1e3a6; }
.wcpec-result.info { background:#f3f8ff; border-color:#c9dcff; }

.wcpec-status {
  padding:12px;
  border-radius:12px;
  border:1px solid #ddd;
  margin:10px 0;
  line-height:1.8;
}
.wcpec-status.ok { background:#f0fff7; border-color:#bfead3; }
.wcpec-status.warn { background:#fffceb; border-color:#f1e3a6; }
.wcpec-status.danger { background:#fff5f5; border-color:#f2c2c2; }
.wcpec-status.info { background:#f3f8ff; border-color:#c9dcff; }

.wcpec-kv { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:10px 0; }
.wcpec-kv > div { border:1px solid #eee; border-radius:12px; padding:10px; background:#fff; }
.wcpec-kv span { display:block; color:#666; font-size:12px; margin-bottom:6px; }
.wcpec-kv b { font-size:14px; }
@media (max-width: 768px){ .wcpec-kv { grid-template-columns:1fr; } }

.wcpec-note {
  margin-top:10px;
  border:1px solid #eee;
  border-radius:12px;
  padding:10px;
  background:#fafafa;
  line-height:1.9;
}
.wcpec-mini { margin-top:10px; color:#555; line-height:1.8; }

/* ===== Alerts + Boxes ===== */
.wcpec-alert {
  margin: 10px 0;
  border-radius: 12px;
  padding: 12px;
  border: 1px solid #eee;
  line-height: 1.9;
  font-size: 14px;
}
.wcpec-alert.warn { background:#fffceb; border-color:#f1e3a6; }
.wcpec-alert.info { background:#f3f8ff; border-color:#c9dcff; }
.wcpec-alert.danger { background:#fff5f5; border-color:#f2c2c2; }

.wcpec-box {
  border: 1px solid #eee;
  background: #fcfcfc;
  border-radius: 12px;
  padding: 12px;
  line-height: 1.9;
  margin-bottom: 12px;
}

.wcpec-scroll {
  max-height: 280px;
  overflow: auto;
  padding: 10px;
  border-radius: 12px;
  border: 1px dashed #cfe7ec;
  background: #f7fbfc;
}

input[readonly]{
  background:#f7f8fa;
  cursor:not-allowed;
  opacity:0.98;
}

/* ===== Ultimate Member inside box ===== */
.wcpec-box .um { margin: 0 !important; padding: 0 !important; }
.wcpec-box .um form { margin: 0 !important; }
.wcpec-box .um-field { margin-bottom: 8px !important; }
.wcpec-box .um-field-label { font-size: 13px; margin-bottom: 4px; }
.wcpec-box .um input[type="text"],
.wcpec-box .um input[type="password"],
.wcpec-box .um input[type="email"] {
  border-radius: 8px !important;
  padding: 8px 10px !important;
  font-size: 13px;
}
.wcpec-box .um-button,
.wcpec-box .um-button:hover { border-radius: 8px !important; font-weight: 800; }
.wcpec-box .um-row { margin-bottom: 6px !important; }
.wcpec-box .um-notice { margin: 6px 0 !important; border-radius: 8px; font-size: 13px; }
.wcpec-step .wcpec-box:first-child { margin-top: 0 !important; }

/* ===== Phone Split + Country Code Picker ===== */
.wcpec-phone-split{display:flex; gap:10px; align-items:flex-start;}
.wcpec-phone{flex:1; min-width:220px;}
@media(max-width:768px){ .wcpec-phone-split{flex-direction:column;} .wcpec-phone{min-width:100%;} }

.wcpec-cc-picker{position:relative; width:210px; max-width:48%;}
.wcpec-cc-btn{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  font-weight:800;
}
.wcpec-cc-btn .cc-label{font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.wcpec-cc-btn .cc-arrow{opacity:.7;}

.wcpec-cc-panel{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  left:0;
  z-index:9999;
  background:#fff;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  box-shadow:0 14px 40px rgba(0,0,0,.12);
  overflow:hidden;
}
.wcpec-cc-search-row{padding:10px 10px 0 10px;}
.wcpec-cc-search{
  width:100%;
  padding:8px 10px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:10px;
  outline:none;
  font-size:12.5px;
}
.wcpec-cc-list{max-height:260px; overflow:auto; padding:8px;}
.wcpec-cc-item{display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:10px; cursor:pointer; user-select:none;}
.wcpec-cc-item:hover{background:rgba(0,0,0,.04);}
.cc-flag{width:22px; text-align:center; font-size:16px;}
.cc-name{flex:1; font-size:13px;}
.cc-code{font-weight:900; font-size:12.5px; opacity:.8;}

/* ===== Loading state (AJAX) ===== */
.wcpec-loading{
  position:relative;
  pointer-events:none;
  opacity:.92;
}
.wcpec-loading:after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(255,255,255,.55);
}