/*  id="cm-desktop-account-button-size-fix-css" */

@media (min-width:1400px){
  html body header.top-head .account-actions{
    gap:12px!important;
    align-items:center!important;
    overflow:visible!important;
  }

  html body header.top-head #mppMsgTrigger,
  html body header.top-head #mppNotifTrigger,
  html body header.top-head #mppHeaderCartBtn,
  html body header.top-head .mpp-header-cart__link,
  html body header.top-head .mpp-header-cart-btn,
  html body header.top-head #modeToggle{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
    border-radius:999px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  html body header.top-head .mpp-header-cart-wrap{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:relative!important;
  }

  html body header.top-head #mppUserMenuTrigger,
  html body header.top-head .mpp-user-menu__trigger,
  html body header.top-head .mpp-user-panel__trigger,
  html body header.top-head [aria-controls="mppUserDropdown"]{
    height:52px!important;
    min-height:52px!important;
    min-width:150px!important;
    padding:0 15px!important;
    border-radius:14px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    box-sizing:border-box!important;
  }

  html body header.top-head .account-actions svg,
  html body header.top-head .account-actions i{
    width:20px!important;
    height:20px!important;
    font-size:19px!important;
  }

  html body header.top-head .account-actions .badge,
  html body header.top-head .account-actions .count,
  html body header.top-head .account-actions [class*="badge"],
  html body header.top-head .account-actions [class*="count"]{
    top:-7px!important;
    right:-5px!important;
    min-width:19px!important;
    height:19px!important;
    font-size:11px!important;
  }
}

/*  id="cm-btn-sm-primary-contrast" */

a.btn--sm.btn--primary,
button.btn--sm.btn--primary,
.btn--sm.btn--primary{
  background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%)!important;
  background-color:#2563eb!important;
}

/*  id="cm-dark-filter-caret" */

body:not(.light-surface) .mpp-filter-panel--modern select,
body:not(.light-surface) .mpp-archive-mod-form select,
body:not(.light-surface) #mpp-game-filter-form select,
body:not(.light-surface) .adv-search--premium select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23cbd5e1' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:calc(100% - 12px) 50%!important;
  padding-right:34px!important;
}

/*  id="cm-edit-profile-polish-css" */

/* --- Hero band: lighter, friendlier in LIGHT mode (was dark navy). --- */
body.light-surface .mpp-profile-settings .mpp-profile-hero{
  background:linear-gradient(135deg,#eef4ff 0%,#dbe8ff 55%,#cfe1ff 100%)!important;
  border-bottom:1px solid #d4e1f5!important;
  box-shadow:none!important;
}
body.light-surface .mpp-profile-settings .mpp-profile-hero__title{
  color:#0f1d33!important;-webkit-text-fill-color:#0f1d33!important;
}
body.light-surface .mpp-profile-settings .mpp-profile-hero .btn--ghost{
  color:#1f3a63!important;border-color:#9fc0ee!important;background:rgba(255,255,255,.65)!important;
}

/* --- Position picker box --- */
.mpp-profile-settings .mpp-profile-focal{
  background:#f6f9ff!important;border:1px solid #dde8f8!important;border-radius:14px!important;
  padding:12px 14px!important;
}
body:not(.light-surface) .mpp-profile-settings .mpp-profile-focal{
  background:rgba(22,32,44,.55)!important;border-color:rgba(100,150,255,.22)!important;
}
.mpp-profile-settings .mpp-profile-focal__lbl{display:block!important;margin:6px 0!important;}
.mpp-profile-settings .mpp-profile-focal__lbl > span{
  display:block!important;font-size:.78rem!important;font-weight:700!important;
  color:#5b6b85!important;margin-bottom:2px!important;
}
body:not(.light-surface) .mpp-profile-settings .mpp-profile-focal__lbl > span{color:#9fb2cd!important;}

/* --- Modern range sliders (were thin red bars) --- */
.mpp-profile-settings .mpp-profile-focal__range{
  -webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:999px;
  background:linear-gradient(90deg,#3b82f6 0%,#60a5fa 100%)!important;
  outline:none;margin:6px 0 2px!important;cursor:pointer;
}
.mpp-profile-settings .mpp-profile-focal__range::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;
  background:#fff;border:3px solid #2563eb;box-shadow:0 2px 6px rgba(0,0,0,.28);cursor:pointer;
  transition:transform .08s ease;
}
.mpp-profile-settings .mpp-profile-focal__range::-webkit-slider-thumb:active{transform:scale(1.12);}
.mpp-profile-settings .mpp-profile-focal__range::-moz-range-thumb{
  width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #2563eb;
  box-shadow:0 2px 6px rgba(0,0,0,.28);cursor:pointer;
}
.mpp-profile-settings .mpp-profile-focal__range::-moz-range-track{background:transparent;}
.mpp-profile-settings .mpp-profile-focal__range:focus-visible{box-shadow:0 0 0 3px rgba(37,99,235,.30);}

/* --- Preview: small zoom so BOTH sliders can pan the image. The picture
   already fills one axis under object-fit:cover, so without a little overflow
   on the other axis that slider has nothing to move. --- */
.mpp-profile-settings .mpp-profile-media__preview{overflow:hidden!important;}
.mpp-profile-settings .mpp-profile-media__preview img{transform:scale(1.2);}

/*  id="cm-elite-flair" */

    /* ---- Animated ELITE badge (wins over main.css via double-class specificity + !important) ---- */
    @keyframes cmEliteShimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
    @keyframes cmEliteGlow{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}50%{box-shadow:0 0 11px 1px rgba(239,68,68,.5)}}
    .crashmod-badge.crashmod-badge--elite{
      background-image:linear-gradient(110deg,#b91c1c 0%,#ef4444 25%,#f87171 50%,#ef4444 75%,#b91c1c 100%)!important;
      background-size:200% 100%!important;
      color:#fff!important;
      animation:cmEliteShimmer 3.4s linear infinite,cmEliteGlow 3s ease-in-out infinite;
      position:relative;overflow:hidden;
    }
    .crashmod-badge.crashmod-badge--elite .crashmod-badge__text{color:#fff!important;position:relative;z-index:1;text-shadow:0 1px 2px rgba(127,29,29,.55)}
    /* ELITE 'Rang:' text accent on mod cards */
    .crashmod-rank-tier-text--elite{
      background:linear-gradient(90deg,#ef4444,#f87171)!important;-webkit-background-clip:text!important;background-clip:text!important;
      -webkit-text-fill-color:transparent!important;color:transparent!important;font-weight:800!important;
    }

    /* ---- Gradient ELITE name accent (where a name + ELITE badge co-exist) ---- */
    .mpp-uploaded-by__nameline:has(.crashmod-badge--elite) .mpp-uploaded-by__name{
      background:linear-gradient(90deg,#f87171,#dc2626)!important;-webkit-background-clip:text!important;background-clip:text!important;
      -webkit-text-fill-color:transparent!important;color:transparent!important;font-weight:800!important;
    }

    /* ---- Polished Verified-Creator check ---- */
    .crashmod-badge.crashmod-badge--verified{
      background:linear-gradient(135deg,#16a34a,#22c55e)!important;color:#fff!important;
      box-shadow:0 1px 4px rgba(22,163,74,.35);border:none!important;
    }
    .crashmod-badge.crashmod-badge--verified .crashmod-badge__text{color:#fff!important;font-weight:900}

    @media (prefers-reduced-motion: reduce){
      .crashmod-badge.crashmod-badge--elite{animation:none;background-position:50% 50%!important}
    }
    /* Forced-colors (Windows High Contrast): gradient-clipped transparent text would vanish — restore system colors. */
    @media (forced-colors: active){
      .mpp-uploaded-by__nameline:has(.crashmod-badge--elite) .mpp-uploaded-by__name,
      .crashmod-rank-tier-text--elite{-webkit-text-fill-color:CanvasText!important;color:CanvasText!important;background:none!important}
    }
    
/*  id="cm-header-nav-icons" */

.top-head #siteNav .menu .cm-nav-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-right:6px;
  flex:0 0 auto;
  line-height:0;
}
.top-head #siteNav .menu .cm-nav-ico svg{
  width:16px;
  height:16px;
  display:block;
  opacity:.9;
}
.top-head #siteNav .menu > li > a:hover .cm-nav-ico svg,
.top-head #siteNav .menu > li.current-menu-item > a .cm-nav-ico svg,
.top-head #siteNav .menu > li > a[aria-current="page"] .cm-nav-ico svg,
.top-head #siteNav .menu > li > a.menu-cta .cm-nav-ico svg{
  opacity:1;
}

/* More visual separation between the wide-desktop menu items (felt cramped after the
   icons were added). The nav slot is genuinely FULL: at the old icon-margin 6px /
   gap 14px there were only ~5px before the account/cart cluster, so simply widening
   the gap overflows and the last item ("Kapcsolat") collides with the profile panel.
   Instead we REDISTRIBUTE width: tighten the icon->label gap (6px -> 3px) and spend
   the freed width on a larger gap BETWEEN items (14px -> 17px). The inter-item gap is
   what actually read as "cramped". Net menu width ends up ~3px NARROWER than before
   (gap +3px*7 = +21px, icon margin -3px*8 = -24px), so this fits everywhere the old
   layout fit, with MORE clearance (~8px vs the old ~5px), verified in-browser.
   NOTE on specificity: several older header plugins set the same selector
   `html body header.top-head #siteNav.main-nav .menu` to different gaps (22/18/14px),
   all !important + equal specificity, so the LAST in source order won. We add
   `nav#siteNav` / `ul.menu` (one extra id-qualified element each) so this rule wins
   regardless of plugin load order. Scoped >=1500px; the 1400-1499px compact tier
   (tightest desktop) is left untouched. */
@media (min-width:1500px){
  html body header.top-head nav#siteNav.main-nav ul.menu{ gap:17px!important; }
  .top-head #siteNav .menu .cm-nav-ico{ margin-right:3px!important; }
}

/* Long usernames must not widen the account cluster into the nav. The header row is a
   CENTERED grid at capacity, and .account-actions is min-width:max-content (it grows
   with the name), so a long username pushed the last menu item ("Kapcsolat") under the
   profile panel. Fix: cap the cluster width and let the username truncate INSIDE it (it
   already has text-overflow:ellipsis) rather than expanding the cluster. Normal-length
   names are unaffected (their cluster is below the cap); only long ones truncate, so the
   menu keeps its clearance regardless of username length. Desktop master header only —
   the <1400px header has a different (hamburger) layout with no inline menu to collide. */
@media (min-width:1400px){
  /* A long username must not widen the account cluster into the nav (the header row is a
     centered grid at capacity). NOTE: capping .account-actions width does NOT work well —
     it forces an INTERNAL overlap (the profile button slides onto the 🌐 language switcher)
     when the fixed-width cluster can't shrink cleanly. Cleaner & robust: cap just the
     USERNAME span. The cluster then sizes naturally (so the language switcher / dark toggle
     keep their spacing — no internal overlap), but it stays bounded, so the last menu item
     keeps its clearance. Normal names (~<=11 chars, e.g. "Tabornok3") show in full; longer
     ones truncate via the span's existing text-overflow:ellipsis. The body.logged-in class
     out-specifies the theme's base max-width:151px and scopes this to logged-in users. */
  html body.logged-in header.top-head .mpp-user-panel__name{ max-width:100px!important; }
}

/* Staff-only "Edit" button on the public mod cards (shown only to ranks with the
   edit_any_mod permission; markup is gated in content-mod.php). Match the side "View
   mod" button width and sit just below it. */
.cm-staff-edit-btn{ display:block; width:100%; margin-top:8px; text-align:center; box-sizing:border-box; }
.cm-staff-edit-inline{ display:inline-flex; align-items:center; gap:4px; margin-top:8px; }

/* Footer "Explore" column reuses the primary nav (fallback), which now carries the
   icons. The user wants the footer list text-only, so hide the icons there. */
.site-footer .cm-nav-ico{ display:none !important; }

/*  id="cm-home-light-contrast-css" */

body.light-surface .cm-featured__dl-lbl,
body.light-surface .cm-featured__dl-num,
body.light-surface .cm-featured__row small,
body.light-surface .cm-featured__rating--empty,
body.light-surface .cm-side-card--topdl small,
body.light-surface .cm-side-topdl__name,
body.light-surface .cm-side-topdl__game{
  color:#475569 !important;
}
/* Tulaj (2026-07-11): a Top downloads szamok legyenek ugyanolyan feketek, mint a Statistics
   szamai (.cm-side-stats strong = #0f172a / 850) — az ikon kek marad, mint a Featured blokkban. */
body.light-surface .cm-side-card--topdl [data-cm-top-dl],
body.light-surface .cm-side-topdl__dl{
  color:#0f172a !important;
  font-weight:850 !important;
}
body.light-surface .cm-side-topdl__dl .cm-side-topdl__dl-ico,
body.light-surface .cm-side-topdl__dl svg{
  color:#2563eb !important;
}
/* Tulaj (2026-07-11): a Latest forum topics kommentszamai is olyan feketek legyenek,
   mint a Top downloads szamok — az ikon kek, a "x days ago" masodlagos, marad szurke. */
body.light-surface .cm-side-forum__comments{
  color:#0f172a !important;
  font-weight:850 !important;
}
body.light-surface .cm-side-forum__comments .cm-i,
body.light-surface .cm-side-forum__comments svg{
  color:#2563eb !important;
}

/*  id="cm-imgprotect-css" */

img,picture,.mpp-gallery__bd,.cm-hero__game-bg,.mod-card-row__thumb,.mod-card-grid__thumb{
  -webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;user-drag:none;
  -webkit-touch-callout:none;
}
