*{box-sizing:border-box}

:root{
--panel:rgba(22,23,29,.96);
--line:rgba(255,255,255,.11);
--muted:#9ca7ba;
--text:#fff;
--cyan:#27d4ff;
--purple:#c084fc;
--danger:#ff5f6d;
--success:#36e59f
}

body{
margin:0;
background:
radial-gradient(circle at top,rgba(255,255,255,.06),transparent 26%),
radial-gradient(circle at 75% 18%,rgba(39,212,255,.08),transparent 28%),
linear-gradient(180deg,#0d0d10 0%,#111216 46%,#08090c 100%);
color:var(--text);
font-family:Inter,Arial,sans-serif;
min-height:100vh
}

.hidden,
.state-panel.hidden,
.favorites-content.hidden {
  display: none !important;
}

.topbar{
height:72px;
padding:0 44px;
display:flex;
align-items:center;
justify-content:space-between;
background:rgba(8,10,15,.92);
border-bottom:1px solid var(--line);
position:sticky;
top:0;
z-index:50;
backdrop-filter:blur(16px)
}

.logo{
color:#fff;
font-size:22px;
font-weight:950;
text-decoration:none;
letter-spacing:-.03em
}

nav{display:flex;gap:24px}
nav a{color:#aab3c4;text-decoration:none;font-weight:850;font-size:14px}
nav a.active,nav a:hover{color:var(--cyan)}

.favorites-page{
max-width:1760px;
margin:0 auto;
padding:58px 48px 92px
}

.favorites-hero{
display:grid;
grid-template-columns:minmax(0,1fr) auto;
gap:28px;
align-items:end;
margin-bottom:38px
}

.eyebrow{
margin:0 0 10px;
color:var(--cyan);
text-transform:uppercase;
letter-spacing:.15em;
font-size:12px;
font-weight:950
}

.favorites-hero h1{
margin:0;
font-size:clamp(54px,7vw,106px);
line-height:.9;
letter-spacing:-.08em
}

.favorites-hero p:last-child{
color:#b8c2d4;
font-size:18px;
font-weight:720;
max-width:760px
}

.hero-actions{
display:flex;
align-items:center;
justify-content:flex-end;
gap:14px;
flex-wrap:wrap
}

.primary-btn,.ghost-btn{
min-height:46px;
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:999px;
padding:0 18px;
text-decoration:none;
font-weight:950;
cursor:pointer
}

.primary-btn{
border:1px solid rgba(39,212,255,.45);
background:linear-gradient(135deg,rgba(39,212,255,.28),rgba(192,132,252,.18));
color:#fff;
box-shadow:0 18px 42px rgba(0,0,0,.24)
}

.ghost-btn{
border:1px solid rgba(255,255,255,.13);
background:rgba(255,255,255,.06);
color:#d7deea
}

.primary-btn:hover,.ghost-btn:hover{transform:translateY(-1px)}

.asset-grid{
display:grid;
grid-template-columns:repeat(3,minmax(280px,1fr));
gap:38px
}

.asset-card{
overflow:hidden;
border-radius:18px;
background:var(--panel);
box-shadow:0 22px 50px rgba(0,0,0,.38);
transition:.18s ease;
border:1px solid rgba(255,255,255,.055);
position:relative
}

.image-wrap{
position:relative;
height:280px;
background:#15171e;
overflow:hidden
}

.image-wrap img{
width:100%;
height:100%;
object-fit:cover
}

.price-badge{
position:absolute;
right:18px;
bottom:-22px;
background:#25262f;
color:#fff;
border-radius:10px;
padding:13px 18px;
font-weight:950;
font-size:18px
}

/* ========================= */
/* 🔥 FIXED REMOVE BUTTON */
/* ========================= */

.remove-fav-btn{
position:absolute;
top:14px;
right:14px;
width:42px;
height:42px;
border-radius:999px;
border:1px solid rgba(255,95,109,.35);
background:rgba(0,0,0,.55);
color:#fff;
cursor:pointer;
z-index:4;
display:flex;
align-items:center;
justify-content:center;
backdrop-filter:blur(12px)
}

.remove-fav-btn:hover{
background:rgba(255,95,109,.22);
border-color:rgba(255,95,109,.7)
}

.remove-fav-btn[disabled]{
opacity:.55;
cursor:not-allowed
}

/* ✅ THIS IS THE IMPORTANT PART */
.remove-fav-btn svg{
width:18px;
height:18px;
display:block;
pointer-events:none;
color:#fff;
}

/* ========================= */

.card-body{
padding:34px 24px 24px
}

.badge-row{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-bottom:14px
}

.badge{
font-size:11px;
font-weight:950;
letter-spacing:.04em;
text-transform:uppercase;
color:#d7deea;
border:1px solid rgba(255,255,255,.12);
background:rgba(255,255,255,.07);
border-radius:999px;
padding:7px 9px
}

.card-actions{
display:grid;
grid-template-columns:1fr auto;
gap:10px;
align-items:center
}

.view-btn{
color:#061014;
background:linear-gradient(135deg,#27d4ff,#9be7ff);
height:42px;
border-radius:10px;
display:flex;
align-items:center;
justify-content:center;
font-weight:950;
text-decoration:none
}

.remove-link-btn{
border:1px solid rgba(255,95,109,.32);
background:rgba(255,95,109,.08);
color:#ffd7dc;
height:42px;
border-radius:10px;
padding:0 14px;
cursor:pointer
}

.remove-link-btn:hover{
background:rgba(255,95,109,.16)
}

/* Header logo hard size */
.topbar .logo{display:inline-flex!important;align-items:center!important;gap:10px!important;line-height:1!important;}
.topbar .logo img,#globalLogoImg{width:34px!important;height:34px!important;min-width:34px!important;max-width:34px!important;min-height:34px!important;max-height:34px!important;object-fit:cover!important;border-radius:10px!important;position:static!important;display:inline-block!important;}
