.profil-page{
    background:
        radial-gradient(circle at 10% 6%, rgba(0,107,255,.08), transparent 26%),
        radial-gradient(circle at 88% 0%, rgba(255,27,107,.06), transparent 24%),
        #f6f8fc;
}

/* WRAPPER */

.profile-premium{
    width:min(1500px, calc(100% - 64px));
    margin:0 auto;
    padding:24px 0 56px;
}

/* ALERTES */

.profile-alert{
    margin-bottom:16px;
    padding:14px 18px;
    border-radius:16px;
    font-weight:900;
}

.profile-alert--error{
    background:#fff1f2;
    border:1px solid #fecdd3;
    color:#9f1239;
}

.profile-alert--success{
    background:#ecfdf3;
    border:1px solid #bbf7d0;
    color:#166534;
}

/* HERO */

.profile-hero{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    background:#06123a;
    color:#fff;
    box-shadow:0 18px 46px rgba(6,18,58,.22);
}

.profile-hero-bg{
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg, rgba(3,10,34,.98), rgba(3,10,34,.80), rgba(0,107,255,.22)),
        radial-gradient(circle at 12% 10%, rgba(255,27,107,.50), transparent 28%),
        radial-gradient(circle at 78% 8%, rgba(0,107,255,.55), transparent 30%),
        linear-gradient(135deg, #07163f, #130a38 55%, #06123a);
    background-size:cover;
    background-position:center;
}

.profile-hero-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(115deg, transparent 0%, transparent 45%, rgba(255,255,255,.10) 46%, transparent 48%),
        linear-gradient(135deg, transparent 0%, transparent 62%, rgba(0,107,255,.18) 64%, transparent 66%);
    opacity:.75;
}

.profile-hero-inner{
    position:relative;
    z-index:2;
    padding:42px;
    display:grid;
    grid-template-columns:minmax(0, 1fr) 340px;
    gap:34px;
    align-items:center;
}

.profile-hero-main{
    min-width:0;
}

.profile-identity{
    display:flex;
    align-items:center;
    gap:30px;
    min-width:0;
}

/* AVATAR PREMIUM */

.profile-avatar-premium{
    position:relative;
    width:172px;
    height:172px;
    flex:0 0 172px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.profile-avatar-premium__ring{
    position:absolute;
    inset:0;
    border-radius:50%;
    background:conic-gradient(from 180deg, #006BFF, #8b5cf6, #06b6d4, #006BFF);
    box-shadow:0 18px 45px rgba(0,107,255,.25);
}

.profile-avatar-premium__ring::before{
    content:"";
    position:absolute;
    inset:6px;
    border-radius:50%;
    background:#fff;
}

.profile-avatar-premium .profile-avatar{
    position:relative;
    z-index:2;
    width:150px;
    height:150px;
    border-radius:50%;
    overflow:hidden;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 12px 30px rgba(6,18,58,.20);
}

.profile-avatar-premium .profile-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.profile-avatar-premium .profile-avatar span{
    color:#06123a;
    font-size:58px;
    font-weight:900;
}

.profile-avatar-premium__level{
    position:absolute;
    right:4px;
    bottom:8px;
    z-index:5;
    width:46px;
    height:46px;
    border-radius:50%;
    background:#06123a;
    color:#fff;
    border:4px solid #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:17px;
    font-weight:900;
    box-shadow:0 10px 24px rgba(6,18,58,.28);
}

/* IDENTITÉ */

.profile-identity-content{
    min-width:0;
}

.profile-name-line{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.profile-name-line h1{
    margin:0;
    font-size:44px;
    line-height:1.05;
    font-weight:900;
    letter-spacing:-.035em;
}

.profile-edit-icon{
    width:34px;
    height:34px;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    color:#fff;
    cursor:pointer;
    font-weight:900;
}

.profile-edit-icon:hover{
    background:rgba(255,255,255,.20);
}

.profile-identity-content p{
    margin:8px 0 14px;
    color:rgba(255,255,255,.76);
    font-weight:700;
}

.profile-title-zone{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.profile-title-badge,
.profile-anonymous-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.18);
    font-weight:900;
    font-size:13px;
}

.profile-title-badge span{
    width:10px;
    height:10px;
    border-radius:50%;
}

/* XP */

.profile-xp-block{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:22px;
    margin-top:28px;
    margin-left:202px;
}

.profile-level-emblem{
    width:92px;
    height:104px;
    border-radius:24px;
    background:linear-gradient(135deg, #4f46e5, #7c3aed);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.20),
        0 18px 34px rgba(79,70,229,.32);
}

.profile-level-emblem span{
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    color:rgba(255,255,255,.86);
}

.profile-level-emblem strong{
    font-size:42px;
    line-height:1;
    font-weight:900;
}

.profile-xp-main{
    flex:1;
    max-width:620px;
    min-width:0;
}

.profile-xp-label{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}

.profile-xp-label strong{
    font-size:24px;
    font-weight:900;
}

.profile-xp-label span{
    color:rgba(255,255,255,.72);
    font-size:13px;
    font-weight:800;
}

.profile-xp-bar{
    height:16px;
    padding:3px;
    border-radius:999px;
    background:rgba(255,255,255,.14);
}

.profile-xp-bar span{
    display:block;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg, #006BFF, #5b7cff, #8b5cf6);
    box-shadow:0 0 18px rgba(0,107,255,.55);
}

/* CARTES HERO */

.profile-hero-cards{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
}

.profile-hero-card{
    padding:24px;
    border-radius:20px;
    background:rgba(0,0,0,.26);
    border:1px solid rgba(255,255,255,.14);
    backdrop-filter:blur(12px);
}

.profile-hero-card span{
    display:block;
    color:rgba(255,255,255,.76);
    font-size:13px;
    font-weight:900;
    margin-bottom:10px;
}

.profile-hero-card strong{
    display:block;
    font-size:36px;
    line-height:1;
    font-weight:900;
}

.profile-hero-card small{
    display:block;
    margin-top:8px;
    color:rgba(255,255,255,.70);
    font-weight:700;
}

.profile-hero-card.is-green strong{
    color:#22c55e;
}

/* STATS HERO */

.profile-quick-stats{
    position:relative;
    z-index:2;
    padding:20px 42px 28px;
    border-top:1px solid rgba(255,255,255,.10);
    display:grid;
    grid-template-columns:repeat(5, 1fr);
}

.profile-quick-stats div{
    padding:0 22px;
    border-right:1px solid rgba(255,255,255,.10);
}

.profile-quick-stats div:last-child{
    border-right:0;
}

.profile-quick-stats strong{
    display:block;
    font-size:25px;
    font-weight:900;
}

.profile-quick-stats span{
    display:block;
    margin-top:3px;
    color:rgba(255,255,255,.72);
    font-size:13px;
    font-weight:800;
}

/* FORM EDIT */

.profile-edit-form{
    margin-top:18px;
    background:#fff;
    border:1px solid #dce8fb;
    border-radius:22px;
    padding:20px;
    box-shadow:0 10px 28px rgba(6,18,58,.05);
}

.profile-edit-form label{
    display:block;
    color:#06123a;
    font-size:13px;
    font-weight:900;
    margin-bottom:12px;
}

.profile-edit-form input[type="text"]{
    width:100%;
    height:42px;
    margin-top:7px;
    border:1px solid #dce8fb;
    border-radius:12px;
    padding:0 12px;
}

.profile-checkbox{
    display:flex !important;
    align-items:center;
    gap:8px;
}

.profile-edit-form button{
    width:100%;
    height:42px;
    border:0;
    border-radius:12px;
    background:#006BFF;
    color:#fff;
    font-weight:900;
    cursor:pointer;
}

/* TABS */

.profile-tabs{
    margin:20px 0 22px;
    background:#fff;
    border:1px solid #e7eef9;
    border-radius:20px;
    display:flex;
    gap:6px;
    padding:8px;
    box-shadow:0 10px 26px rgba(6,18,58,.045);
    overflow-x:auto;
}

.profile-tabs a{
    height:42px;
    padding:0 18px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#06123a;
    font-size:13px;
    font-weight:900;
    white-space:nowrap;
}

.profile-tabs a.is-active,
.profile-tabs a:hover{
    background:#eef4ff;
    color:#006BFF;
}

/* DASHBOARD */

.profile-dashboard{
    display:grid;
    grid-template-columns:260px minmax(0, 1fr) 260px;
    gap:24px;
    align-items:start;
}

.profile-left-column,
.profile-center-column,
.profile-right-column{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:18px;
}

.profile-center-column{
    width:100%;
}

.profile-right-column{
    justify-self:stretch;
}

.profile-card{
    width:100%;
    min-width:0;
    background:#fff;
    border:1px solid #e7eef9;
    border-radius:22px;
    padding:22px;
    box-shadow:0 10px 28px rgba(6,18,58,.045);
}

.profile-card-title{
    color:#06123a;
    font-size:18px;
    font-weight:900;
    margin-bottom:16px;
}

.profile-card-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:16px;
}

.profile-card-header .profile-card-title{
    margin-bottom:0;
}

.profile-card-header a{
    color:#006BFF;
    font-size:13px;
    font-weight:900;
    white-space:nowrap;
}

.profile-bio{
    color:#394963;
    font-size:14px;
    line-height:1.65;
}

.profile-main-action{
    width:100%;
    height:42px;
    margin-top:18px;
    border:1px solid #cfe0ff;
    border-radius:999px;
    background:#fff;
    color:#006BFF;
    font-weight:900;
    cursor:pointer;
}

.profile-main-action:hover{
    background:#eef4ff;
}

/* TAGS */

.profile-tags{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.profile-tags span{
    padding:7px 11px;
    border-radius:999px;
    background:#eef4ff;
    color:#006BFF;
    font-size:12px;
    font-weight:900;
}

.profile-tags span:nth-child(1),
.profile-tags span:nth-child(2){
    background:#fff1f2;
    color:#e11d48;
}

.profile-tags span:nth-child(4){
    background:#f3e8ff;
    color:#7e22ce;
}

.profile-tags span:nth-child(5){
    background:#fff7ed;
    color:#ea580c;
}

/* STATS */

.profile-stats-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:12px;
}

.profile-stats-list li{
    display:flex;
    justify-content:space-between;
    gap:12px;
    color:#52627a;
    font-size:14px;
    font-weight:800;
}

.profile-stats-list strong{
    color:#06123a;
}

/* TROPHÉES */

.profile-trophies-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:14px;
}

.profile-trophy{
    min-height:140px;
    padding:16px;
    border-radius:20px;
    background:
        radial-gradient(circle at top, rgba(0,107,255,.10), transparent 48%),
        #f8fbff;
    border:1px solid #e8eef8;
    text-align:center;
}

.profile-trophy-icon{
    width:58px;
    height:58px;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg, #006BFF, #7c3aed);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    box-shadow:0 12px 24px rgba(0,107,255,.18);
}

.profile-trophy strong{
    display:block;
    color:#06123a;
    font-size:13px;
    line-height:1.3;
    margin-bottom:6px;
}

.profile-trophy span{
    color:#667085;
    font-size:12px;
    font-weight:900;
}

.profile-trophy.is-locked{
    opacity:.55;
    filter:grayscale(.25);
}

.profile-trophy.is-locked .profile-trophy-icon{
    background:#d8e1ef;
    color:#52627a;
    box-shadow:none;
}

/* ACTIVITÉ */

.profile-activity-list{
    display:flex;
    flex-direction:column;
}

.profile-activity-item{
    display:flex;
    align-items:center;
    gap:16px;
    padding:15px 0;
    border-bottom:1px solid #eef3fb;
}

.profile-activity-item:last-child{
    border-bottom:0;
}

.profile-activity-item b{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:14px;
    background:#eef4ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
}

.profile-activity-item strong{
    display:block;
    color:#06123a;
    font-size:14px;
    margin-bottom:4px;
}

.profile-activity-item span{
    color:#667085;
    font-size:13px;
    font-weight:700;
}

/* WISHLIST */

.profile-wishlist-placeholder{
    min-height:180px;
    border-radius:20px;
    background:
        radial-gradient(circle at top left, rgba(0,107,255,.09), transparent 34%),
        #f8fbff;
    border:1px dashed #cfe0ff;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:26px;
}

.profile-wishlist-placeholder strong{
    display:block;
    color:#06123a;
    font-size:18px;
    margin-bottom:6px;
}

.profile-wishlist-placeholder span{
    color:#667085;
    font-weight:800;
}

.profile-wishlist-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:16px;
}

.profile-wishlist-card{
    display:block;
    padding:12px;
    border:1px solid #e8eef8;
    border-radius:18px;
    background:#f8fbff;
    text-decoration:none;
    transition:.18s ease;
}

.profile-wishlist-card:hover{
    transform:translateY(-3px);
    border-color:rgba(0,107,255,.25);
    box-shadow:0 12px 26px rgba(6,18,58,.08);
}

.profile-wishlist-card__image{
    height:150px;
    border-radius:14px;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    margin-bottom:10px;
}

.profile-wishlist-card__image img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.profile-wishlist-card strong{
    display:block;
    color:#06123a;
    font-size:13px;
    line-height:1.35;
    margin-bottom:5px;
}

.profile-wishlist-card small{
    display:block;
    color:#006BFF;
    font-size:11px;
    font-weight:900;
    margin-bottom:6px;
}

.profile-wishlist-card > span{
    display:block;
    color:#ef233c;
    font-size:14px;
    font-weight:900;
}

/* ALERTES / PRODUITS SUIVIS */

.profile-followed-number{
    margin-bottom:14px;
}

.profile-followed-number strong{
    color:#006BFF;
    font-size:42px;
    line-height:1;
    font-weight:900;
}

.profile-followed-number span{
    color:#52627a;
    font-weight:800;
    margin-left:6px;
}

.profile-alerts-list{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.profile-alert-item{
    display:block;
    padding:13px;
    border-radius:16px;
    background:#f8fbff;
    border:1px solid #e8eef8;
}

.profile-alert-item strong{
    display:block;
    color:#06123a;
    font-size:13px;
    line-height:1.35;
    margin-bottom:5px;
}

.profile-alert-item span{
    color:#006BFF;
    font-size:12px;
    font-weight:900;
}

/* DÉBLOCAGES */

.profile-unlocks{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.profile-unlocks div{
    padding:14px;
    border-radius:16px;
    background:#f8fbff;
    border:1px solid #e8eef8;
}

.profile-unlocks strong{
    display:block;
    color:#06123a;
    font-size:14px;
    margin-bottom:5px;
}

.profile-unlocks span{
    color:#667085;
    font-size:13px;
    font-weight:800;
    line-height:1.45;
}

/* AVATARS ET WALLPAPERS DÉBLOQUÉS */

.profile-unlock-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.profile-unlock-item,
.profile-wallpaper-item{
    margin:0;
}

.profile-unlock-item button,
.profile-wallpaper-item button{
    width:100%;
    border:1px solid #e8eef8;
    background:#f8fbff;
    border-radius:18px;
    padding:12px;
    cursor:pointer;
    text-align:center;
    transition:.18s ease;
}

.profile-unlock-item button:hover,
.profile-wallpaper-item button:hover{
    transform:translateY(-2px);
    border-color:rgba(0,107,255,.25);
    box-shadow:0 10px 24px rgba(6,18,58,.08);
}

.profile-unlock-item button.is-selected,
.profile-wallpaper-item button.is-selected{
    border-color:#006BFF;
    background:#eef4ff;
    box-shadow:0 0 0 3px rgba(0,107,255,.12);
}

.profile-unlock-item img{
    width:68px;
    height:68px;
    border-radius:50%;
    object-fit:cover;
    margin-bottom:8px;
}

.profile-unlock-item strong,
.profile-wallpaper-item strong{
    display:block;
    color:#06123a;
    font-size:12px;
    font-weight:900;
    margin-bottom:4px;
}

.profile-unlock-item span,
.profile-wallpaper-item span{
    display:block;
    color:#667085;
    font-size:11px;
    font-weight:900;
}

.profile-unlock-note{
    margin-top:14px;
    padding:12px;
    border-radius:14px;
    background:#fff7ed;
    border:1px solid #fed7aa;
    color:#9a3412;
    font-size:12px;
    font-weight:900;
    line-height:1.45;
}

.profile-custom-avatar-form{
    margin-top:14px;
}

.profile-custom-avatar-form label{
    height:42px;
    border-radius:999px;
    background:#006BFF;
    color:#fff;
    font-size:12px;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.profile-wallpaper-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
}

.profile-wallpaper-item img{
    width:100%;
    height:72px;
    border-radius:14px;
    object-fit:cover;
    margin-bottom:8px;
}

/* EMPTY */

.profile-empty{
    padding:20px;
    border-radius:18px;
    background:#f8fbff;
    border:1px dashed #cfe0ff;
    color:#667085;
    font-weight:800;
    line-height:1.5;
}

/* RESPONSIVE */

@media(max-width:1200px){

    .profile-premium{
        width:min(100% - 28px, 1500px);
    }

    .profile-dashboard{
        grid-template-columns:280px minmax(0, 1fr);
    }

    .profile-right-column{
        grid-column:1 / -1;
        display:grid;
        grid-template-columns:repeat(2, minmax(0,1fr));
    }

    .profile-hero-inner{
        grid-template-columns:1fr;
    }

    .profile-xp-block{
        margin-left:202px;
    }

    .profile-hero-cards{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:900px){

    .profile-premium{
        width:calc(100% - 24px);
        padding:14px 0 36px;
    }

    .profile-hero{
        border-radius:22px;
    }

    .profile-hero-inner{
        padding:26px;
    }

    .profile-identity{
        flex-direction:column;
        align-items:flex-start;
    }

    .profile-avatar-premium{
        width:132px;
        height:132px;
        flex-basis:132px;
    }

    .profile-avatar-premium .profile-avatar{
        width:114px;
        height:114px;
    }

    .profile-avatar-premium__level{
        width:38px;
        height:38px;
        font-size:14px;
        border-width:3px;
    }

    .profile-name-line h1{
        font-size:32px;
    }

    .profile-xp-block{
        margin-left:0;
        flex-direction:column;
        align-items:flex-start;
    }

    .profile-xp-main{
        width:100%;
    }

    .profile-hero-cards{
        grid-template-columns:1fr;
    }

    .profile-quick-stats{
        grid-template-columns:repeat(2,1fr);
        gap:16px;
        padding:20px 26px 26px;
    }

    .profile-quick-stats div{
        padding:0;
        border-right:0;
    }

    .profile-dashboard{
        grid-template-columns:1fr;
    }

    .profile-right-column{
        display:flex;
        grid-column:auto;
    }

    .profile-trophies-grid,
    .profile-unlock-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }
}

@media(max-width:520px){

    .profile-trophies-grid,
    .profile-unlock-grid{
        grid-template-columns:1fr;
    }

    .profile-xp-label{
        flex-direction:column;
        align-items:flex-start;
    }

    .profile-quick-stats{
        grid-template-columns:1fr;
    }

    .profile-wishlist-grid{
        grid-template-columns:1fr;
    }
}
/* CORRECTION STRUCTURE PROFIL */

*,
*::before,
*::after{
    box-sizing:border-box;
}

.profile-dashboard{
    display:grid !important;
    grid-template-columns:280px minmax(0, 1fr) 280px !important;
    gap:24px !important;
    align-items:start !important;
}

.profile-left-column,
.profile-center-column,
.profile-right-column{
    min-width:0 !important;
    width:100% !important;
    max-width:none !important;
    margin-top:0 !important;
    align-self:start !important;
}

.profile-center-column{
    grid-column:auto !important;
    padding-top:0 !important;
    transform:none !important;
}

.profile-center-column .profile-card{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
}

.profile-card{
    box-sizing:border-box !important;
}

.profile-wishlist-grid{
    grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)) !important;
}

.profile-wishlist-card{
    min-width:0 !important;
}

.profile-wishlist-card__image{
    height:150px !important;
}

@media(max-width:1200px){
    .profile-dashboard{
        grid-template-columns:260px minmax(0, 1fr) !important;
    }

    .profile-right-column{
        grid-column:1 / -1 !important;
        display:grid !important;
        grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    }
}

@media(max-width:900px){
    .profile-dashboard{
        grid-template-columns:1fr !important;
    }

    .profile-right-column{
        display:flex !important;
    }
}