.customer-profile-page { max-width: 480px; margin: 0 auto; padding: var(--space-3); }
.dashboard-page-title { font-size: 1.4rem; font-weight: 800; margin-bottom: var(--space-4); }

/* ── Picture-Row ── */
.profile-picture-row {
    display: flex; align-items: center; gap: var(--space-3);
    margin-bottom: var(--space-5); padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--color-border);
}
.profile-avatar {
    position: relative; width: 72px; height: 72px; border-radius: 12px;
    background: var(--color-primary-light); color: var(--color-primary);
    font-size: 1.8rem; font-weight: 700; border: none; cursor: pointer;
    display: flex; align-items: center; justify-content: center; overflow: hidden; flex-shrink: 0;
}
.profile-avatar__img {border-radius: 12px; width: 100%; height: 100%; object-fit: cover; }
.profile-avatar__edit-badge {
    position: absolute; bottom: 0; right: 0; width: 24px; height: 24px; border-radius: 50%;
    background: var(--color-primary); color: #fff; display: flex; align-items: center; justify-content: center;
    border: 2px solid var(--color-bg);
}
.profile-avatar--uploading { opacity: 0.5; pointer-events: none; }

.profile-picture-actions { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.profile-picture-actions .btn-link { font-size: var(--font-size-sm); font-weight: 600; }
.btn-link--danger { color: var(--color-error); }

/* ── Form ── */
.profile-form { display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-4); }

.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field-row { display: flex; gap: var(--space-3); }
.form-field-row .form-field { flex: 1; min-width: 0; }

.form-label { font-size: var(--font-size-sm); font-weight: 600; color: var(--color-text); }

.form-input {
    width: 100%; padding: 10px 12px; border: 1.5px solid var(--color-border); border-radius: var(--radius);
    font-size: var(--font-size-sm); font-family: inherit; color: var(--color-text);
    background: var(--color-bg); transition: border-color 0.15s ease;
}
.form-input:focus { outline: none; border-color: var(--color-primary); }
.form-input:disabled { background: var(--color-bg-alt); color: var(--color-text-secondary); }
.form-input::placeholder { color: var(--color-text-secondary); }
textarea.form-input { resize: vertical; }

#save-profile-btn { margin-top: var(--space-1); }

/* ── Location-Card ── */
.profile-location-card { border: 1px solid var(--color-border); border-radius: var(--radius); padding: var(--space-3); }
.profile-location-card__header { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); margin-bottom: var(--space-1); }
.profile-location-card__header .btn-link { font-size: var(--font-size-sm); font-weight: 600; white-space: nowrap; }
.profile-location-card__value { font-size: var(--font-size-sm); color: var(--color-text-secondary); }

/* ── Responsive — mobile-এ division/district stack হয়ে যাবে ── */
@media (max-width: 420px) {
    .form-field-row { flex-direction: column; }
}