/* ===== Ani Beseret Magazine Upgrades ===== */
:root {
  --mag-blue: #1a8fff;
  --mag-cyan: #7ee1ff;
  --mag-card: rgba(12, 30, 48, .82);
  --mag-border: rgba(77, 184, 255, .18);
  --mag-text: #f4f8ff;
  --mag-muted: #8fb0c9;
  --mag-orange: #ffa940;
}

.ab-live-search {
  position: absolute;
  z-index: 9999;
  top: calc(100% + 10px);
  right: 0;
  width: min(420px, 86vw);
  max-height: 520px;
  overflow: auto;
  padding: .65rem;
  border: 1px solid var(--mag-border);
  border-radius: 20px;
  background: radial-gradient(circle at 90% 0%, rgba(26,143,255,.16), transparent 13rem), rgba(5,13,24,.96);
  box-shadow: 0 24px 70px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.025);
  backdrop-filter: blur(20px);
  display: none;
}
.ab-live-search.open { display: block; }
.ab-live-search-title { color: var(--mag-cyan); font-size: .78rem; font-weight: 900; padding: .45rem .55rem .65rem; }
.ab-live-search-item { display: grid; grid-template-columns: 58px 1fr; gap: .8rem; align-items: center; padding: .65rem; border-radius: 15px; color: var(--mag-text); text-decoration: none; transition: .18s ease; }
.ab-live-search-item:hover { background: rgba(255,255,255,.055); transform: translateY(-1px); }
.ab-live-search-thumb, .ab-live-search-fallback { width: 58px; height: 72px; border-radius: 12px; background: linear-gradient(135deg, #0a2340, #123a62); border: 1px solid rgba(255,255,255,.08); }
.ab-live-search-thumb { object-fit: cover; }
.ab-live-search-fallback { display: grid; place-items: center; font-weight: 900; font-size: 1.35rem; color: #fff; }
.ab-live-search-name { font-weight: 900; line-height: 1.2; margin-bottom: .25rem; }
.ab-live-search-meta { color: var(--mag-muted); font-size: .78rem; display: flex; gap: .4rem; flex-wrap: wrap; }
.ab-live-search-empty { padding: 1rem; color: var(--mag-muted); line-height: 1.7; text-align: center; }
.ab-live-search-popular { display: flex; gap: .45rem; flex-wrap: wrap; justify-content: center; margin-top: .65rem; }
.ab-live-search-popular a { color: #dbeafe; text-decoration: none; border: 1px solid rgba(77,184,255,.18); background: rgba(255,255,255,.045); border-radius: 999px; padding: .38rem .7rem; font-size: .78rem; font-weight: 800; }

.ab-language-toggle { border: 1px solid rgba(77,184,255,.22); background: rgba(255,255,255,.055); color: #dbeafe; border-radius: 999px; padding: .45rem .7rem; font: inherit; font-size: .78rem; font-weight: 900; cursor: pointer; }
.ab-panel-link { display: none !important; }
.review-comments-section { border-radius: 26px; }
.review-comments-section h2 { color: #f4f8ff !important; }

.ab-related-wrap { max-width: 900px; margin: 0 auto; padding: 0 2rem 3rem; }
.ab-related-card { border: 1px solid var(--mag-border); border-radius: 24px; background: linear-gradient(135deg, rgba(12,30,48,.94), rgba(7,17,31,.96)); padding: 1.3rem; box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.ab-related-head { display: flex; justify-content: space-between; gap: 1rem; align-items: end; margin-bottom: 1rem; }
.ab-related-head h3 { margin: 0; font-size: clamp(1.35rem, 3vw, 2rem); color: #fff; }
.ab-related-head p { margin: .25rem 0 0; color: var(--mag-muted); font-size: .9rem; }
.ab-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .85rem; }
.ab-related-item { min-height: 118px; border-radius: 18px; overflow: hidden; position: relative; color: #fff; text-decoration: none; background: #081827; border: 1px solid rgba(255,255,255,.08); }
.ab-related-item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.48); }
.ab-related-item div { position: absolute; inset: auto 0 0; padding: .85rem; background: linear-gradient(to top, rgba(0,0,0,.78), transparent); font-weight: 900; }

.ab-profile-page { min-height: 100vh; background: radial-gradient(circle at 80% 0%, rgba(26,143,255,.2), transparent 32rem), radial-gradient(circle at 15% 20%, rgba(255,169,64,.09), transparent 24rem), linear-gradient(180deg,#050d18,#07111f); color: #f4f8ff; font-family: 'Heebo', sans-serif; direction: rtl; padding: 5.5rem 1.3rem 4rem; }
.ab-profile-shell { max-width: 1120px; margin: 0 auto; display: grid; gap: 1.2rem; }
.ab-profile-hero { overflow: hidden; position: relative; display: grid; grid-template-columns: auto 1fr minmax(260px,.72fr); align-items: center; gap: 1.4rem; border: 1px solid rgba(77,184,255,.22); border-radius: 34px; padding: clamp(1.4rem, 4vw, 2.4rem); background: radial-gradient(circle at 10% 20%, rgba(26,143,255,.2), transparent 18rem), radial-gradient(circle at 92% 20%, rgba(255,169,64,.1), transparent 18rem), linear-gradient(135deg, rgba(12,30,48,.95), rgba(7,17,31,.95)); box-shadow: 0 24px 70px rgba(0,0,0,.22); }
.ab-profile-hero::after { content:''; position:absolute; inset:auto -8rem -11rem auto; width:310px; height:310px; border-radius:50%; border:34px solid rgba(126,225,255,.045); pointer-events:none; }
.ab-profile-avatar { width: 132px; height: 132px; border-radius: 32px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(135deg, #0a2340, #1a8fff); border: 1px solid rgba(255,255,255,.12); font-size: 3rem; font-weight: 900; }
.ab-profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ab-profile-title { font-size: clamp(2rem, 5vw, 4.2rem); margin: 0; line-height: .95; }
.ab-profile-sub { color: var(--mag-muted); margin: .5rem 0 1.2rem; }
.ab-profile-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.2rem; }
.ab-profile-card { border: 1px solid rgba(77,184,255,.18); border-radius: 26px; background: linear-gradient(145deg, rgba(12,30,48,.82), rgba(7,17,31,.86)); padding: 1.35rem; box-shadow: 0 18px 52px rgba(0,0,0,.18); }
.ab-profile-card h2 { margin: 0 0 1rem; }
.ab-profile-form { display: grid; gap: .9rem; }
.ab-profile-form label { color: #9bc5df; font-weight: 800; font-size: .86rem; }
.ab-profile-form input, .ab-profile-form textarea { width: 100%; border: 1px solid rgba(77,184,255,.18); background: rgba(255,255,255,.055); color: #fff; border-radius: 14px; padding: .85rem 1rem; font: inherit; outline: none; }
.ab-profile-btn { border: 0; border-radius: 14px; padding: .9rem 1.1rem; font: inherit; font-weight: 900; color: #fff; cursor: pointer; background: linear-gradient(135deg, #1a8fff, #26c6f9); box-shadow: 0 18px 38px rgba(26,143,255,.22); }
.ab-profile-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.ab-profile-stat { border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.045); border-radius: 18px; padding: 1rem; }
.ab-profile-stat strong { display: block; font-size: 1.55rem; color: var(--mag-orange); }
.ab-profile-level-card { position:relative; z-index:1; border:1px solid rgba(126,225,255,.2); border-radius:24px; padding:1rem; background:rgba(3,13,24,.42); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
.ab-level-kicker { color:#7ee1ff; font-weight:950; font-size:.78rem; letter-spacing:.08em; }
.ab-level-name { margin:.4rem 0 .55rem; color:#fff; font-size:1.28rem; font-weight:950; }
.ab-level-points { display:flex; align-items:end; gap:.45rem; margin-bottom:.75rem; }
.ab-level-points strong { color:#ffa940; font-size:2rem; line-height:1; }
.ab-level-points span { color:#9fc0d8; font-weight:850; padding-bottom:.18rem; }
.ab-level-progress { height:12px; overflow:hidden; border-radius:999px; border:1px solid rgba(126,225,255,.16); background:rgba(255,255,255,.06); }
.ab-level-progress span { display:block; height:100%; width:0%; border-radius:inherit; background:linear-gradient(90deg,#1a8fff,#24c6dc,#ffa940); box-shadow:0 0 22px rgba(36,198,220,.35); transition:width .35s ease; }
.ab-level-next { margin-top:.55rem; color:#a9c1d4; font-size:.82rem; font-weight:800; }
.ab-profile-badges { display:flex; flex-wrap:wrap; gap:.45rem; margin:1rem 0 .85rem; }
.ab-profile-badges span { border:1px solid rgba(255,169,64,.26); border-radius:999px; padding:.42rem .68rem; color:#ffe4b5; background:rgba(255,169,64,.09); font-weight:900; font-size:.82rem; }
.ab-profile-badges small, .ab-profile-empty { color:#8fb0c9; line-height:1.7; }
.ab-profile-tip { color:#9fb6ca; line-height:1.75; border-top:1px solid rgba(255,255,255,.08); padding-top:1rem; }
.ab-profile-activity { display:grid; gap:.65rem; }
.ab-activity-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:.85rem 1rem; background:rgba(255,255,255,.035); }
.ab-activity-row strong { display:block; color:#fff; }
.ab-activity-row span { display:block; margin-top:.18rem; color:#8fb0c9; font-size:.82rem; }
.ab-activity-row b { color:#7dffb0; font-size:1.1rem; }
.ab-activity-row b.minus { color:#ff8b8b; }
@media (max-width: 760px) {
  .ab-related-grid, .ab-profile-grid, .ab-profile-hero { grid-template-columns: 1fr; }
  .ab-profile-avatar { width: 104px; height: 104px; }
  .ab-profile-stat-grid { grid-template-columns: 1fr; }
}
