:root{
  --pc-bg:#fff7f9;
  --pc-bg-soft:#fff0f3;
  --pc-card:#ffffff;
  --pc-card-soft:#fff8fa;
  --pc-line:#f3cbd5;
  --pc-line-strong:#e9aebe;
  --pc-text:#3d2530;
  --pc-muted:#7f6871;
  --pc-primary:#d94f78;
  --pc-primary-dark:#b93c62;
  --pc-primary-soft:#ffe3eb;
  --pc-success:#1f9d6a;
  --pc-success-dark:#15744e;
  --pc-danger:#c53f54;
  --pc-shadow:0 18px 50px rgba(176,68,104,.12);
  --pc-radius-xl:28px;
  --pc-radius-lg:20px;
  --pc-radius-md:15px;
  --pc-radius-sm:11px;
}

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  min-height:100vh;
  font-family:"Tajawal",Tahoma,Arial,sans-serif;
  color:var(--pc-text);
  background:
    radial-gradient(circle at top right,rgba(255,200,216,.48),transparent 31%),
    radial-gradient(circle at bottom left,rgba(220,244,239,.55),transparent 32%),
    linear-gradient(180deg,#fffafb 0%,var(--pc-bg) 100%);
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  cursor:pointer;
}

a{
  color:inherit;
}

[hidden]{
  display:none !important;
}

.pc-container{
  width:min(1180px,calc(100% - 28px));
  margin:0 auto;
}

/* Loading */

.pc-loading{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(255,247,249,.96);
  backdrop-filter:blur(10px);
}

.pc-loading-card{
  min-width:min(360px,100%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:22px;
  border:1px solid var(--pc-line);
  border-radius:20px;
  background:var(--pc-card);
  box-shadow:var(--pc-shadow);
}

.pc-spinner{
  width:30px;
  height:30px;
  border:4px solid var(--pc-primary-soft);
  border-top-color:var(--pc-primary);
  border-radius:50%;
  animation:pcSpin .8s linear infinite;
}

@keyframes pcSpin{
  to{transform:rotate(360deg)}
}

/* Header */

.pc-header{
  position:sticky;
  top:0;
  z-index:1000;
  border-bottom:1px solid rgba(229,168,185,.55);
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(16px);
}

.pc-header-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.pc-brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

.pc-brand-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(145deg,#ffe8ef,#fff);
  border:1px solid var(--pc-line);
  font-size:25px;
  box-shadow:0 10px 24px rgba(194,74,113,.1);
}

.pc-brand strong{
  display:block;
  font-size:1.13rem;
  font-weight:900;
}

.pc-brand small{
  display:block;
  margin-top:2px;
  color:var(--pc-muted);
  font-weight:700;
}

.pc-header-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.pc-vip-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:8px 14px;
  border:1px solid #efbdca;
  border-radius:999px;
  background:#fff3f6;
  color:#9f3155;
  font-weight:900;
}

/* Intro */

.pc-intro{
  padding:44px 0 24px;
  text-align:center;
}

.pc-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 15px;
  border:1px solid var(--pc-line);
  border-radius:999px;
  background:#fff;
  color:var(--pc-primary-dark);
  font-weight:900;
}

.pc-intro h1{
  max-width:850px;
  margin:18px auto 0;
  font-size:clamp(1.8rem,4vw,3rem);
  line-height:1.3;
  font-weight:900;
}

.pc-intro p{
  max-width:760px;
  margin:14px auto 0;
  color:var(--pc-muted);
  line-height:1.9;
  font-size:1.07rem;
  font-weight:600;
}

.pc-progress-card{
  max-width:760px;
  margin:26px auto 0;
  padding:18px;
  border:1px solid var(--pc-line);
  border-radius:18px;
  background:rgba(255,255,255,.88);
  box-shadow:0 12px 30px rgba(180,74,108,.08);
}

.pc-progress-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  color:var(--pc-muted);
  font-weight:800;
}

.pc-progress-head strong{
  color:var(--pc-primary-dark);
  font-size:1.05rem;
}

.pc-progress-track{
  height:12px;
  margin-top:12px;
  overflow:hidden;
  border-radius:999px;
  background:#f8dfe6;
}

.pc-progress-track span{
  display:block;
  width:14%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--pc-primary),#ee7898);
  transition:width .3s ease;
}

/* Wizard */

.pc-wizard-wrap{
  padding-bottom:50px;
}

#profileCompletionForm{
  border:1px solid var(--pc-line);
  border-radius:var(--pc-radius-xl);
  background:rgba(255,255,255,.94);
  box-shadow:var(--pc-shadow);
  overflow:hidden;
}

.pc-step{
  display:none;
  padding:32px;
}

.pc-step.is-active{
  display:block;
  animation:pcFade .25s ease;
}

@keyframes pcFade{
  from{
    opacity:0;
    transform:translateY(8px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.pc-step-head{
  display:flex;
  align-items:flex-start;
  gap:15px;
  margin-bottom:26px;
  padding-bottom:20px;
  border-bottom:1px solid #f4dbe1;
}

.pc-step-number{
  flex:0 0 auto;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:linear-gradient(145deg,var(--pc-primary),#ed7998);
  color:#fff;
  font-size:1.2rem;
  font-weight:900;
  box-shadow:0 10px 24px rgba(217,79,120,.2);
}

.pc-step-head h2{
  margin:0;
  font-size:clamp(1.35rem,3vw,1.85rem);
  font-weight:900;
}

.pc-step-head p{
  margin:6px 0 0;
  color:var(--pc-muted);
  line-height:1.7;
  font-weight:600;
}

/* Grid */

.pc-grid{
  display:grid;
  gap:18px;
}

.pc-grid-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.pc-field-full{
  grid-column:1 / -1;
}

.pc-field{
  min-width:0;
}

.pc-field label,
.pc-label{
  display:block;
  margin-bottom:8px;
  color:#4a2f39;
  font-weight:900;
}

.pc-field label span,
.pc-label span{
  color:var(--pc-danger);
}

.pc-field input,
.pc-field select,
.pc-field textarea{
  width:100%;
  min-height:52px;
  border:1px solid var(--pc-line);
  border-radius:14px;
  background:#fffafb;
  color:var(--pc-text);
  padding:12px 14px;
  outline:none;
  transition:border-color .2s,box-shadow .2s,background .2s;
}

.pc-field textarea{
  min-height:120px;
  resize:vertical;
  line-height:1.8;
}

.pc-field input::placeholder,
.pc-field textarea::placeholder{
  color:#ae949e;
}

.pc-field input:focus,
.pc-field select:focus,
.pc-field textarea:focus{
  border-color:var(--pc-primary);
  background:#fff;
  box-shadow:0 0 0 4px rgba(217,79,120,.1);
}

.pc-field input:invalid:focus,
.pc-field select:invalid:focus,
.pc-field textarea:invalid:focus{
  border-color:var(--pc-danger);
  box-shadow:0 0 0 4px rgba(197,63,84,.09);
}

.pc-help{
  display:block;
  margin-top:8px;
  color:var(--pc-muted);
  line-height:1.7;
  font-weight:600;
}

/* Radio options */

.pc-options{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}

.pc-options label{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  padding:10px 17px;
  border:1px solid var(--pc-line);
  border-radius:13px;
  background:#fffafb;
  cursor:pointer;
  transition:.2s ease;
}

.pc-options label:hover{
  border-color:var(--pc-line-strong);
  background:#fff4f7;
}

.pc-options input{
  width:auto;
  min-height:auto;
  accent-color:var(--pc-primary);
}

.pc-options label:has(input:checked){
  border-color:var(--pc-primary);
  background:var(--pc-primary-soft);
  color:#8f2d4d;
  box-shadow:0 8px 20px rgba(217,79,120,.1);
}

/* Conditional blocks */

.pc-conditional{
  padding:20px;
  border:1px dashed var(--pc-line-strong);
  border-radius:18px;
  background:linear-gradient(145deg,#fff9fb,#fff2f6);
}

/* Check cards */

.pc-check-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.pc-check-card{
  display:block;
  margin:0 !important;
  cursor:pointer;
}

.pc-check-card input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.pc-check-card span{
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:13px;
  border:1px solid var(--pc-line);
  border-radius:15px;
  background:#fffafb;
  text-align:center;
  font-weight:900;
  transition:.2s ease;
}

.pc-check-card:hover span{
  border-color:var(--pc-line-strong);
  transform:translateY(-1px);
}

.pc-check-card input:checked + span{
  border-color:var(--pc-primary);
  background:var(--pc-primary-soft);
  color:#922f50;
  box-shadow:0 9px 22px rgba(217,79,120,.11);
}

/* Visibility */

.pc-visibility-card{
  display:flex !important;
  align-items:flex-start;
  gap:13px;
  margin:0 !important;
  padding:18px;
  border:1px solid #b9dfd2;
  border-radius:17px;
  background:#f1fbf7;
  cursor:pointer;
}

.pc-visibility-card input{
  width:auto;
  min-height:auto;
  margin-top:5px;
  accent-color:var(--pc-success);
}

.pc-visibility-card strong{
  display:block;
  color:#176548;
  font-weight:900;
}

.pc-visibility-card small{
  display:block;
  margin-top:4px;
  color:#5f8174;
  line-height:1.6;
  font-weight:600;
}

/* Navigation */

.pc-navigation{
  display:flex;
  align-items:center;
  gap:12px;
  padding:20px 32px;
  border-top:1px solid var(--pc-line);
  background:#fff8fa;
}

.pc-navigation-spacer{
  flex:1;
}

.pc-btn{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 20px;
  border:0;
  border-radius:13px;
  text-decoration:none;
  font-weight:900;
  transition:.2s ease;
}

.pc-btn:hover{
  transform:translateY(-1px);
}

.pc-btn:disabled{
  cursor:not-allowed;
  opacity:.65;
  transform:none;
}

.pc-btn-light{
  border:1px solid var(--pc-line);
  background:#fff;
  color:#5f424d;
}

.pc-btn-primary{
  background:linear-gradient(135deg,var(--pc-primary),#ec7393);
  color:#fff;
  box-shadow:0 10px 24px rgba(217,79,120,.2);
}

.pc-btn-primary:hover{
  background:linear-gradient(135deg,var(--pc-primary-dark),var(--pc-primary));
}

.pc-btn-success{
  background:linear-gradient(135deg,var(--pc-success),#35b67f);
  color:#fff;
  box-shadow:0 10px 24px rgba(31,157,106,.2);
}

.pc-btn-success:hover{
  background:linear-gradient(135deg,var(--pc-success-dark),var(--pc-success));
}

/* Messages */

.pc-form-message{
  margin:0 32px 24px;
  padding:15px 17px;
  border-radius:14px;
  line-height:1.8;
  font-weight:800;
}

.pc-form-message.is-error{
  border:1px solid #efbac3;
  background:#fff0f2;
  color:#a92f43;
}

.pc-form-message.is-success{
  border:1px solid #b7e3d3;
  background:#effbf6;
  color:#17704d;
}

.pc-field.has-error input,
.pc-field.has-error select,
.pc-field.has-error textarea{
  border-color:var(--pc-danger);
  box-shadow:0 0 0 3px rgba(197,63,84,.08);
}

.pc-field-error{
  display:block;
  margin-top:7px;
  color:var(--pc-danger);
  font-size:.91rem;
  font-weight:800;
}

/* Responsive */

@media(max-width:850px){
  .pc-grid-2{
    grid-template-columns:1fr;
  }

  .pc-field-full{
    grid-column:auto;
  }

  .pc-check-grid{
    grid-template-columns:1fr;
  }

  .pc-step{
    padding:25px 20px;
  }

  .pc-navigation{
    padding:18px 20px;
  }
}

@media(max-width:640px){
  .pc-header-inner{
    min-height:auto;
    padding:12px 0;
    align-items:flex-start;
  }

  .pc-header-actions{
    justify-content:flex-end;
  }

  .pc-vip-badge{
    display:none;
  }

  .pc-brand-icon{
    width:42px;
    height:42px;
    border-radius:13px;
  }

  .pc-intro{
    padding-top:30px;
  }

  .pc-progress-card{
    padding:15px;
  }

  #profileCompletionForm{
    border-radius:20px;
  }

  .pc-step{
    padding:22px 16px;
  }

  .pc-step-head{
    gap:11px;
  }

  .pc-step-number{
    width:42px;
    height:42px;
    border-radius:13px;
  }

  .pc-options{
    align-items:stretch;
  }

  .pc-options label{
    flex:1 1 110px;
  }

  .pc-navigation{
    flex-wrap:wrap;
    padding:16px;
  }

  .pc-navigation-spacer{
    display:none;
  }

  .pc-navigation .pc-btn{
    flex:1 1 130px;
  }

  .pc-form-message{
    margin:0 16px 18px;
  }
}
/* =========================================================
   Profile Photo Upload
========================================================= */

.pc-photo-card {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  margin-bottom: 28px;
  padding: 24px;
  border: 1px solid #efcbd7;
  border-radius: 22px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,239,245,.92));
  box-shadow: 0 14px 34px rgba(126, 39, 72, 0.08);
}

.pc-photo-preview {
  width: 190px;
  height: 190px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 5px solid #ffffff;
  border-radius: 26px;
  background: linear-gradient(135deg, #ffe1eb, #eee8ff);
  box-shadow: 0 14px 28px rgba(111, 36, 68, 0.13);
}

.pc-photo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pc-photo-preview span {
  font-size: 74px;
  opacity: 0.75;
}

.pc-photo-content {
  min-width: 0;
}

.pc-photo-kicker {
  display: inline-block;
  margin-bottom: 6px;
  color: #d72f67;
  font-size: 13px;
  font-weight: 900;
}

.pc-photo-content h3 {
  margin: 0 0 8px;
  font-size: 25px;
  font-weight: 900;
}

.pc-photo-content p {
  max-width: 680px;
  margin: 0;
  color: #735a64;
  line-height: 1.85;
  font-weight: 600;
}

.pc-photo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.pc-photo-select-btn {
  cursor: pointer;
}

.pc-photo-message {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 800;
}

.pc-photo-message.is-success {
  color: #17673a;
  border: 1px solid #b8e2c8;
  background: #eefbf3;
}

.pc-photo-message.is-error {
  color: #a5231b;
  border: 1px solid #f2c2bd;
  background: #fff2f0;
}

.pc-photo-help {
  display: block;
  margin-top: 10px;
  color: #8a6d78;
  line-height: 1.6;
  font-weight: 700;
}

@media (max-width: 760px) {
  .pc-photo-card {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 20px;
    padding: 20px;
    text-align: center;
  }

  .pc-photo-preview {
    width: min(220px, 100%);
    height: auto;
    aspect-ratio: 1 / 1;
  }

  .pc-photo-actions {
    justify-content: center;
  }

  .pc-photo-actions .pc-btn {
    width: 100%;
  }
}



/* =========================================================
   PROFILE OPTIONAL LABELS
   ========================================================= */

.pc-field-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-inline-start: 8px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.4;
  vertical-align: middle;
}

.pc-field-optional {
  color: #5f4a53;
  border: 1px solid #e7d5dc;
  background: #fff8fa;
}

.pc-field-conditional {
  color: #8a5a13;
  border: 1px solid #f2d59b;
  background: #fff9e9;
}

.pc-label-required .pc-field-status {
  display: none;
}

@media (max-width: 640px) {
  .pc-field-status {
    margin-inline-start: 5px;
    padding: 2px 7px;
    font-size: 10px;
  }
}

/* =========================================================
   ZAWAJ VIP — NEW PLATFORM COLORS
   توحيد صفحة ملء البيانات مع لوحة المستخدم
   ========================================================= */

:root {
  --pc-bg: #fdf0f6;
  --pc-bg-soft: #f3edff;
  --pc-card: #fff0f6;
  --pc-card-soft: #e8f8f5;

  --pc-line: rgba(170, 71, 119, 0.20);
  --pc-line-strong: rgba(125, 88, 211, 0.38);

  --pc-text: #432535;
  --pc-muted: #735b69;

  --pc-primary: #c62e68;
  --pc-primary-dark: #971f50;
  --pc-primary-soft: #fbdce8;

  --pc-success: #168b7d;
  --pc-success-dark: #096b62;

  --pc-danger: #be3651;

  --pc-shadow:
    0 22px 55px rgba(101, 45, 78, 0.13);
}

/* خلفية الصفحة */

body {
  background:
    radial-gradient(
      circle at 92% 7%,
      rgba(234, 91, 151, 0.19),
      transparent 31%
    ),
    radial-gradient(
      circle at 8% 47%,
      rgba(127, 96, 218, 0.16),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #ffeaf3 0%,
      #f1ebff 52%,
      #e1f7f3 100%
    ) !important;
}

/* شاشة التحميل */

.pc-loading {
  background:
    linear-gradient(
      145deg,
      rgba(255, 234, 243, 0.96),
      rgba(240, 234, 255, 0.96),
      rgba(224, 247, 243, 0.96)
    ) !important;
}

.pc-loading-card {
  border: 2px solid var(--pc-line) !important;
  background:
    linear-gradient(
      135deg,
      #ffe6f0,
      #eee8ff,
      #ddf6f1
    ) !important;
}

/* الهيدر */

.pc-header {
  border-bottom:
    2px solid rgba(159, 31, 80, 0.14) !important;

  background:
    linear-gradient(
      90deg,
      rgba(255, 222, 235, 0.96),
      rgba(237, 230, 255, 0.96),
      rgba(218, 246, 241, 0.96)
    ) !important;
}

.pc-brand-icon {
  border: 2px solid rgba(150, 65, 113, 0.15) !important;

  background:
    linear-gradient(
      135deg,
      #ffdce9,
      #e8e1ff,
      #dff5f1
    ) !important;
}

.pc-brand strong {
  color: #8f214d !important;
}

.pc-brand small {
  color: #705866 !important;
}

.pc-vip-badge {
  color: #754d00 !important;
  border-color: rgba(199, 146, 18, 0.30) !important;

  background:
    linear-gradient(
      135deg,
      #fff2bd,
      #ffe2a6
    ) !important;
}

/* المقدمة */

.pc-kicker {
  color: #7a3f9e !important;
  border: 2px solid rgba(119, 83, 203, 0.20) !important;

  background:
    linear-gradient(
      135deg,
      #eee8ff,
      #e6f8f4
    ) !important;
}

.pc-intro h1 {
  color: #90214e !important;
}

.pc-intro p {
  color: #705765 !important;
}

/* التقدم */

.pc-progress-card {
  border: 2px solid var(--pc-line) !important;

  background:
    linear-gradient(
      135deg,
      #ffe8f1,
      #eee9ff,
      #e3f8f4
    ) !important;
}

.pc-progress-track {
  background: #eadffc !important;
}

.pc-progress-track span {
  background:
    linear-gradient(
      90deg,
      #bd2863,
      #d94b83,
      #765bd0
    ) !important;
}

/* الصندوق الرئيسي والخطوات */

#profileCompletionForm {
  border: 2px solid var(--pc-line) !important;

  background:
    linear-gradient(
      145deg,
      rgba(255, 232, 241, 0.97),
      rgba(240, 234, 255, 0.97),
      rgba(225, 248, 244, 0.97)
    ) !important;
}

.pc-step {
  background:
    linear-gradient(
      145deg,
      rgba(255, 237, 244, 0.72),
      rgba(239, 235, 255, 0.72),
      rgba(226, 248, 244, 0.72)
    ) !important;
}

.pc-step-head {
  border-bottom:
    2px solid rgba(150, 66, 113, 0.13) !important;
}

.pc-step-number {
  background:
    linear-gradient(
      135deg,
      #a92359,
      #df417c,
      #795dd1
    ) !important;
}

.pc-step-head h2 {
  color: #85234d !important;
}

.pc-step-head p {
  color: #735c68 !important;
}

/* الصورة الشخصية */

.pc-photo-card {
  border: 2px solid rgba(143, 69, 121, 0.17) !important;

  background:
    linear-gradient(
      135deg,
      #ffe4ef,
      #eee7ff,
      #def7f2
    ) !important;
}

.pc-photo-preview {
  background:
    linear-gradient(
      135deg,
      #ffd6e6,
      #e5ddff,
      #d9f4ee
    ) !important;
}

.pc-photo-kicker {
  color: #a91f58 !important;
}

/* الحقول */

.pc-field label,
.pc-label {
  color: #593047 !important;
}

.pc-field input,
.pc-field select,
.pc-field textarea {
  border: 2px solid rgba(158, 58, 109, 0.19) !important;

  color: #402333 !important;

  background:
    linear-gradient(
      135deg,
      #fff1f6,
      #f6f1ff
    ) !important;
}

.pc-field input:focus,
.pc-field select:focus,
.pc-field textarea:focus {
  border-color: #7055c8 !important;

  background:
    linear-gradient(
      135deg,
      #fff5f8,
      #f1edff,
      #eaf9f6
    ) !important;

  box-shadow:
    0 0 0 5px
    rgba(112, 85, 200, 0.11) !important;
}

/* الخيارات */

.pc-options label {
  border: 2px solid rgba(153, 64, 112, 0.16) !important;

  background:
    linear-gradient(
      135deg,
      #ffeef4,
      #f1edff
    ) !important;
}

.pc-options label:hover {
  border-color: #8063d2 !important;
  background: #ece6ff !important;
}

.pc-options label:has(input:checked) {
  color: #633a9a !important;
  border-color: #765bd0 !important;

  background:
    linear-gradient(
      135deg,
      #eadfff,
      #dff7f2
    ) !important;
}

/* البطاقات الشرطية */

.pc-conditional {
  border: 2px dashed rgba(122, 87, 202, 0.31) !important;

  background:
    linear-gradient(
      145deg,
      #ffe9f2,
      #eee8ff,
      #e5f8f4
    ) !important;
}

.pc-check-card span {
  border: 2px solid rgba(150, 65, 111, 0.16) !important;

  background:
    linear-gradient(
      135deg,
      #ffedf4,
      #f0ebff
    ) !important;
}

.pc-check-card input:checked + span {
  color: #63369a !important;
  border-color: #7358cb !important;

  background:
    linear-gradient(
      135deg,
      #e9dfff,
      #dcf6f1
    ) !important;
}

/* ظهور الملف */

.pc-visibility-card {
  border: 2px solid rgba(20, 137, 124, 0.24) !important;

  background:
    linear-gradient(
      135deg,
      #ddf7f1,
      #e9f9f6
    ) !important;
}

/* أزرار التنقل */

.pc-navigation {
  border-top:
    2px solid rgba(146, 60, 107, 0.14) !important;

  background:
    linear-gradient(
      90deg,
      #ffe4ef,
      #eee8ff,
      #ddf6f1
    ) !important;
}

.pc-btn-light {
  color: #553044 !important;
  border: 2px solid rgba(148, 59, 106, 0.17) !important;

  background:
    linear-gradient(
      135deg,
      #ffeef4,
      #eeeaff
    ) !important;
}

.pc-btn-primary {
  background:
    linear-gradient(
      135deg,
      #9f2456,
      #dc3e79,
      #765bd0
    ) !important;
}

.pc-btn-success {
  background:
    linear-gradient(
      135deg,
      #08766b,
      #1a9e8d
    ) !important;
}

/* الشارات الصغيرة */

.pc-field-optional {
  color: #64468d !important;
  border-color: rgba(113, 84, 198, 0.22) !important;
  background: #ebe5ff !important;
}

.pc-field-conditional {
  color: #8a5710 !important;
  border-color: rgba(219, 162, 38, 0.28) !important;
  background: #fff0c9 !important;
}

/* الموبايل */

@media (max-width: 640px) {
  body {
    background:
      linear-gradient(
        160deg,
        #ffeaf3,
        #f0eaff,
        #dff6f1
      ) !important;
  }

  .pc-header {
    position: relative !important;
  }

  #profileCompletionForm {
    border-radius: 23px !important;
  }
}

