.nav-pills .nav-link {
        border-radius: 10px;
        font-size: 0.82rem;
        font-weight: 600;
        color: #545a68;
        padding: 0.5rem 0.9rem;
        background: #f9fafc;
        border: 1.5px solid #eef0f4;
      }
      .nav-pills .nav-link.active {
        background: linear-gradient(135deg, var(--brand-2), var(--brand-3));
        color: #fff;
        border-color: transparent;
      }
      .nav-pills .nav-link i { font-size: 0.9rem; }

      .role-pick {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0.6rem;
      }
      .role-pick input { display: none; }
      .role-pick label {
        border: 1.5px solid #eef0f4;
        border-radius: 12px;
        padding: 0.75rem 0.5rem;
        text-align: center;
        cursor: pointer;
        font-size: 0.8rem;
        font-weight: 600;
        color: #545a68;
        transition: 0.15s;
        background: #f9fafc;
        display: block;
      }
      .role-pick label i {
        display: block;
        font-size: 1.25rem;
        margin-bottom: 0.35rem;
        color: #8b8f9a;
      }
      .role-pick input:checked + label {
        border-color: var(--brand-2);
        background: #fdf6ec;
        color: var(--brand-1);
      }
      .role-pick input:checked + label i { color: var(--brand-2); }
      @media (max-width: 576px) { .role-pick { grid-template-columns: 1fr 1fr; } }

      .perm-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.42rem 0.8rem;
        border: 1.5px solid #eef0f4;
        border-radius: 30px;
        font-size: 0.78rem;
        cursor: pointer;
        background: #f9fafc;
        color: #545a68;
        transition: 0.15s;
      }
      .perm-chip:hover { border-color: var(--brand-3); color: var(--brand-1); }
      .perm-chip input { display: none; }
      .perm-chip:has(input:checked) {
        background: #fdf6ec;
        border-color: var(--brand-2);
        color: var(--brand-1);
        font-weight: 600;
      }

      .status-pick {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.85rem 1rem;
        border: 1.5px solid #eef0f4;
        border-radius: 13px;
        cursor: pointer;
        transition: 0.15s;
        background: #f9fafc;
        flex: 1;
        min-width: 180px;
      }
      .status-pick i { font-size: 1.4rem; color: #8b8f9a; }
      .status-pick b { font-size: 0.88rem; color: #2b2b2b; }
      .status-pick small { font-size: 0.72rem; color: #9aa0ac; }
      .status-pick:hover { border-color: var(--brand-3); }
      input:checked + .status-pick {
        border-color: var(--brand-2);
        background: #fdf6ec;
      }
      input:checked + .status-pick i { color: var(--brand-2); }
      input:checked + .status-pick b { color: var(--brand-1); }
      input:checked + .status-pick.danger {
        border-color: #ef4444;
        background: #fdecec;
      }
      input:checked + .status-pick.danger i { color: #ef4444; }
      input:checked + .status-pick.danger b { color: #b33232; }

      .input-icon-wrap { position: relative; }
      .input-icon-wrap .toggle-pass {
        position: absolute;
        left: 14px;
        top: 50%;
        transform: translateY(-50%);
        color: #a8aab3;
        cursor: pointer;
        font-size: 0.95rem;
      }

      /* User card */
      .uc-avatar {
        width: 96px;
        height: 96px;
        border-radius: 22px;
        object-fit: cover;
        border: 3px solid #fff;
        box-shadow: 0 8px 24px rgba(107, 63, 29, 0.15);
      }
      .uc-avatar-edit {
        position: absolute;
        bottom: -6px;
        left: -6px;
        width: 34px;
        height: 34px;
        border-radius: 11px;
        background: linear-gradient(135deg, var(--brand-2), var(--brand-3));
        color: #fff;
        border: 3px solid #fff;
        display: grid;
        place-items: center;
        cursor: pointer;
        font-size: 0.85rem;
      }
      .uc-meta {
        display: flex;
        flex-direction: column;
        gap: 0.6rem;
        text-align: right;
      }
      .uc-meta > div {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        font-size: 0.82rem;
        color: #545a68;
        padding: 0.5rem 0.75rem;
        background: #f9fafc;
        border-radius: 10px;
      }
      .uc-meta i { color: var(--brand-2); font-size: 0.95rem; }

      .qs-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.6rem 0;
        border-bottom: 1px dashed #f1f2f6;
        font-size: 0.83rem;
      }
      .qs-item:last-child { border-bottom: none; }
      .qs-item span { color: #6b7080; }
      .qs-item span i { color: var(--brand-2); margin-left: 0.35rem; }
      .qs-item b { color: #1f2430; }

      /* Documents */
      .doc-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
      }
      @media (max-width: 768px) { .doc-grid { grid-template-columns: 1fr; } }

      .doc-item {
        display: flex;
        align-items: center;
        gap: 0.85rem;
        padding: 0.85rem 1rem;
        border: 1.5px solid #eef0f4;
        border-radius: 13px;
        background: #f9fafc;
        transition: 0.15s;
        position: relative;
      }
      .doc-item:hover { border-color: var(--brand-3); background: #fff; }
      .doc-item .doc-ico {
        width: 44px;
        height: 44px;
        border-radius: 11px;
        display: grid;
        place-items: center;
        font-size: 1.3rem;
        flex-shrink: 0;
        background: #fff;
        color: var(--brand-2);
      }
      .doc-item.ok .doc-ico { color: #10b981; }
      .doc-item.pending .doc-ico { color: #d99a4e; }
      .doc-item.missing .doc-ico { color: #ef4444; }
      .doc-info { flex: 1; min-width: 0; }
      .doc-info b { font-size: 0.85rem; display: block; color: #1f2430; }
      .doc-info small { font-size: 0.72rem; color: #9aa0ac; }
      .doc-actions { display: flex; gap: 0.25rem; }
      .doc-item > .pill { position: absolute; top: 8px; left: 8px; font-size: 0.65rem; }
/* ===== اصلاح ارتفاع کارت‌ها در این صفحه ===== */
.page > .row {
  align-items: flex-start;   /* ستون‌ها مستقل ارتفاع بگیرند */
}
.page .card-x {
  height: auto;              /* کارت‌ها به اندازه‌ی محتوای خودشان */
}