/*Profile pages Content*/


.dfp-profile-wrapper {
  background: #f4f6fb;
  padding: 30px 0;
}


.dfp-profile-sidebar {
  position: sticky;
  top: 50px;
}

.dfp-profile-sidebar a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 15px;
  margin-bottom: 10px;
  background: #fff;
  border-radius: 8px;
  color: #000;
  text-decoration: none;
  font-weight: 600;
  transition: 0.2s;
    font-size: 14px;
}

.dfp-profile-sidebar a:hover {
  background: #7868F0;
    color: #fff;
}

.dfp-profile-sidebar a.dfp-profile-active {
  background: #7868F0;
  color: #fff;
}


.dfp-profile-content {
  background: #fff;
  border-radius: 14px;
  padding: 5px;
}

/* Page heading */
.dfp-profile-title {
  font-size: 22px;
  font-weight: 700;
  color: #2c2c2c;
}

.dfp-profile-subtitle {
  color: #6c757d;
  font-size: 14px;
  margin-bottom: 25px;
}

/* =========================
   KYC SECTIONS
========================= */

.dfp-profile-card {
  border: 1px solid #e5e7f1;
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 25px;
}

.dfp-profile-card h5 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #7868F0;
}

/* Inputs */
.dfp-profile-input,
.dfp-profile-select {
  border-radius: 30px;
  border: 2px solid #d6dbff;
  padding: 10px 18px;
}

.dfp-profile-input:focus,
.dfp-profile-select:focus {
  border-color: #3f51b5;
  box-shadow: none;
}

/* =========================
   DOCUMENT UPLOAD ROW
========================= */

.dfp-profile-doc-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.dfp-profile-upload-box {
  flex: 1;
  border: 2px dashed #d6dbff;
  border-radius: 30px;
  padding: 8px 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
}

.dfp-profile-status {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 20px;
}

.dfp-profile-pending {
  background: #fff3cd;
  color: #856404;
}

.dfp-profile-uploaded {
  background: #d1e7dd;
  color: #0f5132;
}

.dfp-profile-check input {
  margin-right: 6px;
}
/* Upload clickable */
.dfp-profile-upload-box {
  position: relative;
  cursor: pointer;
}

.dfp-profile-file-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

/* =========================
   SUBMIT
========================= */

.dfp-profile-submit {
  background: #7868F0;
  color: #fff;
  border-radius: 30px;
  padding: 12px 45px;
  border: none;
  font-weight: 600;
}

.dfp-profile-submit:hover {
  background: #2c3aa8;
}

/* Mobile bar */
.dfp-profile-mobile-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  padding: 12px 15px;
  border-radius: 10px;
  margin-bottom: 15px;
  font-weight: 600;
}

.dfp-profile-menu-btn {
  font-size: 22px;
  background: none;
  border: none;
  cursor: pointer;
}

/* Overlay */
.dfp-profile-mobile-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  display: none;
  z-index: 9998;
}

/* Mobile menu */
.dfp-profile-mobile-menu {
  position: fixed;
  top: 0;
  left: -280px;
  width: 280px;
  height: 100%;
  background: #f4f6fb;
  padding: 20px;
  transition: 0.3s ease;
  z-index: 9999;
}

/* Header */
.dfp-profile-mobile-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
  margin-bottom: 20px;
}

.dfp-profile-mobile-header button {
  background: none;
  border: none;
  font-size: 20px;
  cursor: pointer;
}

/* Active states */
.dfp-profile-menu-open .dfp-profile-mobile-menu {
  left: 0;
}

.dfp-profile-menu-open .dfp-profile-mobile-overlay {
  display: block;
}

.dfp-profile-mobile-bar {
/*
  display: flex;
  align-items: center;
  justify-content: space-between;
*/
  background: var(--accent-2);
  padding: 12px 16px;
  border-radius: 0px;
  margin-bottom: 15px;
  font-weight: 600;
    color: #FFF;
}

.dfp-profile-menu-btn {
  font-size: 22px;
  background: none;
  border: none;
  cursor: pointer;
    color: #FFF;
}

.dfp-profile-page-title {
  font-size: 15px;
  font-weight: 600;
  color: #FFF;
}


/* Overlay */
.dfp-profile-mobile-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease;
  z-index: 9998;
}

/* Mobile menu */
.dfp-profile-mobile-menu {
  position: fixed;
  top: 0;
  left: -280px;
  width: 280px;
  height: 100%;
  background: #f4f6fb;
  padding: 20px;
  transition: 0.3s ease;
  z-index: 9999;
}

/* Active states */
.dfp-profile-menu-open .dfp-profile-mobile-menu {
  left: 0;
}

.dfp-profile-menu-open .dfp-profile-mobile-overlay {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 1023px) {
    
    .dfp-profile-doc-row{
        flex-wrap: wrap;
    }

    .dfp-profile-upload-box{
        width: 100%;
        flex: auto;
    }
    
    .dfp-profile-wrapper{
        padding: 0px;
    }

}

/*
.dfp-profile-password-box{
    width: 96%;
    max-width: 440px;
    margin-left: auto;
    margin-right: auto;
}
*/
    
/*
.profile-wrapper{
    max-width:1000px;
    margin:auto;
    margin-top:40px;
}
*/
.profile-card{
    background:#fff;
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,.06);
    padding:30px;
    margin-bottom: 15px;
    position: sticky;
    top: 0px;
    z-index: 9;
}

.profile-card.sticky-active{
    padding: 12px 30px;
    border-radius: 0 0 16px 16px;
    box-shadow: 0 8px 20px rgba(0,0,0,.12);
    transition: all .25s ease;
}

.avatar{
    width:60px;
    height:60px;
    border-radius:50%;
    background:linear-gradient(135deg,#4f46e5,#6366f1);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    font-weight:bold;
    font-size:22px;
}

.profile-card.sticky-active .avatar{
    width:60px;
    height:60px;
    font-size:22px;
}


.profileFormcontainer{
    background:#fff;
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,.06);
    padding:30px;
}



.form-floating>.form-control{
    border-radius:10px;
}
.readonly{
    background:#f4f6f9;
    border:none;
}

.p-section-title{
    border-bottom:1px solid #eee;
    margin-bottom:15px;
    padding-bottom:8px;
    font-weight:600;
}

.p-section{
    margin-bottom: 40px;
}

.p-section .form-control,
.p-section .form-select{
    background: var(--light-background);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 14px;
    color: var(--primary-text);
    transition: all .25s ease;
    box-shadow: none;
}

/* Placeholder */
.p-section .form-control::placeholder{
    color: var(--placeholder);
}

/* Hover */
.p-section .form-control:hover,
.p-section .form-select:hover{
    border-color: var(--accent-blue-light);
}

/* Focus */
.p-section .form-control:focus,
.p-section .form-select:focus{
    background: var(--color-white);
    border-color: var(--accent-2);
    box-shadow: 0 0 0 3px rgba(74,163,240,.15);
    outline: none;
}

/* Readonly style */
.p-section .form-control[readonly],
.p-section .form-select:disabled{
    background: #f1f4f8;
    color: var(--secondary-text);
    border: 1px dashed var(--border);
}

/* When in edit mode */
.p-section.edit-mode .form-control,
.p-section.edit-mode .form-select{
    background: var(--color-white);
    border: 1px solid var(--accent-blue-light);
}

/* Floating label compatibility */
.p-section .form-floating > .form-control:focus ~ label,
.p-section .form-floating > .form-control:not(:placeholder-shown) ~ label,
.p-section .form-floating > .form-select ~ label{
    color: var(--accent-blue-dark);
}

/* Invalid / error */
.p-section .form-control.is-invalid{
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239,68,68,.15);
}
.form-floating>.form-control:focus, .form-floating>.form-control:not(:placeholder-shown){
    padding-top: 2rem;
}

.form-floating>label{
    left: 8px;
    font-weight: 700;
}

.p-section .form-select{
        height: 60px;
    padding-top: 27px;
}