
/* Customer profile center - Chợ Online */
.profile-page{padding-top:38px;padding-bottom:55px}
.profile-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:25px}
.profile-kicker{font-size:12px;font-weight:900;letter-spacing:1.4px;color:#0784cf}
.profile-heading h1{font-size:30px;font-weight:850;color:#123d65;margin:5px 0}
.profile-heading p{font-size:14px;color:#8093a5;margin:0}
.profile-order-link{border:1px solid #cfe5f6;background:#fff;color:#087dcc;border-radius:11px;padding:11px 15px;text-decoration:none;font-size:13px;font-weight:800}
.profile-order-link span{margin-left:8px}
.profile-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px;align-items:start}
.profile-sidebar{position:sticky;top:115px;display:grid;gap:14px}
.profile-user-card,.profile-menu,.profile-card{background:#fff;border:1px solid #e1ebf4;border-radius:17px;box-shadow:0 8px 28px rgba(18,75,120,.045)}
.profile-user-card{padding:24px 17px;text-align:center;display:flex;align-items:center;flex-direction:column}
.profile-avatar{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#29b7ed,#087dcc);color:#fff;font-size:29px;font-weight:850;overflow:hidden;border:4px solid #e8f5ff;box-shadow:0 5px 15px rgba(8,125,204,.13);margin-bottom:12px}
.profile-avatar img,.account-avatar-img{width:100%;height:100%;object-fit:cover}
.profile-user-card strong{font-size:16px;color:#183f62}
.profile-user-card>span{font-size:12px;color:#8295a7;margin-top:4px;max-width:100%;overflow-wrap:anywhere}
.profile-user-card small{font-size:12px;color:#249568;margin-top:12px}
.profile-user-card small i{display:inline-block;width:6px;height:6px;background:#22b879;border-radius:50%;margin-right:5px}
.profile-menu{padding:9px}
.profile-menu a{display:flex;align-items:center;gap:11px;padding:12px 11px;border-radius:9px;text-decoration:none;color:#5d748a;font-size:13px;font-weight:750}
.profile-menu a span{width:20px;text-align:center;font-size:18px;color:#178bd0}
.profile-menu a:hover,.profile-menu a.active{background:#eaf6ff;color:#087dcc}
.profile-content{display:grid;gap:18px;min-width:0}
.profile-card{padding:24px 26px;scroll-margin-top:110px}
.profile-card-title{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #edf2f7;padding-bottom:16px;margin-bottom:18px}
.profile-card-title h2{font-size:19px;font-weight:850;color:#183f62;margin:0 0 5px}
.profile-card-title p{font-size:12px;color:#8a9aaa;margin:0}
.profile-title-icon{display:grid;place-items:center;width:37px;height:37px;border-radius:11px;background:#eaf6ff;color:#087dcc;font-size:21px}
.profile-avatar-edit{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.profile-avatar-small{width:58px;height:58px;font-size:24px;margin:0;flex:0 0 58px}
.profile-avatar-edit label{display:block;font-size:13px;font-weight:800;color:#284e6e;margin-bottom:5px}
.profile-avatar-edit input{font-size:12px;color:#647b91;max-width:100%}
.profile-avatar-edit small{display:block;color:#9aaaba;font-size:12px;margin-top:4px}
.profile-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.profile-form-grid label{display:block;font-size:12px;font-weight:800;color:#31516e;margin-bottom:6px}
.profile-form-grid .form-control{height:42px;border:1px solid #dce8f2;border-radius:9px;font-size:13px;box-shadow:none}
.profile-form-grid .form-control:focus{border-color:#168fd9;box-shadow:0 0 0 3px rgba(8,125,204,.08)}
.profile-form-grid .form-control:disabled{background:#f3f7fa;color:#8c9bab}
.profile-help{display:block;font-size:12px;color:#9aaaba;margin-top:4px}
.profile-actions{display:flex;justify-content:flex-end;margin-top:16px}
.profile-primary{background:linear-gradient(100deg,#078bd4,#0871bd);color:#fff;border:0;border-radius:9px;padding:10px 17px;font-size:13px;font-weight:850}
.profile-primary:hover{background:#075e9f;color:#fff}
.profile-primary span{margin-left:8px}
.profile-address-list{display:grid;gap:10px}
.profile-address{display:flex;justify-content:space-between;gap:15px;padding:14px;border:1px solid #e8eff5;border-radius:11px}
.profile-address-name{font-size:13px;font-weight:850;color:#244a69}
.profile-address-name span{font-weight:500;color:#72869a;margin-left:8px}
.profile-address-name b{display:inline-block;margin-left:7px;padding:3px 6px;border-radius:4px;background:#e8f6ff;color:#087dcc;font-size:12px}
.profile-address-main p{font-size:12px;color:#7b8fa1;margin:6px 0 0;line-height:1.6}
.profile-address-actions{display:flex;align-items:flex-start;gap:10px;white-space:nowrap}
.profile-address-actions form{margin:0}
.profile-text-btn,.profile-delete-btn{border:0;background:transparent;color:#087dcc;font-size:12px;font-weight:800;padding:3px}
.profile-delete-btn{color:#d45b5b}
.profile-empty-address{display:flex;align-items:center;gap:13px;padding:15px;background:#f7fbff;border-radius:11px}
.profile-empty-address>span{display:grid;place-items:center;width:38px;height:38px;background:#e7f5ff;border-radius:10px;color:#087dcc;font-size:23px}
.profile-empty-address strong{font-size:13px;color:#294d6d}
.profile-empty-address p{font-size:12px;color:#8b9cac;margin:4px 0 0}
.profile-add-address{margin-top:16px;border:1px dashed #b9d9ef;border-radius:11px;padding:13px 15px}
.profile-add-address summary{cursor:pointer;color:#087dcc;font-size:13px;font-weight:850;list-style:none}
.profile-add-address summary::-webkit-details-marker{display:none}
.profile-add-address[open] summary{margin-bottom:15px}
.profile-add-address .profile-form-grid{padding-top:3px}
.profile-add-address .profile-check{display:flex;align-items:center;gap:7px;font-weight:600}
.profile-add-address .profile-check input{accent-color:#087dcc}
.profile-full{grid-column:1/-1}
.account-menu.profile-header-link{text-decoration:none;color:inherit}
.account-avatar-img{width:30px;height:30px;border-radius:50%;border:2px solid #d9efff}
@media(max-width:767px){
 .profile-page{padding-top:24px}
 .profile-heading{align-items:flex-start;flex-direction:column}
 .profile-heading h1{font-size:25px}
 .profile-layout{grid-template-columns:1fr}
 .profile-sidebar{position:static}
 .profile-user-card{flex-direction:row;text-align:left;gap:12px;padding:13px}
 .profile-user-card .profile-avatar{margin:0;width:52px;height:52px;flex:0 0 52px;font-size:22px}
 .profile-user-card>span{margin-left:auto}
 .profile-user-card small{display:none}
 .profile-menu{display:flex;overflow-x:auto;gap:4px;padding:6px}
 .profile-menu a{white-space:nowrap;padding:10px;font-size:12px}
 .profile-menu a span{display:none}
 .profile-card{padding:19px 16px}
}
@media(max-width:480px){
 .profile-form-grid{grid-template-columns:1fr}
 .profile-full{grid-column:1}
 .profile-address{flex-direction:column}
 .profile-address-actions{justify-content:flex-end}
 .profile-heading p{max-width:290px}
}
